1237 lines
36 KiB
Plaintext
1237 lines
36 KiB
Plaintext
|
webpackJsonp([28],{
|
|||
|
|
|||
|
/***/ "7gAJ":
|
|||
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|||
|
|
|||
|
"use strict";
|
|||
|
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
|
|||
|
|
|||
|
// EXTERNAL MODULE: ./node_modules/echarts/map/js/world.js
|
|||
|
var world = __webpack_require__("9OQl");
|
|||
|
var world_default = /*#__PURE__*/__webpack_require__.n(world);
|
|||
|
|
|||
|
// EXTERNAL MODULE: ./src/components/Pagination.vue + 2 modules
|
|||
|
var Pagination = __webpack_require__("cMGX");
|
|||
|
|
|||
|
// EXTERNAL MODULE: ./src/components/BarChart.vue + 2 modules
|
|||
|
var BarChart = __webpack_require__("2u/A");
|
|||
|
|
|||
|
// EXTERNAL MODULE: ./node_modules/echarts/map/js/china.js
|
|||
|
var china = __webpack_require__("Bhwq");
|
|||
|
var china_default = /*#__PURE__*/__webpack_require__.n(china);
|
|||
|
|
|||
|
// EXTERNAL MODULE: ./node_modules/vuex/dist/vuex.esm.js
|
|||
|
var vuex_esm = __webpack_require__("NYxO");
|
|||
|
|
|||
|
// EXTERNAL MODULE: ./src/common/meta.js
|
|||
|
var meta = __webpack_require__("BoBM");
|
|||
|
|
|||
|
// CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/pages/count/OverView.vue
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
//
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
|
|||
|
/* harmony default export */ var OverView = ({
|
|||
|
components: {
|
|||
|
BarChart: BarChart["a" /* default */],
|
|||
|
Pagination: Pagination["a" /* default */]
|
|||
|
},
|
|||
|
data: function data() {
|
|||
|
return {
|
|||
|
/*topTitle:this.global.getFunLimit().topTitle,
|
|||
|
province:this.global.getRoleLimit().province,
|
|||
|
totalAlertCount: this.global.getRoleLimit().totalAlertCount,
|
|||
|
insertCount: this.global.getRoleLimit().insertCount,
|
|||
|
top10Admin: this.global.getRoleLimit().top10Admin,
|
|||
|
underAttackArea: this.global.getRoleLimit().underAttackArea,
|
|||
|
adminName: this.global.getRoleLimit().adminName,*/
|
|||
|
props: { multiple: true },
|
|||
|
time: '',
|
|||
|
allwebsites: '0',
|
|||
|
allaccess: '0',
|
|||
|
allintercepts: '0',
|
|||
|
websites: '0',
|
|||
|
uAttackWebsites: '0',
|
|||
|
access: '0',
|
|||
|
warnings: '0',
|
|||
|
intercepts: '0',
|
|||
|
areaList: [],
|
|||
|
areaInfo: [],
|
|||
|
mapShow: '0',
|
|||
|
mapData: [],
|
|||
|
wmapData: [],
|
|||
|
maxAttack: 500,
|
|||
|
maxWAttack: 500,
|
|||
|
attacks: [],
|
|||
|
newAttact: [],
|
|||
|
isSearch: false,
|
|||
|
qgCode: "A001B001",
|
|||
|
screenWidth: document.body.clientWidth,
|
|||
|
pickerOptions2: {
|
|||
|
disabledDate: function disabledDate(time) {
|
|||
|
return time.getTime() > Date.now();
|
|||
|
},
|
|||
|
|
|||
|
shortcuts: [{
|
|||
|
text: '1天',
|
|||
|
onClick: function onClick(picker) {
|
|||
|
var end = new Date();
|
|||
|
var start = new Date();
|
|||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 0);
|
|||
|
picker.$emit('pick', [start, end]);
|
|||
|
}
|
|||
|
}, {
|
|||
|
text: '7天',
|
|||
|
onClick: function onClick(picker) {
|
|||
|
var end = new Date();
|
|||
|
var start = new Date();
|
|||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
|
|||
|
picker.$emit('pick', [start, end]);
|
|||
|
}
|
|||
|
}, {
|
|||
|
text: '30天',
|
|||
|
onClick: function onClick(picker) {
|
|||
|
var end = new Date();
|
|||
|
var start = new Date();
|
|||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 29);
|
|||
|
picker.$emit('pick', [start, end]);
|
|||
|
}
|
|||
|
}]
|
|||
|
},
|
|||
|
topTen: [],
|
|||
|
accessRank: [],
|
|||
|
warnRank: [],
|
|||
|
interceptRank: [],
|
|||
|
urlRank: [],
|
|||
|
URL: {
|
|||
|
getAreaList: '/website/rest/queryArea',
|
|||
|
getSuperData: '/rest/admin/summary',
|
|||
|
getAllCount: '/rest/total/summary',
|
|||
|
getSuperContacts: '/rest/admin/attacklog',
|
|||
|
getProvinceData: '/rest/area/summary',
|
|||
|
getProvinceContacts: '/rest/area/attacklog',
|
|||
|
getMapUnder: '/rest/hotspot/underAttack',
|
|||
|
getMap: '/rest/hotspot/attack'
|
|||
|
}
|
|||
|
};
|
|||
|
},
|
|||
|
|
|||
|
computed: Object(vuex_esm["b" /* mapState */])({
|
|||
|
contextPath: 'urlHost',
|
|||
|
active: 'active',
|
|||
|
roleAction: 'roleAction',
|
|||
|
myHeight: 'cdnConHeight'
|
|||
|
}),
|
|||
|
mounted: function mounted() {
|
|||
|
var that = this;
|
|||
|
window.addEventListener('resize', that.timeInitData);
|
|||
|
this.initData();
|
|||
|
},
|
|||
|
|
|||
|
methods: {
|
|||
|
timeInitData: function timeInitData() {
|
|||
|
var that = this;
|
|||
|
setTimeout(function () {
|
|||
|
that.chart = that.$echarts.init(that.$refs.insertWebsite);
|
|||
|
that.chart.resize();
|
|||
|
that.mapchart = that.$echarts.init(that.$refs.map);
|
|||
|
that.mapchart.resize();
|
|||
|
}, 10);
|
|||
|
},
|
|||
|
initData: function initData() {
|
|||
|
this.getAllCount();
|
|||
|
if (this.roleAction.province) {
|
|||
|
//超级管理员
|
|||
|
this.getAreaList();
|
|||
|
} else {
|
|||
|
//管理员和普通用户
|
|||
|
this.getData();
|
|||
|
this.getContacts();
|
|||
|
}
|
|||
|
},
|
|||
|
proChange: function proChange(val) {
|
|||
|
if (val.length == 0) {
|
|||
|
for (var i = 0; i < this.areaList.length; i++) {
|
|||
|
if (this.areaList[i].disabled == true || this.areaList[i].disabled == undefined) {
|
|||
|
this.areaList[i].disabled = false;
|
|||
|
}
|
|||
|
}
|
|||
|
} else {
|
|||
|
if (val.indexOf(this.qgCode) != -1) {
|
|||
|
for (var i = 1; i < this.areaList.length; i++) {
|
|||
|
this.areaList[i].disabled = true;
|
|||
|
}
|
|||
|
} else {
|
|||
|
this.areaList[0].disabled = true;
|
|||
|
for (var i = 1; i < this.areaList.length; i++) {
|
|||
|
this.areaList[i].disabled = false;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
getAreaList: function getAreaList() {
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'get',
|
|||
|
url: that.contextPath + that.URL.getAreaList + "?type=QUERY",
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
that.areaList = res || [];
|
|||
|
if (that.areaInfo.length == 0) {
|
|||
|
that.areaInfo.push(res[0].value);
|
|||
|
}
|
|||
|
for (var i = 1; i < that.areaList.length; i++) {
|
|||
|
that.areaList[i].disabled = true;
|
|||
|
}
|
|||
|
that.getSuperData();
|
|||
|
that.getSuperContacts();
|
|||
|
that.getMapData();
|
|||
|
});
|
|||
|
},
|
|||
|
getAllCount: function getAllCount() {
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'post',
|
|||
|
url: that.contextPath + that.URL.getAllCount,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
that.allwebsites = res.totalsum.websites;
|
|||
|
that.allaccess = res.totalsum.access;
|
|||
|
that.allintercepts = res.totalsum.intercepts;
|
|||
|
});
|
|||
|
},
|
|||
|
getSuperData: function getSuperData() {
|
|||
|
if (this.time == undefined) {
|
|||
|
this.time = '';
|
|||
|
}
|
|||
|
var formData = this.$qs.stringify({
|
|||
|
start: this.time[0],
|
|||
|
end: this.time[1],
|
|||
|
areaCode: this.areaInfo.toString()
|
|||
|
});
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'post',
|
|||
|
url: that.contextPath + that.URL.getSuperData,
|
|||
|
data: formData,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
var accessSum = 0;
|
|||
|
var warnSum = 0;
|
|||
|
var interceptSum = 0;
|
|||
|
var urlSum = 0;
|
|||
|
that.websites = res.sum.websites;
|
|||
|
that.access = res.sum.access;
|
|||
|
that.warnings = res.sum.warnings || that.warnings;
|
|||
|
that.intercepts = res.sum.intercepts;
|
|||
|
that.uAttackWebsites = res.sum.attacks;
|
|||
|
for (var i = 0; i < 10; i++) {
|
|||
|
if (res.accessRank[i] != null) {
|
|||
|
accessSum += res.accessRank[i].value;
|
|||
|
}
|
|||
|
if (res.warnRank && res.warnRank[i] != null) {
|
|||
|
warnSum += res.warnRank[i].value;
|
|||
|
}
|
|||
|
if (res.interceptRank[i] != null) {
|
|||
|
interceptSum += res.interceptRank[i].value;
|
|||
|
}
|
|||
|
if (res.urlRank[i] != null) {
|
|||
|
urlSum += res.urlRank[i].value;
|
|||
|
}
|
|||
|
}
|
|||
|
for (var j = 0; j < 10; j++) {
|
|||
|
if (res.accessRank[j] != null) {
|
|||
|
res.accessRank[j].perWidth = res.accessRank[j].value / accessSum * 100 + "%";
|
|||
|
res.accessRank[j].colors = '#26CBDB';
|
|||
|
}
|
|||
|
if (res.warnRank && res.warnRank[j] != null) {
|
|||
|
res.warnRank[j].perWidth = res.warnRank[j].value / warnSum * 100 + "%";
|
|||
|
res.warnRank[j].colors = '#15BAFA';
|
|||
|
}
|
|||
|
if (res.interceptRank[j] != null) {
|
|||
|
res.interceptRank[j].perWidth = res.interceptRank[j].value / interceptSum * 100 + "%";
|
|||
|
res.interceptRank[j].colors = '#15BAFA';
|
|||
|
}
|
|||
|
if (res.urlRank[j] != null) {
|
|||
|
res.urlRank[j].perWidth = res.urlRank[j].value / urlSum * 100 + "%";
|
|||
|
res.urlRank[j].colors = '#6A5BE5';
|
|||
|
}
|
|||
|
}
|
|||
|
that.accessRank = res.accessRank;
|
|||
|
that.warnRank = res.warnRank;
|
|||
|
that.urlRank = res.urlRank;
|
|||
|
var dataX = [];
|
|||
|
var dataY = [];
|
|||
|
if (res.websiteCount != null) {
|
|||
|
for (var n = 0; n < res.websiteCount.length; n++) {
|
|||
|
dataX.push(res.websiteCount[n].name);
|
|||
|
dataY.push(res.websiteCount[n].value);
|
|||
|
}
|
|||
|
}
|
|||
|
that.interceptRank = res.interceptRank;
|
|||
|
that.topTen = res.top10;
|
|||
|
that.initTopTen();
|
|||
|
that.initBar(dataX, dataY);
|
|||
|
that.isSearch = false;
|
|||
|
});
|
|||
|
},
|
|||
|
getSuperContacts: function getSuperContacts() {
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'get',
|
|||
|
url: that.contextPath + that.URL.getSuperContacts,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
that.attacks = res;
|
|||
|
that.isSearch = false;
|
|||
|
});
|
|||
|
},
|
|||
|
getData: function getData() {
|
|||
|
if (!this.time) {
|
|||
|
this.time = '';
|
|||
|
}
|
|||
|
var formData = this.$qs.stringify({
|
|||
|
start: this.time[0],
|
|||
|
end: this.time[1]
|
|||
|
});
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'post',
|
|||
|
url: that.contextPath + that.URL.getProvinceData,
|
|||
|
data: formData,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
var accessSum = 0;
|
|||
|
var interceptSum = 0;
|
|||
|
var urlSum = 0;
|
|||
|
that.websites = res.sum.websites;
|
|||
|
that.access = res.sum.access;
|
|||
|
that.intercepts = res.sum.intercepts;
|
|||
|
that.uAttackWebsites = res.sum.attacks;
|
|||
|
for (var i = 0; i < 10; i++) {
|
|||
|
if (res.accessRank[i] != null) {
|
|||
|
accessSum += res.accessRank[i].value;
|
|||
|
}
|
|||
|
if (res.interceptRank[i] != null) {
|
|||
|
interceptSum += res.interceptRank[i].value;
|
|||
|
}
|
|||
|
if (res.urlRank[i] != null) {
|
|||
|
urlSum += res.urlRank[i].value;
|
|||
|
}
|
|||
|
}
|
|||
|
for (var j = 0; j < 10; j++) {
|
|||
|
if (res.accessRank[j] != null) {
|
|||
|
res.accessRank[j].perWidth = res.accessRank[j].value / accessSum * 100 + "%";
|
|||
|
res.accessRank[j].colors = '#26CBDB';
|
|||
|
}
|
|||
|
if (res.interceptRank[j] != null) {
|
|||
|
res.interceptRank[j].perWidth = res.interceptRank[j].value / interceptSum * 100 + "%";
|
|||
|
res.interceptRank[j].colors = '#15BAFA';
|
|||
|
}
|
|||
|
if (res.urlRank[j] != null) {
|
|||
|
res.urlRank[j].perWidth = res.urlRank[j].value / urlSum * 100 + "%";
|
|||
|
res.urlRank[j].colors = '#6A5BE5';
|
|||
|
}
|
|||
|
}
|
|||
|
that.accessRank = res.accessRank;
|
|||
|
that.interceptRank = res.interceptRank;
|
|||
|
that.urlRank = res.urlRank;
|
|||
|
that.topTen = res.top10;
|
|||
|
that.initTopTen();
|
|||
|
that.isSearch = false;
|
|||
|
});
|
|||
|
},
|
|||
|
getContacts: function getContacts() {
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'get',
|
|||
|
url: that.contextPath + that.URL.getProvinceContacts,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
that.attacks = res;
|
|||
|
});
|
|||
|
},
|
|||
|
initBar: function initBar(dataX, dataY) {
|
|||
|
var proBar = this.$echarts.init(document.getElementById('insertWebsite'));
|
|||
|
proBar.clear();
|
|||
|
var dataAxis = dataX;
|
|||
|
var data = dataY;
|
|||
|
var yMax = 500;
|
|||
|
var dataShadow = [];
|
|||
|
|
|||
|
for (var i = 0; i < data.length; i++) {
|
|||
|
dataShadow.push(yMax);
|
|||
|
}
|
|||
|
proBar.setOption({
|
|||
|
tooltip: {
|
|||
|
show: false
|
|||
|
},
|
|||
|
xAxis: {
|
|||
|
type: 'category',
|
|||
|
data: dataAxis,
|
|||
|
axisLabel: {
|
|||
|
color: "#7E899A"
|
|||
|
},
|
|||
|
axisTick: {
|
|||
|
show: false
|
|||
|
},
|
|||
|
axisLine: {
|
|||
|
lineStyle: {
|
|||
|
color: "#7E899A"
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
yAxis: {
|
|||
|
type: "value",
|
|||
|
axisLabel: {
|
|||
|
color: "#7E899A"
|
|||
|
},
|
|||
|
axisLine: {
|
|||
|
show: false
|
|||
|
},
|
|||
|
axisTick: {
|
|||
|
show: false
|
|||
|
},
|
|||
|
splitLine: {
|
|||
|
lineStyle: {
|
|||
|
width: 1,
|
|||
|
color: "#DFE6EC",
|
|||
|
type: "dashed"
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
grid: {
|
|||
|
left: "0",
|
|||
|
top: "20px",
|
|||
|
right: "0",
|
|||
|
bottom: "0",
|
|||
|
containLabel: true
|
|||
|
},
|
|||
|
dataZoom: [{
|
|||
|
type: 'inside'
|
|||
|
}],
|
|||
|
series: [{
|
|||
|
type: "bar",
|
|||
|
left: "10px",
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
show: true,
|
|||
|
position: "top",
|
|||
|
color: "#4AC5F9"
|
|||
|
}
|
|||
|
},
|
|||
|
barWidth: 8,
|
|||
|
itemStyle: {
|
|||
|
normal: {
|
|||
|
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{ offset: 0, color: "#35AFFF" }, { offset: 1, color: "#3571EB" }]),
|
|||
|
barBorderRadius: 10
|
|||
|
}
|
|||
|
},
|
|||
|
data: data
|
|||
|
}]
|
|||
|
});
|
|||
|
},
|
|||
|
initTopTen: function initTopTen() {
|
|||
|
var sumCountPie = this.$echarts.init(document.getElementById('top10'));
|
|||
|
var topName = [];
|
|||
|
var topData = this.topTen;
|
|||
|
for (var i = 0; i < topData.length; i++) {
|
|||
|
topName.push(topData[i].name);
|
|||
|
}
|
|||
|
var superOption = {
|
|||
|
color: ['#11C6FE', '#FFE43E', '#20B2A6', '#32DD76', '#AADD32', '#42A800', '#FFBF00', '#FF9632', '#C3029E', '#880EBB', '#1E5BD9'],
|
|||
|
tooltip: {
|
|||
|
position: function position(pos, params, dom, rect, size) {
|
|||
|
// 鼠标在左侧时 tooltip 显示到右侧,鼠标在右侧时 tooltip 显示到左侧。
|
|||
|
var obj = { top: 60 };
|
|||
|
obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 5;
|
|||
|
return obj;
|
|||
|
},
|
|||
|
trigger: 'item',
|
|||
|
formatter: "{a} <br/>{b}: {c} ({d}%)"
|
|||
|
},
|
|||
|
legend: {
|
|||
|
orient: 'vertical',
|
|||
|
icon: "circle",
|
|||
|
itemWidth: 10, // 图例图形宽度
|
|||
|
itemHeight: 10,
|
|||
|
top: 160,
|
|||
|
align: 'left',
|
|||
|
width: '100%',
|
|||
|
data: topName,
|
|||
|
formatter: function formatter(name) {
|
|||
|
return '{a|' + name + '}';
|
|||
|
},
|
|||
|
textStyle: {
|
|||
|
color: '#7E899A',
|
|||
|
rich: {
|
|||
|
a: {
|
|||
|
/*width: 100*/
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
series: [{
|
|||
|
name: '攻击类型',
|
|||
|
type: 'pie',
|
|||
|
radius: ['25%', '38%'],
|
|||
|
center: ['50%', '25%'],
|
|||
|
avoidLabelOverlap: false,
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
show: false,
|
|||
|
position: 'center'
|
|||
|
},
|
|||
|
emphasis: {
|
|||
|
show: false,
|
|||
|
textStyle: {
|
|||
|
fontSize: '15',
|
|||
|
fontWeight: 'bold'
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
labelLine: {
|
|||
|
normal: {
|
|||
|
show: false
|
|||
|
}
|
|||
|
},
|
|||
|
data: topData
|
|||
|
}]
|
|||
|
};
|
|||
|
var otherOption = {
|
|||
|
color: ['#11C6FE', '#FFE43E', '#20B2A6', '#32DD76', '#AADD32', '#42A800', '#FFBF00', '#FF9632', '#C3029E', '#880EBB', '#1E5BD9'],
|
|||
|
tooltip: {
|
|||
|
trigger: 'item',
|
|||
|
formatter: "{a} <br/>{b}: {c} ({d}%)"
|
|||
|
},
|
|||
|
legend: {
|
|||
|
orient: 'vertical',
|
|||
|
icon: "circle",
|
|||
|
left: '50%',
|
|||
|
top: '115',
|
|||
|
itemWidth: 10, // 图例图形宽度
|
|||
|
itemHeight: 10,
|
|||
|
height: 80,
|
|||
|
align: 'left',
|
|||
|
data: topName,
|
|||
|
formatter: function formatter(name) {
|
|||
|
return '{a|' + name + '}';
|
|||
|
},
|
|||
|
textStyle: {
|
|||
|
rich: {
|
|||
|
a: {
|
|||
|
width: 100,
|
|||
|
align: 'left'
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
toolbox: {
|
|||
|
x: 'right', // ¦ {number}(x坐标,单位px)
|
|||
|
y: 'top'
|
|||
|
},
|
|||
|
series: [{
|
|||
|
name: '攻击类型',
|
|||
|
type: 'pie',
|
|||
|
radius: ['35%', '55%'],
|
|||
|
center: ['25%', '50%'],
|
|||
|
avoidLabelOverlap: false,
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
show: false,
|
|||
|
position: 'center'
|
|||
|
},
|
|||
|
emphasis: {
|
|||
|
show: true,
|
|||
|
textStyle: {
|
|||
|
fontSize: '15',
|
|||
|
fontWeight: 'bold'
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
labelLine: {
|
|||
|
normal: {
|
|||
|
show: false
|
|||
|
}
|
|||
|
},
|
|||
|
data: topData
|
|||
|
}]
|
|||
|
};
|
|||
|
if (this.roleAction.adminName != "superAdmin") {
|
|||
|
sumCountPie.setOption(superOption);
|
|||
|
} else {
|
|||
|
sumCountPie.setOption(otherOption);
|
|||
|
}
|
|||
|
},
|
|||
|
search: function search() {
|
|||
|
this.isSearch = true;
|
|||
|
if (this.roleAction.adminName == "superAdmin" || this.roleAction.adminName == "QGAdmin") {
|
|||
|
//超级管理员
|
|||
|
this.getSuperData();
|
|||
|
this.getSuperContacts();
|
|||
|
this.getMapData();
|
|||
|
} else {
|
|||
|
//管理员和普通用户
|
|||
|
this.getData();
|
|||
|
this.getContacts();
|
|||
|
}
|
|||
|
},
|
|||
|
showMap: function showMap(val) {
|
|||
|
this.mapShow = val;
|
|||
|
if (val == '0') {
|
|||
|
this.getMapData();
|
|||
|
}
|
|||
|
if (val == '1') {
|
|||
|
this.getWmapData();
|
|||
|
}
|
|||
|
},
|
|||
|
getMapData: function getMapData() {
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'get',
|
|||
|
url: that.contextPath + that.URL.getMapUnder,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
that.mapData = res;
|
|||
|
if (res.length != 0) {
|
|||
|
that.maxAttack = res[0].value;
|
|||
|
}
|
|||
|
that.mapShow = '0';
|
|||
|
that.initChinaMap();
|
|||
|
});
|
|||
|
},
|
|||
|
getWmapData: function getWmapData() {
|
|||
|
var that = this;
|
|||
|
this.$axios({
|
|||
|
method: 'get',
|
|||
|
url: that.contextPath + that.URL.getMap,
|
|||
|
needInterceptors: true,
|
|||
|
showError: true,
|
|||
|
loader: true
|
|||
|
}).then(function (res) {
|
|||
|
/*if(res.current != null && JSON.stringify(res.current) != "{}"){
|
|||
|
that.newAttact.push(res.current);
|
|||
|
that.newAttact[0].value[2] = 1;
|
|||
|
}
|
|||
|
that.wmapData = res.total;*/
|
|||
|
that.wmapData = res.total;
|
|||
|
if (res.total.length != 0) {
|
|||
|
that.maxWAttack = res.total[0].value;
|
|||
|
}
|
|||
|
that.mapShow = '1';
|
|||
|
that.initWorldMap();
|
|||
|
});
|
|||
|
},
|
|||
|
initChinaMap: function initChinaMap() {
|
|||
|
var myMap = this.$echarts.init(document.getElementById('map'));
|
|||
|
myMap.clear();
|
|||
|
var mydata = this.mapData;
|
|||
|
var maxData = this.maxAttack;
|
|||
|
myMap.setOption({
|
|||
|
backgroundColor: '#D8EFF8',
|
|||
|
tooltip: {
|
|||
|
trigger: 'item',
|
|||
|
formatter: function formatter(params, ticket, callback) {
|
|||
|
if (params.data != '' || params.data != undefined) {
|
|||
|
return params.seriesName + '<br />' + params.data.name + ': ' + params.data.value;
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
//左侧小导航图标
|
|||
|
visualMap: {
|
|||
|
show: true,
|
|||
|
orient: 'vertical',
|
|||
|
calculable: true,
|
|||
|
inverse: false,
|
|||
|
hoverLink: false,
|
|||
|
align: "auto",
|
|||
|
min: 0,
|
|||
|
max: maxData,
|
|||
|
text: ['高', '低'],
|
|||
|
x: '20',
|
|||
|
bottom: '50',
|
|||
|
inRange: {
|
|||
|
color: ['#D8EFF8', '#34B1E1']
|
|||
|
}
|
|||
|
},
|
|||
|
series: [{
|
|||
|
name: '受攻击分布',
|
|||
|
type: 'map',
|
|||
|
mapType: 'china',
|
|||
|
roam: false,
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
show: false //省份名称
|
|||
|
},
|
|||
|
emphasis: {
|
|||
|
show: false
|
|||
|
}
|
|||
|
},
|
|||
|
data: mydata
|
|||
|
}]
|
|||
|
});
|
|||
|
},
|
|||
|
initWorldMap: function initWorldMap() {
|
|||
|
var myMap = this.$echarts.init(document.getElementById('map'));
|
|||
|
myMap.clear();
|
|||
|
var wmapData = this.wmapData;
|
|||
|
var maxWAttack = this.maxWAttack;
|
|||
|
myMap.setOption({
|
|||
|
backgroundColor: '#D8EFF8',
|
|||
|
tooltip: {
|
|||
|
trigger: 'item',
|
|||
|
formatter: function formatter(params, ticket, callback) {
|
|||
|
if (params.data != '' || params.data != undefined) {
|
|||
|
return params.seriesName + '<br />' + params.data.name + ': ' + params.data.value;
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
//左侧小导航图标
|
|||
|
visualMap: {
|
|||
|
show: true,
|
|||
|
orient: 'vertical',
|
|||
|
calculable: true,
|
|||
|
inverse: false,
|
|||
|
hoverLink: false,
|
|||
|
align: "auto",
|
|||
|
min: 0,
|
|||
|
max: maxWAttack,
|
|||
|
text: ['高', '低'],
|
|||
|
x: '20',
|
|||
|
bottom: '50',
|
|||
|
inRange: {
|
|||
|
color: ['#D8EFF8', '#34B1E1']
|
|||
|
}
|
|||
|
},
|
|||
|
series: [{
|
|||
|
name: '攻击源分布',
|
|||
|
type: 'map',
|
|||
|
mapType: 'world',
|
|||
|
roam: false,
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
show: false //省份名称
|
|||
|
},
|
|||
|
emphasis: {
|
|||
|
show: false
|
|||
|
}
|
|||
|
},
|
|||
|
data: wmapData,
|
|||
|
nameMap: meta["a" /* default */].CEname
|
|||
|
}]
|
|||
|
/*backgroundColor: '#404a59',
|
|||
|
tooltip : {
|
|||
|
trigger: 'item',
|
|||
|
formatter: function (params, ticket, callback) {
|
|||
|
return params.seriesName+'<br />'+params.data.name+': '+params.data.value[2];
|
|||
|
}
|
|||
|
},
|
|||
|
legend: {
|
|||
|
orient: 'vertical',
|
|||
|
y: 'bottom',
|
|||
|
x:'left',
|
|||
|
data:['攻击源分布'],
|
|||
|
textStyle: {
|
|||
|
color: '#fff'
|
|||
|
}
|
|||
|
},
|
|||
|
geo: {
|
|||
|
map: 'world',
|
|||
|
label: {
|
|||
|
emphasis: {
|
|||
|
show: false
|
|||
|
}
|
|||
|
},
|
|||
|
roam: true,
|
|||
|
itemStyle: {
|
|||
|
normal: {
|
|||
|
areaColor: '#323c48',
|
|||
|
borderColor: '#111'
|
|||
|
},
|
|||
|
emphasis: {
|
|||
|
areaColor: '#2a333d'
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
series : [
|
|||
|
{
|
|||
|
name: '攻击源分布',
|
|||
|
type: 'scatter',
|
|||
|
coordinateSystem: 'geo',
|
|||
|
data: convertData,
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
formatter: '{b}',
|
|||
|
position: 'right',
|
|||
|
show: false
|
|||
|
},
|
|||
|
emphasis: {
|
|||
|
show: true
|
|||
|
}
|
|||
|
},
|
|||
|
itemStyle: {
|
|||
|
normal: {
|
|||
|
color: '#ddb926'
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
{
|
|||
|
name: '最新攻击源',
|
|||
|
type: 'effectScatter',
|
|||
|
coordinateSystem: 'geo',
|
|||
|
data: currentData,
|
|||
|
symbolSize: function (val) {
|
|||
|
return val[2] * 20;
|
|||
|
},
|
|||
|
showEffectOn: 'render',
|
|||
|
rippleEffect: {
|
|||
|
brushType: 'stroke'
|
|||
|
},
|
|||
|
hoverAnimation: true,
|
|||
|
label: {
|
|||
|
normal: {
|
|||
|
formatter: '{b}',
|
|||
|
position: 'right',
|
|||
|
show: true
|
|||
|
}
|
|||
|
},
|
|||
|
itemStyle: {
|
|||
|
normal: {
|
|||
|
color: '#f4e925',
|
|||
|
shadowBlur: 10,
|
|||
|
shadowColor: '#333'
|
|||
|
}
|
|||
|
},
|
|||
|
zlevel: 1
|
|||
|
}
|
|||
|
]*/
|
|||
|
});
|
|||
|
}
|
|||
|
}
|
|||
|
});
|
|||
|
// CONCATENATED MODULE: ./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-1ab50b77","hasScoped":true,"transformToRequire":{"video":["src","poster"],"source":"src","img":"src","image":"xlink:href"},"buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./src/pages/count/OverView.vue
|
|||
|
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"inner-content"},[_c('el-breadcrumb',{attrs:{"separator-class":"el-icon-arrow-right"}},[(_vm.roleAction.topTitle)?_c('el-breadcrumb-item',{staticClass:"con-ptitle",attrs:{"to":{ path: '/CDNindex' }}},[_vm._v("Web应用防火墙")]):_vm._e(),_vm._v(" "),(!_vm.roleAction.topTitle)?_c('el-breadcrumb-item',{staticClass:"con-ptitle"},[_vm._v("统计")]):_vm._e(),_vm._v(" "),_c('el-breadcrumb-item',[_vm._v("总览")])],1),_vm._v(" "),_c('div',{staticClass:"con-content",style:({height:_vm.myHeight})},[_c('el-row',{attrs:{"gutter":20}},[_c('el-col',{attrs:{"span":17}},[_c('div',{staticClass:"grid-content"},[_c('div',{staticClass:"handle con-title"},[_vm._v("截止当前,全部已接入"),_c('span',[_vm._v(_vm._s(_vm.allwebsites))]),_vm._v("个网站,总访问量"),_c('span',[_vm._v(_vm._s(_vm.allaccess))]),_vm._v("次,总拦截量"),_c('span',[_vm._v(_vm._s(_vm.allintercepts))]),_vm._v("次\n ")]),_vm._v(" "),_c('div',{staticClass:"overContentLeft"},[(_vm.roleAction.province)?_c('span',{staticClass:"search-name"},[_vm._v("省份")]):_vm._e(),_vm._v(" "),(_vm.roleAction.province)?_c('el-select',{attrs:{"size":"small","multiple":"","collapse-tags":"","placeholder":"请选择省份"},on:{"change":_vm.proChange},model:{value:(_vm.areaInfo),callback:function ($$v) {_vm.areaInfo=$$v},expression:"areaInfo"}},_vm._l((_vm.areaList),function(item){return _c('el-option',{key:item.value,attrs:{"label":item.label,"disabled":item.disabled,"value":item.value}})}),1):_vm._e(),_vm._v(" "),_c('el-date-picker',{staticStyle:{"width":"320px"},attrs:{"prefix-icon":"noneIcon","type":"daterange","picker-options":_vm.pickerOptions2,"format":"yyyy-MM-dd","value-format":"yyyy-MM-dd","range-separator":"~","start-placeholder":"请选择开始时间","end-placeholder":"结束时间","align":"left","size":"small"},model:{value:(_vm.time),callback:function ($$v) {_vm.time=$$v},expression:"time"}}),_vm._v(" "),_c('el-button',{staticClass:"left-space",attrs:{"type":"primary","size":"small","disabled":_vm.isSearch},on:{"click":_vm.search},nativeOn:{"keyup":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.search($event)}}},[_vm._v("搜索")]),_vm._v(" "),_c('el-row',{class:_vm.roleAction.totalAlertCount ? 'countAreaA' : 'countArea',attrs:{"gutter":15}},[_c('el-col',{attrs:{"span":4}},[_c('div',{staticClass:"grid-content insertBg"},[_c('span',{staticClass:"ca-title"},[_vm._v("新增网站数")]),_vm._v(" "),_c('div',{staticClass:"ca-count-area"},[_c('span',{staticClass:"ca-count"},[_vm._v(_vm._s(_vm.websites))]),_c('span',{staticClass:"ca-dw"},[_vm._v("个")])])])]),_vm._v(" "),_c('el-col',{attrs:{"span":4}},[_c('div',{staticClass:"grid-content underAttackBg"},[_c('span',{staticClass:"ca-title"},[_vm._v("受攻击网站数")]),_vm._v(" "),_c('div',{staticClass:"ca-count-area"},[_c('span',{staticClass:"ca-count"},[_vm._v(_vm._s(_vm.uAttackWebsites))]),_c('span',{staticClass:"ca-dw"},[_vm._v("个")])])])]),_vm._v(" "),_c('el-col',{attrs:{"span":4}},[_c('div',{staticClass:"grid-content allConutBg"},[_c('span',{staticClass:"ca-title"},[_vm._v("总访问量")]),_vm._v(" "),_c('div',{staticClass:"ca-count-area"},[_c('span',{staticClass:"ca-count"},[_vm._v(_vm._s(_vm.access))]),_c('span',{staticClass:"ca-dw"},[_vm._v("次")])])])]),_vm._v(" "),_c('el-col',{attrs:{"span":4}},[_c('div',{staticClass:"grid-content interceptBg"},[_c('span',{staticClass:"ca-title"},[_vm._v("拦截总量")]),_vm._v(" "),_c('div',{staticClass:"ca-count-area"},[_c('span',{staticClass:"ca-count"},[_vm._v(_vm._s(_vm.intercepts))]),_c('span',{staticClass:"ca-dw"},[_vm._v("次")])])])]),_vm._v(" "),(_vm.roleAction.totalAlertCount)?_c('el-col',{attrs:{"span":4}},[_c('div',{staticClass:"grid-content alertBg"},[_c('span',{staticClass:"ca-title"},[_vm._v("告警总量")]),_vm._v(" "),_c('div',{staticClass:"ca-count-area"},[_c('span',{staticClass:"ca-count"},[_vm._v(_vm._s(_vm.warnings))]),_c('sp
|
|||
|
var staticRenderFns = []
|
|||
|
var esExports = { render: render, staticRenderFns: staticRenderFns }
|
|||
|
/* harmony default export */ var count_OverView = (esExports);
|
|||
|
// CONCATENATED MODULE: ./src/pages/count/OverView.vue
|
|||
|
function injectStyle (ssrContext) {
|
|||
|
__webpack_require__("ZGk1")
|
|||
|
}
|
|||
|
var normalizeComponent = __webpack_require__("VU/8")
|
|||
|
/* script */
|
|||
|
|
|||
|
|
|||
|
/* template */
|
|||
|
|
|||
|
/* template functional */
|
|||
|
var __vue_template_functional__ = false
|
|||
|
/* styles */
|
|||
|
var __vue_styles__ = injectStyle
|
|||
|
/* scopeId */
|
|||
|
var __vue_scopeId__ = "data-v-1ab50b77"
|
|||
|
/* moduleIdentifier (server only) */
|
|||
|
var __vue_module_identifier__ = null
|
|||
|
var Component = normalizeComponent(
|
|||
|
OverView,
|
|||
|
count_OverView,
|
|||
|
__vue_template_functional__,
|
|||
|
__vue_styles__,
|
|||
|
__vue_scopeId__,
|
|||
|
__vue_module_identifier__
|
|||
|
)
|
|||
|
|
|||
|
/* harmony default export */ var pages_count_OverView = __webpack_exports__["default"] = (Component.exports);
|
|||
|
|
|||
|
|
|||
|
/***/ }),
|
|||
|
|
|||
|
/***/ "ZGk1":
|
|||
|
/***/ (function(module, exports) {
|
|||
|
|
|||
|
// removed by extract-text-webpack-plugin
|
|||
|
|
|||
|
/***/ })
|
|||
|
|
|||
|
});
|