|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <GlobalWindow :title="title" :visible.sync="isShowModal" @confirm="confirm"> | 
|---|
|  |  |  | <GlobalWindow :title="title" :visible.sync="isShowModal" @close="close" @confirm="confirm"> | 
|---|
|  |  |  | <div class="modal_wrap"> | 
|---|
|  |  |  | <div class="modal_content"> | 
|---|
|  |  |  | <div class="header"> | 
|---|
|  |  |  | <img v-if="info.status == '3' || info.status == '6'" class="head_bg" src="@/assets/task/bg_shenhe_fail@2x.png" alt=""> | 
|---|
|  |  |  | <img v-else-if="info.status == '2' || info.status == '5'" class="head_bg" src="@/assets/task/bg_shenhe_pass@2x.png" alt=""> | 
|---|
|  |  |  | <img v-else-if="info.status == '4'" class="head_bg" src="@/assets/task/bg_shenhe_chexiao@2x.png" alt=""> | 
|---|
|  |  |  | <img v-else class="head_bg" src="@/assets/task/bg_shenhe@2x.png" alt=""> | 
|---|
|  |  |  | <div class="left"> | 
|---|
|  |  |  | <div class="h1">{{ cateList[type] }}</div> | 
|---|
|  |  |  | <div class="time">提交时间:{{ info.createDate }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="right">{{ statusMap[info.status] }}</div> | 
|---|
|  |  |  | <div class="right" :class="{ scs: info.status == '2' || info.status == '5', msg: info.status == '3' || info.status == '6' }">{{ statusMap[info.status] }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="info"> | 
|---|
|  |  |  | <div class="title">隐患随手拍信息</div> | 
|---|
|  |  |  | 
|---|
|  |  |  | <div class="label">现场情况</div> | 
|---|
|  |  |  | <div class="value"> | 
|---|
|  |  |  | <div class="file_list"> | 
|---|
|  |  |  | <template v-for="item in info.submitFileList"> | 
|---|
|  |  |  | <div class="file" v-for="item in info.submitFileList"> | 
|---|
|  |  |  | <img | 
|---|
|  |  |  | v-if="item.type == 0" | 
|---|
|  |  |  | :key="item.id" | 
|---|
|  |  |  | 
|---|
|  |  |  | class="img" | 
|---|
|  |  |  | controls | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | >转交</el-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-button @click="isShowBack = true" type="danger" plain>退回</el-button> | 
|---|
|  |  |  | <el-button @click="isShowModal = false">返回</el-button> | 
|---|
|  |  |  | <el-button @click="close">返回</el-button> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <!--  同意/拒绝 --> | 
|---|
|  |  |  | <el-dialog | 
|---|
|  |  |  | 
|---|
|  |  |  | class="avatar-uploader" | 
|---|
|  |  |  | :action="uploadUrl" | 
|---|
|  |  |  | :show-file-list="false" | 
|---|
|  |  |  | :on-error="uploadError" | 
|---|
|  |  |  | :on-success="handleAvatarSuccess" | 
|---|
|  |  |  | :before-upload="beforeAvatarUpload" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | 
|---|
|  |  |  | :action="uploadUrl" | 
|---|
|  |  |  | :show-file-list="false" | 
|---|
|  |  |  | :on-success="handleAfterSuccess" | 
|---|
|  |  |  | :on-error="uploadError" | 
|---|
|  |  |  | :before-upload="beforeAvatarUpload" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <img v-if="param.url" :src="param.url" class="avatar" /> | 
|---|
|  |  |  | 
|---|
|  |  |  | :action="uploadUrl" | 
|---|
|  |  |  | :show-file-list="false" | 
|---|
|  |  |  | :on-success="handleBackSuccess" | 
|---|
|  |  |  | :on-error="uploadError" | 
|---|
|  |  |  | :before-upload="beforeAvatarUpload" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <div class="upload_box"> | 
|---|
|  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
|---|
|  |  |  | import { memberList } from '@/api/business/hiddenDangerParam' | 
|---|
|  |  |  | import { Loading } from 'element-ui' | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | uploadFile, | 
|---|
|  |  |  | hiddenDangerDetail, | 
|---|
|  |  |  | 
|---|
|  |  |  | id: '', | 
|---|
|  |  |  | type: '', | 
|---|
|  |  |  | uploadUrl: uploadFile, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | loadingInstance: false, | 
|---|
|  |  |  | title: '访客预约详情', | 
|---|
|  |  |  | isShowModal: false, | 
|---|
|  |  |  | info: {}, | 
|---|
|  |  |  | 
|---|
|  |  |  | dealAfterFileList: [{ type: 'array', required: true, message: '请选择', trigger: 'change' }] | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | statusMap: { | 
|---|
|  |  |  | 0: '待审批', | 
|---|
|  |  |  | 1: '审批中', | 
|---|
|  |  |  | 2: '审批通过', | 
|---|
|  |  |  | 3: '审批未通过', | 
|---|
|  |  |  | 0: '待审核', | 
|---|
|  |  |  | 1: '处理中', | 
|---|
|  |  |  | 2: '已通过', | 
|---|
|  |  |  | 3: '已拒绝', | 
|---|
|  |  |  | 4: '已取消', | 
|---|
|  |  |  | 5: '他人或签', | 
|---|
|  |  |  | 6: '他人拒绝' | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created() { | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | this.getMemberList() | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | 
|---|
|  |  |  | this.subLoading = false | 
|---|
|  |  |  | this.$tip.apiSuccess('处理成功') | 
|---|
|  |  |  | this.getDetail() | 
|---|
|  |  |  | this.$emit('success') | 
|---|
|  |  |  | this.$emit('close') | 
|---|
|  |  |  | this.isShowProblem = false | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .finally(() => { | 
|---|
|  |  |  | this.subLoading = false | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | close(){ | 
|---|
|  |  |  | this.isShowModal = false | 
|---|
|  |  |  | this.$emit('close') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | onSubBack () { | 
|---|
|  |  |  | this.$refs.backForm.validate((valid) => { | 
|---|
|  |  |  | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | reject () { }, | 
|---|
|  |  |  | handleAvatarSuccess (res) { | 
|---|
|  |  |  | this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭 | 
|---|
|  |  |  | if(this.loadingInstance){ | 
|---|
|  |  |  | this.loadingInstance.close() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | if (res.code === 200) { | 
|---|
|  |  |  | const str = res.data.url.indexOf('png') > 0 || res.data.url.indexOf('jpg') > 0 | 
|---|
|  |  |  | const arr = this.handleParam.dealBeforeFileList || [] | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | handleAfterSuccess (res) { | 
|---|
|  |  |  | this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭 | 
|---|
|  |  |  | if(this.loadingInstance){ | 
|---|
|  |  |  | this.loadingInstance.close() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | if (res.code === 200) { | 
|---|
|  |  |  | const str = res.data.url.indexOf('png') > 0 || res.data.url.indexOf('jpg') > 0 | 
|---|
|  |  |  | const arr = this.handleParam.dealAfterFileList || [] | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | handleBackSuccess (res) { | 
|---|
|  |  |  | this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭 | 
|---|
|  |  |  | if(this.loadingInstance){ | 
|---|
|  |  |  | this.loadingInstance.close() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | if (res.code === 200) { | 
|---|
|  |  |  | const str = res.data.url.indexOf('png') > 0 || res.data.url.indexOf('jpg') > 0 | 
|---|
|  |  |  | const arr = this.backForm.dealBeforeFileList || [] | 
|---|
|  |  |  | 
|---|
|  |  |  | this.$set(this.backForm, 'dealBeforeFileList', arr) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | beforeAvatarUpload () { } | 
|---|
|  |  |  | beforeAvatarUpload () { | 
|---|
|  |  |  | this.loadingInstance = Loading.service({ | 
|---|
|  |  |  | lock: true, | 
|---|
|  |  |  | text: 'Loading', | 
|---|
|  |  |  | spinner: 'el-icon-loading', | 
|---|
|  |  |  | background: 'rgba(0, 0, 0, 0.7)' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | uploadError() { | 
|---|
|  |  |  | this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭 | 
|---|
|  |  |  | this.loadingInstance.close() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style lang="scss" scoped> | 
|---|
|  |  |  | @import "@/assets/style/variables.scss"; | 
|---|
|  |  |  | .upload_wrap { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | flex-wrap: wrap; | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .file_list { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | .img { | 
|---|
|  |  |  | width: 200px; | 
|---|
|  |  |  | .file { | 
|---|
|  |  |  | width: 92px; | 
|---|
|  |  |  | margin-right: 12px; | 
|---|
|  |  |  | margin-bottom: 12px; | 
|---|
|  |  |  | .img{ | 
|---|
|  |  |  | max-height: 92px; | 
|---|
|  |  |  | max-width: 92px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .value { | 
|---|
|  |  |  | 
|---|
|  |  |  | padding: 20px 30px; | 
|---|
|  |  |  | margin: 0 -30px; | 
|---|
|  |  |  | border-radius: 8px 8px 0 0; | 
|---|
|  |  |  | background: linear-gradient(to right, #f2f6fe, #cadffa); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | .head_bg{ | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | left: 0; | 
|---|
|  |  |  | top: 0; | 
|---|
|  |  |  | z-index: 9; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .h1 { | 
|---|
|  |  |  | font-weight: 600; | 
|---|
|  |  |  | font-size: 22px; | 
|---|
|  |  |  | 
|---|
|  |  |  | font-size: 14px; | 
|---|
|  |  |  | color: #999999; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .right { | 
|---|
|  |  |  | height: 40px; | 
|---|
|  |  |  | font-size: 16px; | 
|---|
|  |  |  | 
|---|
|  |  |  | background: #207ff7; | 
|---|
|  |  |  | box-shadow: 4px 4px 0px 0px rgba(32, 127, 247, 0.16); | 
|---|
|  |  |  | border-radius: 16px 0px 16px 0px; | 
|---|
|  |  |  | position: relative; | 
|---|
|  |  |  | z-index: 99; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .scs{ | 
|---|
|  |  |  | background-color: #00BA67; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .msg{ | 
|---|
|  |  |  | background-color: #ED4545; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .table_info { | 
|---|
|  |  |  | 
|---|
|  |  |  | position: absolute; | 
|---|
|  |  |  | border-left: 2px dashed #cccccc; | 
|---|
|  |  |  | left: 31px; | 
|---|
|  |  |  | height: calc(100% - 36px); | 
|---|
|  |  |  | height: calc(100% - 30px); | 
|---|
|  |  |  | top: 49px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .avatar { | 
|---|
|  |  |  | 
|---|
|  |  |  | font-size: 13px; | 
|---|
|  |  |  | color: #888888; | 
|---|
|  |  |  | .status { | 
|---|
|  |  |  | color: #00ba67; | 
|---|
|  |  |  | color: $primaryColor; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .m_content { | 
|---|