From 9ff66017debadfc89bc0c1b796684a4d1dbe2bc3 Mon Sep 17 00:00:00 2001 From: fangyuan <527392886@qq.com> Date: 星期五, 16 十二月 2022 10:00:02 +0800 Subject: [PATCH] 已上报到市批量操作按钮隐藏 --- src/views/operate/disposal/casepool/pool/createUser/vio/index.vue | 609 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 607 insertions(+), 2 deletions(-) diff --git a/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue b/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue index d0ef7c6..46aa84e 100644 --- a/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue +++ b/src/views/operate/disposal/casepool/pool/createUser/vio/index.vue @@ -1,3 +1,608 @@ <template> - <div>1</div> -</template> \ No newline at end of file + <div class="vio"> + <div class="input-area"> + <div class="input-header"> + <div class="input-header__title">鍩虹淇℃伅</div> + <div class="input-header__tip">濉啓浜嬩欢鍩虹淇℃伅</div> + </div> + <div class="input-form"> + <el-form ref="user" label-width="120px" autoComplete="on" :model="vio" :rules="createRoleRules" + label-position="right"> + <div class="user-item"> + <!-- 闂绫诲瀷 --> + <el-form-item class="optionItem" label="闂绫诲瀷:" prop="category"> + <el-select v-model="vio.category" placeholder="杩濊" disabled> + <el-option v-for="item in typeList" :key="item.label" :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <!-- 澶х被鍚嶇О --> + <el-form-item class="optionItems" label="澶х被鍚嶇О:" prop="categoryId"> + <el-select v-model="vio.categoryId" placeholder="璇烽�夋嫨澶х被鍚嶇О" @change="handleBigKindChange"> + <el-option v-for="item in bigKindList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + </div> + <div class="user-item"> + <!-- 灏忕被鍚嶇О --> + <el-form-item class="optionItems" label="灏忕被鍚嶇О:" prop="typeId"> + <el-select v-model="vio.typeId" placeholder="璇烽�夋嫨灏忕被鍚嶇О" @change="handleSmallKindChange"> + <el-option v-for="item in smallKindList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + <!-- 浜嬩欢绛夌骇 --> + <el-form-item class="optionItems" label="浜嬩欢绛夌骇:" prop="gradeId"> + <el-select v-model="vio.gradeId" placeholder="璇烽�夋嫨妗堜欢绛夌骇"> + <el-option v-for="item in eventLevelList" :key="item.id" :label="item.name" + :value="item.id"> + </el-option> + </el-select> + </el-form-item> + </div> + <!-- 妗堢敱 --> + <el-form-item class="optionItem anyou" label="妗堢敱:" prop="actionCause"> + <el-select v-model="vio.actionCause" placeholder="璇疯緭鍏ユ鐢�" filterable @blur="selectBlur"> + <el-option v-for="item in anYouList" :key="item.id" :label="item.name" :value="item.name"> + </el-option> + </el-select> + </el-form-item> + <div class="user-item"> + <!-- 鎵�灞炶閬� --> + <el-form-item class="optionItems" label="鎵�灞炶閬�:" prop="streetId"> + <el-select v-model="vio.streetId" placeholder="璇烽�夋嫨鎵�灞炶閬�" @change="handleStreet"> + <el-option v-for="item in streetList" :key="item.id" :label="item.regionName" :value="item.id" + > + </el-option> + </el-select> + </el-form-item> + <!-- 鎵�灞炵ぞ鍖� --> + <el-form-item class="optionItems" label="鎵�灞炵ぞ鍖�:" prop="communityId"> + <el-select v-model="vio.communityId" placeholder="璇烽�夋嫨鎵�灞炵ぞ鍖�"> + <el-option v-for="item in communityList" :key="item.id" :label="item.regionName" + :value="item.id" > + </el-option> + </el-select> + </el-form-item> + </div> + <!-- 浜嬪彂鍦扮偣 --> + <el-form-item class="optionItems" label="浜嬪彂鍦扮偣:" prop="site"> + <el-input placeholder="璇疯緭鍏ヤ簨鍙戝湴璇︾粏浣嶇疆" v-model="vio.site"></el-input> + </el-form-item> + <div class="user-item"> + <!-- 鏄惁鍏宠仈鍟嗛摵 --> + <el-form-item class="optionItems" label="鏄惁鍏宠仈鍟嗛摵:" prop="linkShop"> + <el-radio-group v-model="vio.linkShop" @change="handleLinkShop"> + <el-radio :label="1">鏄�</el-radio> + <el-radio :label="0">鍚�</el-radio> + </el-radio-group> + </el-form-item> + <!-- 鍏宠仈鍟嗛摵鍚嶇О --> + <el-form-item class="optionItems" label="鍏宠仈鍟嗛摵鍚嶇О:" prop="shopName"> + <el-select v-model="vio.shopName" :disabled="vio.linkShop === 0" placeholder="璇峰~鍐欏叧鑱斿晢閾哄悕绉�"> + <el-option v-for="store in storeList" :key="store.id" :value="store.id" :label="store.storeName"></el-option> + </el-select> + </el-form-item> + </div> + <!-- 濉啓杞︾墝鍙� --> + <el-form-item class="optionItems" label="濉啓杞︾墝鍙�:" prop="carNumber"> + <el-input placeholder="璇峰~鍐欒溅鐗屽彿" v-model="vio.carNumber"></el-input> + </el-form-item> + <!-- 闂鎻忚堪 --> + <el-form-item class="optionItems" label="闂鎻忚堪:" prop="description"> + <el-input type="textarea" :rows="5" maxlength="200" placeholder="璇疯緭鍏ュ唴瀹�200瀛椾互鍐�" + v-model="vio.description"> + </el-input> + </el-form-item> + <div class="user-item"> + <!-- 鎶ヨ鏃堕棿 --> + <el-form-item class="optionItems" label="鎶ヨ鏃堕棿:" prop="alarmTime"> + <el-date-picker v-model="vio.alarmTime" type="datetime" placeholder="閫夋嫨鎶ヨ鏃堕棿"> + </el-date-picker> + </el-form-item> + <!-- 璋冨害鏃堕檺 --> + <el-form-item class="optionItems" label="璋冨害鏃堕檺:" prop="limitTime"> + <el-date-picker v-model="vio.limitTime" type="datetime" placeholder="閫夋嫨璋冨害鏃堕檺"> + </el-date-picker> + </el-form-item> + </div> + <!-- 濉啓鍙嶆槧浜轰俊鎭� --> + <el-form-item class="optionItems" label="濉啓鍙嶆槧浜轰俊鎭�"> + </el-form-item> + <!-- 鍙嶆槧浜烘儏鍐� --> + <div class="user-item"> + <el-form-item class="optionItems" label="鍙嶆槧浜�:" prop="informant"> + <el-input v-model="vio.informant"></el-input> + </el-form-item> + <el-form-item class="optionItems" label="鑱旂郴鏂瑰紡:" prop="informantPhoneCode"> + <el-input v-model="vio.informantPhoneCode"></el-input> + </el-form-item> + </div> + <el-form-item class="optionItems" label="韬唤璇佸彿:" prop="informantIdCard"> + <el-input v-model="vio.informantIdCard"></el-input> + </el-form-item> + </el-form> + </div> + <div class="input-footer"> + <el-button type="primary" class="confirm" @click="handleSubmit">纭畾</el-button> + <el-button class="back" @click="handleBack">杩斿洖</el-button> + </div> + </div> + <div class="map-area"> + <!-- <MyMap /> --> + </div> + </div> +</template> +<script> +import MyMap from '@/components/map' +import { validateName, validatePhone, validateCarNum, validateCardId } from '@/utils/validate' +import { getTypeList } from '@/utils/helper' +import { parseTime } from "@/utils/index" +import { getStoreInfoList } from "@/api/operate/storeManagement"; +export default { + components: { + MyMap + }, + data() { + const checkCause = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('妗堢敱涓嶈兘涓虹┖')) + } + } + const checkCategory = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('澶х被鍚嶇О涓嶈兘涓虹┖')) + } + } + const checkCommunity = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鎵�灞炵ぞ鍖轰笉鑳戒负绌�')); + } + } + const checkDesc = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('闂鎻忚堪涓嶈兘涓虹┖')) + } + } + const checkSite = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('浜嬪彂鍦扮偣涓嶈兘涓虹┖')) + } + } + const checkStreet = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鎵�灞炶閬撲笉鑳戒负绌�')) + } + } + const checkType = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('灏忕被涓嶈兘涓虹┖')) + } + } + const checkGrade = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('浜嬩欢绛夌骇涓嶈兘涓虹┖')) + } + } + const checkDate = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鎶ヨ鏃堕棿涓嶈兘涓虹┖')) + } + } + const checkName = (rule, value, callback) => { + if (value) { + validateName(value) ? callback() : callback(new Error('璇疯緭鍏ユ纭殑濮撳悕')) + } else { + callback() + } + } + const checkCardId = (rule, value, callback) => { + if (value) { + validateCardId(value) ? callback() : callback(new Error('璇疯緭鍏ユ纭殑韬唤璇佸彿鐮�')) + } else { + callback() + } + } + const checkPhone = (rule, value, callback) => { + if (value) { + validatePhone(value) ? callback() : callback(new Error('璇疯緭鍏ユ纭殑鎵嬫満鍙�')); + } else { + callback() + } + } + const checkLink = (rule, value, callback) => { + if (value) { + callback(); + } else { + if (this.vio.linkShop === 1) { + callback(new Error('鍏宠仈鍟嗛摵鍚嶅瓧涓嶈兘涓虹┖')); + } else { + callback(); + } + } + } + const checkLimit = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('璋冨害鏃堕檺鏃堕棿涓嶈兘涓虹┖')) + } + } + return { + vio: { + actionCause: "",//妗堢敱 + carNumber: "",//杞︾墝鍙� + categoryId: '',//澶х被 + communityId: '',//鎵�灞炵ぞ鍖� + description: '',//闂鎻忚堪 + informant: '',//鍙嶆槧浜� + informantIdCard: '',//韬唤璇佸彿鐮� + informantPhoneCode: "",//鍙嶆槧浜鸿仈绯绘柟寮� + linkShop: 0,//鏄惁鍏宠仈鍟嗛摵(0鍚�1鏄�) + shopName: "",//鍏宠仈鍟嗛摵鍚嶇О + site: '',//浜嬪彂鍦扮偣 + streetId: '',//鎵�灞炶閬� + typeId: '',//灏忕被 + gradeId: '',//妗堜欢绛夌骇 + alarmTime: '', + limitTime: '',//璋冨害鏃堕檺 + }, + createRoleRules: { + //妗堢敱 + actionCause: [ + { + required: true, trigger: 'blur', validator: checkCause, + } + ], + //澶х被 + categoryId: [ + { + required: true, trigger: 'change', validator: checkCategory + } + ], + //鎵�灞炵ぞ鍖� + communityId: [ + { + required: true, trigger: 'change', validator: checkCommunity + } + ], + //闂鎻忚堪 + description: [ + { + required: true, trigger: 'blur', validator: checkDesc + } + ], + informant: [ + { + required: false, trigger: 'blur', validator: checkName + } + ], + informantIdCard: [ + { + required: false, trigger: 'blur', validator: checkCardId + } + ], + informantPhoneCode: [ + { + required: false, trigger: 'blur', validator: checkPhone + } + ], + // linkShop:0,//鏄惁鍏宠仈鍟嗛摵(0鍚�1鏄�) + shopName: [ + { + required: false, trigger: 'blur', validator: checkLink + } + ], + //浜嬪彂鍦扮偣 + site: [ + { + required: true, trigger: 'blur', validator: checkSite + } + ], + //鎵�灞炶閬� + streetId: [ + { + required: true, trigger: 'change', validator: checkStreet + } + ], + //灏忕被 + typeId: [ + { + required: true, trigger: 'change', validator: checkType + } + ], + //妗堜欢绛夌骇 + gradeId: [ + { + required: true, trigger: 'change', validator: checkGrade + } + ], + alarmTime: [ + { + required: true, trigger: 'change', validator: checkDate + } + ], + limitTime: [ + { + required: true, trigger: 'change', validator: checkLimit + } + ] + + }, + bigKindList: [], + smallKindList: [], + eventLevelList: [], + typeList: [ + { + label: '杩濊', + value: 1. + }, + { + label: '杩濆缓', + value: 2. + } + ], + streetList: [], + communityList: [], + anYouList: [], + storeList: [] + } + }, + created() { + const { setBigKindList, getStreetList, getEventLevel } = this; + this.vio.category = this.mytype + 1; + setBigKindList(); + getStreetList(0); + getEventLevel(); + this.getShopList(); + }, + methods: { + handleStop() { + this.refresh(); + }, + // 璁剧疆澶х被 + async setBigKindList() { + this.bigKindList = await this.getBigKind(); + }, + // 璁剧疆灏忕被 + async setSmallKindList(id) { + let arr = await this.getSmallKind(); + this.smallKindList = arr.filter(item => { + if (item.parentId === id) { + return item; + } + }) + }, + // 璁剧疆妗堢敱 + async setAnYouList(id) { + let arr = await this.getAnYouList(); + this.anYouList = arr.filter(item => { + if (item.parentId === id) { + return item; + } + }) + }, + // 鏌ヨ澶х被鍒楄〃 + async getBigKind() { + let arr = []; + await this.$axios({ + method: 'get', + url: "sccg/violations/query/type_second", + }) + .then(res => { + arr = res.data; + }) + return arr + }, + // 鑾峰彇灏忕被鍒楄〃 + async getSmallKind() { + let arr = []; + await this.$axios({ + method: 'get', + url: "sccg/violations/query/type_third", + }) + .then(res => { + arr = res.data; + }) + return arr + }, + // 鑾峰彇妗堜欢绛夌骇鍒楄〃 + async getEventLevel() { + this.eventLevelList = await getTypeList(1, '02'); + }, + // 鏌ヨ鎵�灞炴鐢� + async getAnYouList() { + let arr = []; + await this.$axios({ + method: 'get', + url: 'sccg/violations/query/type_four' + }) + .then(res => { + arr = res.data; + }) + return arr; + }, + // 鎻愪氦娉ㄥ唽淇℃伅 + handleSubmit() { + this.$refs.user.validate((valid) => { + if (valid) { + const { vio } = this; + this.$axios({ + method: 'post', + url: 'sccg/base_case/addition_violation', + data: { + ...vio, + alarmTime: parseTime(vio.alarmTime), + limitTime:parseTime(vio.limitTime), + } + }) + .then(res => { + if (res.code === 200) { + this.$message({ + type: 'success', + message: res.message + }) + this.$emit('changeDialog', { flag: false }); + this.refresh(); + } else { + this.$message({ + type: 'warning', + message: res.message, + }) + } + }) + } else { + return false; + } + }) + }, + // 杩斿洖 + handleBack() { + this.$emit('changeDialog', { flag: false }) + }, + // 鑾峰彇琛楅亾淇℃伅 + async getStreetList(id) { + let arr + await this.$axios({ + method:'get', + url:`sccg/sccg_region/getChildren/${id}`, + }) + .then(res=>{ + if(res.code === 200){ + arr = res.data; + } + }) + this.streetList = arr; + }, + // 琛楅亾鏇存敼 + handleStreet(id) { + this.vio.communityId = ''; + this.$axios({ + method: 'get', + url: `sccg/sccg_region/getChildren/${id}` + }) + .then(res => { + this.communityList = res.data; + }) + }, + // 鍏宠仈鍟嗛摵 + handleLinkShop(value) { + value === 0 ? this.vio.shopName = '' : ''; + }, + // 澶х被閫変腑 + handleBigKindChange(id) { + this.vio.actionCause = ''; + this.vio.typeId = ''; + this.setSmallKindList(id); + }, + // 灏忕被閫変腑 + handleSmallKindChange(id) { + this.vio.actionCause = ''; + this.setAnYouList(id); + }, + // 妗堢敱杈撳叆 + selectBlur(e) { + if (e.target.value) { + this.vio.actionCause = e.target.value; + } + }, + + getShopList() { + getStoreInfoList({ current: 1, size: 100 }) + .then(({ list }) => { + this.storeList = list; + }) + .catch(err => { + this.$message.error(err) + }) + } + }, + props: ['mytype', 'changeDialog', 'refresh'] +} +</script> +<style lang="scss" scoped> +.vio { + display: flex; + padding: 20px 10px 50px; + + .input-area { + flex: 3; + padding: 10px 20px; + + .input-header { + color: #4b9bb7; + + .input-header__title { + line-height: 60px; + font-weight: 650; + font-size: 20px; + } + + .input-header__tip { + line-height: 40px; + } + } + + .user-item { + display: flex; + justify-content: space-between; + } + + .input-form { + .el-form { + &::v-deep .el-form-item__label { + color: #4b9bb7; + } + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + } + + .input-footer { + display: flex; + justify-content: center; + } + } + + .map-area { + flex: 2; + } + + .anyou { + :deep(.el-select) { + display: block; + } + } + +} +</style> \ No newline at end of file -- Gitblit v1.8.0