隐患处理列表

lijinlong
许宏杰 1 year ago
parent 0028e615c8
commit 4431427b0c

@ -4,6 +4,6 @@ ENV = 'development'
# base api # base api
VUE_APP_BASE_API = '/dashboard' VUE_APP_BASE_API = '/dashboard'
VUE_APP_BASE_API2 = 'http://192.168.0.106:9027' VUE_APP_BASE_API2 = 'http://192.168.0.110:9027'
BASE_API = 'http://10.10.3.35:9070' BASE_API = 'http://10.10.3.35:9070'

@ -25,8 +25,8 @@ const dict = {
getDictType({ commit }) { getDictType({ commit }) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const query = { const query = {
list: 'sys_user_sex,tc_net_sx,tc_yq_media,tc_enter_type,tc_inlet_yewu,tc_item_type,tc_net_safety_level,tc_yes_no,tc_unit_type,tc_tmt_type,tc_db_steam_state,tc_attack_type,tc_yh_level,tc_yh_source,tc_yq_type,tc_event_type,tc_cy_type,tc_yq_state' list: "sys_user_sex,tc_net_sx,tc_yq_media,tc_enter_type,tc_inlet_yewu,tc_item_type,tc_net_safety_level,tc_yes_no,tc_unit_type,tc_tmt_type,tc_db_steam_state,tc_attack_type,tc_yh_level,tc_yh_source,tc_yq_type,tc_event_type,tc_cy_type,tc_yq_state,tc_steam_state",
} };
getDictList(query) getDictList(query)
.then((res) => { .then((res) => {
// console.log(res) // console.log(res)

@ -1,4 +1,3 @@
<template> <template>
<div class="container"> <div class="container">
<div class="module-container"> <div class="module-container">
@ -108,6 +107,7 @@
<span>等级</span> <span>等级</span>
<span>隐患来源</span> <span>隐患来源</span>
</div> </div>
<div @click="rowDetails($event)">
<vue-seamless-scroll <vue-seamless-scroll
:data="dangerList" :data="dangerList"
:class-option="classOption" :class-option="classOption"
@ -117,54 +117,48 @@
v-for="(item, idx) in dangerList" v-for="(item, idx) in dangerList"
:key="idx" :key="idx"
class="dangerText" class="dangerText"
@click="rowDetails(item)"
> >
<span>{{ <span :data-url="item.fileUrl">{{ item.unitName }}</span>
item.unitName <span>{{ item.riskName }}</span>
}}</span> <span>{{ $filterDict("tc_yh_level", item.level) }}</span>
<span>{{ <span> {{ $filterDict("tc_yh_source", item.riskSource) }}</span>
item.riskName
}}</span>
<span>{{ $filterDict('tc_yh_level',item.level) }}</span>
<span>
{{ $filterDict('tc_yh_source',item.riskSource) }}</span>
</div> </div>
</vue-seamless-scroll> </vue-seamless-scroll>
</div>
</div> </div>
<!-- 通报处置 --> <!-- 通报处置 -->
<div v-if="dangerCurrentIndex === 1"> <div v-if="dangerCurrentIndex === 1">
<div class="table_outside" @click="rowDetails($event)"> <div class="table_outside">
<div class="table_title"> <div class="table_title">
<span class="title_one">单位名称</span> <span class="title_one">单位名称</span>
<span class="title_two">目标IP/域名</span> <span class="title_two">目标IP/域名</span>
<span class="title_three">处置情况</span> <span class="title_three">处置情况</span>
</div> </div>
<div @click="rowDetails($event)">
<vue-seamless-scroll <vue-seamless-scroll
:data="informList" :data="informList"
:class-option="classOption" :class-option="classOption"
class="table_ctn" class="table_ctn"
> >
<div <div
v-for="(item, index) in informList" v-for="(item, index) in informList"
:key="index" :key="index"
class="ctn_item" class="ctn_item"
> >
<div <div class="item_name" :data-url="item.fileUrl">
class="item_name"
>
{{ item.depName }} {{ item.depName }}
</div> </div>
<div <div class="item_ip" >
{{ item.ip }}
class="item_ip"
>
{{ item.domainName }}
</div> </div>
<span class="item_num">{{ <span class="item_num" >{{
item.status $filterDict("tc_steam_state", item.state)
}}</span> }}</span>
</div> </div>
</vue-seamless-scroll> </vue-seamless-scroll>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -187,10 +181,9 @@
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<span> <span>
<el-button <el-button class="dialog-btn" @click="dialogStatus = false"
class="dialog-btn" > </el-button
@click="dialogStatus = false" >
> </el-button>
</span> </span>
</span> </span>
</el-dialog> </el-dialog>
@ -219,17 +212,17 @@
class="file-content" class="file-content"
></div> ></div>
<div v-if="fileExtension === 'pdf'" class="file-content"> <div v-if="fileExtension === 'pdf'" class="file-content">
<div v-for="i in numPages" :key="i"> <iframe style="height: 100%; width: 100%" :src="pdfUrl"></iframe>
<!-- <div v-for="i in numPages" :key="i">
<pdf ref="pdf" :key="i" :src="pdfUrl" :page="i"></pdf> <pdf ref="pdf" :key="i" :src="pdfUrl" :page="i"></pdf>
</div> </div> -->
</div> </div>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<span> <span>
<el-button <el-button class="dialog-btn" @click="dialogDetails = false"
class="dialog-btn" > </el-button
@click="dialogDetails = false" >
> </el-button>
</span> </span>
</span> </span>
</el-dialog> </el-dialog>
@ -237,48 +230,48 @@
</template> </template>
<script> <script>
import { listDanger, getDanger, listTb, getTb } from '@/api/zongzhi/st.js' import { listDanger, getDanger, listTb, getTb } from "@/api/zongzhi/st.js";
import vueSeamlessScroll from 'vue-seamless-scroll' import vueSeamlessScroll from "vue-seamless-scroll";
import ModuleTitle from '../../common/ModuleTitle.vue' import ModuleTitle from "../../common/ModuleTitle.vue";
import ReportingStatistics from './ReportingStatistics.vue' import ReportingStatistics from "./ReportingStatistics.vue";
// import { getSafeHazardSatistic, getNotificationList } from '@/api/common' // import { getSafeHazardSatistic, getNotificationList } from '@/api/common'
import { dangerList, informList } from './data.js' import { dangerList, informList } from "./data.js";
import qs from 'qs' import qs from "qs";
const docx = require('docx-preview') const docx = require("docx-preview");
import axios from 'axios' import axios from "axios";
window.JSZip = require('jszip') window.JSZip = require("jszip");
import pdf from 'vue-pdf' import pdf from "vue-pdf";
export default { export default {
components: { components: {
vueSeamlessScroll, vueSeamlessScroll,
ModuleTitle, ModuleTitle,
ReportingStatistics, ReportingStatistics,
pdf pdf,
}, },
filters: { filters: {
numFilter(value) { numFilter(value) {
const realVal = Number(value).toFixed(2) const realVal = Number(value).toFixed(2);
return Number(realVal) return Number(realVal);
}, },
commaFilter(target) { commaFilter(target) {
if (target < 10000) { if (target < 10000) {
return String(target).replace(/(\d)(?=(\d{3})+$)/g, '$1,') return String(target).replace(/(\d)(?=(\d{3})+$)/g, "$1,");
} else { } else {
return (target / 10000).toFixed(2) + '万' return (target / 10000).toFixed(2) + "万";
} }
} },
}, },
data() { data() {
return { return {
total: 0, total: 0,
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: 10 pageSize: 10,
}, },
total2: 0, total2: 0,
queryParams2: { queryParams2: {
pageNum: 1, pageNum: 1,
pageSize: 10 pageSize: 10,
}, },
loading: true, loading: true,
// //
@ -287,35 +280,35 @@ export default {
dangerTime: null, dangerTime: null,
dangerCurrentIndex: 0, dangerCurrentIndex: 0,
threeStatistics: { threeStatistics: {
options: ['属地通报', '部门通报'] options: ["属地通报", "部门通报"],
}, },
trouble: { options: ['最新隐患', '通报处置'] }, trouble: { options: ["最新隐患", "通报处置"] },
// //
safetyList: [ safetyList: [
{ {
title: '敏感信息泄露漏洞', title: "敏感信息泄露漏洞",
value: 86800 value: 86800,
}, },
{ {
title: '权限许可和访问控制', title: "权限许可和访问控制",
value: 23800 value: 23800,
}, },
{ {
title: '未加密登录请求', title: "未加密登录请求",
value: 15200 value: 15200,
}, },
{ {
title: '其他', title: "其他",
value: 14700 value: 14700,
}, },
{ {
title: '应用程序测试脚本漏洞', title: "应用程序测试脚本漏洞",
value: 2142 value: 2142,
}, },
{ {
title: '文件上传漏洞', title: "文件上传漏洞",
value: 1525 value: 1525,
} },
], ],
// //
notificationFinishList: [ notificationFinishList: [
@ -323,32 +316,32 @@ export default {
timeRangeFlag: 1, timeRangeFlag: 1,
notificationCount: 59, notificationCount: 59,
completionCount: 59, completionCount: 59,
completionPercent: `100%` completionPercent: `100%`,
}, },
{ {
timeRangeFlag: 2, timeRangeFlag: 2,
notificationCount: 92, notificationCount: 92,
completionCount: 92, completionCount: 92,
completionPercent: `100%` completionPercent: `100%`,
}, },
{ {
timeRangeFlag: 3, timeRangeFlag: 3,
notificationCount: 108, notificationCount: 108,
completionCount: 108, completionCount: 108,
completionPercent: `100%` completionPercent: `100%`,
}, },
{ {
timeRangeFlag: 4, timeRangeFlag: 4,
notificationCount: 170, notificationCount: 170,
completionCount: 170, completionCount: 170,
completionPercent: `100%` completionPercent: `100%`,
}, },
{ {
timeRangeFlag: 4, timeRangeFlag: 4,
notificationCount: 120, notificationCount: 120,
completionCount: 170, completionCount: 170,
completionPercent: `100%` completionPercent: `100%`,
} },
], ],
animate: true, animate: true,
positionTimer: null, positionTimer: null,
@ -361,24 +354,24 @@ export default {
dialogStatus: false, dialogStatus: false,
rowDta: {}, rowDta: {},
dialogDetails: false, dialogDetails: false,
dialogTitle: '', dialogTitle: "",
// //
fileExtension: '', fileExtension: "",
numPages: 1, numPages: 1,
pdfUrl: '' pdfUrl: "",
} };
}, },
computed: { computed: {
notificationStatus() { notificationStatus() {
return (flag) => { return (flag) => {
const myMap = new Map([ const myMap = new Map([
[1, '近一个月'], [1, "近一个月"],
[2, '近三个月'], [2, "近三个月"],
[3, '近六个月'], [3, "近六个月"],
[4, '近一年'] [4, "近一年"],
]) ]);
return myMap.get(flag) return myMap.get(flag);
} };
}, },
classOption() { classOption() {
return { return {
@ -389,37 +382,39 @@ export default {
openWatch: true, // dom openWatch: true, // dom
singleHeight: 0, // (0) direction => 0/1 singleHeight: 0, // (0) direction => 0/1
singleWidth: 0, // (0) direction => 2/3 singleWidth: 0, // (0) direction => 2/3
waitTime: 1000 // (1000ms) waitTime: 1000, // (1000ms)
} };
} },
}, },
created() {}, created() {},
destroyed() { destroyed() {
clearInterval(this.announceTime) clearInterval(this.announceTime);
clearInterval(this.dangerTime) clearInterval(this.dangerTime);
clearInterval(this.dangerListTime) clearInterval(this.dangerListTime);
clearInterval(this.tbTime) clearInterval(this.tbTime);
}, },
mounted() { mounted() {
this.dangerChange() this.dangerChange();
this.getListDanger() this.getListDanger();
this.dangerListTime = setInterval(() => { // this.dangerListTime = setInterval(() => {
//
if (this.dangerList.length >= this.total) { if (this.dangerList.length >= this.total) {
clearInterval(this.dangerListTime) clearInterval(this.dangerListTime);
} else { } else {
this.queryParams.pageNum = this.queryParams.pageNum + 1 this.queryParams.pageNum = this.queryParams.pageNum + 1;
this.getListDanger() this.getListDanger();
} }
}, 6000) }, 6000);
this.getlistTb() this.getlistTb();
this.tbTime = setInterval(() => { // this.tbTime = setInterval(() => {
//
if (this.informList.length >= this.total2) { if (this.informList.length >= this.total2) {
clearInterval(this.tbTime) clearInterval(this.tbTime);
} else { } else {
this.queryParams2.pageNum = this.queryParams2.pageNum + 1 this.queryParams2.pageNum = this.queryParams2.pageNum + 1;
this.getlistTb() this.getlistTb();
} }
}, 6000) }, 6000);
// this.announceChange() // this.announceChange()
// getSafeHazardSatistic().then((res) => { // getSafeHazardSatistic().then((res) => {
@ -445,85 +440,113 @@ export default {
* 最新隐患 * 最新隐患
*/ */
getListDanger() { getListDanger() {
listDanger(this.queryParams).then(res => { listDanger(this.queryParams).then((res) => {
this.dangerList = [...this.dangerList, ...res.rows] this.dangerList = [...this.dangerList, ...res.rows];
this.total = res.total this.total = res.total;
}) });
}, },
/** /**
* 通报处置 * 通报处置
*/ */
getlistTb() { getlistTb() {
listTb(this.queryParams2).then(res => { listTb(this.queryParams2).then((res) => {
console.log(res, 'www') console.log(res, "www");
this.informList = [...this.informList, ...res.rows] this.informList = [...this.informList, ...res.rows];
this.total2 = res.total this.total2 = res.total;
}) });
}, },
// //
mouseOver(status) { mouseOver(status) {
if (status === 'danger') { if (status === "danger") {
clearInterval(this.dangerTime) clearInterval(this.dangerTime);
} else { } else {
clearInterval(this.announceTime) clearInterval(this.announceTime);
} }
}, },
// //
mouseLeave(status) { mouseLeave(status) {
if (status === 'danger') { if (status === "danger") {
this.dangerChange() this.dangerChange();
} else { } else {
this.announceChange() this.announceChange();
} }
}, },
// //
loadList() { loadList() {
this.animate = true this.animate = true;
setTimeout(() => { setTimeout(() => {
this.dangerList.push(this.dangerList[0]) this.dangerList.push(this.dangerList[0]);
this.dangerList.shift() this.dangerList.shift();
this.animate = false this.animate = false;
}, 1000) }, 1000);
}, },
// //
loadList2() { loadList2() {
this.animate = true this.animate = true;
setTimeout(() => { setTimeout(() => {
this.informList.push(this.informList[0]) this.informList.push(this.informList[0]);
this.informList.shift() this.informList.shift();
this.animate2 = false this.animate2 = false;
}, 1000) }, 1000);
}, },
// //
announceChange() { announceChange() {
this.announceTime = setInterval(() => { this.announceTime = setInterval(() => {
this.announceCurrentIndex === 0 this.announceCurrentIndex === 0
? (this.announceCurrentIndex = 1) ? (this.announceCurrentIndex = 1)
: (this.announceCurrentIndex = 0) : (this.announceCurrentIndex = 0);
}, 11000) }, 11000);
}, },
// //
dangerChange() { dangerChange() {
this.dangerTime = setInterval(() => { this.dangerTime = setInterval(() => {
this.dangerCurrentIndex === 0 this.dangerCurrentIndex === 0
? (this.dangerCurrentIndex = 1) ? (this.dangerCurrentIndex = 1)
: (this.dangerCurrentIndex = 0) : (this.dangerCurrentIndex = 0);
}, 11000) }, 11000);
}, },
rowClick(row) { rowClick(row) {
this.rowDta = row this.rowDta = row;
this.dialogStatus = true this.dialogStatus = true;
}, },
rowDetails(e) { rowDetails(e) {
const row = JSON.parse(e.target.dataset.obj) if(!e.target.dataset.url) return
this.dialogTitle = row?.name || row?.systemName this.fileExtension = e.target.dataset.url.substring(
if (this.dangerCurrentIndex === 0) { e.target.dataset.url.lastIndexOf(".") + 1
row.url = `/网信办大屏内容文档/网络安全/最新隐患/网络和信息安全通报-2023年第${row.issue}期 总第${row.totalNum}期(${row.systemName}.pdf` );
} else {
row.url = `/网信办大屏内容文档/网络安全/通报处置/${row.url}` console.log(this.fileExtension)
if (this.fileExtension == "pdf") {
this.pdfUrl = process.env.VUE_APP_BASE_API2 +e.target.dataset.url;
console.log(this.pdfUrl,'aaa')
this.dialogDetails = true;
} else if (
this.fileExtension === "docx" ||
this.fileExtension === "doc"
) {
axios({
method: "get",
responseType: "blob", //
url: process.env.VUE_APP_BASE_API2 + e.target.dataset.url,
}).then(({ data }) => {
if (data) {
this.dialogDetails = true;
this.$nextTick(() => {
docx.renderAsync(data, this.$refs.file1); //
});
}
});
} }
console.log(row, 'aaa')
this.dialogDetails = true // const row = JSON.parse(e.target.dataset.obj)
// this.dialogTitle = row?.name || row?.systemName
// if (this.dangerCurrentIndex === 0) {
// row.url = `////-2023${row.issue} ${row.totalNum}${row.systemName}.pdf`
// } else {
// row.url = `////${row.url}`
// }
// console.log(row, 'aaa')
// this.dialogDetails = true
// this.fileExtension = row.url.substring(row.url.lastIndexOf('.') + 1) // this.fileExtension = row.url.substring(row.url.lastIndexOf('.') + 1)
// if (this.fileExtension === 'docx' || this.fileExtension === 'doc') { // if (this.fileExtension === 'docx' || this.fileExtension === 'doc') {
@ -555,66 +578,66 @@ export default {
}, },
getNumPages(url) { getNumPages(url) {
axios({ axios({
method: 'GET', method: "GET",
url: url, // url: url, //
paramsSerializer: function(params) { paramsSerializer: function (params) {
return qs.stringify(params, { arrayFormat: 'brackets' }) return qs.stringify(params, { arrayFormat: "brackets" });
}, },
headers: { headers: {
'Content-Type': "Content-Type":
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
}, },
responseType: 'blob' responseType: "blob",
}) })
.then((response) => { .then((response) => {
this.pdfUrl = this.getObjectURL(response.data) this.pdfUrl = this.getObjectURL(response.data);
const loadingTask = pdf.createLoadingTask(this.pdfUrl) const loadingTask = pdf.createLoadingTask(this.pdfUrl);
loadingTask.promise loadingTask.promise
.then((pdf) => { .then((pdf) => {
this.numPages = 1 this.numPages = 1;
setInterval(() => { setInterval(() => {
if (pdf.numPages > this.numPages) { if (pdf.numPages > this.numPages) {
this.numPages++ this.numPages++;
this.$forceUpdate() this.$forceUpdate();
} else { } else {
clearInterval() clearInterval();
} }
}, 2000) }, 2000);
this.dialogDetails = true this.dialogDetails = true;
}) })
.catch((err) => { .catch((err) => {
console.error('pdf 加载失败', err) console.error("pdf 加载失败", err);
}) });
}) })
.catch((error) => { .catch((error) => {
this.$message.error('' + error) this.$message.error("" + error);
}) });
}, },
// url // url
getObjectURL(file) { getObjectURL(file) {
let url = null let url = null;
if (window.createObjectURL !== undefined) { if (window.createObjectURL !== undefined) {
// basic // basic
url = window.createObjectURL(file) url = window.createObjectURL(file);
} else if (window.webkitURL !== undefined) { } else if (window.webkitURL !== undefined) {
// webkit or chrome // webkit or chrome
try { try {
url = window.webkitURL.createObjectURL(file) url = window.webkitURL.createObjectURL(file);
} catch (error) { } catch (error) {
console.log(error) console.log(error);
} }
} else if (window.URL !== undefined) { } else if (window.URL !== undefined) {
// mozilla(firefox) // mozilla(firefox)
try { try {
url = window.URL.createObjectURL(file) url = window.URL.createObjectURL(file);
} catch (error) { } catch (error) {
console.log(error) console.log(error);
} }
} }
return url return url;
} },
} },
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -1210,4 +1233,7 @@ export default {
.file-content .docx p { .file-content .docx p {
text-align: center !important; text-align: center !important;
} }
.docx{
padding: 104pt 90pt !important;
}
</style> </style>

Loading…
Cancel
Save