From a598d935a61fea27312fc57becd80e23bf09f788 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期五, 21 十月 2022 18:04:19 +0800 Subject: [PATCH] 修改bug --- src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/arrive/index.vue | 56 ++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 42 insertions(+), 14 deletions(-) diff --git a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/arrive/index.vue b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/arrive/index.vue index 858e326..e6b426c 100644 --- a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/arrive/index.vue +++ b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/arrive/index.vue @@ -1,6 +1,6 @@ <template> <div class="arrive"> - <div class="arrive-title">鍒板ぇ鐜板満鎯呭喌</div> + <div class="arrive-title">鍒拌揪鐜板満鎯呭喌</div> <div class="arrive-form"> <el-form ref="arriveForm" label-width="160px" :model="arrive" :rules="arriveRules" autoComplete="on"> <!-- 鍒拌揪鏃堕棿 --> @@ -25,13 +25,16 @@ <!-- 鐜板満鎯呭喌鐓х墖 --> <el-form-item label="鐜板満鎯呭喌鐓х墖:" prop="situationPic"> <div class="upImg"> - <div class="img-list"> - <img :src="item" alt="" v-for="(item,index) in arrive.situationPic" :key="index"> + <div class="img-list" v-if="arrive.situationPic.length!==0"> + <div class="img" v-for="(item,index) in arrive.situationPic" :key="index"> + <img :src="item" alt=""> + <i class="el-icon-close myicon" @click="handleRemove(index)"></i> + </div> </div> <div class="upload" v-if="arrive.situationPic.length<4"> <el-upload :file-list="fileList" class="upload-demo" - action="http://42.193.1.25:8082/sccg/file/medias" multiple :show-file-list="false" - :limit="4" :on-success="handleSuccess" :headers="getToken()"> + action="/sccg/file/medias" multiple :show-file-list="false" + :limit="50" :on-success="handleSuccess" list-type="picture" :headers="getToken()"> <i class="el-icon-plus"></i> </el-upload> </div> @@ -74,10 +77,10 @@ } } const checkSitPic = (rule, value, callback) => { - if (value) { + if (value.length !== 0) { callback() } else { - callback(); + callback(new Error('璇蜂笂浼犵幇鍦烘儏鍐电収鐗�')); } } return { @@ -98,17 +101,17 @@ { trigger: 'blur', validator: checkReplay } ], situationPic: [ - { trigger: 'change', validator: checkSitPic } + { trigger: 'blur', validator: checkSitPic } ], }, fileList: [], } }, - props:['getArrive'], methods: { handleSuccess(res, file, filelist) { const baseUrl = 'http://140.143.152.226:8410/'; console.log(res); + console.log(this.fileList); if (this.arrive.situationPic.length < 4) { this.arrive.situationPic.push(baseUrl + res.data.url1) } @@ -121,15 +124,29 @@ } }, // 鑾峰彇arrive瀵硅薄 - backData(){ + backData() { const { arrive } = this; - this.$emit('getArrive',{arrive}); + this.$emit('getArrive', { arrive }); + }, + // 鍒犻櫎鍥剧墖 + handleRemove(index) { + this.arrive.situationPic.splice(index,1); + } + }, + watch: { + 'arrive.situationPic.length': { + handler(newLen, oldLen) { + if (newLen !== 0) { + this.$refs.arriveForm.validateField('situationPic'); + } + }, + deep: true, } } } </script> <style lang="scss" scoped> -.arrive-title{ +.arrive-title { line-height: 60px; font-weight: 650; font-size: 20px; @@ -149,12 +166,23 @@ } .img-list { - height: 80px; + height: 60px; position: relative; - + display: flex; img { width: 60px; height: 60px; + margin-right: 10px; + } + .img{ + height: 60px; + position: relative; + } + .myicon { + position: absolute; + top: 0px; + right: 0px; + color: #4b9bb7; } } } -- Gitblit v1.8.0