From ad32b2a769637629ce505a70e508780f7074a05c Mon Sep 17 00:00:00 2001 From: luobisheng <727299681@qq.com> Date: 星期五, 18 十一月 2022 16:03:06 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/evidence/index.vue | 548 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 508 insertions(+), 40 deletions(-) diff --git a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/evidence/index.vue b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/evidence/index.vue index c46a150..dfad1d3 100644 --- a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/evidence/index.vue +++ b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/evidence/index.vue @@ -3,14 +3,16 @@ <div class="evidence-title">璋冩煡鍙栬瘉</div> <div class="evidence-form"> <el-form ref="evidenceForm" label-width="160px" :model="evidence" :rules="evidenceRules" autoComplete="on"> - <!-- 鎵垮姙闃熷憳 --> - <el-form-item label="鎵垮姙闃熷憳:" prop="undertaker"> - <el-input v-model="evidence.undertaker" placeholder="璇疯緭鍏ュ鍚�"></el-input> - </el-form-item> - <!-- 鍗忓姙闃熷憳 --> - <el-form-item label="鍗忓姙闃熷憳:" prop="assistant"> - <el-input v-model="evidence.assistant" placeholder="璇疯緭鍏ュ鍚�"></el-input> - </el-form-item> + <div class="evidence-item"> + <!-- 鎵垮姙闃熷憳 --> + <el-form-item label="鎵垮姙闃熷憳:" prop="undertaker"> + <el-input v-model="evidence.undertaker" placeholder="璇疯緭鍏ュ鍚�"></el-input> + </el-form-item> + <!-- 鍗忓姙闃熷憳 --> + <el-form-item label="鍗忓姙闃熷憳:" label-width="100px" prop="assistant"> + <el-input v-model="evidence.assistant" placeholder="璇疯緭鍏ュ鍚�"></el-input> + </el-form-item> + </div> <!-- 鏃堕棿 --> <el-form-item label="鏃堕棿:" prop="investigationTime"> <el-date-picker v-model="evidence.investigationTime" type="datetime" placeholder="閫夋嫨鏃堕棿"> @@ -25,42 +27,132 @@ <el-input v-model="evidence.caseAction" placeholder="璇疯緭鍏ユ鐢�"></el-input> </el-form-item> <!-- 褰撲簨浜轰俊鎭� --> - <el-form-item label="褰撲簨浜轰俊鎭�"> - <el-input suffix-icon="el-icon-s-order" @focus="openDialog"></el-input> + <el-form-item label="褰撲簨浜轰俊鎭�:" prop="userInfo" class="sp-user-info"> + <el-input suffix-icon="el-icon-s-order" v-model="evidence.userInfo" @focus="openDialog"></el-input> </el-form-item> <!-- 鎯呭喌鎻忚堪 --> - <el-form-item label="鎯呭喌鎻忚堪:" prop="description"> + <el-form-item label="澶勭疆缁撴灉:" prop="description"> <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" maxlength="200" show-word-limit - v-model="evidence.description" placeholder="璇疯緭鍏ユ儏鍐垫弿杩�,闄愬埗200瀛椾互鍐�"></el-input> + v-model="evidence.description" placeholder="璇疯緭鍏ュ缃粨鏋�,闄愬埗200瀛椾互鍐�"></el-input> </el-form-item> <!-- 鐓х墖闄勪欢 --> - <el-form-item label="鐓х墖闄勪欢:" prop="photo"> + <el-form-item label="鐓х墖闄勪欢:" prop="pic"> <div class="upImg"> - <div class="img-list"> - <img :src="item" alt="" v-for="(item,index) in evidence.pic" :key="index"> - </div> - <div class="upload" v-if="evidence.pic.length<4"> + <!-- <div class="img-list" v-if="evidence.pic.length!==0"> + <div class="img" v-for="(item,index) in evidence.pic" :key="index"> + <img :src="item" alt=""> + <i class="el-icon-close myicon" @click="handleRemove(index)"></i> + </div> + </div> --> + <MyUpload @setPictureUrl="setPicUrl" @delPictureUrl="delPicUrl"></MyUpload> + <!-- <div class="upload" v-if="evidence.pic.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" + action="/sccg/file/medias" multiple :show-file-list="false" :limit="4" :on-success="handleSuccess2" :headers="getToken()"> <i class="el-icon-plus"></i> </el-upload> - </div> + </div> --> <div class="tip">{{evidence.pic.length}} / 4</div> </div> </el-form-item> </el-form> </div> - <div class="user-form"> - <el-dialog :visible.sync="dialogUser" width="80%" title="璋冨害淇℃伅" v-if="dialogUser" :before-close="handleClose" - append-to-body> - 11111 - </el-dialog> + <div class="user-form" v-show="userFlag"> + <div class="user-form-header"> + <span>璋冨害淇℃伅</span> + <i class="el-icon-close" @click="closeUserForm"></i> + </div> + <div class="user-form-content"> + <el-form ref="userForm" label-width="120px" :model="user" :rules="userRules" autoComplete="on"> + <!-- 绫诲瀷 --> + <el-form-item label="绫诲瀷:" prop="illegalType"> + <el-input v-model="basecase"></el-input> + </el-form-item> + <!-- 濮撳悕銆佹墜鏈哄彿 --> + <div class="user-item"> + <!-- 濮撳悕 --> + <el-form-item label="褰撲簨浜哄鍚�:" prop="name"> + <el-input v-model="user.name"></el-input> + </el-form-item> + <!-- 鎵嬫満鍙� --> + <el-form-item label="鎵嬫満鍙风爜:" prop="phoneCode"> + <el-input v-model="user.phoneCode"></el-input> + </el-form-item> + </div> + <!-- 璇佷欢 --> + <div class="user-item"> + <el-form-item label="璇佷欢绫诲瀷:" prop="certificateType"> + <el-select v-model="user.certificateType" placeholder="璇烽�夋嫨"> + <el-option v-for="item in cardOptions" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <el-form-item label="璇佷欢鍙风爜:" prop="certificateCode"> + <el-input v-model="user.certificateCode"></el-input> + </el-form-item> + </div> + <!-- 鏂囧寲绋嬪害\鑱屼笟 --> + <div class="user-item"> + <!-- 鏂囧寲绋嬪害 --> + <el-form-item label="鏂囧寲绋嬪害:" prop="educationDegree"> + <el-select v-model="user.educationDegree" placeholder="璇烽�夋嫨"> + <el-option v-for="item in degreeOptions" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 鑱屼笟 --> + <el-form-item label="鑱屼笟:" prop="career"> + <el-input v-model="user.career"></el-input> + </el-form-item> + </div> + <!-- 宸ヤ綔鍗曚綅鍙婅亴鍔� --> + <el-form-item label="宸ヤ綔鍗曚綅鍙婅亴鍔�:" prop="work"> + <el-input v-model="user.work"></el-input> + </el-form-item> + <!-- 姘戞棌\绫嶈疮 --> + <div class="user-item"> + <!-- 姘戞棌 --> + <el-form-item label="姘戞棌:" prop="nation"> + <!-- <el-select v-model="user.nation" placeholder="璇烽�夋嫨姘戞棌"> --> + <el-select v-model="user.nation" placeholder="璇烽�夋嫨"> + <el-option v-for="item in nationOptions" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + <!-- <el-input v-model="user.nation"></el-input> --> + </el-form-item> + <!-- 绫嶈疮 --> + <el-form-item label="绫嶈疮:" prop="nativePlace"> + <el-input v-model="user.nativePlace"></el-input> + </el-form-item> + </div> + <!-- 鐜颁綇鍧� --> + <el-form-item label="鐜颁綇鍧�:" prop="liveAddress"> + <el-input v-model="user.liveAddress"></el-input> + </el-form-item> + <!-- 鎴风睄鎵�鍦ㄥ湴 --> + <el-form-item label="鎴风睄鎵�鍦ㄥ湴:" prop="registerAddress"> + <el-input v-model="user.registerAddress"></el-input> + </el-form-item> + </el-form> + </div> + <div class="user-form-footer"> + <el-button type="primary" @click="checkUser">纭畾</el-button> + <el-button>杩斿洖</el-button> + </div> </div> </div> </template> <script> +import { getTypeList } from '@/utils/helper' +import {validateName,validatePhone,validateCardId} from '@/utils/validate' +import MyUpload from "@/components/myUpload" export default { + components: { + MyUpload + }, data() { const checkName = (rule, value, callback) => { if (value) { @@ -105,17 +197,112 @@ } } const checkPic = (rule, value, callback) => { + if (value.length !== 0) { + callback() + } else { + callback(new Error('璇蜂笂浼犵収鐗囬檮浠�')); + } + } + const checkIll = (rule, value, callback) => { if (value) { callback() } else { + callback(new Error('妗堜欢绫诲瀷涓嶈兘涓虹┖')); + } + } + const checkName3 = (rule, value, callback) => { + if (value) { + validateName(value) ? callback() : callback(new Error('璇疯緭鍏ユ纭殑濮撳悕')) + } else { + callback(new Error('褰撲簨浜哄鍚嶄笉鑳戒负绌�')); + } + } + const checkPhone = (rule, value, callback) => { + if (value) { + validatePhone(value) ? callback() : callback(new Error('璇疯緭鍏ユ纭殑鎵嬫満鍙风爜')) + } else { + callback(new Error('鎵嬫満鍙风爜涓嶈兘涓虹┖')); + } + } + const checkCard = (rule, value, callback) => { + if (value) { + callback() + } else { + callback(new Error('璇佷欢绫诲瀷涓嶈兘涓虹┖')); + } + } + const checkCode = (rule, value, callback) => { + if (value) { + validateCardId(value) ? callback() : callback(new Error('璇疯緭鍏ユ纭殑璇佷欢鍙风爜')) + } else { + callback(new Error('璇佷欢鍙风爜涓嶈兘涓虹┖')); + } + } + const checkWh = (rule, value, callback) => { + if (value) { + callback() + } else { + callback(new Error('鏂囧寲绋嬪害涓嶈兘涓虹┖')); + } + } + // const checkCareer = (rule, value, callback) => { + // if (value) { + // callback() + // } else { + // callback(); + // } + // } + // const checkWork = (rule, value, callback) => { + // if (value) { + // callback() + // } else { + // callback(new Error('宸ヤ綔鍗曚綅鍙婅亴鍔′笉鑳戒负绌�')); + // } + // } + const checkNation = (rule, value, callback) => { + if (value) { + callback() + } else { + callback(new Error('姘戞棌涓嶈兘涓虹┖')); + } + } + // const checkNaP = (rule, value, callback) => { + // if (value) { + // callback() + // } else { + // callback(new Error('绫嶈疮涓嶈兘涓虹┖')); + // } + // } + const checkLiveAdd = (rule, value, callback) => { + if (value) { + callback() + } else { + callback(new Error('鐜颁綇鍧�涓嶈兘涓虹┖')); + } + } + // const checkRegAdd = (rule, value, callback) => { + // if (value) { + // callback() + // } else { + // callback(new Error('鎴风睄鎵�鍦ㄥ湴涓嶈兘涓虹┖')); + // } + // } + const checkFlag = (rule, value, callback) => { + if (value) { callback(); + } else { + callback(new Error('鐢ㄦ埛淇℃伅涓嶈兘涓虹┖')) } } return { evidence: { - pic: [] + pic: [], + userInfo: '', }, evidenceRules: { + userInfo: [ + { trigger: 'change', validator: checkFlag } + ], undertaker: [ { trigger: 'blur', validator: checkName @@ -153,14 +340,152 @@ ], }, fileList: [], - user: {}, - dialogUser: false, + user: { + illegalType: '', + name: '', + phoneCode: '', + certificateType: 703, + certificateCode: '', + educationDegree: '', + career: '', + work: '', + nation: '', + nativePlace: '', + liveAddress: '', + registerAddress: '', + }, + userRules: { + illegalType: [ + { + trigger: 'change', validator: checkIll, + } + ], + name: [ + { + required:true,trigger: 'blur', validator: checkName3 + } + ], + phoneCode: [ + { + required:true,trigger: 'blur', validator: checkPhone + } + ], + certificateType: [ + { + trigger: 'change', validator: checkCard + } + ], + certificateCode: [ + { + required:true,trigger: 'blur', validator: checkCode + } + ], + educationDegree: [ + { + trigger: 'change', validator: checkWh + } + ], + // career: [ + // { + // trigger: 'blur', validator: checkCareer + // } + // ], + // work: [ + // { + // trigger: 'blur', validator: checkWork + // } + // ], + nation: [ + { + trigger: 'change', validator: checkNation + } + ], + // nativePlace: [ + // { + // trigger: 'blur', validator: checkNaP + // } + // ], + liveAddress: [ + { + required:true,trigger: 'blur', validator: checkLiveAdd + } + ], + // registerAddress: [ + // { + // trigger: 'blur', validator: checkRegAdd + // } + // ], + }, + userFlag: false, + typeOptions: [ + { + label: '杩濇硶', + value: 1, + }, + { + label: '杩濆缓', + value: 2 + } + ], + nationOptions: [], + cardOptions: [ + { + label: '韬唤璇�', + value: 1, + }, + { + label: '鍏朵粬', + value: 2 + } + ], + degreeOptions: [ + { + label: '灏忓', + value: 1 + }, + { + label: '鍒濅腑', + value: 2 + }, + { + label: '楂樹腑', + value: 3 + }, + { + label: '澶у鍙婁互涓�', + value: 4 + }, + ], + basecase:"" } }, + created() { + this.getCardTypeList(); + this.getSchoolList(); + this.getNationList(); + console.log(this.mytype); + this.user.illegalType = JSON.parse(JSON.stringify(this.mytype)); + const {mycode}=this; + this.getEventInfo(mycode) + }, methods: { + // 鑾峰彇妗堜欢淇℃伅 + async getEventInfo(mycode) { + await this.$axios({ + method: 'get', + url: `sccg/base_case/baseCaseDetail/${mycode}` + }) + .then(res => { + if(this.mytype == 1){ + this.basecase = res.data.baseCase.violations.typeText; + }else{ + this.basecase = res.data.baseCase.illegalBuilding.categoryText; + } + console.log(this.basecase) + }) + }, handleSuccess2(res, file, filelist) { const baseUrl = 'http://140.143.152.226:8410/'; - console.log(res); if (this.evidence.pic.length < 4) { this.evidence.pic.push(baseUrl + res.data.url1) } @@ -174,24 +499,88 @@ }, // 鎵撳紑褰撲簨浜轰俊鎭~鍐欒〃 openDialog(e) { - this.dialogUser = true + this.userFlag = true; + this.userInfo = true; }, - // 鍏抽棴褰撲簨浜轰俊鎭� - handleClose(done) { - this.$confirm('纭鍏抽棴锛�') - .then(_ => { - this.dialogUser = false; - done(); - }) - .catch(_ => { }); + // 妫�楠寀ser + checkUser() { + // console.log(this.$refs.userForm.validate); + this.$refs.userForm.validate((valid) => { + console.log(valid); + if (valid) { + this.evidence.userInfo = this.user.name; + this.userFlag = false; + } else { + this.evidence.userInfo = false; + return false; + } + }) }, - } + // 鍏抽棴褰撲簨浜轰俊鎭晫闈� + closeUserForm() { + this.userFlag = false; + }, + // 杩斿洖褰撳墠evidence鍜寀ser瀵硅薄 + backData() { + const { user, evidence } = this; + this.$emit('getEvidence', { user, evidence }); + }, + // 鍒犻櫎鍥剧墖 + handleRemove(index) { + this.evidence.pic.splice(index, 1); + }, + // 鑾峰彇璇佷欢绫诲瀷 + async getCardTypeList() { + this.cardOptions = await getTypeList(1, '03'); + }, + // 鑾峰彇瀛﹀巻 + async getSchoolList() { + this.degreeOptions = await getTypeList(1, '04'); + }, + // 鑾峰彇姘戞棌鍒楄〃 + async getNationList() { + this.nationOptions = await getTypeList(1, '05'); + }, + // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧� + setPicUrl({ url }) { + const baseUrl = 'http://140.143.152.226:8410/'; + if (this.evidence.pic.length < 4) { + this.evidence.pic.push(baseUrl + url) + } + console.log(url); + }, + //鍒犻櫎鍥剧墖 + delPicUrl({url}){ + const baseUrl = 'http://140.143.152.226:8410/'; + console.log(url); + this.evidence.pic.splice(this.evidence.pic.indexOf(baseUrl + url),1); + console.log(this.evidence.pic); + } + }, + watch: { + 'evidence.pic.length': { + handler(newLen, oldLen) { + if (newLen !== 0) { + this.$refs.evidenceForm.validate((valid) => { + if (valid) { + + } else { return false } + }) + } + }, + deep: true, + } + }, + props:['mytype','mycode'] } </script> <style lang="scss" scoped> .evidence { line-height: 60px; - + position: relative; + .evidence-item{ + display: flex; + } .evidence-title { line-height: 60px; font-weight: 650; @@ -213,12 +602,25 @@ } .img-list { - height: 80px; + height: 60px; position: relative; + display: flex; img { width: 60px; height: 60px; + } + + .img { + height: 60px; + position: relative; + } + + .myicon { + position: absolute; + top: 0px; + right: 0px; + color: #4b9bb7; } } } @@ -234,6 +636,72 @@ border-radius: 4px; } +.user-form { + position: absolute; + top: 0; + z-index: 3000; + background-color: #06122c; + + .user-form-header { + background-color: #fff; + color: #4b9bb7; + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + } + + padding-bottom: 60px; +} +.sp-user-info{ + ::v-deep .el-input{ + width: 200px; + } +} +.user-form-content { + padding-top: 20px; + + .user-item { + display: flex; + justify-content: flex-start; + + .el-input { + flex: 1; + } + + .el-select { + flex: 1; + + :deep(.el-input__inner){ + padding: 0px 15px; + } + } + } + + ::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-input__count { + background-color: #09152f; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } +} + +.user-form-footer { + display: flex; + justify-content: flex-end; +} + ::v-deep .el-textarea__inner { background-color: #09152f; border: 1px solid #17324c; -- Gitblit v1.8.0