Sinopec-Anxin/src/app/system-management/organization/organization.component.ts

import { HttpClient } from '@angular/common/http';
import { Component, OnInit, AfterViewInit, ViewChild, ViewContainerRef } from '@angular/core';
import { TreeService } from 'src/app/service/tree.service';
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { NzModalService } from 'ng-zorro-antd/modal';
import { NzMessageService } from 'ng-zorro-antd/message';
import { AddorComponent } from './addor/addor.component';
import { EditorComponent } from './editor/editor.component';
@Component({
  selector: 'app-organization',
  templateUrl: './organization.component.html',
  styleUrls: ['./organization.component.scss']
})
export class OrganizationComponent implements OnInit {
  validateForm!: FormGroup;
  constructor(private fb: FormBuilder, private http: HttpClient, private toTree: TreeService, private modal: NzModalService, private message: NzMessageService, private viewContainerRef: ViewContainerRef) { }

  ngOnInit(): void {
    this.validateForm = this.fb.group({
      search: [null]
    });
    this.getAllOrganization()
  }
  //搜索框提交
  submitForm(): void {
    console.log(12345)
    for (const i in this.validateForm.controls) {
      this.validateForm.controls[i].markAsDirty();
      this.validateForm.controls[i].updateValueAndValidity();
    }
  }

  //获取所有组织机构
  searchValue = '';
  nzExpandAll = false;
  totalCount: string
  getAllOrganization() {
    this.http.get('/api/services/app/Organization/GetAll').subscribe((data: any) => {
      this.totalCount = data.result.totalCount
      // console.log('组织机构',data.result.totalCount)
      data.result.items.forEach(element => {
        element.key = element.id
        element.title = element.displayName
        element.selectable = false
      });
      this.nodes = [...this.toTree.toTree(data.result.items)]
      this.defaultExpandedKeys = [...this.defaultExpandedKeys]
    })
  }


  @ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent;

  defaultExpandedKeys = [];

  nodes: any[] = []

  nzClick(event: NzFormatEmitEvent): void {
    // console.log(event);
    console.log('展开节点', this.nzTreeComponent.getExpandedNodeList())


  }

  nzCheck(event: NzFormatEmitEvent): void {
    console.log(event);
  }

  // nzSelectedKeys change
  nzSelect(keys: string[]): void {
    console.log(keys, this.nzTreeComponent.getSelectedNodeList());
  }

  ngAfterViewInit(): void {
    // get node by key: '10011'
    console.log(this.nzTreeComponent.getTreeNodeByKey('10011'));
    // use tree methods
    console.log(
      this.nzTreeComponent.getTreeNodes(),
      this.nzTreeComponent.getCheckedNodeList(),
      this.nzTreeComponent.getSelectedNodeList(),
      this.nzTreeComponent.getExpandedNodeList()
    );
  }

  addOr(node?: any) {
    // console.log(node)
    const modal = this.modal.create({
      nzTitle: node ? '新增组织机构' : '新增一级组织机构',
      nzContent: AddorComponent,
      nzViewContainerRef: this.viewContainerRef,
      nzWidth: 288,
      nzComponentParams: {},
      nzOnOk: async () => {
        console.log('hhhhhhh', instance.validateForm)
        if (instance.validateForm.valid) {
          await new Promise(resolve => {
            let body = {
              parentId: node ? Number(node.key) : null,
              code: instance.validateForm.value.code,
              displayName: instance.validateForm.value.name,
              isGasStation: instance.validateForm.value.isGasStation
            }
            this.http.post('/api/services/app/Organization/Create', body).subscribe(data => {
              resolve(data)
              this.message.create('success', '创建成功！');
              this.nzTreeComponent.getExpandedNodeList().forEach((item) => {
                this.defaultExpandedKeys.push(item.key)
              })
              this.getAllOrganization()
              return true
            }, err => {
              resolve(err)
              this.message.create('warning', '创建失败');
              return false
            })
          })
        } else {
          this.message.create('warning', '请填写完整！');
          return false
        }
      }
    });
    const instance = modal.getContentComponent();

  }
  editOr(node) {
    // console.log(node)
    const modal = this.modal.create({
      nzTitle: '编辑组织机构',
      nzContent: EditorComponent,
      nzViewContainerRef: this.viewContainerRef,
      nzWidth: 288,
      nzComponentParams: {
        data: node.origin,
      },
      nzOnOk: async () => {
        console.log('hhhhhhh', instance.validateForm)
        if (instance.validateForm.valid) {
          await new Promise(resolve => {
            let body = {
              id: node.origin.id,
              parentId: node.origin.parentId,
              code: instance.validateForm.value.code,
              displayName: instance.validateForm.value.name,
              isGasStation: instance.validateForm.value.isGasStation
            }
            this.http.put('/api/services/app/Organization/Update', body).subscribe(data => {
              resolve(data)
              this.message.create('success', '编辑成功！');
              this.nzTreeComponent.getExpandedNodeList().forEach((item) => {
                this.defaultExpandedKeys.push(item.key)
              })
              this.getAllOrganization()
              return true
            }, err => {
              resolve(err)
              this.message.create('warning', '编辑失败');
              return false
            })
          })
        } else {
          this.message.create('warning', '请填写完整！');
          return false
        }
      }
    });
    const instance = modal.getContentComponent();
  }
  deleteOr(item) {
    console.log(item)
    this.modal.confirm({
      nzTitle: `确定要删除${item.title}这个机构吗?`,
      nzOkText: '确定',
      nzOkType: 'danger',
      nzOnOk: () => {
        this.http.delete('/api/services/app/Organization/Delete', {
          params: {
            Id: item.origin.id
          }
        }).subscribe(data => {
          this.nzTreeComponent.getExpandedNodeList().forEach((item) => {
            this.defaultExpandedKeys.push(item.key)
          })
          this.getAllOrganization()
          this.message.create('success', '删除成功！');
        })
      },
      nzCancelText: '取消',
      nzOnCancel: () => {

      }
    });
  }
}