合同添加草稿

src/pages/ContractManager/component/DraftModal.jsx

@@ -1,17 +1,13 @@
-import { Modal, Table, Space, Divider } from 'antd';
+import { Modal, Table, Space, Divider, message } from 'antd';
 import { useRequest, useModel } from '@umijs/max';
 import { queryContractDraft } from '@/services/contract';
 import { queryDelDraft } from '../../../services/contract';
+import { useEffect } from 'react';
+import { ExclamationCircleOutlined } from '@ant-design/icons';
 
 const DraftModal = ({ open, onCancel, onOk }) => {
+  const [modal, contextHolder] = Modal.useModal();
   const columns = [
-    {
-      title: '合同签订时间',
-      dataIndex: 'effect_on',
-      key: 'effect_on',
-      align: 'center',
-      width: 120,
-    },
     {
       title: '合同名称',
       dataIndex: 'name',
@@ -21,20 +17,37 @@ const DraftModal = ({ open, onCancel, onOk }) => {
     },
     {
       title: '操作',
-      width: '210px',
+      width: '40%',
       align: 'center',
       render: (record) => {
         return (
           <Space>
-            <a onClick={() => onOk(record)}>打开</a>
-            <a onClick={() => runDel({ id: record.id })}>删除</a>
+            <a onClick={() => handlerOk(record)}>打开</a>
+            <a onClick={() => handleDel(record.id)}>删除</a>
           </Space>
         );
       },
     },
   ];
 
-  const { data, loading } = useRequest(queryContractDraft, {
+  const handleDel = (id) => {
+    modal.confirm({
+      icon: <ExclamationCircleOutlined />,
+      title: '提示：',
+      content: <div>确定删除草稿！</div>,
+      onOk: () => runDel({ id }),
+    });
+  };
+
+  useEffect(() => {
+    if (open) runList();
+  }, [open]);
+
+  const {
+    data,
+    loading,
+    run: runList,
+  } = useRequest(queryContractDraft, {
     formatResult: (res) => {
       if (res?.data) {
         return res.data?.list;
@@ -43,9 +56,18 @@ const DraftModal = ({ open, onCancel, onOk }) => {
   });
 
   const { run: runDel } = useRequest(queryDelDraft, {
-    onSuccess: (res) => {},
+    manual: true,
+    onSuccess: (res) => {
+      message.success('删除成功');
+      runList();
+    },
   });
 
+  const handlerOk = (record) => {
+    const data = JSON.parse(record.content);
+    onOk(data);
+  };
+
   return (
     <Modal
       title="草稿箱"
@@ -53,6 +75,7 @@ const DraftModal = ({ open, onCancel, onOk }) => {
       footer={null}
       onCancel={onCancel}
       onOk={onOk}
+      width={500}
     >
       <Table
         dataSource={data}
@@ -60,6 +83,7 @@ const DraftModal = ({ open, onCancel, onOk }) => {
         loading={loading}
         pagination={false}
       />
+      {contextHolder}
     </Modal>
   );
 };

src/pages/ContractManager/component/Modal.jsx

@@ -38,7 +38,7 @@ export const Type = {
   add: 0, //新增
   detail: 1, //详情
   cancel: 2, //作废
-  check: 3, //审核
+  save: 3, //保存草稿
 };
 
 export const StatusText = [
@@ -542,7 +542,22 @@ const ContractModal = (props) => {
   };
 
   const handleSaveDraft = () => {
-    console.log(form.getFieldsValue());
+    let values = form.getFieldsValue();
+    Object.keys(values).forEach((key) => {
+      if (Array.isArray(values[key]))
+        values[key].length == 0
+          ? delete values[key]
+          : (values[key] = JSON.stringify(values[key]));
+    });
+    if (values.effect_on)
+      values.effect_on = dayjs(values.effect_on).format(FORMAT);
+    const params = {
+      name: values.name,
+      content: JSON.stringify(values),
+    };
+    if (data?.id) params.id = data?.id;
+    console.log(values, params);
+    handleOk(params, Type.save);
   };
 
   const getDepItemById = (id) => {
@@ -783,7 +798,7 @@ const ContractModal = (props) => {
               <Form.Item
                 name="effect_on"
                 label="合同签订日期："
-                initialValue={data?.effect_on}
+                initialValue={dayjs(data?.effect_on, FORMAT)}
                 tooltip="合同主体各方签字盖章完成之日，以最后签字盖章的为准"
                 rules={[
                   {
@@ -943,7 +958,7 @@ const ContractModal = (props) => {
             name="party_c"
             label="丙方（及其他）："
             tooltip="可多选。合同主体可以下拉选择，可选项需要经办人在“主页--供应商管理”中创建。经办人可以维护和更新供应商信息。"
-            initialValue={data?.party_c ? data?.party_c.split(',') : []}
+            initialValue={data?.party_c ? data?.party_c?.split(',') : []}
             labelCol={{ span: 4 }}
           >
             <Select

src/pages/ContractManager/index.jsx

@@ -21,6 +21,7 @@ import {
   queryContractCancelCheck,
   queryContractCheck,
   queryContractDownload,
+  queryContractSaveDraft,
   queryDelById,
   queryGetContractList,
   queryOAReCall,
@@ -318,6 +319,18 @@ const ConteactManager = (props) => {
     },
   );
 
+  //保存草稿
+  const { run: saveDraftRun } = useRequest(
+    (data) => queryContractSaveDraft(data),
+    {
+      manual: true,
+      onSuccess: (res) => {
+        setVisible(false);
+        message.success('保存成功');
+      },
+    },
+  );
+
   const handleDelete = (id) => {
     modal.confirm({
       icon: <ExclamationCircleOutlined />,
@@ -379,7 +392,9 @@ const ConteactManager = (props) => {
   };
 
   const handleDraftOpen = (data) => {
+    console.log(data);
     setDraftOpen(false);
+    typeRef.current = Type.add;
     setDetail(data);
     setVisible(true);
   };
@@ -423,12 +438,14 @@ const ConteactManager = (props) => {
         extend_code: data.code,
         extend_type: 0, //归档提交
       });
+    } else if (type == Type.save) {
+      saveDraftRun(data);
     }
   };
 
   const handlerReCall = async (id) => {
     modal.confirm({
-      icon: <ExclamationCircleOutl ined />,
+      icon: <ExclamationCircleOutlined ined />,
       title: '提示：',
       content: <div>确定撤回合同存档审批！</div>,
       onOk: async () => {
@@ -436,7 +453,9 @@ const ConteactManager = (props) => {
         if (res.code == 200) {
           message.success('撤回成功');
           setVisible(false);
-          run(searchData);
+          setTimeout(() => {
+            run(searchData);
+          }, 1000);
         } else {
           message.success('撤回失败，请重试');
         }