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 { ModalButtonOptions, 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";

import { NzFormatBeforeDropEvent } from "ng-zorro-antd/tree";
import { Observable, of } from "rxjs";
import { delay } from "rxjs/operators";
import { WarningEventsComponent } from "./warning-events/warning-events.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
  ) {}

  // level: number; //当前登录账号的组织机构等级
  ngOnInit(): void {
    // this.level = JSON.parse(
    //   sessionStorage.getItem("userdata")
    // ).organization.level;
    this.validateForm = this.fb.group({
      search: [null],
    });
    this.getAllOrganization();
  }
  //搜索框提交
  submitForm(): void {
    for (const i in this.validateForm.controls) {
      this.validateForm.controls[i].markAsDirty();
      this.validateForm.controls[i].updateValueAndValidity();
    }
  }

  //获取所有组织机构
  searchValue = "";
  nzExpandAll = false;
  totalCount: string;

  allOrList: any;

  isLoading = false;
  getAllOrganization() {
    this.isLoading = true;
    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) => {
        this.totalCount = data.result.totalCount;
        console.log(data.result.items);
        data.result.items.forEach((element) => {
          element.title = element.displayName;
          element.key = element.id;
        });
        this.nodes = [...this.toTree.toTree(data.result.items)];
        this.defaultExpandedKeys.length == 0
          ? (this.defaultExpandedKeys = [this.nodes[0].id])
          : (this.defaultExpandedKeys = [...this.defaultExpandedKeys]);
        this.isLoading = false;
      });
  }

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

  defaultExpandedKeys = [];

  nodes: any[] = [];

  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 isGasStation;
            instance.validateForm.value.OrgnizationLevel == 4
              ? (isGasStation = true)
              : (isGasStation = false);
            let body = {
              parentId: node ? Number(node.key) : null,
              displayName: instance.validateForm.value.name,
              isGasStation: isGasStation,
              isSkipAudit: !instance.validateForm.value.isParticipationAudit,
              level: instance.validateForm.value.OrgnizationLevel,
            };
            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) {
    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 isGasStation;
            instance.validateForm.value.OrgnizationLevel == 4
              ? (isGasStation = true)
              : (isGasStation = false);
            let body = {
              id: node.origin.id,
              parentId: node.origin.parentId,
              displayName: instance.validateForm.value.name,
              isGasStation: isGasStation,
              isSkipAudit: !instance.validateForm.value.isParticipationAudit,
              level: instance.validateForm.value.OrgnizationLevel,
            };
            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();
  }

  waring(node) {
    const modal = this.modal.create({
      nzTitle: "油站预警事件接收情况",
      nzContent: WarningEventsComponent,
      nzViewContainerRef: this.viewContainerRef,
      nzWidth: 388,
      nzClassName: "WarningEvents",
      nzFooter: null,
      nzMaskClosable: false,
      nzComponentParams: {
        data: node.origin,
      },
      nzOnOk: () => {},
    });
    const instance = modal.getContentComponent();
  }

  deleteOr(item) {
    console.log(item);
    if (item.origin.children && item.origin.children.length != 0) {
      this.message.create("warning", "请先删除所有子节点");
    } else {
      this.modal.confirm({
        nzTitle: `确定要删除${item.title}这个机构吗?`,
        nzOkText: "确定",
        nzOkType: "primary",
        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: () => {},
      });
    }
  }

  nzEvent(event: NzFormatEmitEvent): void {
    console.log("event", event);
    if (this.isDrag) {
      let parentId;
      if (this.pos == 0) {
        //目标节点内部
        parentId = event.node.key;
      } else {
        if (event.node.level == 0) {
          parentId = null;
        } else {
          parentId = event.node.origin.parentId;
        }
      }

      let body = {
        id: event.dragNode.key,
        parentId: parentId,
        // code: instance.validateForm.value.code,
        // displayName: event.dragNode.origin.displayName,
        // isGasStation: event.dragNode.origin.isGasStation
      };
      this.http
        .post("/api/services/app/Organization/Move", null, {
          params: {
            id: event.dragNode.key,
            parentId: parentId,
          },
        })
        .subscribe(
          (data) => {
            this.message.create("success", "拖拽成功!");
            this.nzTreeComponent.getExpandedNodeList().forEach((item) => {
              this.defaultExpandedKeys.push(item.key);
            });
            this.getAllOrganization();
            return true;
          },
          (err) => {
            this.message.create("warning", "拖拽失败");
            return false;
          }
        );

      // console.log('this.allOrList', this.allOrList)
      // let orders = {}
      // let originalData = JSON.parse(JSON.stringify(this.allOrList || [])) //tree原始数据
      // let targetNodeData = []//拖动移入节点的数据，用于遍历求出放在该数组的第几位
      //找到需要重新排序的数组
      // if (this.pos == 0) {
      //   originalData.forEach(item => {
      //     if (item.parentId == event.node.key) {
      //       targetNodeData.push(item)
      //     }
      //   })
      // } else {
      //   if (event.node.origin.parentId) {//如果拖动目标为非一级节点
      //     originalData.forEach(item => {
      //       if (item.parentId == event.node.origin.parentId) {
      //         targetNodeData.push(item)
      //       }
      //     })
      //   } else {//如果拖动目标为一级节点
      //     originalData.forEach(item => {
      //       if (!item.parentId) {
      //         targetNodeData.push(item)
      //       }
      //     })
      //   }
      // }

      // let idArr = []
      // targetNodeData.forEach(i => {
      //   idArr.push(i.id)
      // })
      // if (this.pos == 0 && event.node.origin.children.length == 1) {
      //   // console.log("移入,没有兄弟")
      //   let key = event.dragNode.key
      //   orders[key] = 0
      //   parentId = event.node.key
      // } else {

      //   let array = []
      //   targetNodeData.forEach(item => {
      //     if (item.id != event.dragNode.key) { //将拖动项先移除掉
      //       array.push(item)
      //     }
      //   })
      //   if (event.dragNode.isEnd[event.dragNode.isEnd.length - 1]) { //如果移入到最后一个
      //     // console.log("最后")
      //     array.push(event.dragNode.origin)
      //   } else if (event.dragNode.isStart[event.dragNode.isStart.length - 1]) {//如果移入到第一个
      //     // console.log("第一")
      //     array.unshift(event.dragNode.origin)
      //   } else {//如果移入中间位置
      //     // console.log("中间")
      //     array.splice(event.node.origin.order, 0, event.dragNode.origin)
      //   }
      //   array.forEach((item, key) => {
      //     orders[item.id] = key
      //   })
      //   console.log("移入,多个兄弟",orders)
      // }

      // let obj = {
      //   id: event.dragNode.origin.id,
      //   parentId: parentId,
      //   orders: orders
      // }

      // this.http.put("/api/DisposalNodes/Sort", obj).subscribe(data => {
      //   const config = new MatSnackBarConfig();
      //   config.verticalPosition = 'top';
      //   config.duration = 3000
      //   this.snackBar.open('排序成功', '确定', config)
      //   this.refurbishTreeData()
      // })
    }
  }
  isDrag; //是否可以拖动
  pos; //放置位置
  beforeDrop = (arg: NzFormatBeforeDropEvent) => {
    console.log("arg", arg);
    if (arg.node.level === 0) {
      //如果为数据节点则不允许拖到一级节点
      this.message.create("warning", "不允许拖拽到一级节点");
      this.isDrag = false;
      return of(false);
    } else {
      this.isDrag = true;
      this.pos = arg.pos;
      return of(true);
    }
  };
}