<template>
|
<el-dialog v-model="videoDetailDialog" :title="title" width="80%" center>
|
<!-- <div style="margin-bottom: 20px">-->
|
<!-- <el-button type="warning" @click="fillDialog = true">人工录入警报信息</el-button>-->
|
<!-- </div>-->
|
<div class="info">
|
<div class="left-info">
|
<template v-for="item in videoData.approvalDeviceList">
|
<iframe class="video-cont" :src="'http://36.108.169.10:8088/808gps/open/player/video.html?lang=zh&devIdno=' + item.deviceNo + '&&account=gtxh&password=000000'"></iframe>
|
</template>
|
<div class="chart-area">
|
<div class="chart-item">
|
<div class="top-tit">
|
<div class="tit">气体分析数据：</div>
|
<!-- <el-button type="warning" @click="reportDialog = true">监管异常填报</el-button>-->
|
</div>
|
<el-table :data="videoData.analysisDataList" style="width: 100%" border :header-cell-style="{ background: '#fafafa' }">
|
<el-table-column property="type" label="类别" align="center">
|
<template #default="scope">
|
{{ gasData.find(i=>i.value == scope.row.type)?.name }}
|
</template>
|
</el-table-column>
|
<el-table-column property="analysisTime" label="分析时间" align="center"/>
|
<el-table-column property="analysisUname" label="分析人" align="center"/>
|
<el-table-column property="data" label="值" align="center"/>
|
<el-table-column property="resultDesc" label="是否合格" align="center">
|
<!-- <template #default="scope">-->
|
<!-- <span>{{scope.row.isGood == 0?'合格':'不合格'}}</span>-->
|
<!-- </template>-->
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="chart-item">
|
<div class="top-tit"><div class="tit">现场检查数据：</div></div>
|
<el-table :data="videoData.checkList" style="width: 100%" border :header-cell-style="{ background: '#fafafa' }">
|
<el-table-column property="operatorUname" label="检查人" align="center"/>
|
<el-table-column property="operationTime" label="检查填报时间" align="center"/>
|
<el-table-column property="checkContent" label="检查内容" align="center"/>
|
<el-table-column property="info" label="描述" align="center"/>
|
<el-table-column property="checkContent" label="是否合格" align="center">
|
<!-- <template #default="scope">-->
|
<!-- <span>{{scope.row.isGood == 0?'合格':'不合格'}}</span>-->
|
<!-- </template>-->
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</div>
|
<div class="right-info">
|
<div class="info-item">
|
<div class="info-tit">
|
基础信息
|
</div>
|
<div class="content">
|
<div>作业编号: <span>{{videoData.workPermitNo}}</span></div>
|
<div>作业部门: <span>{{videoData.workDepName}}</span></div>
|
<div>作业人员: <span>{{videoData.operatorList.map(i=>i.userName).join(',')}}</span></div>
|
<div>开始时间: <span>{{videoData.workStartTime}}</span></div>
|
<div>结束时间: <span>{{videoData.workFinishTime}}</span></div>
|
<div class="checkBtn" @click="viewTicket(videoData)">查看作业票</div>
|
<!-- <div class="checkBtn" @click="viewRecord(videoData.workApplyId)">查看记录</div>-->
|
</div>
|
</div>
|
<div class="info-item">
|
<div class="info-tit">
|
警报信息
|
</div>
|
<template v-for="item in videoData.warningList" v-if="videoData.warningList && videoData.warningList.length>0">
|
<div class="content" style="padding-bottom: 15px;margin-bottom:10px;border-bottom: 1px solid #ccc">
|
<div>执行人:
|
<span>{{item.operatorUname}}</span>
|
</div>
|
<div>警报时间:
|
<span>{{item.operationTime}}</span>
|
</div>
|
<div>警报内容:
|
<div>{{item.warningContent}}</div>
|
</div>
|
</div>
|
</template>
|
<div v-else>
|
暂无警报信息
|
</div>
|
</div>
|
</div>
|
</div>
|
<Work-record ref="recordRef"></Work-record>
|
<el-dialog v-model="fillDialog" title="作业全过程监测风险警报信息发现录入" width="50%" center>
|
<el-form ref="reviewFormRef" :model="reviewForm" :rules="reviewRules" label-width="170px">
|
<el-form-item label="风险描述：" prop="describe">
|
<el-input
|
v-model="reviewForm.describe"
|
:autosize="{ minRows: 4, maxRows: 10 }"
|
type="textarea"
|
prop="desc"
|
placeholder="请输入风险描述信息"
|
/>
|
</el-form-item>
|
<el-form-item label="是否已通知现场负责人：" prop="isInform">
|
<el-radio-group v-model="reviewForm.isInform">
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">否</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="fillDialog = false">取消</el-button>
|
<el-button type="primary">确认</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
<el-dialog v-model="reportDialog" title="基础指标数据作业过程中监管异常填报" width="50%" center>
|
<div class="tip">
|
提示：动火作业被测可燃气体或蒸气浓度不应大于10%LEL。您在现场人员未发现或未如实填报时，才需要填写此项。
|
</div>
|
<el-form ref="reportFormRef" :model="reportForm" :rules="reportRules" label-width="120px">
|
<el-form-item label="可燃气体浓度：" prop="problem">
|
<el-input
|
v-model="reportForm.problem"
|
prop="problem"
|
/>
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="reportDialog = false">取消</el-button>
|
<el-button type="primary">确认</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</el-dialog>
|
</template>
|
|
<script lang="ts">
|
import { toRefs, reactive, defineComponent, ref, defineAsyncComponent } from 'vue';
|
import { storeToRefs } from 'pinia';
|
import { initBackEndControlRoutes } from '/@/router/backEnd';
|
import {useUserInfo} from "/@/stores/userInfo";
|
import { Session } from '/@/utils/storage';
|
import { ElMessage } from 'element-plus'
|
import type { FormInstance, FormRules } from 'element-plus'
|
import WorkRecord from "/@/views/specialWorkSystem/specialIndex/components/workRecord.vue";
|
import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
|
import axios from "axios";
|
import Cookies from "js-cookie";
|
|
|
interface stateType {
|
videoDetailDialog:boolean
|
fillDialog: boolean
|
reviewForm: object
|
reportForm: object
|
reportDialog: boolean
|
videoData:{}
|
title: string
|
gasData: Array<any>
|
}
|
export default defineComponent({
|
name: 'videoDetail',
|
components: {WorkRecord},
|
props:[],
|
setup() {
|
const userInfo = useUserInfo()
|
const { userInfos } = storeToRefs(userInfo);
|
const state = reactive<stateType>({
|
videoDetailDialog: false,
|
title: '',
|
videoData:{},
|
fillDialog: false,
|
reportDialog: false,
|
reviewForm: {},
|
reportForm: {},
|
gasData: [
|
{
|
name: '有毒有害气体',
|
value: 1
|
},
|
{
|
name: '可燃气体',
|
value: 2
|
},
|
{
|
name: '氧气',
|
value: 3
|
}
|
]
|
})
|
const recordRef = ref()
|
const openDialog = (row)=>{
|
state.videoData = row
|
console.log(state.videoData.approvalDeviceList,'data')
|
state.title = row.workTypeDesc + '编号' + row.workPermitNo + '实时监测详情'
|
state.videoDetailDialog = true
|
}
|
|
const viewTicket = async(row)=>{
|
let res = await workApplyApi().viewTicket({id:row.workApplyId})
|
if(res.data.code == 200){
|
console.log(res.data,666)
|
}
|
axios.post(import.meta.env.VITE_API_URL + `/specialwork9step/work/down/load/pdf`,{id: row.workApplyId},{headers:{'Content-Type': 'application/json','Authorization': `${Cookies.get('token')}`,'uid':`${Cookies.get('uid')}`},responseType: 'blob'}).then(res=>{
|
if (res) {
|
const link = document.createElement('a')
|
let blob = new Blob([res.data],{type: 'application/pdf'})
|
link.style.display = "none";
|
link.href = URL.createObjectURL(blob); // 创建URL
|
link.setAttribute("download", row.workPermitNo + "(" + row.workTypeDesc +")作业证.pdf");
|
window.open(link)
|
} else {
|
ElMessage({
|
type: 'warning',
|
message: '预览失败'
|
});
|
}
|
})
|
}
|
|
const viewRecord = (id: string | null)=>{
|
recordRef.value.openDialog(id)
|
}
|
|
return {
|
recordRef,
|
openDialog,
|
viewTicket,
|
viewRecord,
|
...toRefs(state)
|
};
|
},
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.info{
|
width: 100%;
|
display: flex;
|
align-items: flex-start;
|
justify-content: space-between;
|
|
.left-info{
|
width: calc(70% - 20px);
|
margin-right: 20px;
|
.video-cont{
|
width: 100%;
|
min-height: 500px;
|
}
|
.chart-area{
|
width: 100%;
|
background: #fafafa;
|
padding: 20px;
|
margin-top: 20px;
|
.chart-item{
|
margin-bottom: 20px;
|
.top-tit{
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 20px;
|
}
|
}
|
}
|
}
|
.right-info{
|
width: 30%;
|
|
.info-item{
|
width: 100%;
|
margin-bottom: 10px;
|
|
&:last-of-type{
|
margin-bottom: 0;
|
}
|
|
.info-tit{
|
width: 100%;
|
padding: 6px 0;
|
text-align: center;
|
background: #59ddf7;
|
border-radius: 4px;
|
margin-bottom: 10px;
|
}
|
.content{
|
width: 100%;
|
div{
|
width: 100%;
|
font-size: 14px;
|
margin-bottom: 4px;
|
}
|
.checkBtn{
|
color: #409eff;
|
cursor: pointer;
|
}
|
}
|
}
|
}
|
}
|
.tip{
|
margin-bottom: 20px;
|
}
|
</style>
|
