fix: 跟进记录根据状态禁止工单编辑

boyang
1 parent 978db6d6
Showing 6 changed files with 21 additions and 579 deletions
.umirc.ts
src/pages/Client/FollowRecord/Components/ClientImportModal.tsx
src/pages/Client/FollowRecord/Components/ClientModal.tsx
src/pages/Client/FollowRecord/Components/ClientModal2.tsx
src/pages/Client/FollowRecord/Components/CommunicationHistoryModal.tsx
src/pages/Client/FollowRecord/index.tsx
@@ -14,8 +14,8 @@ export default defineConfig({
   },
   proxy: {
     '/api/': {
-      // target: 'http://localhost:8085/',
-      target: 'http://192.168.1.6:8085/',
+      target: 'http://localhost:8085/',
+      // target: 'http://192.168.1.6:8085/',
       // target: 'http://39.108.227.113:8085/',
       changeOrigin: true,
       pathRewrite: { '^/api': '' },
-import { RESPONSE_CODE } from '@/constants/enum';
-import { downloadFile } from '@/services/order';
-import { blobToJson } from '@/utils';
-import { ModalForm, ProFormUploadDragger } from '@ant-design/pro-components';
-import { Button, Form, message } from 'antd';
-import { RcFile } from 'antd/es/upload';
-import axios from 'axios';
-
-export default () => {
-  const [form] = Form.useForm();
-  const [messageApi, contextHolder] = message.useMessage();
-  const downloadImportTemplate = () => {
-    messageApi.open({
-      type: 'loading',
-      content: '正在导入...',
-      duration: 0,
-    });
-    downloadFile(
-      '/api/admin/client/downloadImportTemplate',
-      '客户导入模板.xlsx',
-      'post',
-      {},
-      () => {
-        messageApi.destroy();
-      },
-    );
-  };
-
-  return (
-    <ModalForm
-      title="导入客户信息"
-      trigger={<Button type="primary">导入客户信息</Button>}
-      form={form}
-      autoFocusFirstInput
-      modalProps={{
-        destroyOnClose: true,
-        onCancel: () => console.log('run'),
-      }}
-      submitTimeout={2000}
-      onFinish={async (values) => {
-        const formData = new FormData();
-        values.file.forEach((file) => {
-          formData.append('file', file.originFileObj as RcFile);
-        });
-        axios({
-          url: '/api/admin/client/importClient',
-          method: 'post',
-          responseType: 'blob',
-          headers: {
-            Authorization: localStorage.getItem('token'),
-            'Content-Type':
-              'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
-          },
-          data: formData,
-        })
-          .then((response) => {
-            let data = response.data;
-            if (data.type === 'application/json') {
-              blobToJson(data).then((dataJson) => {
-                if (dataJson?.result === RESPONSE_CODE.SUCCESS) {
-                  message.success(dataJson?.message);
-                } else {
-                  message.error(dataJson?.message);
-                }
-              });
-            } else {
-              message.error('上传失败，已下载错误信息表格');
-              // 创建一个新的 Blob 对象，它包含了服务器响应的数据（即你的 Excel 文件）
-              const blob = new Blob([response.data]); // Excel 的 MIME 类型
-              const downloadUrl = window.URL.createObjectURL(blob);
-              const a = document.createElement('a');
-              a.href = downloadUrl;
-              a.download = '银行流水导入模板.xlsx'; // 你可以为文件命名
-              document.body.appendChild(a);
-              a.click(); // 模拟点击操作来下载文件
-              URL.revokeObjectURL(downloadUrl); // 释放掉 blob 对象所占用的内存
-              document.body.removeChild(a);
-            }
-          })
-          .catch((error) => {
-            // 处理错误
-            message.error('系统出现异常了，请联系管理员', error);
-          })
-          .finally(() => {});
-        return true;
-      }}
-    >
-      <ProFormUploadDragger max={1} label="上传" name="file" />
-      <Button type="link" onClick={downloadImportTemplate}>
-        下载导入模板
-      </Button>
-      {contextHolder}
-    </ModalForm>
-  );
-};
@@ -19,8 +19,10 @@ import {
 } from '@ant-design/pro-components';
 import { Button, Col, Form, Row, message } from 'antd';
 import { RcFile } from 'antd/es/upload';
+import { useEffect } from 'react';
 import './style.css';
 export default ({ data, type, reloadTable }) => {
+  useEffect(() => {});
   const [form] = Form.useForm();
   const onfinish = async (values) => {
     const resSearchId = await postAdminClientQueryClientPage({
@@ -325,6 +327,7 @@ export default ({ data, type, reloadTable }) =&gt; {
         readonly={optType[type].readOnly}
         fieldProps={{
           labelInValue: false,
+          disabled: data?.ticketsStatus === 'SOLVED',
         }}
         initialValue={data?.ticketsType ? data?.ticketsType + '' : null}
         request={async () => {
@@ -339,6 +342,10 @@ export default ({ data, type, reloadTable }) =&gt; {
         name="ticketsDetail"
         label="工单详情"
         placeholder="请输入工单详情"
+        fieldProps={{
+          labelInValue: false,
+          disabled: data?.ticketsStatus === 'SOLVED',
+        }}
         initialValue={data?.ticketsDetail ? data?.ticketsDetail + '' : null}
         readonly={optType[type].readOnly}
       ></ProFormTextArea>
@@ -374,6 +381,10 @@ export default ({ data, type, reloadTable }) =&gt; {
         <Col span={4}>附件:</Col>
         <Col span={20}>
           <UploadC
+            fieldProps={{
+              labelInValue: false,
+              disabled: data?.ticketsStatus === 'SOLVED',
+            }}
             onFilesChange={async (newFileList) => {
               if (newFileList.length > 0) {
                 const urls = []; // 创建一个数组来存储所有的 URL
@@ -414,6 +425,7 @@ export default ({ data, type, reloadTable }) =&gt; {
         readonly={optType[type].readOnly}
         fieldProps={{
           labelInValue: false,
+          disabled: data?.ticketsStatus === 'SOLVED',
         }}
         initialValue={data?.assignPeople ? data?.assignPeople + '' : null}
         label="指派人员"
-import { RESPONSE_CODE } from '@/constants/enum';
-import UploadC from '@/pages/Invoice/waitProcessRecord/components/UploadSingleImg';
-import {
-  postAdminClientAddOrModifyClientComunicationInfo,
-  postAdminClientQueryClientPage,
-  postOrderErpOrderStagesUpload,
-  postOrderErpUsersListByPage,
-  postServiceConstClientWay,
-  postServiceConstTradeStatus,
-} from '@/services';
-import { enumToSelect } from '@/utils';
-import {
-  ModalForm,
-  ProFormDateTimePicker,
-  ProFormSelect,
-  ProFormText,
-  ProFormTextArea,
-  ProFormUploadDragger,
-} from '@ant-design/pro-components';
-import { Button, Col, Form, Row, message } from 'antd';
-import { RcFile } from 'antd/es/upload';
-import './style.css';
-export default ({ data, type, reloadTable }) => {
-  const [form] = Form.useForm();
-  const onfinish = async (values) => {
-    const resSearchId = await postAdminClientQueryClientPage({
-      data: {
-        groupFilter: 'all',
-      },
-    });
-    const matchingItem = resSearchId.data.data.find(
-      (item) => item.id === values.name,
-    );
-    let matchedId;
-    if (matchingItem) {
-      matchedId = matchingItem.id; // 匹配成功，取出 id
-      values.name = matchingItem.name;
-    } else {
-      matchedId = null; // 如果没有匹配项，可以设置为 null 或其他值
-    }
-    const res = await postAdminClientAddOrModifyClientComunicationInfo({
-      data: {
-        ...values,
-        ticketsAttachments: form.getFieldValue('ticketsAttachments'),
-        clientId: matchedId,
-      },
-    });
-    if (res.result === RESPONSE_CODE.SUCCESS) {
-      message.success('新增成功');
-      reloadTable();
-      return true;
-    }
-    // 不返回不会关闭弹框
-  };
-
-  const editOnfinish = async (values) => {
-    // setEditClientId(data.clientId);
-    values.clientId = data.clientId;
-
-    // const resSearchId = await postAdminClientQueryClientPage({
-    //   data: {
-    //     groupFilter: 'all',
-    //   },
-    // });
-    // const matchingItem = resSearchId.data.data.find(
-    //   (item) => item.id === values.name,
-    // );
-    const res = await postAdminClientAddOrModifyClientComunicationInfo({
-      data: {
-        ...values,
-        // ticketsAttachments: form.getFieldValue("ticketsAttachments"),
-        ticketsAttachments:
-          form.getFieldValue('ticketsAttachments') !== undefined
-            ? form.getFieldValue('ticketsAttachments')
-            : data?.ticketsAttachments,
-        url:
-          form.getFieldValue('url') !== undefined
-            ? form.getFieldValue('url')
-            : data?.url,
-        // ticketsAttachments: data?.annexUrl,
-      },
-    });
-    if (res.result === RESPONSE_CODE.SUCCESS) {
-      message.success('新增成功');
-      reloadTable();
-      return true;
-    }
-    // 不返回不会关闭弹框
-  };
-  const optType = {
-    add: {
-      readOnly: false,
-      title: '新增跟进记录',
-      button: (
-        <Button size={'middle'} type="primary">
-          新增
-        </Button>
-      ),
-      onFinish: onfinish,
-    },
-    modify: {
-      readOnly: false,
-      title: '修改跟进记录',
-      button: (
-        <Button size={'middle'} type="primary">
-          编辑
-        </Button>
-      ),
-      onFinish: editOnfinish,
-    },
-    detail: {
-      readOnly: true,
-      title: '查看跟进记录',
-      button: (
-        <Button size={'middle'} type="primary" color="red">
-          查看
-        </Button>
-      ),
-      onFinish: () => {},
-    },
-  };
-  return (
-    <ModalForm
-      title={optType[type].title}
-      resize={{
-        onResize() {
-          console.log('resize!');
-        },
-        maxWidth: window.innerWidth * 0.8,
-        minWidth: 400,
-      }}
-      form={form}
-      trigger={optType[type].button}
-      autoFocusFirstInput
-      drawerProps={{
-        destroyOnClose: true,
-      }}
-      submitTimeout={2000}
-      onFinish={optType[type].onFinish}
-    >
-      <ProFormSelect
-        name="name"
-        readonly={optType[type].readOnly}
-        fieldProps={{
-          labelInValue: false,
-          disabled: type === 'modify',
-        }}
-        initialValue={data ? data?.clientName + '' : null}
-        label="客户"
-        width="sm"
-        request={async () => {
-          const res = await postAdminClientQueryClientPage({
-            data: {
-              groupFilter: 'all',
-            },
-          });
-          // const namesArray = res.data.data.map((item) => item.name);
-          // const formattedObject = res.data.data.reduce((acc, name) => {
-          //   acc[name] = name; // 将名称作为键和值
-          //   return acc;
-          // }, {});
-          // console.log(namesArray, '5656namesArray');
-          // const formattedObject = res.data.data.reduce((acc, item) => {
-          //   acc[item.name] = item.name; // 使用 name 作为键，id 作为值
-          //   return acc;
-          // }, {});
-          // return enumToSelect(formattedObject);
-          const options = res.data.data.reduce((acc, item) => {
-            acc.push({ label: item.name, value: item.id }); // 使用 name 作为 label，id 作为 value
-            return acc;
-          }, []);
-          return options;
-        }}
-        rules={[
-          {
-            required: true,
-            message: '请选择客户',
-          },
-        ]}
-      ></ProFormSelect>
-      <ProFormText
-        name="contact"
-        label="联系人"
-        width="sm"
-        placeholder="请输入联系人"
-        initialValue={data?.content}
-        readonly={optType[type].readOnly}
-        rules={[
-          {
-            required: true,
-            message: '请输入联系人',
-          },
-        ]}
-      ></ProFormText>
-      <ProFormText
-        name="contactPhone"
-        label="联系电话"
-        width="sm"
-        placeholder="请输入联系电话"
-        initialValue={data?.content}
-        readonly={optType[type].readOnly}
-        rules={[
-          {
-            required: true,
-            message: '请输入联系电话',
-          },
-        ]}
-      ></ProFormText>
-      <ProFormDateTimePicker
-        name="datetime"
-        label="跟进日期"
-        initialValue={data ? data?.datetime + '' : null}
-        placeholder="请选择跟进时间"
-        width="sm"
-        rules={[
-          {
-            required: true,
-            message: '请选择跟进日期',
-          },
-        ]}
-      />
-      <ProFormSelect
-        name="tradeStatus"
-        label="跟进状态"
-        width="sm"
-        placeholder="请输入跟进状态"
-        readonly={optType[type].readOnly}
-        fieldProps={{
-          labelInValue: false,
-        }}
-        initialValue={data?.tradeStatus ? data?.tradeStatus + '' : null}
-        rules={[
-          {
-            required: true,
-            message: '请输入跟进状态',
-          },
-        ]}
-        request={async () => {
-          const res = await postServiceConstTradeStatus();
-          return enumToSelect(res.data);
-        }}
-      />
-      <ProFormSelect
-        name="way"
-        width="sm"
-        readonly={optType[type].readOnly}
-        fieldProps={{
-          labelInValue: false,
-        }}
-        initialValue={data?.way ? data?.way + '' : null}
-        label="跟进方式"
-        request={async () => {
-          const res = await postServiceConstClientWay();
-          return enumToSelect(res.data);
-        }}
-        rules={[
-          {
-            required: true,
-            message: '请选择跟进方式',
-          },
-        ]}
-      ></ProFormSelect>
-      <ProFormTextArea
-        name="content"
-        label="跟进详情"
-        placeholder="请输入跟进详情"
-        initialValue={data?.content}
-        readonly={optType[type].readOnly}
-        rules={[
-          {
-            required: true,
-            message: '请输入跟进详情',
-          },
-        ]}
-      ></ProFormTextArea>
-      <ProFormUploadDragger
-        label="附件"
-        name="attachment"
-        action="upload.do"
-        hidden={optType[type].readOnly}
-        onChange={(info) => {
-          const uploadFile = async ({ fileList: newFileList }) => {
-            if (newFileList.length > 0) {
-              const formData = new FormData();
-              formData.append('file', newFileList[0].originFileObj as RcFile);
-              const res = await postOrderErpOrderStagesUpload({
-                data: formData,
-                headers: {
-                  'Content-Type':
-                    'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
-                },
-              });
-              const url = res.data;
-              console.log('attachments' + JSON.stringify(url));
-              form.setFieldValue('attachments', url);
-            } else {
-              form.setFieldValue('attachments', null);
-            }
-          };
-          uploadFile(info);
-        }}
-        max={1}
-      />
-      <a hidden={!optType[type].readOnly} href={data?.attachments} download>
-        下载附件
-      </a>
-      <ProFormTextArea
-        name="comment"
-        label="客户评价"
-        placeholder="请输入客户评价"
-        initialValue={data?.comment}
-        readonly={optType[type].readOnly}
-      ></ProFormTextArea>
-      <ProFormText
-        initialValue={data?.attachments}
-        name="attachments"
-        hidden
-      ></ProFormText>
-      <ProFormText initialValue={data?.id} name="id" hidden></ProFormText>
-      <div className="styled-text">
-        <div className="vertical-line"></div>
-        <span className="text">工单指派</span>
-      </div>
-      <ProFormSelect
-        name="ticketsType"
-        label="工单类型"
-        width="sm"
-        placeholder="请输入工单类型"
-        readonly={optType[type].readOnly}
-        fieldProps={{
-          labelInValue: false,
-        }}
-        initialValue={data?.ticketsType ? data?.ticketsType + '' : null}
-        request={async () => {
-          return [
-            { label: '问题', value: 'QUESTION' },
-            { label: '需求', value: 'DEMAND' },
-            { label: '建议', value: 'ADVICE' },
-          ];
-        }}
-      />
-      <ProFormTextArea
-        name="ticketsDetail"
-        label="工单详情"
-        placeholder="请输入工单详情"
-        initialValue={data?.ticketsDetail ? data?.ticketsDetail + '' : null}
-        readonly={optType[type].readOnly}
-      ></ProFormTextArea>
-      {/* <ProFormUploadDragger
-        label="工单附件"
-        name="ticketsAttachment"
-        action="upload.do"
-        hidden={optType[type].readOnly}
-        onChange={(info) => {
-          const uploadFile = async ({ fileList: newFileList }) => {
-            if (newFileList.length > 0) {
-              const formData = new FormData();
-              formData.append('file', newFileList[0].originFileObj as RcFile);
-              const res = await postOrderErpOrderStagesUpload({
-                data: formData,
-                headers: {
-                  'Content-Type':
-                    'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
-                },
-              });
-              const url = res.data;
-              console.log('ticketsAttachments' + JSON.stringify(url));
-              form.setFieldValue('ticketsAttachments', url);
-            } else {
-              form.setFieldValue('ticketsAttachments', null);
-            }
-          };
-          uploadFile(info);
-        }}
-        max={1}
-      /> */}
-      <Row>
-        <Col span={4}>附件:</Col>
-        <Col span={20}>
-          <UploadC
-            onFilesChange={async (newFileList) => {
-              if (newFileList.length > 0) {
-                const urls = []; // 创建一个数组来存储所有的 URL
-
-                for (const file of newFileList) {
-                  const formData = new FormData();
-                  formData.append('file', file.originFileObj as RcFile);
-
-                  const res = await postOrderErpOrderStagesUpload({
-                    data: formData,
-                    headers: {
-                      'Content-Type':
-                        'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
-                    },
-                  });
-
-                  const url = res.data; // 获取响应中的 URL
-                  urls.push(url); // 将每个 URL 追加到数组中
-                }
-
-                // 将所有 URL 使用 ',' 进行拼接
-                const combinedUrl = urls.join(',');
-                form.setFieldValue('ticketsAttachments', combinedUrl); // 设置表单字段值为拼接后的 URL
-              } else {
-                form.setFieldValue('ticketsAttachments', null); // 如果没有文件，则清空 URL
-              }
-            }}
-          ></UploadC>
-        </Col>
-      </Row>
-      <a hidden={!optType[type].readOnly} href={data?.orderAttachment} download>
-        {/* <a href={data?.annexUrl} download> */}
-        下载附件
-      </a>
-      <ProFormSelect
-        name="assignPeople"
-        width="sm"
-        readonly={optType[type].readOnly}
-        fieldProps={{
-          labelInValue: false,
-        }}
-        initialValue={data?.assignPeople ? data?.assignPeople + '' : null}
-        label="指派人员"
-        request={async () => {
-          const res = await postOrderErpUsersListByPage({
-            data: {
-              pageSize: 10000,
-            },
-          });
-          const userOptions = res.data.records
-            ? res.data.records.map((user) => ({
-                label: user.userName, // 或者使用其他需要的属性
-                value: user.userName, // 作为value的字段
-              }))
-            : [];
-          return userOptions;
-        }}
-      ></ProFormSelect>
-      {/* <Row>
-        <Col span={4}>上传发票:</Col>
-        <Col span={20}>
-          <UploadC
-            onFilesChange={async (newFileList) => {
-              if (newFileList.length > 0) {
-                const urls = []; // 创建一个数组来存储所有的 URL
-
-                for (const file of newFileList) {
-                  const formData = new FormData();
-                  formData.append('file', file.originFileObj as RcFile);
-
-                  const res = await postOrderErpOrderStagesUpload({
-                    data: formData,
-                    headers: {
-                      'Content-Type':
-                        'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
-                    },
-                  });
-
-                  const url = res.data; // 获取响应中的 URL
-                  urls.push(url); // 将每个 URL 追加到数组中
-                }
-
-                // 将所有 URL 使用 ',' 进行拼接
-                const combinedUrl = urls.join(',');
-                form.setFieldValue('url', combinedUrl); // 设置表单字段值为拼接后的 URL
-              } else {
-                form.setFieldValue('url', null); // 如果没有文件，则清空 URL
-              }
-            }}
-          ></UploadC>
-        </Col>
-      </Row> */}
-    </ModalForm>
-  );
-};
@@ -33,6 +33,7 @@ export default ({ data, reloadTable }) =&gt; {
   const [assignPeople, setAssignPeople] = useState(''); // 附件名称
   useEffect(() => {
     const request = async () => {
+      console.log(data, '5656datatatatata');
       const res = await postAdminClientQueryClientComunicationInfo({
         data: {
           id: data.id,
@@ -48,8 +49,8 @@ export default ({ data, reloadTable }) =&gt; {
       // data.annexUrl = resTicket.data.annexUrl;
       // data.assignPeople = resTicket.data.assignPeople;
       // console.log(resTicket, '5656resTicket');
+      // const dataSearch = res.data.data[0];
       const dataSearch = res.data.data[0];
-      console.log(dataSearch, '5656dataSearch');
       if (dataSearch) {
         // data.type = resTicket.data.type;
         // data.detailText = resTicket.data.detailText;
@@ -199,9 +200,7 @@ export default ({ data, reloadTable }) =&gt; {
                 <ClientModal
                   key={'modify'}
                   // data={data} // 将表单数据传递给 ClientModal
-                  data={{
-                    data,
-                  }} // 传递修改后的 data
+                  data={data} // 传递修改后的 data
                   reloadTable={() => {
                     actionRef?.current?.reload(); // 重新加载表格数据
                     props.submit();
@@ -12,7 +12,6 @@ import type { ActionType } from &#39;@ant-design/pro-components&#39;;
 import { ProTable } from '@ant-design/pro-components';
 import { Button, Popconfirm, Space, message } from 'antd';
 import { useRef, useState } from 'react';
-import ClientModal2 from './Components/ClientModal2';
 export default () => {
   const actionRef = useRef<ActionType>();
@@ -23,6 +22,7 @@ export default () =&gt; {
     // 更新 refreshKey，强制刷新 CommunicationHistoryModal
     setRefreshKey((prevKey) => prevKey + 1);
+    console.log('5656refresh');
   };
   //biaoji
   const columns = [
@@ -241,7 +241,8 @@ export default () =&gt; {
         return [
           <CommunicationHistoryModal
             // key={'communicationHistory'}
-            key={`communicationHistory-${refreshKey}`} // 使用 refreshKey 来强制更新组件
+            // key={'communicationHistory'}
+            key={`${refreshKey}`} // 使用 refreshKey 来强制更新组件
             data={record}
             // reloadTable={() => {
             //   actionRef.current.reload();
@@ -249,7 +250,7 @@ export default () =&gt; {
             // }}
             reloadTable={reload}
           />,
-          <ClientModal2
+          <ClientModal
             key={'modify'}
             // data={data} // 将表单数据传递给 ClientModal
             data={record} // 传递修改后的 data