修改合同管理

src/pages/ContractManager/component/Modal.jsx

@@ -55,6 +55,7 @@ const ContractModal = (props) => {
   const { depList, run: depListRun } = useModel('depList');
   const FORMAT = 'YYYY-MM-DD';
   const {
+    detail: data,
     type,
     visible,
     projectList = [],
@@ -65,11 +66,11 @@ const ContractModal = (props) => {
   const title =
     type == Type.add ? '新增' : type == Type.detail ? '详情' : '作废';
   //所属公司为总部时才能选择部门，为子公司时，部门不能操作  所属部门为子公司的需要填经办人
-  const company = Form.useWatch('company_name', form);
+  const company = Form.useWatch('company_id', form);
   const [depDisable, setDepDisable] = useState(false);
   const [dealDisable, setDealDisable] = useState(false);
   //项目名称选择后，自动填入对应的项目编号
-  const project_code = Form.useWatch('project_name', form);
+  const project_name = Form.useWatch('project_name', form);
 
   const [isPass, setIsPass] = useState(1);
 
@@ -80,6 +81,10 @@ const ContractModal = (props) => {
     depListRun();
   }, []);
 
+  useEffect(() => {
+    form.resetFields();
+  }, [data]);
+
   //供应商列表
   const { data: supplierList = [], loading } = useRequest(querySupplierList, {
     defaultParams: [
@@ -97,6 +102,8 @@ const ContractModal = (props) => {
     },
   });
 
+  console.log('======================', data);
+
   useEffect(() => {
     if (company == 135) {
       setDepDisable(false);
@@ -108,14 +115,23 @@ const ContractModal = (props) => {
     }
   }, [company]);
   useEffect(() => {
-    form.setFieldsValue({ project_code });
-  }, [project_code]);
+    const project_code = projectList?.find(
+      (item) => item.project_name == project_name,
+    )?.project_full_code;
+    if (project_code) form.setFieldsValue({ project_code });
+  }, [project_name]);
 
   const supplyList = useMemo(() => {
     return depList ? [...depList, ...supplierList] : supplierList;
   }, [depList, supplierList]);
 
   const disableds = useMemo(() => {
+    if (!visible) {
+      setFileList([]);
+      setIsPass(1);
+      setDepDisable(false);
+      setDealDisable(false);
+    }
     if (type == Type.add) {
       return { contract: false, check: true };
     } else if (type == Type.detail) {
@@ -126,74 +142,81 @@ const ContractModal = (props) => {
     return { contract: true, check: false };
   }, [type, visible]);
 
-  const data = {
-    company_name: 'hdhdhdh',
-    name: 'kkkk',
-    effect_on: dayjs('2020-02-02'),
-    party_a: 'aaaaa',
-    party_b: 'bbbbbb',
-    party_c: 'ccccc',
-    created_dep: 'fffff',
-    dep_id: '1111',
-    status: 4,
-    code: '132456',
-    amount: '1111111111777',
-    project_name: 'hahahah',
-    project_code: '444444',
-    deal_by: 'hhhhh',
-    perform: 'dnjfndjfnjdnfjd',
-    created_by: '77777',
-    created_name: 'gggggg',
-    created_on: dayjs().format(FORMAT),
-    attach: [
-      { name: 'hhhhh', url: '99999' },
-      { name: '11111', url: '922229999' },
-    ],
-  };
-
   const UploadProps = {
     action: `/api/contract/v1/attach`,
+    headers: {
+      'JWT-TOKEN': localStorage.getItem('JWT-TOKEN'),
+    },
     onChange({ file, fileList }) {
       if (file.status !== 'uploading') {
         console.log(file, fileList);
-        setFileList(fileList);
+        setFileList(fileList.map((item) => item.response?.data?.attach));
       }
     },
-    // defaultFileList: [
-    //   {
-    //     uid: '1',
-    //     name: 'xxx.png',
-    //     status: 'uploading',
-    //     url: 'http://www.baidu.com/xxx.png',
-    //     percent: 33,
-    //   },
-    //   {
-    //     uid: '2',
-    //     name: 'yyy.png',
-    //     status: 'done',
-    //     url: 'http://www.baidu.com/yyy.png',
-    //   },
-    //   {
-    //     uid: '3',
-    //     name: 'zzz.png',
-    //     status: 'error',
-    //     response: 'Server Error 500',
-    //     // custom error message to show
-    //     url: 'http://www.baidu.com/zzz.png',
-    //   },
-    // ],
   };
 
   const handleSubmit = () => {
     form.validateFields().then((values) => {
-      console.log(values);
-      values.effect_on = dayjs(values.effect_on, FORMAT);
-      values.created_on = values.created_on || dayjs().format(FORMAT);
-      if (parent_id) values.parent_id = parent_id;
-      handleOk(values);
+      if (type == Type.add) {
+        values.effect_on = dayjs(values.effect_on).format(FORMAT);
+        values.created_on = values.created_on || dayjs().format(FORMAT);
+        if (parent_id) values.parent_id = parent_id;
+        if (values.amount || values.amount == 0)
+          values.amount = values.amount + '';
+        if (fileList.length > 0) values.attach = JSON.stringify(fileList);
+        if (values.party_c && values.party_c.length > 0)
+          values.party_c = values.party_c.join(',');
+        if (values.company_id == 135 && values.dep_id) {
+          const item = getDepItemById(values.dep_id);
+          if (item) {
+            values.dep_name = item.Name;
+            values.dep_code = item.Code;
+          }
+          const companyItem = getDepItemById(values.company_id);
+          if (companyItem) values.company_name = companyItem.Name;
+        } else if (values.company_id) {
+          const item = getDepItemById(values.company_id);
+          if (item) {
+            values.company_name = item.Name;
+            values.company_code = item.Code;
+          }
+        }
+        values.created_by = user?.ID;
+        handleOk(values);
+      } else if (type == Type.cancel) {
+        let result = {
+          id: data?.id,
+          cancel_desc: values.cancel_desc,
+        };
+        handleOk(result);
+      } else if (type == Type.check && data?.status == Status.Checking) {
+        let result = {
+          id: data?.id,
+          check_by: user.CName,
+          check_result: values.check_result,
+          is_pass: values.is_pass,
+          check_desc: values?.check_desc,
+        };
+        handleOk(result);
+      }
     });
   };
 
+  const getDepItemById = (id) => {
+    const fun = (list) => {
+      for (let i = 0; i < list.length; i++) {
+        let item = list[i];
+        if (item.ID == id) {
+          return item;
+        } else if (item.children?.length > 0) {
+          let res = fun(item.children);
+          if (res) return res;
+        }
+      }
+    };
+    return fun(depList);
+  };
+
   return (
     <Modal
       width={'85%'}
@@ -203,21 +226,24 @@ const ContractModal = (props) => {
       cancelText="返回"
       onOk={handleSubmit}
       onCancel={handleCancel}
+      okButtonProps={type == Type.detail ? { disabled: true } : null}
+      destroyOnClose
     >
       <Divider />
       <ModuleTitle title="合同信息" />
       <Form
         form={form}
-        initialValues={data}
+        // initialValues={data}
         labelCol={{ span: 7 }}
         wrapperCol={{ span: 17 }}
       >
         <Row>
           <Col span={10} offset={1}>
             <Form.Item
-              name="company_code"
+              name="company_id"
               label="所属公司："
               tooltip="所属公司"
+              initialValue={data?.company_id}
               rules={[
                 {
                   required: true,
@@ -244,6 +270,7 @@ const ContractModal = (props) => {
               name="name"
               label="合同名称："
               tooltip="合同名称"
+              initialValue={data?.name}
               rules={[
                 {
                   required: true,
@@ -256,6 +283,7 @@ const ContractModal = (props) => {
             <Form.Item
               name="effect_on"
               label="合同生效日期："
+              initialValue={data?.effect_on}
               rules={[
                 {
                   required: true,
@@ -263,14 +291,19 @@ const ContractModal = (props) => {
                 },
               ]}
             >
-              <DatePicker
-                style={{ width: '100%' }}
-                disabled={disableds.contract}
-              />
+              {type == Type.add ? (
+                <DatePicker
+                  style={{ width: '100%' }}
+                  disabled={disableds.contract}
+                />
+              ) : (
+                <Input disabled={disableds.contract} />
+              )}
             </Form.Item>
             <Form.Item
               name="project_name"
               label="项目名称："
+              initialValue={data?.project_name}
               rules={[
                 {
                   required: true,
@@ -283,7 +316,7 @@ const ContractModal = (props) => {
                 placeholder="请选择"
                 options={projectList?.map((item) => {
                   return {
-                    value: item.project_full_code,
+                    value: item.project_name,
                     label: item.project_name,
                   };
                 })}
@@ -293,6 +326,7 @@ const ContractModal = (props) => {
             <Form.Item
               name="party_a"
               label="甲方："
+              initialValue={data?.party_a}
               rules={[
                 {
                   required: true,
@@ -318,6 +352,7 @@ const ContractModal = (props) => {
             <Form.Item
               name="party_c"
               label="丙方（及其他）："
+              initialValue={data?.party_c ? JSON.parse(data?.party_c) : []}
               rules={[
                 {
                   required: true,
@@ -344,6 +379,7 @@ const ContractModal = (props) => {
             <Form.Item
               name="created_dep"
               label="签约承办部门："
+              initialValue={data?.created_dep}
               rules={[
                 {
                   required: true,
@@ -359,7 +395,7 @@ const ContractModal = (props) => {
                 disabled={disableds.contract}
                 fieldNames={{
                   label: 'Name',
-                  value: 'ID',
+                  value: 'Name',
                   children: 'children',
                 }}
                 dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
@@ -369,14 +405,9 @@ const ContractModal = (props) => {
           </Col>
           <Col span={10}>
             <Form.Item
-              name="dep_code"
+              name="dep_id"
               label="所属部门："
-              rules={[
-                {
-                  required: true,
-                  message: '请选择所属部门',
-                },
-              ]}
+              initialValue={data?.dep_id}
             >
               <TreeSelect
                 style={{ width: '100%' }}
@@ -388,20 +419,21 @@ const ContractModal = (props) => {
                   value: 'ID',
                   children: 'children',
                 }}
-                disabled={disableds.contract}
+                disabled={disableds.contract || depDisable}
                 dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
                 treeData={depList?.find((item) => item.Code == 'GT')?.children}
               />
             </Form.Item>
-            {type != Type.add && (
-              <Form.Item name="code" label="合同编号：">
-                <Input disabled />
-              </Form.Item>
-            )}
+            {/* {type != Type.add && ( */}
+            <Form.Item name="code" initialValue={data?.code} label="合同编号：">
+              <Input placeholder="提交后自动生成" disabled />
+            </Form.Item>
+            {/* )} */}
 
             <Form.Item
               label="合同总价款："
               name="amount"
+              initialValue={data?.amount}
               rules={[
                 {
                   required: true,
@@ -417,12 +449,17 @@ const ContractModal = (props) => {
               />
             </Form.Item>
 
-            <Form.Item name="project_code" label="项目编号：">
+            <Form.Item
+              name="project_code"
+              initialValue={data?.project_code}
+              label="项目编号："
+            >
               <Input disabled />
             </Form.Item>
             <Form.Item
               name="party_b"
               label="乙方："
+              initialValue={data?.party_b}
               rules={[
                 {
                   required: true,
@@ -448,6 +485,7 @@ const ContractModal = (props) => {
             <Form.Item
               name="deal_by"
               label="经办人："
+              initialValue={data?.deal_by}
               rules={[
                 {
                   required: true,
@@ -458,7 +496,7 @@ const ContractModal = (props) => {
               <Select
                 style={{ width: '100%' }}
                 placeholder="请选择"
-                disabled={dealDisable && disableds.contract}
+                disabled={dealDisable || disableds.contract}
                 options={userList?.map((item) => {
                   return {
                     value: item.CName,
@@ -469,7 +507,12 @@ const ContractModal = (props) => {
             </Form.Item>
           </Col>
         </Row>
-        <Form.Item name="perform" label="合同履行情况：" labelCol={{ span: 4 }}>
+        <Form.Item
+          name="perform"
+          initialValue={data?.perform}
+          label="合同履行情况："
+          labelCol={{ span: 4 }}
+        >
           <Input.TextArea disabled={disableds.contract} />
         </Form.Item>
         <Form.Item label="合同上传：" labelCol={{ span: 4 }}>
@@ -479,13 +522,14 @@ const ContractModal = (props) => {
             </Upload>
           ) : (
             <ul>
-              {data?.attach?.map((item) => (
-                <li>
-                  <Space>
-                    {item.name} <span>预览</span> <a href={item.url}>下载</a>
-                  </Space>
-                </li>
-              ))}
+              {data?.attach &&
+                JSON.parse(data?.attach)?.map((item, idx) => (
+                  <li key={`${idx}_${item.name}`}>
+                    <Space>
+                      {item.name} <span>预览</span> <a href={item.url}>下载</a>
+                    </Space>
+                  </li>
+                ))}
             </ul>
           )}
         </Form.Item>
@@ -500,64 +544,70 @@ const ContractModal = (props) => {
             </Form.Item>
           </Col>
           <Col span={10}>
-            <Form.Item name="created_on" label="创建时间：">
+            <Form.Item
+              name="created_on"
+              initialValue={data?.created_on || dayjs().format(FORMAT)}
+              label="创建时间："
+            >
               <Input disabled />
             </Form.Item>
           </Col>
         </Row>
-        {type == Type.check && (
-          <>
-            <ModuleTitle title="审核情况" />
-            <Row>
-              <Col span={10} offset={1}>
-                <Form.Item
-                  name="check_by"
-                  initialValue={user.CName}
-                  label="审核人："
-                >
-                  <Input disabled />
-                </Form.Item>
-                <Form.Item name="is_pass" initialValue={1} label="审核意见：">
-                  <Select
-                    onChange={(e) => {
-                      setIsPass(e);
-                    }}
-                    style={{ width: '100%' }}
-                    options={[
-                      {
-                        value: 1,
-                        label: '同意',
-                      },
-                      {
-                        value: 0,
-                        label: '拒绝',
-                      },
-                    ]}
-                  />
-                </Form.Item>
-              </Col>
-              <Col span={10}>
+        {type == Type.check &&
+          (data.status == Status.Checking ||
+            data.status == Status.CalChecking) && (
+            <>
+              <ModuleTitle title="审核情况" />
+              <Row>
+                <Col span={10} offset={1}>
+                  <Form.Item
+                    name="check_by"
+                    initialValue={user.CName}
+                    label="审核人："
+                  >
+                    <Input disabled />
+                  </Form.Item>
+                  <Form.Item name="is_pass" initialValue={1} label="审核意见：">
+                    <Select
+                      onChange={(e) => {
+                        setIsPass(e);
+                      }}
+                      style={{ width: '100%' }}
+                      options={[
+                        {
+                          value: 1,
+                          label: '同意',
+                        },
+                        {
+                          value: 0,
+                          label: '拒绝',
+                        },
+                      ]}
+                    />
+                  </Form.Item>
+                </Col>
+                <Col span={10}>
+                  <Form.Item
+                    name="check_date"
+                    initialValue={dayjs().format(FORMAT)}
+                    label="审核时间："
+                  >
+                    <Input disabled />
+                  </Form.Item>
+                </Col>
+              </Row>
+              {!isPass && (
                 <Form.Item
-                  name="check_date"
-                  initialValue={dayjs().format(FORMAT)}
-                  label="审核时间："
+                  name="check_desc"
+                  label="拒绝原因："
+                  labelCol={{ span: 4 }}
                 >
-                  <Input disabled />
+                  <Input.TextArea />
                 </Form.Item>
-              </Col>
-            </Row>
-            {!isPass && (
-              <Form.Item
-                name="check_desc"
-                label="拒绝原因："
-                labelCol={{ span: 4 }}
-              >
-                <Input.TextArea />
-              </Form.Item>
-            )}
-          </>
-        )}
-        {(type == Type.detail || type == Type.cancel) && (
+              )}
+            </>
+          )}
+        {type != Type.add && (
           <>
             <ModuleTitle title="归档流程" />
             <div className={styles.modelItem}>
@@ -571,8 +621,12 @@ const ContractModal = (props) => {
                     title: '发起',
                     description: (
                       <>
-                        <div>{data?.created_by}</div>
-                        <div>{data?.created_on}</div>
+                        <div className={styles.textNowarp}>
+                          发起人：{data?.created_name}
+                        </div>
+                        <div className={styles.textNowarp}>
+                          发起时间：{data?.created_on}
+                        </div>
                       </>
                     ),
                   },
@@ -580,8 +634,20 @@ const ContractModal = (props) => {
                     title: '审核',
                     description: (
                       <>
-                        <div>{data?.check_by}</div>
-                        <div>{data?.check_on}</div>
+                        <div className={styles.textNowarp}>
+                          审核人：{data?.check_by}
+                        </div>
+                        <div className={styles.textNowarp}>
+                          审核时间：{data?.check_on}
+                        </div>
+                        {data?.check_desc && (
+                          <div
+                            className={styles.textNowarp}
+                            style={{ color: 'red' }}
+                          >
+                            拒绝原因：{data?.check_desc}
+                          </div>
+                        )}
                       </>
                     ),
                   },
@@ -596,33 +662,38 @@ const ContractModal = (props) => {
             </div>
           </>
         )}
-        {(type == Type.detail || type == Type.cancel) && (
+        {(type == Type.cancel || data?.status >= Status.CalChecking) && (
           <>
             <ModuleTitle title="作废信息" />
             <Form.Item
               name="cancel_desc"
               label="作废原因："
+              initialValue={data?.cancel_desc}
               labelCol={{ span: 4 }}
             >
               <Input />
             </Form.Item>
-            <Form.Item
-              name="cancel_on"
-              label="创建时间："
-              labelCol={{ span: 4 }}
-            >
-              <Input
-                style={{ width: '460px' }}
-                defaultValue={dayjs().format('YYYY-MM-DD')}
-              />
-              <span
-                style={{ color: 'red', fontSize: '24px', marginLeft: '40px' }}
-              >
-                确认作废该合同，作废提交后无法撤回
-              </span>
-            </Form.Item>
           </>
         )}
+        {type == Type.cancel && (
+          <Form.Item
+            name="cancel_on"
+            label="创建时间："
+            initialValue={dayjs().format(FORMAT)}
+            labelCol={{ span: 4 }}
+          >
+            <Input
+              style={{ width: '460px' }}
+              defaultValue={dayjs().format('YYYY-MM-DD')}
+              disabled
+            />
+            <span
+              style={{ color: 'red', fontSize: '24px', marginLeft: '40px' }}
+            >
+              确认作废该合同，作废提交后无法撤回
+            </span>
+          </Form.Item>
+        )}
         {type == Type.detail && data?.status >= Status.CalChecking && (
           <>
             <ModuleTitle title="作废流程" />
@@ -637,8 +708,12 @@ const ContractModal = (props) => {
                     title: '发起',
                     description: (
                       <>
-                        <div>{data?.created_by}</div>
-                        <div>{data?.created_on}</div>
+                        <div className={styles.textNowarp}>
+                          发起人：{data?.created_name}
+                        </div>
+                        <div className={styles.textNowarp}>
+                          发起时间：{data?.created_on}
+                        </div>
                       </>
                     ),
                   },
@@ -646,8 +721,12 @@ const ContractModal = (props) => {
                     title: '审核',
                     description: (
                       <>
-                        <div>{data?.cancel_check_by}</div>
-                        <div>{data?.cancel_check_on}</div>
+                        <div className={styles.textNowarp}>
+                          审核人：{data?.cancel_check_by}
+                        </div>
+                        <div className={styles.textNowarp}>
+                          审核时间：{data?.cancel_check_on}
+                        </div>
                       </>
                     ),
                   },

src/pages/ContractManager/index.jsx

@@ -1,15 +1,18 @@
 import React, { useState, useRef, useEffect } from 'react';
-import { Button, DatePicker, Input, Select, Space, Table } from 'antd';
+import { Button, DatePicker, Input, Select, Space, Table, message } from 'antd';
 import styles from './index.less';
 import ContractModal, { Type } from './component/Modal';
 import { PageContainer } from '@ant-design/pro-components';
-import { useRequest } from '@umijs/max';
+import { useRequest, useModel } from '@umijs/max';
 import { connect } from 'umi';
 import {
   queryApproval,
   queryContract,
+  queryContractCancel,
   queryGetContractList,
 } from '../../services/contract';
+import dayjs from 'dayjs';
+import useModal from 'antd/es/modal/useModal';
 
 const ConteactManager = (props) => {
   const { dispatch } = props;
@@ -21,60 +24,87 @@ const ConteactManager = (props) => {
     current: 0,
     name: '',
   });
+  const { user } = useModel('userInfo');
   const [visible, setVisible] = useState(false);
+  const [detail, setDetail] = useState({});
+  const [data, setData] = useState([]);
   const typeRef = useRef();
   const parentIdRef = useRef(0);
 
+  const showBtn = (record, type) => {
+    let bool = false;
+    switch (type) {
+      case 'download':
+        if (user?.Permission['menu-001-audit'] || record.created_by == user.ID)
+          bool = true;
+        break;
+      case 'addOrCal':
+        if (record.created_by == user.ID) bool = true;
+        break;
+    }
+    return bool;
+  };
+
   const columns = [
     {
       title: '合同编号',
       dataIndex: 'code',
       key: 'code',
+      align: 'center',
     },
     {
       title: '合同生效时间',
       dataIndex: 'effect_on',
       key: 'effect_on',
+      align: 'center',
     },
     {
       title: '合同名称',
       dataIndex: 'name',
       key: 'name',
+      align: 'center',
     },
     {
       title: '甲方',
       dataIndex: 'party_a',
       key: 'party_a',
+      align: 'center',
     },
     {
       title: '丙方',
       dataIndex: 'party_c',
       key: 'party_c',
+      align: 'center',
     },
     {
       title: '所属部门/子公司',
-      dataIndex: 'company_name',
-      key: 'company_name',
+      dataIndex: 'dep_name',
+      key: 'dep_name',
+      align: 'center',
     },
     {
       title: '项目名称',
       dataIndex: 'project_name',
       key: 'project_name',
+      align: 'center',
     },
     {
       title: '合同总价（万元）',
       dataIndex: 'amount',
       key: 'amount',
+      align: 'center',
     },
     {
       title: '经办人',
       dataIndex: 'deal_by',
       key: 'deal_by',
+      align: 'center',
     },
     {
       title: '状态',
       dataIndex: 'status',
       key: 'status',
+      align: 'center',
       render: (status) => {
         let str = '';
         switch (status) {
@@ -102,7 +132,7 @@ const ConteactManager = (props) => {
     },
     {
       title: '操作',
-      dataIndex: 'address',
+      width: '210px',
       align: 'center',
       render: (record) => {
         return (
@@ -111,25 +141,30 @@ const ConteactManager = (props) => {
               onClick={() => {
                 typeRef.current = Type.detail;
                 parentIdRef.current = 0;
+                setDetail(record);
                 setVisible(true);
               }}
             >
               详情
             </a>
             <a onClick={handlePreView}>预览</a>
-            <a onClick={handleUpload}>下载</a>
-            <a
-              onClick={() => {
-                typeRef.current = Type.add;
-                parentIdRef.current = record.id;
-                setVisible(true);
-              }}
-            >
-              增补
-            </a>
+            {showBtn(record, 'download') && <a onClick={handleUpload}>下载</a>}
+            {showBtn(record, 'addOrCal') && !record.parent_id && (
+              <a
+                onClick={() => {
+                  typeRef.current = Type.add;
+                  parentIdRef.current = record.id;
+                  setDetail({});
+                  setVisible(true);
+                }}
+              >
+                增补
+              </a>
+            )}
             <a
               onClick={() => {
                 typeRef.current = Type.cancel;
+                setDetail(record);
                 setVisible(true);
               }}
             >
@@ -140,70 +175,6 @@ const ConteactManager = (props) => {
       },
     },
   ];
-  const dataSource = [
-    {
-      key: 1,
-      name: 'John Brown sr.',
-      age: 60,
-      address: 'New York ',
-      children: [
-        {
-          key: 11,
-          name: 'John Brown',
-          age: 42,
-          address: 'New York No. 2 Lake Park',
-        },
-        {
-          key: 12,
-          name: 'John Brown jr.',
-          age: 30,
-          address: 'New York No. 3 Lake Park',
-          children: [
-            {
-              key: 121,
-              name: 'Jimmy Brown',
-              age: 16,
-              address: 'New York No. 3 Lake Park',
-            },
-          ],
-        },
-        {
-          key: 13,
-          name: 'Jim Green sr.',
-          age: 72,
-          address: 'London No. 1 Lake Park',
-          children: [
-            {
-              key: 131,
-              name: 'Jim Green',
-              age: 42,
-              address: 'London No. 2 Lake Park',
-              children: [
-                {
-                  key: 1311,
-                  name: 'Jim Green jr.',
-                  age: 25,
-                  address: 'London No. 3 Lake Park',
-                },
-                {
-                  key: 1312,
-                  name: 'Jimmy Green sr.',
-                  age: 18,
-                  address: 'London No. 4 Lake Park',
-                },
-              ],
-            },
-          ],
-        },
-      ],
-    },
-    {
-      key: 2,
-      name: 'Joe Black',
-      age: 32,
-      address: 'Sydney No',
-    },
-  ];
 
   useEffect(() => {
     dispatch({
@@ -212,17 +183,41 @@ const ConteactManager = (props) => {
   }, []);
 
   //请求列表
-  const { data, run } = useRequest((data) => queryGetContractList(data), {
+  const { run, loading } = useRequest((data) => queryGetContractList(data), {
     defaultParams: [searchData],
+    onSuccess: (data) => {
+      let resultData = data?.list?.map((item) => {
+        return item.sub_num > 0 ? { ...item, children: [] } : item;
+      });
+      setData(resultData);
+      console.log(data);
+    },
   });
-  console.log('==============', data);
   //编辑新增接口
-  const { data: addData, run: editRun } = useRequest(
-    (data) => queryContract(data),
-    {
-      manual: true,
+  const { run: editRun } = useRequest((data) => queryContract(data), {
+    manual: true,
+    onSuccess: () => {
+      message.success('添加成功');
+      setVisible(false);
+      run(searchData);
     },
-  );
+    onError: () => {
+      message.success('添加失败');
+    },
+  });
+
+  //作废发起
+  const { run: calRun } = useRequest((data) => queryContractCancel(data), {
+    manual: true,
+    onSuccess: () => {
+      message.success('发起作废成功');
+      setVisible(false);
+      run(searchData);
+    },
+    onError: () => {
+      message.success('发起作废失败');
+    },
+  });
 
   //请求项目列表
   const { data: projectData } = useRequest(queryApproval, {
@@ -236,15 +231,29 @@ const ConteactManager = (props) => {
   };
 
   const handleUpload = () => {};
-  const handleSearch = () => {};
-  const handleExport = () => {
-    typeRef.current = Type.audit;
-    setVisible(true);
+  const handleSearch = () => {
+    run(searchData);
+  };
+  const handleExport = () => {};
+
+  const handleQueryChildren = async (req) => {
+    const res = await queryGetContractList(req);
+    if (res?.data?.list) {
+      let resultData = [...data];
+      let idx = data.findIndex((item) => item.id == req.is_parent);
+      if (idx > -1) {
+        resultData[idx].children = res?.data?.list;
+        setData(resultData);
+      }
+    }
   };
 
   const handleOk = (data) => {
-    console.log('-----------', data);
-    run(data);
+    if (typeRef.current == Type.add) {
+      editRun(data);
+    } else if (typeRef.current == Type.cancel) {
+      calRun(data);
+    }
   };
   return (
     <PageContainer>
@@ -253,7 +262,10 @@ const ConteactManager = (props) => {
           <div>合同生效日期：</div>
           <DatePicker
             onChange={(e) => {
-              setSearchData({ effect_on: e });
+              setSearchData({
+                ...searchData,
+                effect_on: e ? dayjs(e).format('YYYY-MM-DD') : null,
+              });
             }}
           />
         </div>
@@ -263,11 +275,14 @@ const ConteactManager = (props) => {
             style={{ width: 200 }}
             placeholder="请选择"
             onChange={(e) => {
-              setSearchData({ project_name: e });
+              setSearchData({
+                ...searchData,
+                project_name: e,
+              });
             }}
             options={projectData?.list?.map((item) => {
               return {
-                value: item.project_full_code,
+                value: item.project_name,
                 label: item.project_name,
               };
             })}
@@ -278,15 +293,19 @@ const ConteactManager = (props) => {
           <Select
             style={{ width: 150 }}
             placeholder="请选择"
+            allowClear
             onChange={(e) => {
-              setSearchData({ status: e });
+              setSearchData({
+                ...searchData,
+                status: e,
+              });
             }}
             options={[
-              { value: 0, label: '已归档' },
+              { value: 3, label: '已归档' },
               { value: 1, label: '归档审核中' },
-              { value: 2, label: '作废审核中' },
-              { value: 3, label: '已作废' },
-              { value: 4, label: '归档拒绝' },
+              { value: 4, label: '作废审核中' },
+              { value: 6, label: '已作废' },
+              { value: 2, label: '归档拒绝' },
               { value: 5, label: '作废拒绝' },
             ]}
           />
@@ -294,8 +313,12 @@ const ConteactManager = (props) => {
         <Input
           className={styles.inputSty}
           placeholder="请输入合同名称/编号"
+          allowClear
           onChange={(e) => {
-            setSearchData({ project_name: e.target.value });
+            setSearchData({
+              ...searchData,
+              name: e.target.value,
+            });
           }}
         />
         <Button
@@ -309,6 +332,7 @@ const ConteactManager = (props) => {
           type="primary"
           onClick={() => {
             typeRef.current = Type.add;
+            setDetail({});
             setVisible(true);
           }}
         >
@@ -323,11 +347,19 @@ const ConteactManager = (props) => {
         </Button>
       </div>
       <Table
+        rowKey="code"
+        loading={loading}
         columns={columns}
-        dataSource={data?.list}
+        dataSource={data}
+        // indentSize={30}
+        onExpand={(expanded, record) => {
+          console.log(expanded, record);
+          if (expanded) handleQueryChildren({ is_parent: record.id });
+        }}
         // pagination={data?.pagination}
       />
       <ContractModal
+        detail={detail}
         type={typeRef.current}
         parent_id={parentIdRef.current}
         projectList={projectData?.list}

src/pages/ContractManager/index.less

@@ -38,4 +38,7 @@
 }
 .modelItem{
   margin: 0  40px;
+}
+.textNowarp{
+  white-space: nowrap;
 }

src/pages/Profile/index.js

@@ -1,160 +1,285 @@
 import React, { Fragment, useState, useEffect, useMemo, useRef } from 'react';
 import { useNavigate } from 'umi';
-import { Card, Table, Empty, Button, Modal, message, Form, DatePicker, Row, Col } from 'antd';
+import {
+  Card,
+  Table,
+  Empty,
+  Button,
+  Modal,
+  message,
+  Form,
+  DatePicker,
+  Row,
+  Col,
+} from 'antd';
 import { PageContainer } from '@ant-design/pro-components';
 const { RangePicker } = DatePicker;
-import { useRequest } from '@umijs/max';
-import {
-  queryProfileList
-} from '@/services/boom'
+import { useRequest, useModel } from '@umijs/max';
+import { queryProfileList } from '@/services/boom';
 import dayjs from 'dayjs';
+import { queryContractCheck, queryGetContractList } from '@/services/contract';
+import ContractModal, {
+  Status,
+  StatusText,
+  Type,
+} from '../ContractManager/component/Modal';
 function profile(props) {
-  const {
-    submitting,
-    params,
-    dispatch,
-  } = props;
+  const { submitting, params, dispatch } = props;
+  const { user } = useModel('userInfo');
   const [tabActive, setTabActive] = useState('1');
   const approveFormRef = useRef();
   const applyFormRef = useRef();
   let navigate = useNavigate();
-  const queryProfileListRequest = useRequest(queryProfileList, {
+  const [detail, setDetail] = useState({});
+  const [conVisible, setConVisible] = useState(false);
+
+  const TYPE = {
+    Contract: 1,
+    OA: 2,
+  };
+
+  const { data: OAData, loading: OALoading } = useRequest(queryProfileList, {
     // manual: true,
-    onSuccess: data => {
-      console.log(data)
-    }
+    formatResult: (res) => {
+      return res.data?.list?.map((item) => {
+        return {
+          ...item,
+          CName: item.AuthorInfo.CName,
+          table_desc: [item.table_desc],
+          statusText: item.status,
+          type: TYPE.OA,
+        };
+      });
+    },
+    onSuccess: (data) => {
+      console.log(data);
+    },
   });
-  const onTabChange = activeKey => {
-    setTabActive(activeKey)
-  }
+  const contractResult = (res) => {
+    let data = res.data?.list;
+    return data?.map((item) => {
+      return {
+        ...item,
+        table_name: `${user.CName}提交的合同审批`,
+        table_desc: [
+          `合同名称：${item.name}`,
+          `合同编号：${item.code}`,
+          `合同金额：${item.amount}万元`,
+        ],
+        CName: user.CName,
+        create_time: item.cancel_on || item.created_on,
+        type: TYPE.Contract,
+        statusText: StatusText[item.status],
+      };
+    });
+  };
+
+  //合同管理相关数据
+  //请求我的申请列表
+  const {
+    data: ApplyData,
+    run: applyRun,
+    loading: applyLoading,
+  } = useRequest(queryGetContractList, {
+    defaultParams: [{ created_by: user?.ID }],
+    formatResult: contractResult,
+  });
+  //我的审批列表
+  const {
+    data: AuditData,
+    run,
+    loading: aduitLoading,
+  } = useRequest((data) => queryGetContractList(data), {
+    manual: true,
+    formatResult: contractResult,
+  });
+  console.log('================', ApplyData, AuditData, OAData);
+
+  //审核合同
+  const { run: runCheck, loading: checkLoading } = useRequest(
+    (data) => queryContractCheck(data),
+    {
+      manual: true,
+      onSuccess: () => {
+        setConVisible(false);
+        message.success('审核成功');
+      },
+      onErroe: () => {
+        message.error('审核失败');
+      },
+    },
+  );
+
+  useEffect(() => {
+    if (user?.Permission['menu-001-audit']) run({ status: 1 });
+  }, [user]);
+
+  const onTabChange = (activeKey) => {
+    applyRun();
+    setTabActive(activeKey);
+  };
   const columns = [
     {
       title: '标题',
-      dataIndex: 'table_name'
+      dataIndex: 'table_name',
     },
     {
-
       title: '摘要',
-      dataIndex: 'table_desc'
+      dataIndex: 'table_desc',
+      render: (descList) => {
+        return (
+          <ul>
+            {descList?.map((item) => (
+              <li>{item}</li>
+            ))}
+          </ul>
+        );
+      },
     },
     {
-
       title: '发起人',
-      dataIndex: 'AuthorInfo.CName'
+      dataIndex: 'CName',
     },
     {
-
       title: '发起时间',
       render: (record) => {
-        return dayjs(record.create_time).format('YYYY-MM-DD HH:mm:ss')
-      }
+        return dayjs(record.create_time).format('YYYY-MM-DD HH:mm:ss');
+      },
     },
     {
-
       title: '流程状态',
-      dataIndex: 'status'
+      dataIndex: 'statusText',
     },
-  ]
+  ];
   const approveColumns = [
     {
       title: '标题',
-      dataIndex: 'table_name'
+      dataIndex: 'table_name',
     },
     {
-
       title: '摘要',
-      dataIndex: 'table_desc'
+      dataIndex: 'table_desc',
+      render: (descList) => {
+        return (
+          <ul>
+            {descList?.map((item) => (
+              <li>{item}</li>
+            ))}
+          </ul>
+        );
+      },
     },
     {
-
       title: '发起人',
-      dataIndex: 'AuthorInfo.CName'
+      dataIndex: 'CName',
     },
     {
-
       title: '发起时间',
       render: (record) => {
-        return dayjs(record.create_time).format('YYYY-MM-DD HH:mm:ss')
-      }
+        return dayjs(record.create_time).format('YYYY-MM-DD HH:mm:ss');
+      },
     },
     {
-
       title: '流程状态',
-      dataIndex: 'status'
+      dataIndex: 'statusText',
     },
     {
       title: '操作',
-      render: (text, record) => (
-        <Fragment>
-          <>
-            <a style={{ color: "#4096ff" }} onClick={() => {
-              navigate(`/oa/detail/${record.flow_id}/${record.id}`)
-            }}>审批</a>
-          </>
-        </Fragment>
+      render: (record) => (
+        <>
+          <a
+            style={{ color: '#4096ff' }}
+            onClick={() => {
+              if (record.type == TYPE.Contract) {
+                setDetail(record);
+                setConVisible(true);
+              } else {
+                navigate(`/oa/detail/${record.flow_id}/${record.id}`);
+              }
+            }}
+          >
+            审批
+          </a>
+        </>
       ),
-    }
-  ]
+    },
+  ];
   const handleApplySubmit = (values) => {
     console.log(values);
   };
   const handleApproveSubmit = (values) => {
     console.log(values);
   };
-  const renderPage = activeKey => {
+  const renderPage = (activeKey) => {
     if (activeKey == '1')
-      return <> <Form
-        name="basic"
-        // labelCol={{ span: 0 }}
-        // wrapperCol={{ span: 24 }}
-        onFinish={handleApplySubmit}
-        ref={applyFormRef}
-      >
-        <div style={{ display: 'flex' }}>
-          <Form.Item name="range-picker" label="申请时间：">
-            <RangePicker />
-          </Form.Item>
-          <Form.Item>
-            <Button type="primary" htmlType="submit" style={{ marginLeft: 10 }}>
-              查询
-            </Button>
-          </Form.Item>
-        </div>
-        <Table
-          columns={columns}
-        />
-      </Form>
-      </>
+      return (
+        <>
+          {' '}
+          <Form
+            name="basic"
+            // labelCol={{ span: 0 }}
+            // wrapperCol={{ span: 24 }}
+            onFinish={handleApplySubmit}
+            ref={applyFormRef}
+          >
+            <div style={{ display: 'flex' }}>
+              <Form.Item name="range-picker" label="申请时间：">
+                <RangePicker />
+              </Form.Item>
+              <Form.Item>
+                <Button
+                  type="primary"
+                  htmlType="submit"
+                  style={{ marginLeft: 10 }}
+                >
+                  查询
+                </Button>
+              </Form.Item>
+            </div>
+            <Table columns={columns} dataSource={ApplyData} />
+          </Form>
+        </>
+      );
     else if (activeKey == '2')
-      return <> <Form
-        name="basic"
-        // labelCol={{ span: 0 }}
-        // wrapperCol={{ span: 24 }}
-        onFinish={handleApproveSubmit}
-        ref={approveFormRef}
-      >
-        <div style={{ display: 'flex' }}>
-          <Form.Item name="range-picker" label="审批时间：">
-            <RangePicker />
-          </Form.Item>
-          <Form.Item>
-            <Button type="primary" htmlType="submit" style={{ marginLeft: 10 }}>
-              查询
-            </Button>
-          </Form.Item>
-        </div>
-      </Form>
-        <Table
-          rowKey='id'
-          columns={approveColumns}
-          dataSource={queryProfileListRequest?.data?.list}
-        />
-      </>
-  }
+      return (
+        <>
+          {' '}
+          <Form
+            name="basic"
+            // labelCol={{ span: 0 }}
+            // wrapperCol={{ span: 24 }}
+            onFinish={handleApproveSubmit}
+            ref={approveFormRef}
+          >
+            <div style={{ display: 'flex' }}>
+              <Form.Item name="range-picker" label="审批时间：">
+                <RangePicker />
+              </Form.Item>
+              <Form.Item>
+                <Button
+                  type="primary"
+                  htmlType="submit"
+                  style={{ marginLeft: 10 }}
+                >
+                  查询
+                </Button>
+              </Form.Item>
+            </div>
+          </Form>
+          <Table
+            rowKey="id"
+            columns={approveColumns}
+            dataSource={[...OAData, ...AuditData].sort(
+              (a, b) => a.create_time > b.create_time,
+            )}
+          />
+        </>
+      );
+  };
   return (
     <PageContainer
       header={{
-        title: '个人中心'
+        title: '个人中心',
       }}
       tabList={[
         {
@@ -168,10 +293,18 @@ function profile(props) {
       ]}
       onTabChange={onTabChange}
     >
-      <div>
-        {renderPage(tabActive)}
-      </div>
-    </PageContainer >
-  )
+      <div>{renderPage(tabActive)}</div>
+      <ContractModal
+        detail={detail}
+        type={Type.check}
+        // projectList={projectData?.list}
+        visible={conVisible}
+        handleOk={(data) =>
+          detail.status == Status.Checking ? runCheck(data) : null
+        }
+        handleCancel={() => setConVisible(false)}
+      />
+    </PageContainer>
+  );
 }
-export default profile;
+export default profile;

src/services/contract.js

@@ -37,3 +37,18 @@ export const queryUploadAttach = async (data) => {
     headers: { 'Content-Type': 'multipart/form-data' },
   });
 };
+//审核合同
+export const queryContractCheck = async (data) => {
+  return await request('/api/contract/v1/contract-check', {
+    method: 'POST',
+    data,
+  });
+};
+
+//作废发起
+export const queryContractCancel = async (data) => {
+  return await request('/api/contract/v1/contract-cancel', {
+    method: 'POST',
+    data,
+  });
+};