+ list-type="image-card" v-model:file-list="signatureFileListLast"
+ @preview="handlePreview"
+ :custom-request="({ file, onFinish, onError, onProgress }) => handleCustomUpload({ file, onFinish, onError, onProgress }, 'signatureFileList')">
@@ -244,6 +255,11 @@ const formData = reactive({
signatureFileList: []
})
+// 临时文件列表，用于上传前预览
+const documentFileListLast = ref([])
+const paymentFileListLast = ref([])
+const signatureFileListLast = ref([])
+
// 定义校验规则
const rules = {
analystSupervisor: { required: true, message: '请输入主管姓名', trigger: 'blur' },
@@ -255,7 +271,7 @@ const rules = {
* 核心：通用文件上传逻辑
* 直接把后端返回的数据挂载到文件对象的 rawResponse 字段，完全隔离前端生成的 id/fullPath
*/
-const handleCustomUpload = async ({ file, onFinish, onError, onProgress }) => {
+const handleCustomUpload = async ({ file, onFinish, onError, onProgress }, type) => {
try {
const uploadData = new FormData()
uploadData.append('file', file.file)
@@ -272,8 +288,14 @@ const handleCustomUpload = async ({ file, onFinish, onError, onProgress }) => {
// 下面两行是给 UI 看的，保证能回显图片和显示“完成”状态
file.url = response.url
file.status = 'finished'
- formData.documentFileList.push(file)
- console.log('Updated documentFileList:', formData.documentFileList)
+ if (type == 'paymentFileList') {
+ formData.paymentFileList.push(file)
+ } else if (type == 'documentFileList') {
+ formData.documentFileList.push(file)
+ } else if (type == 'signatureFileList') {
+ formData.signatureFileList.push(file)
+ }
+ console.log('Updated documentFileList:', formData)
message.success('上传成功')
onFinish()
} else {
@@ -293,7 +315,7 @@ const initData = async () => {
try {
const wecomId = route.query.wecom_id || 'wmcr-ECwAAzKclEfIKNcVgOdxD-TcqLg'
const res = await http.get('/v1/customer/get_customers_info', { wecom_id: wecomId })
-
+
// 1. 回显基础字段
formData.analystName = res.analystName
formData.parentName = res.customerName
@@ -306,7 +328,7 @@ const initData = async () => {
// 2. 回显付款截图：将已有的 object_name 和 url 封装进 rawResponse
if (res.proofOfPayment && res.proofOfPayment_urls) {
- formData.paymentFileList = res.proofOfPayment.map((objName, index) => ({
+ const paymentFiles = res.proofOfPayment.map((objName, index) => ({
id: objName, // UI 需要一个 ID
name: `凭证-${index + 1}`,
status: 'finished',
@@ -318,6 +340,8 @@ const initData = async () => {
success: true
}
}))
+ formData.paymentFileList = paymentFiles
+ paymentFileListLast.value = paymentFiles
}
message.success('数据加载成功')
} catch (error) {
@@ -357,10 +381,10 @@ const handleSubmit = () => {
// 2. 提取纯净的文件数据（仅包含请求回来的 data 对象）
// 单个文件取第 0 项的 rawResponse
document: formData.documentFileList[0]?.rawResponse || null,
-
+
// 多个文件用 map 提取数组
proofOfPayment: formData.paymentFileList.map(f => f.rawResponse).filter(Boolean),
-
+
// 签名文件
signature: formData.signatureFileList[0]?.rawResponse || null
}