From c7835eac66cc4a322dd71a79610f5f4f351f304b Mon Sep 17 00:00:00 2001
From: dminyi <1301963064@qq.com>
Date: Tue, 03 Sep 2024 11:40:40 +0800
Subject: [PATCH] 文件上传接口
---
gz-customerSystem/src/components/ArcoUpload/index.jsx | 103 +++++++++++++++++++++++++++++++--------------------
1 files changed, 62 insertions(+), 41 deletions(-)
diff --git a/gz-customerSystem/src/components/ArcoUpload/index.jsx b/gz-customerSystem/src/components/ArcoUpload/index.jsx
index 61f5fd4..e9f5cca 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 {
@@ -19,6 +27,14 @@
export default function ArcoUpload(props) {
const [myFileList, setMyFileList] = useState([])
+
+ const handleFileListChange = (fileList) => {
+ setMyFileList(fileList);
+ if (props.onFileListChange) {
+ props.onFileListChange(fileList.length);
+ }
+ };
+
useEffect(() => {
if (props.editData) {
console.log(props.editData[props.field]);
@@ -27,48 +43,53 @@
}, [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) => {
- 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'
+ >
+ <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 } = 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 && props.handleDelFile) {
- props.handleDelFile(response.data[0].id)
- }
- setMyFileList(fileList)
- }}
- {...props.params}//自定义
- />
- </FormItem>
+ //删除文件
+ if (isDel && props.handleDelFile) {
+ props.handleDelFile(response.data[0].id)
+ }
+ // setMyFileList(fileList)
+ handleFileListChange(fileList);
+ }}
+ {...props.params}//自定义
+ />
+ </FormItem>
+
+ </>
+
)
}
--
Gitblit v1.8.0