From 17efddc6a667670dca682bf36b51a43e99615e6d Mon Sep 17 00:00:00 2001 From: k94314517 <8417338+k94314517@user.noreply.gitee.com> Date: 星期三, 16 十月 2024 15:59:38 +0800 Subject: [PATCH] 代码初始化 --- admin/src/components/business/OperaHiddenDangerWindow.vue | 330 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 266 insertions(+), 64 deletions(-) diff --git a/admin/src/components/business/OperaHiddenDangerWindow.vue b/admin/src/components/business/OperaHiddenDangerWindow.vue index 78dc481..6937591 100644 --- a/admin/src/components/business/OperaHiddenDangerWindow.vue +++ b/admin/src/components/business/OperaHiddenDangerWindow.vue @@ -13,8 +13,8 @@ <div class="time">鎻愭姤鏃堕棿锛歿{model.createDate}}</div> </div> <div class="right" v-if="model.status==0">寰呭鐞�</div> - <div class="right" v-if="model.status==1">宸插鐞�</div> - <div class="right" v-if="model.status==2">宸叉挙閿�</div> + <div class="right" style="background:#53b76f " v-if="model.status==1">宸插鐞�</div> + <div class="right" style="background:#dc362e " v-if="model.status==2">宸查��鍥�</div> </div> <div class="info"> <div class="title">闅愭偅鎻愭姤璇︽儏</div> @@ -43,7 +43,6 @@ <video v-if="item.fileurlFull && item.fileurlFull.endsWith('.mp4')" ref="videoRef" - autoplay controls preload="auto" style="width: 80px;height: 80px;object-fit: contain;" @@ -116,9 +115,9 @@ <div class="item" v-for="(item,index) in logList" :key="item.id"> <div class="separate" v-if="index < logList.length-1"></div> <div class="info"> - <i class="el-icon-success icon" v-if="(model.status ==1) || index < logList.length-1"></i> - <i class="el-icon-question icon1" v-if="(model.status==0) && index == logList.length-1"></i> - <i class="el-icon-error icon2" v-if="(model.status==2) && index == logList.length-1"></i> + <img src="@/assets/icons/ic_tongguo.png" class="iconnew" v-if="(model.status ==1) || index < logList.length-1"/> + <img src="@/assets/icons/ic_dangqian.png" class="iconnew" v-if="(model.status==0) && index == logList.length-1"/> + <img src="@/assets/icons/ic_jujue.png" class="iconnew" v-if="(model.status==2) && index == logList.length-1"/> <img v-if="item.avatar!=null && item.avatar !=''" :src="item.avatar" class="avatar" alt="" /> <img v-if="item.avatar ==null ||item.avatar ==''" src="@/assets/avatar/man.png" class="avatar" alt="" /> <div class="content"> @@ -144,33 +143,16 @@ </div> <!-- --> <template v-slot:footer> - <el-button @click="dealDo" type="primary" v-if="model.status==0&& model.checkUserId == userInfo.memberId" class="status-red">澶勭悊</el-button> + <el-button @click="openHandModal" type="primary" v-if="model.status==0&& model.checkUserId == userInfo.memberId" class="status-red">澶勭悊</el-button> <el-button type="primary" plain v-if="model.status==0 && model.checkUserId == userInfo.memberId" @click="handleTransfer">杞氦</el-button> - <el-button @click="backDo" v-if="model.status==0&& model.checkUserId == userInfo.memberId" type="danger" >閫�鍥�</el-button> + <el-button @click="openBackModal" v-if="model.status==0&& model.checkUserId == userInfo.memberId" type="danger" >閫�鍥�</el-button> <el-button @click="visible=false">杩斿洖</el-button> </template> - <!-- 鍚屾剰/鎷掔粷 --> - <el-dialog - append-to-body - :title="apprTitle" - :visible.sync="isShowAppr" - width="480px" - > - <el-input - type="textarea" - :placeholder="apprTitle + '璇存槑锛岄潪蹇呭~'" - :rows="4" - v-model="param.explain" - /> - <span slot="footer" class="dialog-footer"> - <el-button @click="isShowAppr = false">鍙栨秷</el-button> - <el-button type="primary" @click="isShowAppr = false">纭畾</el-button> - </span> - </el-dialog> + <el-dialog append-to-body title="杞氦" - style="text-align: center" + class="dialogCl" :visible.sync="isShowTransfer" width="480px" > @@ -188,42 +170,74 @@ </el-form> <span slot="footer" class="dialog-footer"> <el-button @click="isShowTransfer = false">鍙栨秷</el-button> - <el-button type="primary" @click="transferSubmit">纭畾</el-button> + <el-button type="primary" :loading="transfering" @click="transferSubmit">纭畾</el-button> </span> </el-dialog> <!-- 闅愭偅 --> <el-dialog append-to-body - title="闅愭偅" + title="闅愭偅澶勭悊" + class="dialogCl" :visible.sync="isShowProblem" - width="480px" + width="600px" > - <el-form :model="param" :rules="rules" ref="ruleForm" label-width="100px"> - <el-form-item label="閫�鍥炴椂闂�"> + <el-form :model="dealForm" :rules="rulesDeal" ref="dealForm" label-width="100px"> + <el-form-item label="鏁存敼鏃堕棿" prop="checkDate"> <el-date-picker class="w300" - value-format="yyyy-MM-dd" - type="date" - placeholder="閫夋嫨鏃ユ湡" - v-model="param.date" + type="datetime" + value-format="yyyy-MM-dd HH:mm:ss" + placeholder="閫夋嫨鏁存敼鏃堕棿" + v-model="dealForm.checkDate" /> </el-form-item> - <el-form-item label="鏁存敼鍓�"> + <el-form-item label="鏁存敼鍓�" prop="dealBeforeFileList"> <div class="df_ac"> - <img src="@/assets/avatar/man.png" /> - <el-upload - class="avatar-uploader" - action="https://jsonplaceholder.typicode.com/posts/" - :show-file-list="false" - :on-success="handleAvatarSuccess" - :before-upload="beforeAvatarUpload" - > - <img v-if="param.url" :src="param.url" class="avatar" /> - <div v-else class="upload_box"> - <el-icon class="el-icon-plus icon" /> - <div class="text">鍥剧墖/瑙嗛</div> - </div> - </el-upload> + <upload width="80px" height="80px" :list="dealForm.dealBeforeFileList" :tips="'鍥剧墖/瑙嗛'" accept=".png,.jpg,.jpeg,.mp4" folder="hiddendanger" @loading="uploading = true" @dele="dele($event,0)" @success="uploadFileList($event, 0)" /> + </div> + </el-form-item> + <el-form-item label="鏁存敼鍚�" prop="dealAfterFileList"> + <div class="df_ac"> + <upload width="80px" height="80px" :list="dealForm.dealAfterFileList" :tips="'鍥剧墖/瑙嗛'" accept=".png,.jpg,.jpeg,.mp4" folder="hiddendanger" @loading="uploading = true" @dele="dele($event,1)" @success="uploadFileList($event, 1)" /> + </div> + </el-form-item> + <el-form-item label="澶勭悊璇存槑"> + <el-input + type="textarea" + placeholder="璇峰~鍐欒鏄�" + :rows="4" + v-model="dealForm.checkInfo" + /> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="isShowProblem = false">鍙栨秷</el-button> + <el-button type="primary" :loading="dealing" @click="dealDo" + >纭畾</el-button + > + </span> + </el-dialog> + <el-dialog + append-to-body + title="闅愭偅閫�鍥�" + + class="dialogCl" + :visible.sync="isBackProblem" + width="600px" + > + <el-form :model="backForm" :rules="rulesBack" ref="backForm" label-width="100px"> + <el-form-item label="閫�鍥炴椂闂�" prop="checkDate"> + <el-date-picker + class="w300" + value-format="yyyy-MM-dd HH:mm:ss" + type="datetime" + placeholder="閫夋嫨閫�鍥炴椂闂�" + v-model="backForm.checkDate" + /> + </el-form-item> + <el-form-item label="鍥剧墖/瑙嗛" prop="dealBeforeFileList"> + <div class="df_ac"> + <upload width="80px" height="80px" :list="backForm.dealBeforeFileList" :tips="'鍥剧墖/瑙嗛'" accept=".png,.jpg,.jpeg,.mp4" folder="hiddendanger" @loading="uploading = true" @dele="dele($event,2)" @success="uploadFileList($event, 2)" /> </div> </el-form-item> <el-form-item label="閫�鍥炶鏄�"> @@ -231,13 +245,13 @@ type="textarea" placeholder="璇峰~鍐欒鏄�" :rows="4" - v-model="param.explain" + v-model="backForm.checkInfo" /> </el-form-item> </el-form> <span slot="footer" class="dialog-footer"> - <el-button @click="isShowProblem = false">鍙栨秷</el-button> - <el-button type="primary" :loading="transfering" @click="isShowProblem = false" + <el-button @click="isBackProblem= false">鍙栨秷</el-button> + <el-button type="primary" :loading="transfering" @click="backDo" >纭畾</el-button > </span> @@ -248,10 +262,12 @@ <script> import BaseOpera from '@/components/base/BaseOpera' import GlobalWindow from '@/components/common/GlobalWindow' +import upload from '@/components/common/upload' +import dayjs from 'dayjs' import { memberList } from '@/api/business/hiddenDangerParam' -import {mapMutations} from "vuex"; +import { mapState } from 'vuex' export default { - components: { GlobalWindow }, + components: { GlobalWindow, upload }, extends: BaseOpera, data () { return { @@ -264,7 +280,10 @@ isShowAppr: false, apprTitle: '鍚屾剰', param: {}, + uploading: false, + dealing: false, isShowProblem: false, + isBackProblem: false, isShowTransfer: false, rules: {}, rulesTrans: { @@ -272,11 +291,45 @@ { required: true, message: '璇烽�夋嫨' } ] }, + rulesDeal: { + checkDate: [ + { required: true, message: '璇烽�夋嫨鏁存敼鏃堕棿' } + ], + dealBeforeFileList: [ + { required: true, message: '璇蜂笂浼犳暣鏀瑰墠鎯呭喌' } + ], + dealAfterFileList: [ + { required: true, message: '璇蜂笂浼犳暣鏀瑰悗鎯呭喌' } + ] + }, + rulesBack: { + checkDate: [ + { required: true, message: '璇烽�夋嫨閫�鍥炴椂闂�' } + ] + /*, + dealBeforeFileList: [ + { required: true, message: '璇蜂笂浼犳暣鏀瑰墠鎯呭喌' } + ] */ + }, memberList: [], transForm: { memberId: null + }, + dealForm: { + checkDate: null, + checkInfo: null, + dealBeforeFileList: [], + dealAfterFileList: [] + }, + backForm: { + checkDate: null, + checkInfo: null, + dealBeforeFileList: [] } } + }, + computed: { + ...mapState(['userInfo']) }, created () { this.config({ @@ -285,16 +338,158 @@ }) }, methods: { - ...mapMutations(['userInfo']), - dealDo () { this.isShowProblem = true }, - backDo () { this.isShowProblem = true }, + openHandModal () { + const { model } = this + this.isShowProblem = true + this.$set(this.dealForm, 'checkDate', dayjs().format('YYYY-MM-DD HH:mm:ss')) + if (model.submitFileList && model.submitFileList.length > 0) { + this.$set(this.dealForm, 'dealBeforeFileList', model.submitFileList.map(item => { + return { + fileurl: item.fileurl, + name: item.name, + url: item.fileurlFull + } + })) + } + }, + openBackModal () { + this.isBackProblem = true + this.$set(this.backForm, 'checkDate', dayjs().format('YYYY-MM-DD HH:mm:ss')) + }, + dele (index, type) { + if (type == 0) { + if (this.dealForm.dealBeforeFileList != null && this.dealForm.dealBeforeFileList.length > index) { + this.dealForm.dealBeforeFileList.splice(index, 1) + } + } else if (type == 1) { + if (this.dealForm.dealAfterFileList != null && this.dealForm.dealAfterFileList.length > index) { + this.dealForm.dealAfterFileList.splice(index, 1) + } + } else if (type == 2) { + if (this.backForm.dealBeforeFileList != null && this.backForm.dealBeforeFileList.length > index) { + this.backForm.dealBeforeFileList.splice(index, 1) + } + } + }, + uploadFileList (e, objType) { + if (objType === 0) { + if (this.dealForm.dealBeforeFileList == null) { + this.dealForm.dealBeforeFileList = [] + } + this.dealForm.dealBeforeFileList.push({ + fileurl: e.imgaddr, + url: e.url, + name: e.originname, + fileType: e.type + }) + } else if (objType === 1) { + if (this.dealForm.dealAfterFileList == null) { + this.dealForm.dealAfterFileList = [] + } + this.dealForm.dealAfterFileList.push({ + fileurl: e.imgaddr, + url: e.url, + name: e.originname, + fileType: e.type + }) + } else if (objType === 2) { + if (this.backForm.dealBeforeFileList == null) { + this.backForm.dealBeforeFileList = [] + } + this.backForm.dealBeforeFileList.push({ + fileurl: e.imgaddr, + url: e.url, + name: e.originname, + fileType: e.type + }) + } + }, + dealDo () { + this.$refs.dealForm.validate((valid) => { + // debugger + if (!valid) { + return + } + this.$dialog.actionConfirm('鎿嶄綔纭', '鎮ㄧ‘璁ゆ彁浜よ闅愭偅澶勭悊鎯呭喌鍚楋紵') + .then(() => { + this.dealing = true + this.api.dealHiddenDanger({ + id: this.dataId, + status: 1, + dealTime: this.dealForm.checkDate, + checkInfo: this.dealForm.checkInfo, + dealBeforeFileList: this.dealForm.dealBeforeFileList, + dealAfterFileList: this.dealForm.dealAfterFileList + }) + .then(res => { + this.$tip.apiSuccess('澶勭悊鎴愬姛') + this.getDetail() + this.getLogList() + this.$emit('success') + this.isShowProblem = false + }) + .catch(e => { + }) + .finally(() => { + this.dealing = false + }) + }) + }) + }, + backDo () { + this.$refs.backForm.validate((valid) => { + if (!valid) { + return + } + this.$dialog.actionConfirm('鎿嶄綔纭', '鎮ㄧ‘璁ら��鍥炶闅愭偅澶勭悊鎯呭喌鍚楋紵') + .then(() => { + this.dealing = true + this.api.dealHiddenDanger({ + id: this.dataId, + status: 2, + dealTime: this.backForm.checkDate, + checkInfo: this.backForm.checkInfo, + dealBeforeFileList: this.backForm.dealBeforeFileList + }) + .then(res => { + this.$tip.apiSuccess('閫�鍥炴垚鍔�') + this.getDetail() + this.getLogList() + this.$emit('success') + this.isBackProblem = false + }) + .catch(e => { + }) + .finally(() => { + this.dealing = false + }) + }) + }) + }, open (title, target) { this.title = title this.visible = true this.model = {} this.dataId = target.id - this.getDetail() - this.getLogList() + this.$nextTick(() => { + this.memberList = [] + this.transForm = { + memberId: null + } + this.dealForm = { + checkDate: null, + checkInfo: null, + dealBeforeFileList: [], + dealAfterFileList: [] + } + this.backForm = { + checkDate: null, + checkInfo: null, + dealBeforeFileList: [] + } + this.getDetail() + this.getLogList() + }) }, transferSubmit () { this.$refs.transForm.validate((valid) => { @@ -313,6 +508,8 @@ this.$tip.apiSuccess('杞氦鎴愬姛') this.getDetail() this.getLogList() + this.$emit('success') + this.isShowTransfer = false }) .catch(e => { }) @@ -320,7 +517,6 @@ this.transfering = false }) }) - .catch(() => {}) }) }, getLogList () { @@ -419,6 +615,7 @@ .value { color: #111111; + flex: 1; } } } @@ -508,6 +705,11 @@ color: #53b76f; font-size: 24px; } + + .iconnew{ + width: 24px; + height: 24px; + } .icon1 { position: relative; z-index: 11; @@ -517,7 +719,7 @@ .icon2 { position: relative; z-index: 11; - color: red; + color: #dc362e; font-size: 24px; } .avatar { @@ -525,7 +727,7 @@ height: 40px; border-radius: 50%; margin: 0 12px 0 16px; - border: 1px solid; + //border: 1px solid; } .content { flex: 1; -- Gitblit v1.9.3