|
|
|
|
@ -27,26 +27,26 @@
|
|
|
|
|
<!-- 通报 -->
|
|
|
|
|
<!-- <div v-if="announceCurrentIndex === 1"> -->
|
|
|
|
|
<div>
|
|
|
|
|
<div class="table_outside">
|
|
|
|
|
<!-- <div class="table_outside">
|
|
|
|
|
<div class="table_title">
|
|
|
|
|
<!-- <span class="title_one">部门名称</span>
|
|
|
|
|
<span class="title_two">通报次数</span> -->
|
|
|
|
|
<span class="title_one">部门名称</span>
|
|
|
|
|
<span class="title_two">通报次数</span>
|
|
|
|
|
<span class="title_one">单位名称</span>
|
|
|
|
|
<span class="title_two">积分</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<!-- <vue-seamless-scroll
|
|
|
|
|
<vue-seamless-scroll
|
|
|
|
|
:data="notificationList"
|
|
|
|
|
:class-option="classOption"
|
|
|
|
|
class="monitorScroll"
|
|
|
|
|
> -->
|
|
|
|
|
>
|
|
|
|
|
<div class="table_ctn">
|
|
|
|
|
<div
|
|
|
|
|
v-for="(item, index) in notificationList"
|
|
|
|
|
:key="index"
|
|
|
|
|
class="ctn_item"
|
|
|
|
|
@click="clickTop4(item)"
|
|
|
|
|
>
|
|
|
|
|
<!-- @click="clickTop4(item)" -->
|
|
|
|
|
<div class="item_icon">
|
|
|
|
|
{{ index + 1 }}
|
|
|
|
|
</div>
|
|
|
|
|
@ -56,9 +56,41 @@
|
|
|
|
|
<div class="item_num">{{ item.integral }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- </vue-seamless-scroll> -->
|
|
|
|
|
</vue-seamless-scroll>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
<div class="firewall-table" style="height: 100%;">
|
|
|
|
|
<div class="table-header">
|
|
|
|
|
<div class="header-cell" style="width: 220px">部门名称</div>
|
|
|
|
|
<div class="header-cell" style="width: 120px">通报次数</div>
|
|
|
|
|
<div class="header-cell" style="width: 170px">单位名称</div>
|
|
|
|
|
<div class="header-cell" style="width: 170px">积分</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- vue-seamless-scroll
|
|
|
|
|
vue-seamless-scroll -->
|
|
|
|
|
<div :data="notificationList" :class-option="classOption" class="scroll-container">
|
|
|
|
|
<div class="table-body">
|
|
|
|
|
<div v-for="(item, index) in notificationList" :key="index" class="table-row"
|
|
|
|
|
:class="{ 'odd-row': index % 2 === 0 }" @click="clickTop4(item)">
|
|
|
|
|
<div class="cell" style="width: 220px">
|
|
|
|
|
<!-- <span>{{ item.integral }}</span> -->
|
|
|
|
|
<span>园区数据局</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cell" style="width: 120px">
|
|
|
|
|
<!-- <span>{{ item.integral }}</span> -->
|
|
|
|
|
<div class="item_icon">{{ index + 1 }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cell" style="width: 170px">
|
|
|
|
|
<div class="item_name" :title="item.unitName">{{ item.unitName }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cell" style="width: 170px">
|
|
|
|
|
<div class="item_icon">{{ index + 1 }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <el-dialog
|
|
|
|
|
v-if="dialogStatus"
|
|
|
|
|
@ -93,53 +125,27 @@
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog> -->
|
|
|
|
|
<el-dialog
|
|
|
|
|
v-if="dialogStatus2"
|
|
|
|
|
:title="'通报详情'"
|
|
|
|
|
class="screen-dialog"
|
|
|
|
|
:visible.sync="dialogStatus2"
|
|
|
|
|
width="1920px"
|
|
|
|
|
:modal-append-to-body="true"
|
|
|
|
|
center
|
|
|
|
|
:modal="false"
|
|
|
|
|
>
|
|
|
|
|
<div
|
|
|
|
|
style="
|
|
|
|
|
<el-dialog v-if="dialogStatus2" :title="'通报详情'" class="screen-dialog" :visible.sync="dialogStatus2" width="1920px"
|
|
|
|
|
:modal-append-to-body="true" center :modal="false">
|
|
|
|
|
<div style="
|
|
|
|
|
height: 740px;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
text-align: center;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
"
|
|
|
|
|
>
|
|
|
|
|
<div
|
|
|
|
|
v-if="fileExtension === 'docx' || fileExtension === 'doc'"
|
|
|
|
|
ref="file1"
|
|
|
|
|
class="file-content"
|
|
|
|
|
>
|
|
|
|
|
">
|
|
|
|
|
<div v-if="fileExtension === 'docx' || fileExtension === 'doc'" ref="file1" class="file-content">
|
|
|
|
|
<!-- <iframe style="height: 100%; width: 100%" :src="pdfUrl"></iframe> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div
|
|
|
|
|
v-if="fileExtension === 'pdf'"
|
|
|
|
|
class="file-content"
|
|
|
|
|
style="height: 430px"
|
|
|
|
|
>
|
|
|
|
|
<div v-if="fileExtension === 'pdf'" class="file-content" style="height: 430px">
|
|
|
|
|
<!-- <iframe style="height: 100%; width: 100%" :src="pdfUrl"></iframe> -->
|
|
|
|
|
<pdf
|
|
|
|
|
v-for="i in numPages"
|
|
|
|
|
ref="pdf"
|
|
|
|
|
:key="i"
|
|
|
|
|
:src="pdfUrl"
|
|
|
|
|
:page="i"
|
|
|
|
|
></pdf>
|
|
|
|
|
<pdf v-for="i in numPages" ref="pdf" :key="i" :src="pdfUrl" :page="i"></pdf>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
|
|
<span>
|
|
|
|
|
<el-button class="dialog-btn" @click="dialogStatus2 = false"
|
|
|
|
|
>关 闭</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button class="dialog-btn" @click="dialogStatus2 = false">关 闭</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
@ -392,7 +398,7 @@ export default {
|
|
|
|
|
// dataBmtb().then((res) => {
|
|
|
|
|
// this.notificationList = res.data;
|
|
|
|
|
// });
|
|
|
|
|
listZcdwpm().then(res=>{
|
|
|
|
|
listZcdwpm().then(res => {
|
|
|
|
|
this.notificationList = res.rows;
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
@ -405,9 +411,8 @@ export default {
|
|
|
|
|
value: value.count,
|
|
|
|
|
percent: value.percentage.toFixed(2),
|
|
|
|
|
area: value.area,
|
|
|
|
|
img: require(`@/assets/privateOrder/general/${
|
|
|
|
|
index + 1 > 8 ? 1 : index + 1
|
|
|
|
|
}.png`),
|
|
|
|
|
img: require(`@/assets/privateOrder/general/${index + 1 > 8 ? 1 : index + 1
|
|
|
|
|
}.png`),
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
// this.inItPie();
|
|
|
|
|
@ -437,16 +442,95 @@ export default {
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
.firewall-table {
|
|
|
|
|
width: 100%;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
height: 290px;
|
|
|
|
|
|
|
|
|
|
.table-header {
|
|
|
|
|
display: flex;
|
|
|
|
|
background-color: #1a3b6e;
|
|
|
|
|
background: url("~@/assets/privateOrder/general/背景表格头.png");
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
font-family: AlibabaPuHuiTiM;
|
|
|
|
|
|
|
|
|
|
.header-cell {
|
|
|
|
|
padding: 12px;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
flex: 1;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.scroll-container {
|
|
|
|
|
height: 540px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.table-body {
|
|
|
|
|
width: 100%;
|
|
|
|
|
font-family: AlibabaPuHuiTiM;
|
|
|
|
|
|
|
|
|
|
.table-row {
|
|
|
|
|
display: flex;
|
|
|
|
|
background-color: black;
|
|
|
|
|
border-bottom: 1px solid #193859;
|
|
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
|
background-color: rgba(33, 150, 243, 0.1) !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
&.odd-row {
|
|
|
|
|
background-color: rgba(18, 40, 69, 0.7);
|
|
|
|
|
background: url("~@/assets/privateOrder/general/背景表格斑马纹.png");
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.cell {
|
|
|
|
|
padding: 12px;
|
|
|
|
|
color: #B9CCDF;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
flex: 1;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-family: AlibabaPuHuiTiR;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.violation-text {
|
|
|
|
|
color: #11D1E9;
|
|
|
|
|
font-family: DIN-Regular;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.number-text {
|
|
|
|
|
font-family: DIN-Regular;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.green-text {
|
|
|
|
|
color: #99F17A;
|
|
|
|
|
font-family: DIN-Regular;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.monitorScroll {
|
|
|
|
|
height: 280px;
|
|
|
|
|
width: 100%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
margin-top: 15px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dialog__header {
|
|
|
|
|
background: rgba(255, 255, 255, 0);
|
|
|
|
|
text-align: left;
|
|
|
|
|
padding-left: 40px;
|
|
|
|
|
|
|
|
|
|
.el-dialog__title {
|
|
|
|
|
font-family: SourceHanSansCN-Bold, san-serif;
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
@ -457,12 +541,14 @@ export default {
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//饼图
|
|
|
|
|
#pie1 {
|
|
|
|
|
width: 306px;
|
|
|
|
|
height: 307px;
|
|
|
|
|
transform: translate(11%, 11%);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.countpie {
|
|
|
|
|
width: 374px;
|
|
|
|
|
height: 374px;
|
|
|
|
|
@ -471,6 +557,7 @@ export default {
|
|
|
|
|
background: url("~@/assets/privateOrder/general/饼图-bg2.png");
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.moduleCount {
|
|
|
|
|
height: 381px;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
@ -481,26 +568,31 @@ export default {
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-content: flex-start;
|
|
|
|
|
|
|
|
|
|
.smallIcon {
|
|
|
|
|
margin-top: 28px;
|
|
|
|
|
height: 61px;
|
|
|
|
|
width: 143px;
|
|
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
.leftIcon {
|
|
|
|
|
margin-right: 5px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.right_msg {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: flex-start;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
height: 77px;
|
|
|
|
|
|
|
|
|
|
.Top_msg {
|
|
|
|
|
font-family: SourceHanSansCN-Medium;
|
|
|
|
|
font-size: 26px;
|
|
|
|
|
color: #b7dfff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.bottom_msg {
|
|
|
|
|
font-family: DIN-Medium;
|
|
|
|
|
font-size: 30px;
|
|
|
|
|
@ -509,11 +601,13 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//部门
|
|
|
|
|
.table_outside {
|
|
|
|
|
width: 720px;
|
|
|
|
|
height: 350px;
|
|
|
|
|
margin-top: 18px;
|
|
|
|
|
|
|
|
|
|
.table_title {
|
|
|
|
|
width: 718px;
|
|
|
|
|
// height: 55px;
|
|
|
|
|
@ -528,9 +622,11 @@ export default {
|
|
|
|
|
// line-height: 20px;
|
|
|
|
|
line-height: 32px;
|
|
|
|
|
color: #a6d5ff;
|
|
|
|
|
|
|
|
|
|
.title_one {
|
|
|
|
|
margin-left: 77px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title_two {
|
|
|
|
|
margin-right: 25px;
|
|
|
|
|
}
|
|
|
|
|
@ -547,7 +643,8 @@ export default {
|
|
|
|
|
height: 75px;
|
|
|
|
|
margin: 15px 0;
|
|
|
|
|
background: url("~@/assets/privateOrder/general/first/部门通报tr-bg.png") no-repeat;
|
|
|
|
|
background-size:100% 100%;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
|
|
.item_icon {
|
|
|
|
|
width: 38px;
|
|
|
|
|
height: 38px;
|
|
|
|
|
@ -557,6 +654,7 @@ export default {
|
|
|
|
|
line-height: 38px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item_name {
|
|
|
|
|
width: 500px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
@ -567,6 +665,7 @@ export default {
|
|
|
|
|
margin-left: 20px;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item_num {
|
|
|
|
|
font-family: PangMenZhengDao-3;
|
|
|
|
|
font-size: 32px;
|
|
|
|
|
@ -580,6 +679,7 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.screen-dialog {
|
|
|
|
|
.dialog-btn {
|
|
|
|
|
background: url("~@/assets/dialog/btn-bg.png") no-repeat;
|
|
|
|
|
@ -594,18 +694,22 @@ export default {
|
|
|
|
|
letter-spacing: 2px;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-button {
|
|
|
|
|
border: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dialog-footer :hover {
|
|
|
|
|
.dialog-btn {
|
|
|
|
|
background: url("~@/assets/dialog/btn-bg-act.png") no-repeat;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dialog__header {
|
|
|
|
|
background: rgba(255, 255, 255, 0);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dialog {
|
|
|
|
|
background: url("~@/assets/dialog/弹窗背景-一般.png") no-repeat;
|
|
|
|
|
//width: 1260px;
|
|
|
|
|
@ -613,12 +717,15 @@ export default {
|
|
|
|
|
//padding-top:20px;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dialog__headerbtn {
|
|
|
|
|
top: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::v-deep .el-dialog__footer {
|
|
|
|
|
background: rgba(255, 255, 255, 0);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dialogClose {
|
|
|
|
|
text-align: center;
|
|
|
|
|
width: 160px;
|
|
|
|
|
@ -636,10 +743,12 @@ export default {
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dialogClose:hover {
|
|
|
|
|
background: url("~@/assets/dialog/btn-bg-act.png") no-repeat 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//隐患处置
|
|
|
|
|
.dangerTitle {
|
|
|
|
|
//width: 720px;
|
|
|
|
|
@ -647,30 +756,37 @@ export default {
|
|
|
|
|
line-height: 55px;
|
|
|
|
|
margin-top: 13px;
|
|
|
|
|
background-color: #143458;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
font-family: SourceHanSansCN-Regular;
|
|
|
|
|
font-size: 26px;
|
|
|
|
|
color: #b7dfff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(1) {
|
|
|
|
|
padding-left: 13px;
|
|
|
|
|
width: 510px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(2) {
|
|
|
|
|
padding-left: 300px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(3) {
|
|
|
|
|
padding-left: 300px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(4) {
|
|
|
|
|
padding-left: 150px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dangerText {
|
|
|
|
|
//width: 719px;
|
|
|
|
|
height: 85px;
|
|
|
|
|
margin-top: 22px;
|
|
|
|
|
background-color: #6bb8ff21;
|
|
|
|
|
|
|
|
|
|
/* background-image: url("~@/assets/privateOrder/general/隐患处置-td-bg.png");
|
|
|
|
|
background-size: 100% 100%; */
|
|
|
|
|
span {
|
|
|
|
|
@ -683,6 +799,7 @@ export default {
|
|
|
|
|
font-size: 26px;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(1) {
|
|
|
|
|
font-size: 26px;
|
|
|
|
|
padding-left: 16px;
|
|
|
|
|
@ -692,17 +809,21 @@ export default {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(2) {
|
|
|
|
|
padding-left: 100px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(3) {
|
|
|
|
|
padding-left: 260px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span:nth-child(4) {
|
|
|
|
|
color: #fff36f;
|
|
|
|
|
padding-left: 180px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dialog-title {
|
|
|
|
|
text-align: center;
|
|
|
|
|
width: 956px;
|
|
|
|
|
@ -715,11 +836,13 @@ export default {
|
|
|
|
|
letter-spacing: 0;
|
|
|
|
|
color: #ffe850;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dialog-explain {
|
|
|
|
|
margin-top: 39px;
|
|
|
|
|
height: 125px;
|
|
|
|
|
background: url("~@/assets/dialog/信息-bg.png") no-repeat 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.dialog-content {
|
|
|
|
|
width: 1073px;
|
|
|
|
|
max-height: 500px;
|
|
|
|
|
@ -732,11 +855,13 @@ export default {
|
|
|
|
|
letter-spacing: 2px;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.file-content {
|
|
|
|
|
width: 1220px;
|
|
|
|
|
height: 370px;
|
|
|
|
|
transform: scale(1.5);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.screen-dialog ::-webkit-scrollbar {
|
|
|
|
|
width: 10px;
|
|
|
|
|
height: 10px;
|
|
|
|
|
@ -748,9 +873,11 @@ export default {
|
|
|
|
|
background: transparent !important;
|
|
|
|
|
padding: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.file-content .docx {
|
|
|
|
|
width: 90% !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.file-content .docx p {
|
|
|
|
|
text-align: center !important;
|
|
|
|
|
}
|
|
|
|
|
|
