import { Edge, EventArgs, Graph } from "@antv/x6";
import { NodeItem, Line, NoteItem } from "./interface";
import {
  SaveNode,
  SaveNodeData,
  DeleteNode,
  EditObject,
  DeleteObject,
} from "@/api/node";
import { DeleteLink, SaveLink } from "@/api/link";
import { NodeType } from "@/enum";
export const bindEvent = (
  graph: Graph,
  doRequest: (
    service: (params: any) => Promise<any>,
    params: any
  ) => Promise<any> | undefined
) => {
  graph.on("node:added", (args) => {
    const workflowId = sessionStorage.getItem("workflowId");
    const data = args.node.getData() || {};
    if (
      Object.hasOwnProperty.call(data, "type") &&
      !data.id &&
      workflowId &&
      data.type !== NodeType.TEXT
    ) {
      const newNode = new NodeItem();
      newNode.id = args.node.id;
      newNode.type = data.type;
      newNode.name = data.name;
      newNode.wfdWorkflowId = workflowId;
      newNode.imageSrc = data.imageSrc;
      newNode.langNameList = [
        { value: data.name, name: "zh-CN" },
        { name: "en" },
      ];

      const size = args.node.size();
      newNode.width = size.width;
      newNode.height = size.height;

      const position = args.node.position();
      newNode.x = position.x;
      newNode.y = position.y;

      console.log("new node:", newNode);
      doRequest(SaveNode, newNode);
      args.node.setData(newNode);
    }
  });

  graph.on("node:added", (args) => {
    const workflowId = sessionStorage.getItem("workflowId");
    const data = args.node.getData() || {};
    if (
      Object.hasOwnProperty.call(data, "type") &&
      !data.id &&
      workflowId &&
      data.type === NodeType.TEXT
    ) {
      const newNode = new NoteItem();
      newNode.id = args.node.id;
      newNode.wfdWorkflowId = workflowId;

      const size = args.node.size();
      newNode.width = size.width;
      newNode.height = size.height;

      const position = args.node.position();
      newNode.x = position.x;
      newNode.y = position.y;

      console.log("new node:", newNode);
      doRequest(EditObject, newNode);
      args.node.setData(newNode);
    }
  });

  // 创建边
  const addEdge = (edge: Edge) => {
    const workflowId = sessionStorage.getItem("workflowId");
    if (workflowId) {
      const line = new Line();
      line.id = edge.id;
      line.wfdWorkflowId = workflowId;
      // @ts-ignore
      line.startNodeId = edge.source?.cell;
      // @ts-ignore
      line.endNodeId = edge.target?.cell;

      const params = {
        link: line,
        points: [
          {
            x: 0,
            y: 0,
            order: 0,
            wfdWorkflowLinkId: edge.id,
            wfdWorkflowId: workflowId,
          },
          {
            x: 0,
            y: 0,
            order: 0,
            wfdWorkflowLinkId: edge.id,
            wfdWorkflowId: workflowId,
          },
        ],
        workflowId: workflowId,
      };
      doRequest(SaveLink, params);
      edge.setData(line);
    }
  };

  // 连线完成
  graph.on("edge:added", (args) => {
    const source = args.edge.getSource();
    const target = args.edge.getTarget();
    // @ts-ignore
    if (source?.cell && target?.cell) {
      addEdge(args.edge);
    }
  });

  // 设置完目标
  graph.on("edge:change:target", (args) => {
    const data = args.edge.getData();
    const source = args.edge.source;
    const target = args.edge.target;
    // @ts-ignore
    if (!data?.id && source?.cell && target?.cell && source?.cell !== target?.cell) {
      addEdge(args.edge);
    }
  });

  // 删除节点
  graph.on("node:removed", (args) => {
    console.log("node:removed:", args);
    const data = args.node.getData();
    if (data?.id) {
      // 备注
      if (data.type === NodeType.TEXT) {
        doRequest(DeleteObject, data);
      } else {
        doRequest(DeleteNode, data);
      }
    }
  });

  // 删除边
  graph.on("edge:removed", (args) => {
    console.log("edge:removed:", args);
    const data = args.edge.getData();
    if (data?.id) {
      doRequest(DeleteLink, { id: data.id });
    }
  });

  graph.on("node:moved", (args) => {
    const node = args.node;
    const position = node.getPosition();
    const data = node.getData();

    if (data.id && data.type !== NodeType.TEXT) {
      doRequest(SaveNode, { ...data, x: position.x, y: position.y });
    }
    if (data.id && data.type === NodeType.TEXT) {
      doRequest(EditObject, { ...data, x: position.x, y: position.y });
    }
  });

  graph.on("node:resized", (args) => {
    const node = args.node;
    const size = node.getSize();
    const data = node.getData();
    const position = node.getPosition();
    // 修改大小文本组件特有
    if (data.id && data.type === NodeType.TEXT) {
      doRequest(EditObject, {
        ...data,
        width: size.width,
        height: size.height,
        x: position.x,
        y: position.y,
      });
    }
  });

  graph.on(
    "node:change:update:remark",
    function (args: EventArgs["cell:change:*"]) {
      console.log("修改备注：", args.current);
      const data = args.cell.getData();
      if (data.id && data.type === NodeType.TEXT) {
        doRequest(EditObject, {
          ...data,
          langText: null,
          langTextList: [
            {
              name: "zh-CN",
              value: args.current.text,
            },
            {
              name: "en",
            },
          ],
        });
      }
    }
  );
};
