From 5aa4a814ab8d4aa194a9683ebefaefdfc6d92c3a Mon Sep 17 00:00:00 2001
From: liuwh <964324856@qq.com>
Date: Tue, 17 Sep 2024 17:18:05 +0800
Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh into master
---
gz-customerSystem/src/components/ArcoUpload/index.jsx | 134 ++++++++++++++++++++++++++++++--------------
1 files changed, 90 insertions(+), 44 deletions(-)
diff --git a/gz-customerSystem/src/components/ArcoUpload/index.jsx b/gz-customerSystem/src/components/ArcoUpload/index.jsx
index 592096c..034b40c 100644
--- a/gz-customerSystem/src/components/ArcoUpload/index.jsx
+++ b/gz-customerSystem/src/components/ArcoUpload/index.jsx
@@ -1,3 +1,11 @@
+/*
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2024-09-02 19:56:05
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @LastEditTime: 2024-09-03 11:34:07
+ * @FilePath: \gzDyh\gz-customerSystem\src\components\ArcoUpload\index.jsx
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
import React, { useEffect, useState } from 'react'
import { Upload, Form } from '@arco-design/web-react';
import {
@@ -14,61 +22,99 @@
* handleChangeFile, // 文件上传成功之后的回调
* label *, // form的label名
* editData *, // 编辑回显数据
+ * handleDelFile *,//删除文件接口
+ * ownerType,//用于回显文件
+ * formItemParams, formItem的参数
*/
export default function ArcoUpload(props) {
const [myFileList, setMyFileList] = useState([])
+
+ const handleFileListChange = (fileList) => {
+ if (props.onFileListChange) {
+ props.onFileListChange(fileList);
+ }
+ };
+
useEffect(() => {
- if(props.editData) {
- console.log(props.editData[props.field]);
- setMyFileList(props.editData[props.field])
+ if (props.editData) {
+ if(props.editData[props.field]) {
+ //新增的时候有file数据，可以这样子回显
+ setMyFileList(props.editData[props.field])
+ } else {
+ //编辑的时候，文件统一放在filInfoList了，需要设置ownerType获取到该材料文件回显
+ const fileInfoList = props.editData.fileInfoList
+ if(fileInfoList && fileInfoList.length != 0) {
+ let file = [];
+ fileInfoList.forEach(item => {
+ if(item.ownerType == props.ownerType) {
+ file.push(item.fileList[0])
+ }
+ })
+ setMyFileList(file)
+ }
+ }
}
}, [props.editData])
return (
- <FormItem
- label={props.label}
- field={props.field}
- triggerPropName='fileList'
- >
- <Upload
- drag
- multiple
- accept='.png,.jpg,.pdf'
- onDrop={(e) => {
- }}
- tip='支持png、jpg、pdf格式的图片上传，每次上传大小不超过10M'
- showUploadList={{
- fileIcon: <IconAttachment style={{ color: '#1D2129' }} />,
- }}
- headers={{ Authorization: $$.getSessionStorage('customerSystemToken') }}
- onChange={(fileList, file) => {
- console.log(fileList, myFileList, file);
- const { status, response } = file
- //因为字节upLoad组件有bug，不能区分添加文件还是删除文件，所以用这种办法来判断是不是删除
- const isDel = myFileList && myFileList.length > fileList.length
- //上传失败
- if (status === 'error' && !isDel) {
- $$.info({ type: 'error', content: '抱歉，网络错误附件上传失败，请稍后重试' });
- }
- //上传成功
- if (status === 'done' && !isDel) {
- if (response.code === 0 || response.code === '0') {
- // 返回附件成功上传的回调
- $$.infoSuccess({ content: response.msg });
- if (props.handleChangeFile) {
- props.handleChangeFile(response);
+ <>
+ <FormItem
+ label={props.label}
+ field={props.field}
+ triggerPropName='fileList'
+ {...props.formItemParams}
+ >
+ <Upload
+ drag
+ multiple
+ accept='.png,.jpg,.pdf'
+ onDrop={(e) => {
+ }}
+ tip='支持png、jpg、pdf格式的图片上传，每次上传大小不超过10M'
+ showUploadList={{
+ fileIcon: <IconAttachment style={{ color: '#1D2129' }} />,
+ }}
+ headers={{ Authorization: $$.getSessionStorage('customerSystemToken') }}
+ onChange={(fileList, file) => {
+ const { status, response, uid } = file
+ console.log(fileList, file);
+ //因为字节upLoad组件有bug，不能区分添加文件还是删除文件，所以用这种办法来判断是不是删除
+ const isDel = myFileList && myFileList.length > fileList.length
+ //上传失败
+ if (status === 'error' && !isDel) {
+ $$.info({ type: 'error', content: '抱歉，网络错误附件上传失败，请稍后重试' });
+ }
+ //上传成功
+ if (status === 'done' && !isDel) {
+ if (response.code === 0 || response.code === '0') {
+ // 返回附件成功上传的回调
+ $$.infoSuccess({ content: response.msg });
+ if (props.handleChangeFile) {
+ props.handleChangeFile(response);
+ }
}
}
- }
- //删除文件
- if (isDel) {
+ //删除文件
+ if (isDel && props.handleDelFile) {
+ if(response) {
+ //删除的是新提交的
+ props.handleDelFile(response.data[0].id)
+ } else {
+ //删除的是回显的文件
+ props.handleDelFile(uid)
+ }
+
+ }
+ handleFileListChange(fileList);
+ setMyFileList(fileList)
+
+ }}
+ {...props.params}//自定义
+ />
+ </FormItem>
- }
- setMyFileList(fileList)
- }}
- {...props.params}//自定义
- />
- </FormItem>
+ </>
+
)
}
--
Gitblit v1.8.0