539 lines
20 KiB
Vue
539 lines
20 KiB
Vue
<template>
|
||
<div>
|
||
<div v-if="data.hidden" id="printTest" class="app-container">
|
||
<div class="print-break">
|
||
<div class="level-title">
|
||
<h1>隐患信息</h1>
|
||
</div>
|
||
<div class="mb-20">
|
||
<table class="table-ui">
|
||
<tr>
|
||
<td class="tbg">隐患来源</td>
|
||
<template v-if="data.hidden.SOURCE">
|
||
<td> {{ translate(data.hidden.SOURCE.toString() =='3'?'2':data.hidden.SOURCE.toString(), sourceList) }}</td>
|
||
</template>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患描述</td>
|
||
<td>{{ data.hidden.HIDDENDESCR }}</td>
|
||
</tr>
|
||
<template v-if="data.hidden.SOURCE=='2'"> <!-- 只有清单排查的时候 显示里面的内容 -->
|
||
<tr >
|
||
<td class="tbg">风险点（单元）</td>
|
||
<td>{{ data.hidden.RISK_UNIT }}</td>
|
||
</tr>
|
||
<tr >
|
||
<td class="tbg">辨识部位</td>
|
||
<td>{{ data.hidden.IDENTIFICATION }}</td>
|
||
</tr>
|
||
<tr >
|
||
<td class="tbg">存在风险</td>
|
||
<td>{{ data.hidden.RISK_DESCR }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">风险分级</td>
|
||
<td>{{ data.hidden.LEVEL }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">检查内容</td>
|
||
<td>{{ data.hidden.CHECK_CONTENT }}</td>
|
||
</tr>
|
||
</template>
|
||
<tr>
|
||
<td class="tbg">隐患级别</td>
|
||
<td >{{ data.hidden.editLevelName?data.hidden.editLevelName:data.hidden.HIDDENLEVELNAME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患类型</td>
|
||
<td>{{ data.hidden.HIDDENTYPENAME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患状态</td>
|
||
<td>
|
||
<template v-if="data.hidden.STATE">
|
||
{{ translate(data.hidden.STATE.toString(), statusList) }}
|
||
</template>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患部位</td>
|
||
<td>{{ data.hidden.hregionName?data.hidden.hregionName:data.hidden.HIDDENPART }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患上报位置</td>
|
||
<td>经度:{{ data.hidden.LONGITUDE }} , 纬度:{{ data.hidden.LATITUDE }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患位置描述</td>
|
||
<td>{{ data.hidden.POSITIONDESC }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患图片</td>
|
||
<td class="img-select">
|
||
<viewer :images="data.hImgs">
|
||
<img v-for="item in data.hImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" style="margin-left: 10px;" width="100" height="100">
|
||
</viewer>
|
||
</td>
|
||
</tr>
|
||
<tr v-if="playerOptions.sources[0].src">
|
||
<td class="tbg">隐患视频</td>
|
||
<td>
|
||
<span style="color: #4395ff;cursor: pointer" @click="dialogVideoVisible = true">隐患视频</span>
|
||
</td>
|
||
</tr>
|
||
<tr v-for="item in data.hiddenFindPeople" :key="item.USER_ID">
|
||
<td class="tbg">隐患发现人 </td>
|
||
<td>{{ item.NAME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患发现时间</td>
|
||
<td>{{ formatDate(data.hidden.DISCOVERYTIME,'YYYY-MM-DD HH:mm:ss') }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">整改类型</td>
|
||
<td>
|
||
<template v-if="data.hidden.RECTIFICATIONTYPE=='1'">
|
||
立即整改
|
||
</template>
|
||
<template v-else-if="data.hidden.RECTIFICATIONTYPE=='2'">
|
||
限期整改
|
||
</template>
|
||
</td>
|
||
</tr>
|
||
<tr v-if="data.hidden.editDeptName ?data.hidden.editDeptName :data.hidden.RECTIFICATIONDEPTNAME">
|
||
<td class="tbg">整改负责部门</td>
|
||
<td >{{ data.hidden.editDeptName ?data.hidden.editDeptName :data.hidden.RECTIFICATIONDEPTNAME }}</td>
|
||
</tr>
|
||
<tr v-if="data.hidden.editUserName ?data.hidden.editUserName :data.hidden.RECTIFICATIONORNAME">
|
||
<td class="tbg">整改负责人</td>
|
||
<td >{{ data.hidden.editUserName ?data.hidden.editUserName :data.hidden.RECTIFICATIONORNAME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">是否相关方</td>
|
||
<td>{{ data.hidden.ISRELEVANT=='1'?'是':'否' }}</td>
|
||
</tr>
|
||
|
||
<tr v-if="data.RECTIFICATIONTYPE=='2' && data.hidden.RECTIFICATIONDEADLINE">
|
||
<td class="tbg">整改期限</td>
|
||
<td>{{ data.hidden.RECTIFICATIONDEADLINE }}</td>
|
||
</tr>
|
||
<template v-if="data.repulsecause">
|
||
<tr v-for="item in data.hidden.repulsecause" :key="item.USER_ID">
|
||
<td class="tbg">打回原因</td>
|
||
<td>{{ item.REPULSE_CAUSE }}</td>
|
||
</tr>
|
||
</template>
|
||
<template v-if="data.repulsecause">
|
||
<tr v-for="item in data.repulsecause" :key="item.USER_ID">
|
||
<td class="tbg">打回时间</td>
|
||
<td>{{ item.OPERATTIME }}</td>
|
||
</tr>
|
||
</template>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div v-if="data.hidden.hiddenExamineList">
|
||
<div v-for="(item,index) in data.hidden.hiddenExamineList" :key="index" class="print-break">
|
||
<div class="level-line" />
|
||
<table v-if="item.TYPE === 4" class="table-ui">
|
||
<div class="level-title">
|
||
<h1 >确认信息</h1>
|
||
</div>
|
||
<tr>
|
||
<td class="tbg">隐患级别</td>
|
||
<td >{{ item.editLevelName }}</td>
|
||
</tr>
|
||
<tr v-if="item.editUserName">
|
||
<td class="tbg">整改负责人</td>
|
||
<td >{{ item.editUserName }}</td>
|
||
</tr>
|
||
<tr v-if="item.spare3">
|
||
<td class="tbg">整改完成期限</td>
|
||
<td >{{ item.spare3 }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">隐患确认人</td>
|
||
<td>{{ data.hidden.conUserName }}</td>
|
||
</tr>
|
||
<tr >
|
||
<td class="tbg">隐患确认时间</td>
|
||
<td>{{ data.hidden.CONFIRM_TIME }}</td>
|
||
</tr>
|
||
</table>
|
||
<table v-else-if="item.TYPE === 2" class="table-ui">
|
||
<div class="level-title">
|
||
<h1 >延期信息</h1>
|
||
</div>
|
||
<tr>
|
||
<td class="tbg">申请延期日期</td>
|
||
<td >{{ item.DELAY_TIME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">审核人</td>
|
||
<td>{{ data.hidden.conUserName }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">处置方案</td>
|
||
<td >{{ item.DISPOSAL_PLAN }}</td>
|
||
</tr>
|
||
<tr v-if="item.DISPOSAL_FILE">
|
||
<td class="tbg">方案附件</td>
|
||
<td><a style="color: #1e9fff" @click="goViewPdf(item.DISPOSAL_FILE)">[预览]</a> </td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">延期审核状态</td>
|
||
<template v-if="item.STATE===-1">
|
||
<td>待审核</td>
|
||
</template>
|
||
<template v-else-if="item.STATE===1">
|
||
<td>通过</td>
|
||
</template>
|
||
<template v-else-if="item.STATE===2">
|
||
<td>未通过</td>
|
||
</template>
|
||
</tr>
|
||
<tr v-if="item.STATE===1">
|
||
<td class="tbg">审核时间</td>
|
||
<td>{{ item.OPERATTIME }}</td>
|
||
</tr>
|
||
</table>
|
||
<table v-else-if="item.TYPE === 1" class="table-ui">
|
||
<div class="level-title">
|
||
<h1 >特殊处理审核信息</h1>
|
||
</div>
|
||
<tr>
|
||
<td class="tbg">无法整改原因</td>
|
||
<td >{{ item.EXAMINE }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">特殊处置审核状态</td>
|
||
<template v-if="item.STATE===-1">
|
||
<td>待审核</td>
|
||
</template>
|
||
<template v-else-if="item.STATE===2">
|
||
<td>通过</td>
|
||
</template>
|
||
<template v-else-if="item.STATE===1">
|
||
<td>未通过</td>
|
||
</template>
|
||
</tr>
|
||
<tr v-if="item.STATE===2">
|
||
<td class="tbg">处置方案</td>
|
||
<td>{{ item.DISPOSAL_PLAN }}</td>
|
||
</tr>
|
||
<tr v-if="item.STATE===2 && item.DISPOSAL_FILE">
|
||
<td class="tbg">处置方案附件</td>
|
||
<td><a style="color: #1e9fff" @click="goViewPdf(item.DISPOSAL_FILE)">[预览]</a> </td>
|
||
</tr>
|
||
<tr v-if="item.STATE!==-1">
|
||
<td class="tbg">审核时间</td>
|
||
<td>{{ item.OPERATTIME }}</td>
|
||
</tr>
|
||
<tr v-if="item.STATE!==-1">
|
||
<td class="tbg">审核人</td>
|
||
<td>{{ pd.conUserName }}</td>
|
||
</tr>
|
||
<tr v-if="item.TYPE ==='2'">
|
||
<td class="tbg">是否更换整改负责人</td>
|
||
<td v-if="item.spare1==='1'">是</td>
|
||
<td v-if="item.spare1==='0'">否</td>
|
||
</tr>
|
||
<tr v-if="item.STATE!==-1">
|
||
<td class="tbg">是否更换整改负责人</td>
|
||
<td v-if="item.spare2 == undefined">否</td>
|
||
<td v-else>是</td>
|
||
</tr>
|
||
<tr v-if="item.NEWRECTIFICATIONOR != undefined" >
|
||
<td class="tbg">更换整改负责人姓名</td>
|
||
<td>{{ item.NEWRECTIFICATIONOR }}</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div v-if="data.hidden.STATE ==2 || data.hidden.STATE ==4 || data.hidden.STATE == 10 || data.hidden.RECTIFICATIONTYPE == 1" class="print-break">
|
||
<div class="level-line" />
|
||
<div class="level-title">
|
||
<h1>整改信息</h1>
|
||
</div>
|
||
<table class="table-ui">
|
||
<tr>
|
||
<td class="tbg">整改描述</td>
|
||
<td>{{ data.hidden.RECTIFYDESCR }}</td>
|
||
</tr>
|
||
|
||
<tr v-if="data.hidden.RECTIFICATIONDEPTNAME">
|
||
<td class="tbg">整改部门</td>
|
||
<td>{{ data.hidden.RECTIFICATIONDEPTNAME }}</td>
|
||
</tr>
|
||
<tr v-if="data.hidden.RECTIFICATIONORNAME">
|
||
<td class="tbg">整改人</td>
|
||
<td>{{ data.hidden.RECTIFICATIONORNAME }}</td>
|
||
</tr>
|
||
<tr v-if="data.hidden.RECTIFICATIONTIME">
|
||
<td class="tbg">整改时间</td>
|
||
<td>{{ data.hidden.RECTIFICATIONTIME }}</td>
|
||
</tr>
|
||
<tr v-if="data.hidden.INVESTMENT_FUNDS">
|
||
<td class="tbg">投入资金</td>
|
||
<td>{{ data.hidden.INVESTMENT_FUNDS }}元</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">整改后图片</td>
|
||
<td class="img-select">
|
||
<viewer :images="data.rImgs">
|
||
<img v-for="item in data.rImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" style="margin-left: 10px;" width="100" height="100">
|
||
</viewer>
|
||
</td>
|
||
</tr>
|
||
<tr v-if="data.hidden.HAVESCHEME">
|
||
<td class="tbg">整改方案</td>
|
||
<td v-if="data.hidden.HAVESCHEME==0">无</td>
|
||
<td v-else-if="data.hidden.HAVESCHEME==1">有</td>
|
||
<td v-else/>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">排查日期</td>
|
||
<td>{{ data.hs.SCREENINGDATE }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1 && data.hs.LISTNAME">
|
||
<td class="tbg">隐患清单</td>
|
||
<td>{{ data.hs.LISTNAME }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">治理标准要求</td>
|
||
<td>{{ data.hs.GOVERNSTANDARDS }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">治理方法</td>
|
||
<td>{{ data.hs.GOVERNMETHOD }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">经费和物资的落实</td>
|
||
<td>{{ data.hs.EXPENDITURE }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">负责治理人员</td>
|
||
<td>{{ data.hs.PRINCIPAL }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">工时安排</td>
|
||
<td>{{ data.hs.PROGRAMMING }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">时限要求</td>
|
||
<td>{{ data.hs.TIMELIMITFOR }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">工作要求</td>
|
||
<td>{{ data.hs.JOBREQUIREMENT }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">其他事项</td>
|
||
<td>{{ data.hs.OTHERBUSINESS }}</td>
|
||
</tr>
|
||
<tr v-if="data.hs && data.hidden.HAVESCHEME==1">
|
||
<td class="tbg">方案图片</td>
|
||
<td class="img-select">
|
||
<viewer :images="data.sImgs">
|
||
<img v-for="item in data.sImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" style="margin-left: 10px;" width="100" height="100">
|
||
</viewer>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
|
||
<div v-show="data.hidden.STATE ==4" class="print-break">
|
||
<div class="level-line" />
|
||
<div class="level-title">
|
||
<h1>验收信息</h1>
|
||
</div>
|
||
<template v-if="data.hidden.RECTIFICATIONTYPE!='1'">
|
||
<table v-for="(item) in data.checkList" :key="item.value" class="table-ui">
|
||
<tr>
|
||
<td class="tbg">验收描述</td>
|
||
<td>{{ item.CHECKDESCR }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">是否合格</td>
|
||
<td>
|
||
<template v-if="item.STATUS=='1'">
|
||
是
|
||
</template>
|
||
<template v-else-if="item.STATUS=='0'">
|
||
否
|
||
</template>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">验收部门</td>
|
||
<td>{{ item.CHECKDEPTNAME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">验收人</td>
|
||
<td>{{ item.CHECKORNAME }}</td>
|
||
</tr>
|
||
|
||
<tr>
|
||
<td class="tbg">验收时间</td>
|
||
<td>{{ item.CHECK_TIME }}</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tbg">验收图片</td>
|
||
<td class="img-select">
|
||
<viewer :images="item.cImgs">
|
||
<img v-for="item in data.cImgs" :src="config.fileUrl + item.FILEPATH" :key="item.IMGFILES_ID" style="margin-left: 10px;" width="100" height="100">
|
||
</viewer>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
</template>
|
||
<template v-if="data.hidden.RECTIFICATIONTYPE=='1'">
|
||
<table class="table-ui">
|
||
<tr>
|
||
<td class="tbg">验收人</td>
|
||
<td>{{ data.hidden.CHECKORNAME }}</td>
|
||
</tr>
|
||
</table>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
<el-dialog :visible.sync="dialogVideoVisible" title="隐患视频">
|
||
<div>
|
||
<video-player
|
||
ref="videoPlayer"
|
||
:playsinline="true"
|
||
:options="playerOptions"
|
||
style="width: 100%;"
|
||
class="video-player vjs-custom-skin"/>
|
||
</div>
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="dialogVideoVisible = false">关 闭</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
<el-dialog :visible.sync="dialogViewPdf" title="文档" width="600px">
|
||
<div>
|
||
<iframe :src="pdfUrl" width="500px" height="500px" frameborder="1" />
|
||
</div>
|
||
</el-dialog>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
|
||
import formatDate from '@/utils/dateformat'
|
||
import 'video.js/dist/video-js.css'
|
||
import { videoPlayer } from 'vue-video-player'
|
||
export default {
|
||
components: { Pagination, videoPlayer },
|
||
props: {
|
||
data: {
|
||
type: Object,
|
||
default: () => ({})
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
HIDDEN_ID: '', // 主键ID
|
||
config: config,
|
||
pdfUrl: '',
|
||
sourceList: [
|
||
{ ID: '1', NAME: '隐患快报' },
|
||
{ ID: '2', NAME: '清单排查' },
|
||
{ ID: '4', NAME: '安全环保检查(监管端)' },
|
||
{ ID: '5', NAME: '安全环保检查(企业端)' },
|
||
{ ID: '6', NAME: '消防检查' },
|
||
{ ID: '8', NAME: '点检隐患' }
|
||
],
|
||
statusList: [
|
||
{ ID: '1', NAME: '未整改' },
|
||
{ ID: '2', NAME: '已整改' },
|
||
{ ID: '4', NAME: '已验收' },
|
||
{ ID: '5', NAME: '忽略隐患' },
|
||
{ ID: '6', NAME: '重大隐患' },
|
||
{ ID: '7', NAME: '待处理的特殊隐患' },
|
||
{ ID: '8', NAME: '已处理的特殊隐患' },
|
||
{ ID: '-1', NAME: '已过期' },
|
||
{ ID: '-2', NAME: '待确认' },
|
||
{ ID: '16', NAME: '确认打回' },
|
||
{ ID: '10', NAME: '验收打回' }
|
||
],
|
||
playerOptions: {
|
||
playbackRates: [0.5, 1.0, 1.5, 2.0], // 可选的播放速度
|
||
autoplay: false, // 如果为true,浏览器准备好时开始回放。
|
||
muted: false, // 默认情况下将会消除任何音频。
|
||
loop: false, // 是否视频一结束就重新开始。
|
||
preload: 'auto', // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
|
||
language: 'zh-CN',
|
||
aspectRatio: '16:9', // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
|
||
fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
|
||
sources: [{
|
||
type: 'video/mp4', // 类型
|
||
src: '' // url地址
|
||
}],
|
||
poster: '', // 封面地址
|
||
notSupportedMessage: '此视频暂无法播放，请稍后再试', // 允许覆盖Video.js无法播放媒体源时显示的默认信息。
|
||
controlBar: {
|
||
timeDivider: true, // 当前时间和持续时间的分隔符
|
||
durationDisplay: true, // 显示持续时间
|
||
remainingTimeDisplay: false, // 是否显示剩余时间功能
|
||
fullscreenToggle: true // 是否显示全屏按钮
|
||
}
|
||
},
|
||
dialogVideoVisible: false,
|
||
dialogViewPdf: false,
|
||
hiddenVideoSrc: ''
|
||
}
|
||
},
|
||
watch: {
|
||
'data.hiddenVideoSrc': {
|
||
handler() {
|
||
this.getData()
|
||
},
|
||
immediate: false
|
||
}
|
||
},
|
||
methods: {
|
||
getData() {
|
||
var data = this.data
|
||
// this.$set(this, 'pd', this.data.hidden)
|
||
if (data.hiddenVideoSrc) {
|
||
// this.$set(this, 'playerOptions.sources[0].src', config.fileUrl + data.hiddenVideoSrc)
|
||
this.playerOptions.sources[0].src = config.fileUrl + data.hiddenVideoSrc
|
||
}
|
||
},
|
||
goViewPdf(filePath) {
|
||
this.pageNum = 1
|
||
this.pdfUrl = this.config.fileUrl + filePath
|
||
this.dialogViewPdf = true
|
||
},
|
||
back() {
|
||
this.$parent.activeName = 'List'
|
||
},
|
||
formatDate(date, format) {
|
||
return formatDate(date, format)
|
||
},
|
||
// 没有字典是的数据转换
|
||
translate(id, list) {
|
||
for (let i = 0; i < list.length; i++) {
|
||
if (list[i].BIANMA === id || list[i].value === id || list[i].id === id || list[i].ID === id) return list[i].NAME || list[i].label || list[i].name
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="sass" scoped>
|
||
.table-ui
|
||
.tbg
|
||
width: 150px
|
||
.img-flex
|
||
display: flex
|
||
.img-ui
|
||
width: 240px
|
||
height: 240px
|
||
margin-right: 20px
|
||
& img
|
||
width: 100%
|
||
height: 100%
|
||
</style>
|