更新版本库

src/pages/Archive/ProjectArchive/components/CreateDocument.tsx

@@ -1,6 +1,7 @@
-import React from 'react';
-import { Button, Form, Input, Modal, Upload, Select } from 'antd';
+import React, { useEffect, useState } from 'react';
+import { Button, Form, Input, Modal, Upload, Select, message } from 'antd';
 import { UploadOutlined } from '@ant-design/icons';
+import { getSecondBusinessId } from '../service';
 
 interface CreateDocumentProps {
   //新增文档标题参数
@@ -9,6 +10,12 @@ interface CreateDocumentProps {
   modalVisible: boolean;
   //返回参数
   onCancel: () => void;
+  //成功回参
+  onOk: (value: any) => any;
+  //存档目录数据传入
+  archiveData?: any;
+  //修改行数据传入
+  values: any
 }
 
 const layout = {
@@ -21,14 +28,122 @@ const validateMessages = {
 };
 
 const CreateDocument: React.FC<CreateDocumentProps> = (props) => {
-  const { modalVisible, onCancel, title } = props;
-
+  const { modalVisible, onCancel, title,archiveData ,onOk , values} = props;
+  //上传文件id存储
+  const [uploadId, setUploadId] = useState<any>();
+  //上传文件列表
+  const [fileListData, setFileListData] = useState<any[]>([]);
   const { Option } = Select;
   const { TextArea } = Input;
   const [form] = Form.useForm();
 
-  const onFinish = (values: any) => {
-    console.log(values);
+  useEffect(() => {
+    if(values == null || values == undefined) {
+      setFileListData([])
+        form.setFieldsValue({
+          archiveFileType:'',
+          archiveId:null,
+          archiveExplain:'',
+          archiveRoundsId:'',
+          id:''
+        })
+    } else {
+      if(values.ossFileList == null) {
+        setFileListData([])
+      } else {
+        let value: { name: string; businessId: string; url: string; uid: string; }[] = []
+        let data = values.ossFileList
+        data.forEach((ele: any) => {
+          let obj = {
+            name: "",
+            businessId: "",
+            url:"",
+            uid:""
+          }
+          obj.name = ele.filename
+          obj.businessId = ele.bid
+          obj.url = `http://125.32.114.204:8760/api/core-service-ebtp-updownload/v1/attachment/download/oid/${ele.id}`
+          obj.uid = ele.id
+          value.push(obj)
+        });
+        setFileListData([...value])
+      }
+
+      form.setFieldsValue({
+        archiveFileType:values.archiveFileType,
+        archiveId:values.archiveId,
+        archiveExplain:values.archiveExplain,
+        archiveRoundsId:values.archiveRoundsId,
+        id:values.id
+      })
+    }
+  }, [values,modalVisible])
+
+  const onFinish = async (values: any) => {
+    let data = values
+    data.businessFileId = fileListData[0].businessId
+    const success = await onOk(data)
+    if(success) {
+      setFileListData([])
+    }
+
+  };
+  const onSubmit = () => {
+    if(fileListData.length == 0) {
+      message.info("请选择文档")
+    } else {
+      form.submit()
+    }
+  }
+
+
+  //上传文件业务id获取
+  const getUploadBusinessId = async () => {
+      await getSecondBusinessId().then((res) => {
+        setUploadId(res.id);
+      });
+  };
+
+  //上传文件数量控制
+  const handleChange = (info: { fileList: any }) => {
+    let fileList = [...info.fileList];
+    let count = 0
+    // 1. 限制上传文件的数量
+    // 只显示最近上传的一个文件，旧的会被新的替换
+    fileList = fileList.slice(-1);
+    // 2.从response中读取并显示文件链接
+    fileList = fileList.map((file) => {
+      if (file.response) {
+        // 组件将显示文件和url链接
+        message.success("上传成功")
+        count = 1
+        file.url = `http://125.32.114.204:8760/api/core-service-ebtp-updownload/v1/attachment/download/oid/${file.response.oid}`;
+        file.oid = file.response.oid;
+        file.businessId = uploadId
+      }
+      return file;
+    });
+    if(count == 1) {
+      setFileListData(fileList);
+    }
+  };
+  //上传文件大小控制
+  const beforeUpload = (file: any) => {
+    //文件大小字节数自己算的
+    if(file.size > 52428800) {
+      message.info("上传文件大于50M，请重新上传")
+      return false
+    }
+    return true
+  }
+  //上传文件参数配置
+  const uploadProps = {
+    action: '/api/core-service-ebtp-updownload/v1/attachment/upload',
+    onChange: handleChange,
+    beforeUpload: beforeUpload,
+    data: {
+      businessId: uploadId,
+    },
   };
 
   return (
@@ -36,7 +151,11 @@ const CreateDocument: React.FC<CreateDocumentProps> = (props) => {
       destroyOnClose
       title={title}
       visible={modalVisible}
-      onCancel={() => onCancel()}
+      onCancel={() => {
+        setFileListData([])
+        onCancel()
+      }}
+      onOk={() => onSubmit()}
       okText="保存"
       cancelText="取消"
       width={800}
@@ -47,6 +166,7 @@ const CreateDocument: React.FC<CreateDocumentProps> = (props) => {
         name="nest-messages"
         onFinish={onFinish}
         validateMessages={validateMessages}
+        preserve={false}
       >
         <span
           style={{
@@ -60,29 +180,31 @@ const CreateDocument: React.FC<CreateDocumentProps> = (props) => {
         >
           最多上传一个文件，每个最大50MB
         </span>
-        <Form.Item label="选择文档" rules={[{ required: true }]}>
-          <Upload>
-            <Button type="primary">
+        <Form.Item label="选择文档">
+          <Upload {...uploadProps} fileList={fileListData}>
+            <Button type="primary" onClick={() => getUploadBusinessId()}>
               <UploadOutlined />
               上传
             </Button>
           </Upload>
         </Form.Item>
-        <Form.Item label="文档类型" rules={[{ required: true }]}>
+        <Form.Item name="archiveFileType" label="文档类型" rules={[{ required: true }]}>
           <Input placeholder="请填写文档类型" />
         </Form.Item>
-        <Form.Item label="存档目录" rules={[{ required: true }]}>
+        <Form.Item name="archiveId" label="存档目录" rules={[{ required: true }]}>
           <Select style={{ width: 200 }} placeholder="请选择" optionFilterProp="children">
-            <Option value="jack">项目建档</Option>
-            <Option value="lucy">谈判邀请</Option>
-            <Option value="tom">谈判准备</Option>
-            <Option value="tom1">项目谈判</Option>
-            <Option value="tom2">谈判结果</Option>
+            {archiveData.map((ele: any) => (<Option value={ele.archiveLinkId} key={ele.archiveLinkId}>{ele.archiveLinkName}</Option>))}
           </Select>
         </Form.Item>
-        <Form.Item label="文档说明" rules={[{ required: true }]}>
+        <Form.Item name="archiveExplain" label="文档说明" rules={[{ required: true }]}>
           <TextArea rows={6} maxLength={2000} placeholder="请填写文档说明" />
         </Form.Item>
+        <Form.Item name="archiveRoundsId" label="archiveRoundsId" hidden>
+          <Input />
+        </Form.Item>
+        <Form.Item name="id" label="id" hidden>
+          <Input />
+        </Form.Item>
       </Form>
     </Modal>
   );