import { forwardRef, useImperativeHandle, useState } from "react";
import { Modal, Table, Collapse, Checkbox } from "antd";
import type { TableProps } from "antd";
import TrasnferTable from "./TransferTable";
import { useModel } from "umi";

export default forwardRef(function SyncModal(props, ref) {
  const [open, setOpen] = useState(false);
  const { project } = useModel("erModel");
  useImperativeHandle(ref, () => ({
    open: () => {
      setOpen(true);
    },
    close: () => setOpen(false),
  }));

  const [useModelData, setUseModelData] = useState(false);

  return (
    <Modal
      title="数据同步"
      width={"100%"}
      open={open}
      okText="同步"
      onCancel={() => setOpen(false)}
    >
      <Checkbox
        checked={useModelData}
        onChange={(e) => setUseModelData(e.target.checked)}
      >
        全部使用模型数据
      </Checkbox>
      <Collapse
        defaultActiveKey={project.tables.map((item) => item.table.id)}
        items={project.tables.map((item) => {
          const { table, tableColumnList } = item;
          const name = table.langNameList?.find(
            (item) => item.name === "zh-CN"
          )?.value;
          return {
            key: table.id,
            label: `${table.schemaName}${name ? `(${name})` : ""}`,
            children: <TrasnferTable dataSource={tableColumnList} useModelData={useModelData} />,
          };
        })}
      />
    </Modal>
  );
});
