suzhou-jichuang-lanhai
/
taicangZongzhi
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

安全监测事件修复

Browse Source
lijinlong
许宏杰 1 year ago
parent 4431427b0c
commit 2d428ffb26
3 changed files with 354 additions and 1593 deletions
Show Stats Download Patch File Download Diff File

1259
src/views/privateOrder/security/components/componentLeft copy.vue
View File

File diff suppressed because it is too large Load Diff

455
src/views/privateOrder/security/components/componentLeft.vue
Unescape View File

@ -29,7 +29,8 @@
transform: translate(5px, -7px);
"
>
/</span>
/</span
>
<span class="content-total">{{ item.total }}</span>
</div>
</div>
@ -40,11 +41,11 @@
v-for="(item, idx) in dataSource.bottom"
:key="idx"
class="section-bottom-item"
@click="showAttack(item.title,item.num)"
@click="showAttack(item.title, item.num)"
>
<img :src="item.url" alt="" />
<span class="bottom-title">{{ item.title }}</span>
<span class="bottom-num">{{ item.num |commaFilter }}</span>
<span class="bottom-num">{{ item.num | commaFilter }}</span>
</div>
</div>
</div>
@ -57,12 +58,15 @@
v-for="(item, idx) in superviseObject"
:key="idx"
:class="['section-object-item', item.className]"
@click="showAttack(item.title,item.num)"
@click="showAttack(item.title, item.num)"
>
<img :src="item.url" alt="" />
<div class="item-content">
<span class="item-content-title">{{ item.title }}</span><br />
<span class="item-content-num">{{ item.num | commaFilter }}</span>
<span class="item-content-title">{{ item.title }}</span
><br />
<span class="item-content-num">{{
item.num | commaFilter
}}</span>
</div>
</div>
<div class="section-center" />
@ -84,7 +88,7 @@
<div class="monitor-detail">
<div
v-for="(item, index) in securityMonitor.detail"
v-show="index<3"
v-show="index < 3"
:key="index"
class="monitor-detail-item"
>
@ -100,6 +104,7 @@
<span>攻击源/IP</span>
<span>攻击类型</span>
</div>
<div @click="getAttackSource($event)">
<vue-seamless-scroll
:data="tableData"
:class-option="classOption"
@ -109,18 +114,19 @@
v-for="(item, idx) in tableData"
:key="idx"
class="monitor-list"
:data-obj="'安全监测'"
@click="getAttackSource(item.id)"
>
<span>{{ item.attackTime }}</span>
<span>{{ item.attackedIp }}</span>
<span>{{ $filterDict('tc_attack_type',item.attackType) }}</span>
<span :data-id="item.id">{{ item.attackTime }}</span>
<span :data-id="item.id">{{ item.attackedIp }}</span>
<span :data-id="item.id">{{
$filterDict("tc_attack_type", item.attackType)
}}</span>
</div>
</vue-seamless-scroll>
</div>
</div>
</div>
</div>
</div>
<div
class="section-attackRanking"
@mouseover="mouseOver"
@ -178,7 +184,9 @@
<div class="dialog_little_title">攻击类型：</div>
</el-col>
<el-col :span="18">
<div class="dialog_little_ctn">{{ $filterDict('tc_attack_type',tableDataPop.attackType) }}</div>
<div class="dialog_little_ctn">
{{ $filterDict("tc_attack_type", tableDataPop.attackType) }}
</div>
</el-col>
</el-row>
<el-row>
@ -222,7 +230,9 @@
<div class="dialog_little_title">网站安全等级：</div>
</el-col>
<el-col :span="6">
<div class="dialog_little_ctn">{{ $filterDict('tc_net_safety_level',tableDataPop.level) }}</div>
<div class="dialog_little_ctn">
{{ $filterDict("tc_net_safety_level", tableDataPop.level) }}
</div>
</el-col>
<el-col :span="6">
<div class="dialog_little_title">联系电话：</div>
@ -262,10 +272,7 @@
dialogType === '软探针'
"
>
<MyTable
:table-list="excelData"
:table-key="excelDataHeader"
/>
<MyTable :table-list="excelData" :table-key="excelDataHeader" />
<div style="text-align: right; margin-top: 10px">
<paginations
v-show="total > 0"
@ -278,10 +285,9 @@
</template>
<span slot="footer" class="dialog-footer">
<span>
<el-button
class="dialog-btn"
@click="dialogStatus = false"
>关 闭</el-button>
<el-button class="dialog-btn" @click="dialogStatus = false"
>关 闭</el-button
>
</span>
</span>
</el-dialog>
@ -289,20 +295,28 @@
</template>
<script>
import { getSource } from '@/api/common'
import vueSeamlessScroll from 'vue-seamless-scroll'
import ModuleTitle from '../../common/ModuleTitle.vue'
import attackSituation from './attackSituation.vue'
import ExcelTable from '@/components/ExcelTable'
import { listSystem, listUnit, listWeb, listIDCunit, listSource, saftyscreenSupervise, saftyscreenSafety,
listDetection, getDetection
} from '@/api/zongzhi/st.js'
import { getSource } from "@/api/common";
import vueSeamlessScroll from "vue-seamless-scroll";
import ModuleTitle from "../../common/ModuleTitle.vue";
import attackSituation from "./attackSituation.vue";
import ExcelTable from "@/components/ExcelTable";
import {
listSystem,
listUnit,
listWeb,
listIDCunit,
listSource,
saftyscreenSupervise,
saftyscreenSafety,
listDetection,
getDetection,
} from "@/api/zongzhi/st.js";
import {
yingTanZhen,
yingTanZhenKeyValue,
xitongjiance,
xitongjianceKeyValue
} from './mock'
xitongjianceKeyValue,
} from "./mock";
import {
IDCKeyValue,
IDC,
@ -313,25 +327,25 @@ import {
zfdwKeyValue,
zfdw,
rtz,
rtzKeyValue
} from './jianGuan'
import { getLatest, getSecurity } from '@/api/common'
rtzKeyValue,
} from "./jianGuan";
import { getLatest, getSecurity } from "@/api/common";
export default {
components: {
attackSituation,
ModuleTitle,
vueSeamlessScroll,
ExcelTable
ExcelTable,
},
filters: {
commaFilter(target) {
if (target < 10000) {
return String(target).replace(/(\d)(?=(\d{3})+$)/g, '$1,')
return String(target).replace(/(\d)(?=(\d{3})+$)/g, "$1,");
} else {
return (target / 10000).toFixed(2) + '万'
}
return (target / 10000).toFixed(2) + "万";
}
},
},
data() {
return {
/**
@ -339,101 +353,101 @@ export default {
*/
queryParams: {
pageNum: 1,
pageSize: 10
pageSize: 10,
}, // 分页查询条件
total: 0, // 总数
time: null,
checkTotal: 0,
checkParams: {
pageNum: 1,
pageSize: 10
pageSize: 10,
},
//
dialogWidth: 0,
dialogStatus: false,
dialogType: '',
dialogType: "",
safeDialog: false,
attackTime: null,
tableTime: null,
tableTotal: 0,
currentIndex: 0,
attackList: {
options: ['受攻击IPTOP5', '分布情况']
options: ["受攻击IPTOP5", "分布情况"],
},
dataSource: {
top: [
{
title: '云端监测(G)',
title: "云端监测(G)",
currentNum: 100,
total: 150,
url: require('@/assets/privateOrder/general/icon-云端监测.png')
url: require("@/assets/privateOrder/general/icon-云端监测.png"),
},
{
title: 'APT(M)',
title: "APT(M)",
currentNum: 239,
total: 1000,
url: require('@/assets/privateOrder/general/icon-APT.png')
}
url: require("@/assets/privateOrder/general/icon-APT.png"),
},
],
bottom: [
{
title: '硬探针',
title: "硬探针",
num: 6,
url: require('@/assets/privateOrder/general/硬探针.png')
url: require("@/assets/privateOrder/general/硬探针.png"),
},
{
title: '软探针',
title: "软探针",
num: 125,
url: require('@/assets/privateOrder/general/软探针.png')
url: require("@/assets/privateOrder/general/软探针.png"),
},
{
title: '系统监测',
title: "系统监测",
num: 2658,
url: require('@/assets/privateOrder/general/系统监测.png')
}
]
url: require("@/assets/privateOrder/general/系统监测.png"),
},
],
},
superviseObject: [
{
title: '政府网站',
title: "政府网站",
num: 0,
className: 'item1',
url: require('@/assets/privateOrder/general/icon-政府网站.png')
className: "item1",
url: require("@/assets/privateOrder/general/icon-政府网站.png"),
},
{
title: '监管单位',
title: "监管单位",
num: 0,
className: 'item2',
url: require('@/assets/privateOrder/general/icon-监管单位.png')
className: "item2",
url: require("@/assets/privateOrder/general/icon-监管单位.png"),
},
{
title: '网站监测',
title: "网站监测",
num: 0,
className: 'item3',
url: require('@/assets/privateOrder/general/icon-网站监测.png')
className: "item3",
url: require("@/assets/privateOrder/general/icon-网站监测.png"),
},
{
title: 'IDC单位',
title: "IDC单位",
num: 0,
className: 'item4',
url: require('@/assets/privateOrder/general/icon-IDC单位.png')
className: "item4",
url: require("@/assets/privateOrder/general/icon-IDC单位.png"),
},
{
title: '等保系统',
title: "等保系统",
num: 0,
className: 'item5',
url: require('@/assets/privateOrder/general/icon-等保系统.png')
className: "item5",
url: require("@/assets/privateOrder/general/icon-等保系统.png"),
},
{
title: '等保单位',
title: "等保单位",
num: 0,
className: 'item6',
url: require('@/assets/privateOrder/general/icon-等保单位.png')
}
className: "item6",
url: require("@/assets/privateOrder/general/icon-等保单位.png"),
},
],
securityMonitor: {
url: require('@/assets/privateOrder/general/icon-网络攻击.png'),
title: '网络攻击(次)',
url: require("@/assets/privateOrder/general/icon-网络攻击.png"),
title: "网络攻击(次)",
total: 0,
detail: [
// {
@ -448,7 +462,7 @@ export default {
// title: '僵木蠕病毒',
// num: 796.152
// }
]
],
},
tableDataPop: {
// id: 1,
@ -492,8 +506,8 @@ export default {
// }
],
excelData: null,
excelDataHeader: null
}
excelDataHeader: null,
};
},
computed: {
classOption() {
@ -505,29 +519,30 @@ export default {
openWatch: true, // 开启数据实时监控刷新dom
singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
}
}
waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
};
},
},
created() {},
destroyed() {
clearInterval(this.attackTime) // 清除定时器
clearInterval(this.tableTime)
clearInterval(this.time)
clearInterval(this.attackTime); // 清除定时器
clearInterval(this.tableTime);
clearInterval(this.time);
},
mounted() {
this.changeBtn() // 切换
this.getSaftyscreenSupervise()
this.getSaftyscreenSafety()
this.getListDetection()
this.time = setInterval(() => { // 安全隐患列表
this.changeBtn(); // 切换
this.getSaftyscreenSupervise();
this.getSaftyscreenSafety();
this.getListDetection();
this.time = setInterval(() => {
// 安全隐患列表
if (this.tableData.length >= this.checkTotal) {
clearInterval(this.time)
clearInterval(this.time);
} else {
this.checkParams.pageNum = this.checkParams.pageNum + 1
this.getListDetection()
this.checkParams.pageNum = this.checkParams.pageNum + 1;
this.getListDetection();
}
}, 6000)
}, 6000);
// this.getDataSource() // 数据来源
// 左下角数据滚动
// getLatest().then((res) => {
@ -559,223 +574,231 @@ export default {
AttackClick(id) {
return new Promise((resolve) => {
getLatest().then((res) => {
res['T_LATEST_NEWS[]'].forEach((item) => {
res["T_LATEST_NEWS[]"].forEach((item) => {
if (item.id === id) {
this.tableDataPop.id = id
this.tableDataPop.attackTime = item.attack_time
this.tableDataPop.sourceIp = item.source_ip
this.tableDataPop.attackType = item.attack_type
this.tableDataPop.attackIpRegion = item.attack_ip_region
this.tableDataPop.attackedIp = item.attacked_ip
this.tableDataPop.attackedType = item.attacked_type
this.tableDataPop.webLevel = item.web_level
this.tableDataPop.subordinateDept = item.subordinate_dept
this.tableDataPop.attackedIpRegion = item.attacked_ip_region
this.tableDataPop.id = id;
this.tableDataPop.attackTime = item.attack_time;
this.tableDataPop.sourceIp = item.source_ip;
this.tableDataPop.attackType = item.attack_type;
this.tableDataPop.attackIpRegion = item.attack_ip_region;
this.tableDataPop.attackedIp = item.attacked_ip;
this.tableDataPop.attackedType = item.attacked_type;
this.tableDataPop.webLevel = item.web_level;
this.tableDataPop.subordinateDept = item.subordinate_dept;
this.tableDataPop.attackedIpRegion = item.attacked_ip_region;
item.contact_tel === undefined
? (this.tableDataPop.contactTel = '-')
: (this.tableDataPop.contactTel = item.contact_tel)
? (this.tableDataPop.contactTel = "-")
: (this.tableDataPop.contactTel = item.contact_tel);
item.contact_name === undefined
? (this.tableDataPop.contactName = '-')
: (this.tableDataPop.contactName = item.contact_name)
resolve()
? (this.tableDataPop.contactName = "-")
: (this.tableDataPop.contactName = item.contact_name);
resolve();
}
})
})
})
});
});
});
},
async getAttackSource(id) {
this.dialogWidth = '1000px'
getDetection(id).then(res => {
this.tableDataPop = res.data
this.dialogType = '安全监测'
this.dialogStatus = true
})
async getAttackSource(e) {
let id = e.target.dataset.id;
if (!id) return;
this.dialogWidth = "1000px";
getDetection(id).then((res) => {
this.tableDataPop = res.data;
this.dialogType = "安全监测";
this.dialogStatus = true;
});
// await this.AttackClick(id)
},
/**
* 安全监管List
*/
getListDetection() {
listDetection(this.checkParams).then(res => {
this.tableData = [...this.tableData, ...res.rows]
this.checkTotal = res.total
})
listDetection(this.checkParams).then((res) => {
this.tableData = [...this.tableData, ...res.rows];
this.checkTotal = res.total;
});
},
/**
* 安全监测攻击类型统计
*/
getSaftyscreenSafety() {
saftyscreenSafety().then(res => {
saftyscreenSafety().then((res) => {
this.securityMonitor.detail = res.data.list.map((item, index) => {
this.securityMonitor.total = this.securityMonitor.total + item.count
this.securityMonitor.total = this.securityMonitor.total + item.count;
return {
title: this.$filterDict('tc_attack_type', item.attackType),
num: item.count
}
})
})
title: this.$filterDict("tc_attack_type", item.attackType),
num: item.count,
};
});
});
},
/**
* 监管对象各类别统计量
*/
getSaftyscreenSupervise() {
saftyscreenSupervise().then(res => {
saftyscreenSupervise().then((res) => {
// this.superviseObject[4].num = res.data.
res.data.forEach(item => {
this.superviseObject.forEach(it => {
res.data.forEach((item) => {
this.superviseObject.forEach((it) => {
if (item.name == it.title) {
it.num = item.count
it.num = item.count;
}
})
})
console.log(res, 'aaa')
})
});
});
console.log(res, "aaa");
});
},
/**
* 表格参数重置
* */
reset() {
this.total = 0
this.total = 0;
this.queryParams = {
pageNum: 1,
pageSize: 10
}
this.excelData = []
this.excelDataHeader = []
pageSize: 10,
};
this.excelData = [];
this.excelDataHeader = [];
},
/**
* 等保系统
*/
getDbSteam() {
listSystem(this.queryParams).then(res => {
this.excelData = res.rows
this.excelDataHeader = dbxtKeyValue
this.total = res.total
})
listSystem(this.queryParams).then((res) => {
this.excelData = res.rows;
this.excelDataHeader = dbxtKeyValue;
this.total = res.total;
});
},
/**
* 等保单位
*/
getDbUnit() {
listUnit(this.queryParams).then(res => {
this.excelData = res.rows
this.excelDataHeader = dbdwKeyValue
this.total = res.total
})
listUnit(this.queryParams).then((res) => {
this.excelData = res.rows;
this.excelDataHeader = dbdwKeyValue;
this.total = res.total;
});
},
/**
* 政府网站
*/
getZfWeb() {
listWeb(this.queryParams).then(res => {
this.excelData = res.rows
this.excelDataHeader = zfdwKeyValue
this.total = res.total
})
listWeb(this.queryParams).then((res) => {
this.excelData = res.rows;
this.excelDataHeader = zfdwKeyValue;
this.total = res.total;
});
},
/**
* IDC单位
*/
getIdcUnit() {
listIDCunit(this.queryParams).then(res => {
this.excelData = res.rows
this.excelDataHeader = IDCKeyValue
this.total = res.total
})
listIDCunit(this.queryParams).then((res) => {
this.excelData = res.rows;
this.excelDataHeader = IDCKeyValue;
this.total = res.total;
});
},
/**
* 监管单位 || 网站监测 || 系统监测
*/
getJgUnit() {
listSource(this.queryParams).then(res => {
this.excelData = res.rows
this.excelDataHeader = xitongjianceKeyValue
this.total = res.total
})
listSource(this.queryParams).then((res) => {
this.excelData = res.rows;
this.excelDataHeader = xitongjianceKeyValue;
this.total = res.total;
});
},
showAttack(item = '安全监测', total) {
if (typeof item === 'object') {
showAttack(item = "安全监测", total) {
if (typeof item === "object") {
//
} else {
this.reset()
this.dialogType = item
this.reset();
this.dialogType = item;
}
if (this.dialogType === '等保系统') {
this.dialogWidth = '4000px'
this.getDbSteam()
}
if (this.dialogType === '等保单位') {
this.dialogWidth = '4000px'
this.getDbUnit()
}
if (this.dialogType === '政府网站') {
this.dialogWidth = '1800px'
this.getZfWeb()
}
if (this.dialogType === 'IDC单位') {
this.dialogWidth = '1800px'
this.getIdcUnit()
}
if (this.dialogType === '监管单位' || this.dialogType === '系统监测' || this.dialogType === '网站监测' || this.dialogType === '软探针' || this.dialogType === '硬探针') {
this.dialogWidth = '2100px'
if (this.dialogType === '软探针') {
this.queryParams.type = 4
} else if (this.dialogType === '硬探针') {
this.queryParams.type = 3
} else if (this.dialogType === '监管单位') {
this.queryParams.type = 5
} else if (this.dialogType === '网站监测') {
this.queryParams.type = 6
if (this.dialogType === "等保系统") {
this.dialogWidth = "4000px";
this.getDbSteam();
}
if (this.dialogType === "等保单位") {
this.dialogWidth = "4000px";
this.getDbUnit();
}
if (this.dialogType === "政府网站") {
this.dialogWidth = "1800px";
this.getZfWeb();
}
if (this.dialogType === "IDC单位") {
this.dialogWidth = "1800px";
this.getIdcUnit();
}
if (
this.dialogType === "监管单位" ||
this.dialogType === "系统监测" ||
this.dialogType === "网站监测" ||
this.dialogType === "软探针" ||
this.dialogType === "硬探针"
) {
this.dialogWidth = "2100px";
if (this.dialogType === "软探针") {
this.queryParams.type = 4;
} else if (this.dialogType === "硬探针") {
this.queryParams.type = 3;
} else if (this.dialogType === "监管单位") {
this.queryParams.type = 5;
} else if (this.dialogType === "网站监测") {
this.queryParams.type = 6;
} else {
this.queryParams.type = 7
this.queryParams.type = 7;
}
this.getJgUnit()
this.getJgUnit();
}
this.$nextTick(() => {
this.dialogStatus = true
})
this.dialogStatus = true;
});
},
// 数据来源数据获取
getDataSource() {
getSource(9).then((res) => {
const data = JSON.parse(res['[]'][0].T_static_data.DATA)
const data = JSON.parse(res["[]"][0].T_static_data.DATA);
for (let i = 0; i < data.top.length; i++) {
for (let j = 0; j < this.dataSource.top.length; j++) {
if (data.top[i].title === this.dataSource.top[j].title) {
this.dataSource.top[j].currentNum = data.top[i].currentNum
this.dataSource.top[j].total = data.top[i].total
this.dataSource.top[j].currentNum = data.top[i].currentNum;
this.dataSource.top[j].total = data.top[i].total;
}
}
}
for (let i = 0; i < data.bottom.length; i++) {
for (let j = 0; j < this.dataSource.bottom.length; j++) {
if (data.bottom[i].title === this.dataSource.bottom[j].title) {
this.dataSource.bottom[j].num = data.bottom[i].num
this.dataSource.bottom[j].num = data.bottom[i].num;
}
}
}
})
});
},
// 鼠标经过暂停
mouseOver() {
clearInterval(this.attackTime)
clearInterval(this.attackTime);
},
// 鼠标离开开启
mouseLeave() {
this.changeBtn()
this.changeBtn();
},
// 受攻击情况自动切换
changeBtn() {
this.attackTime = setInterval(() => {
this.currentIndex === 0
? (this.currentIndex = 1)
: (this.currentIndex = 0)
}, 11000)
}
}
}
: (this.currentIndex = 0);
}, 11000);
},
},
};
</script>
<style lang="scss" scoped>

