GtDigManageWeb/src/pages/Cad/index.js

import { useRef, useEffect, useState } from 'react';
import PageContent from '@/components/PageContent';
import {
  queryCadDirList,
  queryCadList,
  queryCreateCad,
  queryProject,
} from '@/services/cad';
import { useRequest, useNavigate, useModel } from '@umijs/max';
import { Table, Button, message, Space, Select, Input } from 'antd';
import CreateModal from './components/CreateModal';
import { createAduit } from '@/services/boom';
import CreateChildrenModal from './components/CreateChildrenModal';
import { queryCreateCadVer } from '../../services/cad';
import { queryApprovalProject } from '@/services/contract';

const CadDemo = () => {
  const { initialState } = useModel('@@initialState');
  const user = initialState?.user || {};
  let navigate = useNavigate();
  const [createLoading, setCreateLoading] = useState(false);
  const [visible, setVisible] = useState(false);
  const [childrenVisible, setChildrenVisible] = useState(false);
  const [parentId, setParentId] = useState();
  const [params, setParams] = useState({
    page: 1,
    page_size: 20,
  });

  const auditListRef = useRef();

  const columns = [
    {
      title: '名称',
      dataIndex: 'name',
      key: 'name',
      width: 160,
    },
    {
      title: '所属项目',
      dataIndex: 'project_name',
      key: 'project_name',
      width: 120,
    },
    {
      title: '状态',
      // dataIndex: 'cad_status',
      // key: 'cad_status',
      width: 100,
      render: (record) => {
        let str = '';
        let color = 'black';
        switch (record.cad_status) {
          case 1:
            str = '已归档';
            color = 'green';
            break;
          case 2:
            str = '审核拒绝';
            color = 'red';
            break;
          case 0:
            str = '待审核';
            color = 'blue';
        }
        return record.parent_id ? <div style={{ color }}>{str}</div> : '';
      },
    },
    {
      title: '操作',
      width: '10%',
      render: (record) => {
        return (
          <Space>
            {record.canShow && (
              <a
                onClick={() =>
                  navigate('/cad/detail', {
                    state: {
                      user,
                      path: record.path,
                      project_id: record.project_id,
                    },
                  })
                }
              >
                查看
              </a>
            )}
            {record.showCreate && (
              <a
                onClick={() => {
                  setParentId(record.id);
                  setChildrenVisible(true);
                }}
              >
                新建
              </a>
            )}
          </Space>
        );
      },
    },
  ];

  const { data: projectList } = useRequest(queryApprovalProject, {
    formatResult: (res) => {
      return res?.data?.map((item) => {
        return {
          label: `${item.project_name}(${item.project_full_code})`,
          value: item.id,
        };
      });
    },
  });

  //请求归档目录
  const { data: dirList } = useRequest(queryCadDirList, {
    formatResult: (res) => {
      return res.data;
    },
  });

  //请求列表
  const { data, run, loading } = useRequest(queryCadList, {
    defaultParams: [params],
    formatResult: (res) => {
      res.data?.list?.forEach((item) => {
        const project_id = item.project_id;
        item.children?.forEach((cur) => {
          cur.name = item.name + cur.version;
          item.showCreate = cur.cad_status == 2 ? true : false;
          if (cur.cad_path) {
            const pathList = cur.cad_path.split(',');
            cur.children = pathList.map((item) => {
              const names = item.split('/');
              const name = names?.length > 1 ? names[1] : names[0];
              return {
                name,
                path: item,
                canShow: true,
                project_id,
                parent_id: cur.parent_id,
              };
            });
          }
        });
      });
      return res.data?.list;
    },
  });

  //创建审批
  const { run: runCreate } = useRequest(queryCreateCad, {
    manual: true,
    onSuccess: (data) => {
      createOARun({
        ...auditListRef.current,
        extend_code: data.cad_id + '',
        extend_type: 2, //2图纸
      });
    },
  });

  //创建子审批
  const { run: runCreateVer, loading: loadingCreateVer } = useRequest(
    queryCreateCadVer,
    {
      manual: true,
      onSuccess: (data) => {
        run();
        message.success('新建成功');
        setChildrenVisible(false);
        // createOARun({
        //   ...auditListRef.current,
        //   extend_code: data.cad_id + '',
        //   extend_type: 2, //2图纸
        // });
      },
    },
  );

  //发起OA审批
  const { run: createOARun } = useRequest(
    (data) => createAduit({ ...data, flow_id: 67, files: '' }),
    {
      manual: true,
      onSuccess: () => {
        run();
        message.success('新建成功');
        setVisible(false);
        setCreateLoading(false);
      },
    },
  );

  const handleCreate = (values, audit_list) => {
    setCreateLoading(true);
    auditListRef.current = audit_list;
    runCreate(values);
  };

  return (
    <PageContent>
      <Space>
        <Button type="primary" onClick={() => setVisible(true)}>
          新建图纸
        </Button>
        <div>
          项目名称:
          <Select
            style={{ width: 130 }}
            allowClear
            options={projectList}
            onChange={(value) => {
              const project_name = projectList?.find(
                (item) => item.value == value,
              )?.label;
              setParams({ ...params, project_name });
            }}
          />
        </div>
        <div>
          图纸名称:
          <Input
            allowClear
            style={{ width: '200px' }}
            onChange={(e) => {
              setParams({ ...params, name: e.target.value });
            }}
          />
        </div>
        <Button type="primary" onClick={() => run(params)}>
          查询
        </Button>
      </Space>
      <Table
        rowKey="id"
        loading={loading}
        columns={columns}
        dataSource={data}
        indentSize={70}
      />
      <CreateModal
        loading={createLoading}
        dirList={dirList}
        projectList={projectList}
        open={visible}
        onOk={handleCreate}
        handleCancel={() => setVisible(false)}
      />
      <CreateChildrenModal
        parentId={parentId}
        loading={loadingCreateVer}
        open={childrenVisible}
        onOk={runCreateVer}
        handleCancel={() => setChildrenVisible(false)}
      />
    </PageContent>
  );
};

export default CadDemo;