From 7132270dbcb01808e205e108ad6bb87270dbe4b8 Mon Sep 17 00:00:00 2001 From: zhouwx <1175765986@qq.com> Date: 星期三, 05 二月 2025 13:42:43 +0800 Subject: [PATCH] 资质证书上传修改 --- src/layout/components/Register/index.vue | 41 ++++++++++++++++---- src/views/safetyReview/institution/components/viewInstitution.vue | 30 ++++++++++++-- 2 files changed, 57 insertions(+), 14 deletions(-) diff --git a/src/layout/components/Register/index.vue b/src/layout/components/Register/index.vue index afdc9b3..b386538 100644 --- a/src/layout/components/Register/index.vue +++ b/src/layout/components/Register/index.vue @@ -138,12 +138,12 @@ </el-col> </el-row> <el-row :gutter="30"> - <el-col :span="8"> + <el-col :span="12"> <el-form-item prop="agency.certPath" label="资质证书"> <el-upload accept="image/*" :action="state.uploadUrl" :headers="state.header" method="post" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile,'证书')" :on-exceed="showTip" :on-preview="handlePictureCardPreview" :limit='state.imgLimit' v-model:file-list="state.certList" list-type="picture-card" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles,'证书')" > <el-icon><Plus /></el-icon> <template #tip> - <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传1张</div> + <div class="el-upload__tip">上传jpg/png图片尺寸小于5M,最多可上传5张</div> </template> </el-upload> </el-form-item> @@ -334,7 +334,7 @@ busList: [], fileList: [], certList: [], - imgLimit: 1, + imgLimit: 5, uploadUrl: import.meta.env.VITE_APP_BASE_API + '/system/common/uploadFile', header: { Authorization: 'Bearer ' + getToken() @@ -502,6 +502,7 @@ { required: true, validator: equalToPassword, trigger: "blur" } ] }; +const cert = ref([]) const loading = ref(false) const dialogVisible = ref(false) @@ -559,7 +560,18 @@ state.fileList = imgUrl ? imgUrl.split(',').map(url => {return {url} }) : [] } if(res.data.certPath) { - const imgUrl = import.meta.env.VITE_APP_BASE_API + "/" + res.data.certPath + // cert.value.push(res.data.certPath) + const imgList = res.data.certPath.split(',') + cert.value = imgList + imgList.forEach((item,index) => { + if(item.includes(import.meta.env.VITE_APP_BASE_API)){ + + }else{ + imgList[index] = import.meta.env.VITE_APP_BASE_API + "/" + item + } + + }) + const imgUrl = imgList.join(',') state.certList = imgUrl ? imgUrl.split(',').map(url => {return {url} }) : [] } @@ -652,7 +664,9 @@ if(type === '上报表'){ state.registerForm.agency.reportPath = res.data.path }else { - state.registerForm.agency.certPath = res.data.path + cert.value.push(res.data.path) + state.registerForm.agency.certPath = cert.value.join(',') + console.log('cert',cert.value) } }else{ @@ -665,13 +679,15 @@ const handleRemove = async (file, uploadFiles,type) => { if(file && file.status == 'success'){ - - let path = ''; if(type === '上报表'){ path = state.registerForm.agency.reportPath; }else { - path = state.registerForm.agency.certPath; + path = file.url.substring(file.url.indexOf('upload')) + console.log('cert',cert.value) + cert.value = cert.value.filter(url => !file.url.includes(url)) + state.registerForm.agency.certPath = cert.value.join(',') + } const res = await delPic({path: path}) if(res.code == 200){ @@ -680,6 +696,7 @@ message: '文件已删除' }) }else{ + ElMessage({ type: 'warning', message: res.message @@ -696,6 +713,8 @@ const {confirmPassword,id, ...data} = JSON.parse(JSON.stringify(state.registerForm)) data.password = Base64.encode(data.password) data.agency.business = data.agency.business.join(',') + const cert = state.certList.map(item => item.response ?item.response.data.path:item.url) + data.agency.certPath = cert.join(',') delete data.agency.area delete data.agency.id register(data).then(res => { @@ -729,11 +748,14 @@ const {confirmPassword, ...data} = JSON.parse(JSON.stringify(state.registerForm)) data.password = Base64.encode(data.password) data.agency.business = data.agency.business.join(',') + console.log('rea',state.certList) + const cert = state.certList.map(item => item.response ?item.response.data.path:item.url) + data.agency.certPath = cert.join(',') if(isReject.value) { data.state = 1; } // delete data.agency.area - console.log('data',data) + // console.log('data',data) editAgency(data).then(res => { if(res.code == 200){ ElMessage({ @@ -769,6 +791,7 @@ proxy.$refs.registerRef.clearValidate() state.fileList = [] state.certList = [] + cert.value = [] } defineExpose({ diff --git a/src/views/safetyReview/institution/components/viewInstitution.vue b/src/views/safetyReview/institution/components/viewInstitution.vue index aa9a569..58fcf22 100644 --- a/src/views/safetyReview/institution/components/viewInstitution.vue +++ b/src/views/safetyReview/institution/components/viewInstitution.vue @@ -143,8 +143,8 @@ <el-row :gutter="30"> <el-col :span="8"> <el-form-item prop="agency.certPath" label="资质证书"> - <el-upload disabled :limit='state.imgLimit' :show-file-list="false" list-type="picture-card" > - <el-image v-if="certImageUrl" :src="certImageUrl" :preview-src-list="certList" style="width: 100%;max-height: 146px;" /> + <el-upload disabled v-model:file-list="certList" :limit='state.imgLimit' :on-preview="handlePictureCardPreview" list-type="picture-card" > + </el-upload> </el-form-item> </el-col> @@ -301,7 +301,7 @@ areaList: [], busList: [], fileList: [], - imgLimit: 1, + imgLimit: 5, uploadUrl: import.meta.env.VITE_APP_BASE_API + '/system/common/uploadFile', header: { Authorization: 'Bearer ' + getToken() @@ -358,8 +358,21 @@ registerForm.value.agency.business = res.data.business.split(",").map(Number) imageUrl.value = import.meta.env.VITE_APP_BASE_API + "/" + res.data.reportPath srcList.value.push(imageUrl.value) - certImageUrl.value = import.meta.env.VITE_APP_BASE_API + "/" + res.data.certPath - certList.value.push(certImageUrl.value) + + if(res.data.certPath) { + const imgList = res.data.certPath.split(',') + imgList.forEach((item,index) => { + if(item.includes(import.meta.env.VITE_APP_BASE_API)){ + + }else{ + imgList[index] = import.meta.env.VITE_APP_BASE_API + "/" + item + } + }) + const imgUrl = imgList.join(',') + certList.value = imgUrl ? imgUrl.split(',').map(url => {return {url} }) : [] + } + // certImageUrl.value = import.meta.env.VITE_APP_BASE_API + "/" + res.data.certPath + }else{ @@ -375,6 +388,10 @@ srcList.value = [] certList.value = [] } +const handlePictureCardPreview = (uploadFile) => { + state.dialogImageUrl = uploadFile.url + state.dialogImg = true +} defineExpose({ openDialog, @@ -387,9 +404,12 @@ margin-top: 500px !important; } } + + </style> <style lang='scss' scoped> .register-form { + ::v-deep(.el-upload--picture-card){display: none} .el-input { height: 40px; input { -- Gitblit v1.9.2