From 70897b9f8935d377c9e890b4b04966c1d2cd5d82 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期六, 08 十月 2022 14:34:14 +0800 Subject: [PATCH] 对接案件池违建部分接口 --- src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue | 336 +++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 298 insertions(+), 38 deletions(-) diff --git a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue index a4903eb..d5943f9 100644 --- a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue +++ b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue @@ -2,77 +2,300 @@ <div class="book"> <div class="book-title">鏂囩涔︾被</div> <div class="book-form"> - <el-form ref="bookForm" label-width="160px" :model="book" :rules="bookRules" autoComplete="on"> - <!-- 鏂囦功绉嶇被 --> - <el-form-item label="鏂囦功绉嶇被:" prop="kind"> - <el-input v-model="book.kind"></el-input> - </el-form-item> - <!-- 鏂囦功缂栧彿 --> - <el-form-item label="鏂囦功缂栧彿:" prop="id"> - <el-input v-model="book.id"></el-input> - </el-form-item> + <el-form ref="bookForm" label-width="120px" :model="book" :rules="bookRules" autoComplete="on"> + <div class="book-item"> + <!-- 鏂囦功绉嶇被 --> + <el-form-item label="鏂囦功绉嶇被:" prop="writType"> + <el-select v-model="book.writType" placeholder="璇疯緭鍏ユ枃涔︾绫�"> + <el-option v-for="item in kindList" :key="item.value" :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <!-- 鏂囦功缂栧彿 --> + <el-form-item label="鏂囦功缂栧彿:" prop="writCode"> + <el-input v-model="book.writCode" placeholder="璇疯緭鍏ユ枃涔︾紪鍙�"></el-input> + </el-form-item> + </div> <!-- 杩濇硶绫诲瀷 --> - <el-form-item label="杩濇硶绫诲瀷:" prop="vioKind"> - <el-input v-model="book.vioKind"></el-input> + <el-form-item label="杩濇硶绫诲瀷:" prop="illegalType" placeholder="璇疯緭鍏ヨ繚娉曠被鍨�"> + <el-input v-model="book.illegalType" placeholder="璇疯緭鍏ヨ繚娉曠被鍨�"></el-input> </el-form-item> <!-- 鏂囦功鍙戞斁鏃堕棿 --> - <el-form-item label="鏂囦功鍙戞斁鏃堕棿:" prop="giveTime"> - <el-input v-model="book.giveTime"></el-input> + <el-form-item label="鏂囦功鍙戞斁鏃堕棿:" prop="sendTime"> + <el-date-picker v-model="book.sendTime" type="datetime" placeholder="璇烽�夋嫨骞存湀鏃�"> + </el-date-picker> </el-form-item> <!-- 鏂囦功闄愬畾鏃堕棿 --> <el-form-item label="鏂囦功闄愬畾鏃堕棿" prop="limitTime"> - <el-input v-model="book.limitTime"></el-input> + <el-date-picker v-model="book.limitTime" type="datetime" placeholder="璇烽�夋嫨骞存湀鏃�"> + </el-date-picker> </el-form-item> <!-- 鏂囦功鍙戞斁鍐呭 --> - <el-form-item label="鏂囦功鍙戞斁鍐呭:" prop="content"> - <el-input v-model="book.content"></el-input> + <el-form-item label="鏂囦功鍙戞斁鍐呭:" prop="sendContent"> + <el-input v-model="book.sendContent" placeholder="璇疯緭鍏ユ枃涔﹀彂鏀惧唴瀹�"></el-input> </el-form-item> <!-- 瀹為檯鏁存敼鏃堕棿 --> - <el-form-item label="瀹為檯鏁存敼鏃堕棿:" prop="updateTime"> - <el-input v-model="book.updateTime"></el-input> + <el-form-item label="瀹為檯鏁存敼鏃堕棿:" prop="rectifyTime"> + <el-date-picker v-model="book.rectifyTime" type="datetime" placeholder="璇烽�夋嫨骞存湀鏃�"> + </el-date-picker> </el-form-item> <!-- 鏁存敼鎯呭喌 --> - <el-form-item label="鏁存敼鎯呭喌:" prop="condition"> - <el-input v-model="book.condition"></el-input> + <el-form-item label="鏁存敼鎯呭喌:" prop="rectifySituation"> + <el-input v-model="book.rectifySituation" placeholder="璇疯緭鍏ユ暣鏀规儏鍐�"></el-input> </el-form-item> <!-- 澶囨敞 --> - <el-form-item label="澶囨敞:" prop="note"> - <el-input v-model="book.note"></el-input> + <el-form-item label="澶囨敞:" prop="remark"> + <el-input v-model="book.remark" placeholder="璇疯緭鍏ュ娉�"></el-input> </el-form-item> <!-- 鏂囦功鐓х墖涓婁紶 --> - <el-form-item label="鏂囦功鐓х墖涓婁紶:" prop="bookPhoto"> - <el-input v-model="book.bookPhoto"></el-input> + <el-form-item label="鏂囦功鐓х墖涓婁紶:" prop="writPic"> + <div class="upImg"> + <div class="img-list"> + <img :src="item" alt="" v-for="(item,index) in book.writPic" :key="index"> + </div> + <div class="upload" v-if="book.writPic.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="handleSuccess1" :headers="getToken()"> + <i class="el-icon-plus"></i> + </el-upload> + </div> + <div class="tip">{{book.writPic.length}} / 4</div> + </div> </el-form-item> <!-- 鏁存敼鍓嶇収鐗� --> - <el-form-item label="鏁存敼鍓嶇収鐗�:" prop="beforeUpdate"> - <el-input v-model="book.beforeUpdate"></el-input> + <el-form-item label="鏁存敼鍓嶇収鐗�:" prop="originalPic"> + <div class="upImg"> + <div class="img-list"> + <img :src="item" alt="" v-for="(item,index) in book.originalPic" :key="index"> + </div> + <div class="upload" v-if="book.originalPic.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="handleSuccess2" :headers="getToken()"> + <i class="el-icon-plus"></i> + </el-upload> + </div> + <div class="tip">{{book.originalPic.length}} / 4</div> + </div> </el-form-item> <!-- 鏁存敼鍚庣収鐗� --> - <el-form-item label="鏁存敼鍚庣収鐗�:" prop="afterUpdate"> - <el-input v-model="book.afterUpdate"></el-input> + <el-form-item label="鏁存敼鍚庣収鐗�:" prop="rectifiedPic"> + <div class="upImg"> + <div class="img-list"> + <img :src="item" alt="" v-for="(item,index) in book.rectifiedPic" :key="index"> + </div> + <div class="upload" v-if="book.rectifiedPic.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="handleSuccess3" :headers="getToken()"> + <i class="el-icon-plus"></i> + </el-upload> + </div> + <div class="tip">{{book.rectifiedPic.length}} / 4</div> + </div> </el-form-item> <!-- 鍏朵粬鐓х墖 --> - <el-form-item label="鍏朵粬:" prop="other"> - <el-input v-model="book.other"></el-input> + <el-form-item label="鍏朵粬:" prop="otherPic"> + <div class="upImg"> + <div class="img-list"> + <img :src="item" alt="" v-for="(item,index) in book.otherPic" :key="index"> + </div> + <div class="upload" v-if="book.otherPic.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="handleSuccess4" :headers="getToken()"> + <i class="el-icon-plus"></i> + </el-upload> + </div> + <div class="tip">{{book.otherPic.length}} / 4</div> + </div> </el-form-item> </el-form> </div> </div> </template> <script> - export default{ - data(){ - return{ - book:{}, - bookRules:{ - - } +export default { + data() { + const checkKind = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鏂囦功绉嶇被涓嶈兘涓虹┖')); } } + const checkId = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鏂囦功缂栧彿涓嶈兘涓虹┖')); + } + } + const checkGiveTime = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鍙戞斁鏃堕棿涓嶈兘涓虹┖')); + } + } + const checkUpTime = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('瀹為檯鏁存敼鏃堕棿涓嶈兘涓虹┖')); + } + } + const checkNote = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(); + } + } + const checkCondition = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鏁存敼鎯呭喌涓嶈兘涓虹┖')); + } + } + const checkLimTime = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('闄愬畾鏃堕棿涓嶈兘涓虹┖')); + } + } + const checkVio = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('杩濇硶绫诲瀷涓嶈兘涓虹┖')); + } + } + const checkContent = (rule, value, callback) => { + if (value) { + callback(); + } else { + callback(new Error('鍙戞斁鍐呭涓嶈兘涓虹┖')); + } + } + return { + book: { + writPic: [], + otherPic: [], + rectifiedPic: [], + originalPic: [], + }, + bookRules: { + writType: [ + { + trigger: 'blur', validator: checkKind + } + ], + idwritCode: [ + { + trigger: 'blur', validator: checkId + } + ], + illegalType: [ + { + trigger: 'blur', validator: checkVio + } + ], + sendTime: [ + { + trigger: 'blur', validator: checkGiveTime + } + ], + limitTime: [ + { + trigger: 'blur', validator: checkLimTime + } + ], + sendContent: [ + { + trigger: 'blur', validator: checkContent + } + ], + rectifyTime: [ + { + trigger: 'blur', validator: checkUpTime + } + ], + rectifySituation: [ + { + trigger: 'blur', validator: checkCondition + } + ], + noremark: [ + { + trigger: 'blur', validator: checkNote + } + ], + }, + fileList: [], + kindList: [ + { + label: '涔︾睄1', + value: 1, + }, + { + label: '涔︾睄2', + value: 2, + }, + ] + } + }, + created() { + console.log(this.book.writPic) + }, + props: ['caseId', 'closeDialog'], + methods: { + handleSuccess1(res, file, filelist) { + const baseUrl = 'http://140.143.152.226:8410/'; + console.log(res); + // this.$set(this.book, 'writPic', baseUrl + res.data.url1); + // console.log(this.book.writPic); + if (this.book.writPic.length < 4) { + this.book.writPic.push(baseUrl + res.data.url1) + } + }, + handleSuccess2(res, file, filelist) { + const baseUrl = 'http://140.143.152.226:8410/'; + console.log(res); + if (this.book.originalPic.length < 4) { + this.book.originalPic.push(baseUrl + res.data.url1) + } + }, + handleSuccess3(res, file, filelist) { + const baseUrl = 'http://140.143.152.226:8410/'; + console.log(res); + if (this.book.rectifiedPic.length < 4) { + this.book.rectifiedPic.push(baseUrl + res.data.url1) + } + }, + handleSuccess4(res, file, filelist) { + const baseUrl = 'http://140.143.152.226:8410/'; + console.log(res); + if (this.book.otherPic.length < 4) { + this.book.otherPic.push(baseUrl + res.data.url1) + } + }, + getToken() { + const token = sessionStorage.getItem('token'); + const tokenHead = sessionStorage.getItem('tokenHead'); + if (token && tokenHead) { + return { Authorization: tokenHead + token } + } + }, } +} </script> <style lang="scss" scoped> -.book-title{ +.book-title { line-height: 60px; font-weight: 650; font-size: 20px; @@ -81,6 +304,43 @@ text-align: right; color: #4b9bb7; } + +.book-item { + display: flex; + width: 100%; +} + +.upload { + width: 60px; + height: 60px; + display: flex; + align-items: center; + justify-content: center; + font-size: 20px; + background-color: #fbfdff; + border-radius: 4px; +} + +.upImg { + display: flex; + + .tip { + position: absolute; + bottom: 0; + right: 0; + } + + .img-list { + height: 80px; + position: relative; + + img { + width: 60px; + height: 60px; + } + } +} + ::v-deep .el-textarea__inner { background-color: #09152f; border: 1px solid #17324c; -- Gitblit v1.8.0