13
src/views/privateOrder/security/components/componentRight.vue
Unescape View File

@ -120,9 +120,9 @@
>
<span :data-url="item.fileUrl">{{ item.unitName }}</span>
<span>{{ item.riskName }}</span>
<span>{{ $filterDict("tc_yh_level", item.level) }}</span>
<span> {{ $filterDict("tc_yh_source", item.riskSource) }}</span>
<span :data-url="item.fileUrl">{{ item.riskName }}</span>
<span :data-url="item.fileUrl">{{ $filterDict("tc_yh_level", item.level) }}</span>
<span :data-url="item.fileUrl"> {{ $filterDict("tc_yh_source", item.riskSource) }}</span>
</div>
</vue-seamless-scroll>
</div>
@ -150,10 +150,10 @@
<div class="item_name" :data-url="item.fileUrl">
{{ item.depName }}
</div>
<div class="item_ip" >
<div class="item_ip" :data-url="item.fileUrl">
{{ item.ip }}
</div>
<span class="item_num" >{{
<span class="item_num" :data-url="item.fileUrl">{{
$filterDict("tc_steam_state", item.state)
}}</span>
</div>
@ -514,11 +514,8 @@ export default {
this.fileExtension = e.target.dataset.url.substring(
e.target.dataset.url.lastIndexOf(".") + 1
);
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" ||

Write Preview
Loading…
Cancel
Save