Sinopec-Anxin/src/app/pages/plan-admin/plan-admin.component.ts

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { TreeService } from 'src/app/service/tree.service';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dropdown';
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNode } from 'ng-zorro-antd/tree';
import { Router } from '@angular/router';
import { NavChangeService } from 'src/app/service/navChange.service';
import { fromEvent } from 'rxjs';
import { debounceTime } from 'rxjs/operators';
@Component({
  selector: 'app-plan-admin',
  templateUrl: './plan-admin.component.html',
  styleUrls: ['./plan-admin.component.scss']
})
export class PlanAdminComponent implements OnInit {
  validateForm!: FormGroup;
  @ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent;
  constructor(private element: ElementRef, private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router) { }
  list: any = []

  tableHeight
  ngOnInit(): void {
    this.validateForm = this.fb.group({
      name: [null]
    });
    this.getAllOrganization()

  }

  ngAfterViewInit(): void {
    fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe(async (event: any) => { //监听 DOM 滚动事件
      if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) {
        console.log('需要加载数据了', event)
        this.SkipCount = String(Number(this.SkipCount) + 50)
        // await this.getGasStation()
        let params = {
          StationName: this.validateForm.value.name,
          OrganizationUnitId: String(this.OrganizationUnitId),
          IsContainsChildren: 'true',
          SkipCount: this.SkipCount,
          MaxResultCount: this.MaxResultCount
        }
        await new Promise((resolve, reject) => {
          this.http.get('/api/services/app/GasStation/GetAll', {
            params: params
          }).subscribe((data: any) => {
            this.list = this.list.concat(data.result.items);
            this.list = [...this.list]
            resolve(data)
          })
        })
      }
    });
  }



  submitForm(): void {
    for (const i in this.validateForm.controls) {
      this.validateForm.controls[i].markAsDirty();
      this.validateForm.controls[i].updateValueAndValidity();
    }
    let params = {
      StationName: this.validateForm.value.name,
      OrganizationUnitId: String(this.OrganizationUnitId),
      IsContainsChildren: 'true',
      SkipCount: '0',
      MaxResultCount: this.MaxResultCount
    }
    this.http.get('/api/services/app/GasStation/GetAll', {
      params: params
    }).subscribe((data: any) => {
      this.list = [...data.result.items]
    })
  }
  resetForm(e: MouseEvent): void {
    e.preventDefault();
    this.validateForm.reset();
    for (const key in this.validateForm.controls) {
      this.validateForm.controls[key].markAsPristine();
      this.validateForm.controls[key].updateValueAndValidity();
    }
    let params = {
      StationName: this.validateForm.value.name,
      OrganizationUnitId: String(this.OrganizationUnitId),
      IsContainsChildren: 'true',
      SkipCount: '0',
      MaxResultCount: this.MaxResultCount
    }
    this.http.get('/api/services/app/GasStation/GetAll', {
      params: params
    }).subscribe((data: any) => {
      this.list = [...data.result.items]
    })
  }
  //获取所有组织机构
  nodes: any = []
  nzExpandAll = false
  nzSelectedKeys: any = []
  getAllOrganization() {
    let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id
    let params = {
      OrganizationUnitId: OrganizationUnitId,
      IsContainsChildren: "true"
    }
    this.http.get('/api/services/app/Organization/GetAll', {
      params: params
    }).subscribe((data: any) => {
      data.result.items.forEach(element => {
        if (element.id == OrganizationUnitId) {
          element.parentId = null
        }
      });
      data.result.items = data.result.items.filter((item, i) => {
        return !item.isGasStation
      })
      for (let index = 0; index < data.result.items.length; index++) {
        const element = data.result.items[index];
        element.key = element.id
        element.title = element.displayName
      }

      this.nodes = [...this.toTree.toTree(data.result.items)]
      this.nzSelectedKeys = [OrganizationUnitId]
      this.OrganizationUnitId = OrganizationUnitId
      this.nzExpandAll = true
      this.getGasStation()
    })
  }


  tableheight() {
    return (document.getElementById('tablebox').clientHeight - 42) + 'px'
  }

  look(item) {

    let gastionobj = {
      organization: {
        displayName: item.stationName,
        isGasStation: true,
        id: item.organizationUnitId
      }
    }
    sessionStorage.setItem('userdataOfgasstation', JSON.stringify(gastionobj))
    this.router.navigate(['/plan/petrolStation'])
    let obj = {
      name: 'oilstation'
    }
    this.navChangeService.sendMessage(obj);//发布一条消息
  }

  nzExpandedKeys: any = []
  activatedNode?: NzTreeNode;
  //点击tree节点
  activeNode(data: NzFormatEmitEvent): void {
    this.activatedNode = data.node!;
    console.log(data)
    this.OrganizationUnitId = data.node.origin.id
    this.getGasStation()
  }


  //获取点击组织机构的所有加油站
  SkipCount: string = '0'
  MaxResultCount: string = '100'
  OrganizationUnitId: any
  async getGasStation() {
    let params = {
      StationName: this.validateForm.value.name,
      OrganizationUnitId: String(this.OrganizationUnitId),
      IsContainsChildren: 'true',
      SkipCount: this.SkipCount,
      MaxResultCount: this.MaxResultCount
    }
    await new Promise((resolve, reject) => {
      this.http.get('/api/services/app/GasStation/GetAll', {
        params: params
      }).subscribe((data: any) => {
        // this.list = this.list.concat(data.result.items);
        this.list = [...data.result.items]
        resolve(data)
      })
    })
  }



  expand(e, node) {
    e.stopPropagation()
    node.isExpanded = !node.isExpanded
  }

}