285 lines
9.1 KiB
Vue
285 lines
9.1 KiB
Vue
<template>
|
|
<MyDialog v-if="show" v-model="show" width="60vw" height="75vh" class="safety-check-dialog">
|
|
<template slot="title">{{ title }}</template>
|
|
<div class="head-title-tab" style="padding: 10px 0px;">
|
|
<div :class="nav == 6 ? 'head-nav active' : 'head-nav'" @click="doNav(6)">待整改{{ counts[0] }}</div>
|
|
<div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)">待复检{{ counts[1] }}</div>
|
|
<div :class="nav == 7 ? 'head-nav active' : 'head-nav'" @click="doNav(7)">复检驳回{{ counts[2] }}</div>
|
|
<div :class="nav == 4 ? 'head-nav active' : 'head-nav'" @click="doNav(4)">复检通过{{ counts[3] }}</div>
|
|
<div :class="nav == 5 ? 'head-nav active' : 'head-nav'" @click="doNav(5)">整改超时{{ counts[4] }}</div>
|
|
</div>
|
|
<div class="scroll data-list" :key="dataKey">
|
|
<div v-if="rows.length == 0" style="text-align: center;" class="div-no-data">
|
|
<img src="images/nodata.png" style="width: 120px;" />
|
|
<div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
|
|
</div>
|
|
<div v-for="(it, idx) in rows" :key="idx" class="data-item">
|
|
<div class="left-image">
|
|
<div class="left-header">
|
|
<span class="sp-nav" :class="it.imgSel == 0 ? 'active' : ''" @click="it.imgSel = 0">整改前</span>
|
|
<span class="sp-nav" :class="it.imgSel == 1 ? 'active' : ''" v-if="it.checkState == 4" @click="it.imgSel = 1">整改后</span>
|
|
</div>
|
|
<el-image class="img-sm" fit="scale-down" :src="it.smarkUrl" v-if="it.imgSel == 0" :preview-src-list="[it.smarkUrl]"></el-image>
|
|
<el-image class="img-sm" fit="scale-down" :src="it.marksPicture" v-if="it.imgSel == 1" :preview-src-list="[it.marksPicture]"></el-image>
|
|
</div>
|
|
<div class="right-data">
|
|
<el-col :span="12">
|
|
<span class="sp-label">隐串类型:</span>
|
|
<span class="sp-value">{{ getDict(it.dangerType) }}</span>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<span class="sp-label">提交时间:</span>
|
|
<span class="sp-value">{{ it.createTime }}</span>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<span class="sp-label">提交人:</span>
|
|
<span class="sp-value">{{ it.createUser }}</span>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<span class="sp-label">整改人:</span>
|
|
<span class="sp-value">{{ it.lordSentUser }}</span>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<span class="sp-label">抄送人:</span>
|
|
<span class="sp-value">{{ it.copySendUser }}</span>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<span class="sp-label">截止时间:</span>
|
|
<span class="sp-value">{{ it.nickedTime }}</span>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<span class="sp-label">隐患描述:</span>
|
|
<span class="sp-value">{{ it.workParts }}</span>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<span class="sp-label">整改要求:</span>
|
|
<span class="sp-value">{{ it.changeInfo }}</span>
|
|
</el-col>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<el-pagination
|
|
v-if="rows.length > 0"
|
|
layout="total,prev, pager, next"
|
|
@current-change="handleCurrentChange"
|
|
:total="total"
|
|
:page-size="pageSize"
|
|
:current-page.sync="pageNum"
|
|
class="bg-pagination"
|
|
></el-pagination>
|
|
</MyDialog>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
show: false,
|
|
title: '安全隐患排查',
|
|
prjInfo: {},
|
|
nav: 6,
|
|
problemType: null,
|
|
counts: [],
|
|
pageNum: 0,
|
|
pageSize: 10,
|
|
total: 0,
|
|
rows: [],
|
|
dataKey: 0,
|
|
dangerTypeDict: [],
|
|
}
|
|
},
|
|
methods: {
|
|
handleCurrentChange(n) {
|
|
this.pageNum = n
|
|
this.loadData()
|
|
},
|
|
getDict(n) {
|
|
let tmps = this.dangerTypeDict.filter((d) => d.value == n)
|
|
return tmps.length > 0 ? tmps[0].label : ''
|
|
},
|
|
doNav(n) {
|
|
this.nav = n
|
|
this.loadData()
|
|
},
|
|
showDialog(prj, n, dangerTypeDict) {
|
|
this.dangerTypeDict = dangerTypeDict
|
|
this.problemType = n == 0 ? null : n
|
|
this.prjInfo = prj
|
|
this.title = ['安全隐患排查', '日常巡检', '周检', '月检', '专项检查'][n]
|
|
this.pageNum = 0
|
|
this.show = true
|
|
this.getCount(n)
|
|
this.loadData()
|
|
},
|
|
getCount(n) {
|
|
let postData = {
|
|
projectId: this.prjInfo.id,
|
|
comId: this.prjInfo.comId,
|
|
infoType: 0,
|
|
}
|
|
if (n > 0) {
|
|
postData.problemType = n
|
|
}
|
|
this.$api.safety.listCountForBG(postData).then((d) => {
|
|
this.counts = d.data.filter((it) => it.projectName != 'a').map((it) => it.id)
|
|
})
|
|
},
|
|
loadData() {
|
|
let postData = {
|
|
projectId: this.prjInfo.id,
|
|
comId: this.prjInfo.comId,
|
|
infoType: 0,
|
|
pageNum: this.pageNum,
|
|
pageSize: this.pageSize,
|
|
problemType: this.problemType,
|
|
checkState: this.nav,
|
|
}
|
|
this.$api.safety.listForBG(postData).then((d) => {
|
|
this.total = d.total
|
|
this.rows = (d.rows || []).map((it) => {
|
|
it.imgSel = 0
|
|
return it
|
|
})
|
|
this.dataKey++
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="less">
|
|
.safety-check-dialog {
|
|
.popup-project-introduction-min {
|
|
transform: translateY(20%);
|
|
}
|
|
|
|
.bg-pagination {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.data-list {
|
|
max-height: calc(75vh - 150px);
|
|
overflow-y: auto;
|
|
|
|
.div-no-data {
|
|
margin-top: 10vh;
|
|
}
|
|
|
|
.data-item {
|
|
display: flex;
|
|
background: #060f239d;
|
|
padding: 10px;
|
|
border: solid 1px #cccccc33;
|
|
margin-top: 20px;
|
|
|
|
&:first-child {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.left-image {
|
|
width: 160px;
|
|
box-shadow: 1px 1px 10px 1px #ffffff3b;
|
|
|
|
.left-header {
|
|
margin-bottom: 8px;
|
|
background: #fff;
|
|
|
|
.sp-nav {
|
|
display: inline-block;
|
|
width: 50%;
|
|
line-height: 30px;
|
|
text-align: center;
|
|
background: #fff;
|
|
color: #5b84eb;
|
|
cursor: pointer;
|
|
|
|
&.active {
|
|
color: #fff;
|
|
background: #5b84eb;
|
|
}
|
|
}
|
|
}
|
|
|
|
.el-image {
|
|
width: 160px;
|
|
height: 100px;
|
|
}
|
|
}
|
|
|
|
.right-data {
|
|
flex-grow: 1;
|
|
padding: 0px 20px;
|
|
line-height: 30px;
|
|
|
|
.sp-label {
|
|
color: #8bffd2;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (min-width: 1921px) and (max-width: 2560px) {
|
|
.safety-check-dialog {
|
|
.bg-pagination {
|
|
margin-top: 5px;
|
|
|
|
* {
|
|
font-size: 20px !important;
|
|
}
|
|
|
|
button,
|
|
li {
|
|
height: 28px !important;
|
|
line-height: 28px !important;
|
|
}
|
|
}
|
|
|
|
.data-list {
|
|
max-height: calc(75vh - 180px);
|
|
|
|
.data-item {
|
|
.right-data {
|
|
font-size: 18px;
|
|
|
|
.sp-label {
|
|
color: #8bffd2;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (min-width: 2561px) {
|
|
.safety-check-dialog {
|
|
.bg-pagination {
|
|
margin-top: 15px;
|
|
|
|
* {
|
|
font-size: 24px !important;
|
|
}
|
|
|
|
button,
|
|
li {
|
|
height: 32px !important;
|
|
line-height: 32px !important;
|
|
}
|
|
}
|
|
|
|
.data-list {
|
|
max-height: calc(75vh - 180px);
|
|
|
|
.data-item {
|
|
.right-data {
|
|
font-size: 24px;
|
|
|
|
.sp-label {
|
|
color: #8bffd2;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |