| | |
| | | <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 { |