图形监控优化、业务95值计算和交换机收益管理模块开发

This commit is contained in:
康冉冉
2025-10-29 18:21:41 +08:00
parent 1aa53d7d90
commit 9cc43a8700
20 changed files with 1010 additions and 208 deletions

View File

@@ -14,7 +14,20 @@
</el-select>
</el-form-item>
</el-form>
<el-switch v-for="item of switchData" v-model="item.checkType" :activeText="item.label" class="mr20" />
<template v-for="item of switchData">
<el-switch v-model="item.checkType" :activeText="item.label" class="mr20" />
<el-date-picker
v-model="timeList[item.value]"
:style="{width: '300px!important', marginRight: '10px'}"
:type="item.value === '1' ? 'datetimerange' : 'monthrange'"
:start-placeholder="item.value === '2' ? '开始日期' : '开始时间'"
:end-placeholder="item.value === '2' ? '结束日期' : '结束时间'"
range-separator=""
:format="item.value === '2' ? 'yyyy-MM' : 'yyyy-MM-dd HH:mm:ss'"
:value-format="item.value === '2' ? 'yyyy-MM' : 'yyyy-MM-dd HH:mm:ss'"
:default-time="item.value === '1' ? ['12:00:00', '12:00:00'] : null"
@change="(val) => dateChange(val, item.value)"/>
</template>
</div>
<div style="height: calc(100vh - 160px);overflow: scroll;">
<template v-for="(item,index) of echartListData">
@@ -62,6 +75,7 @@
},
data() {
return {
timeList: {'1': [], '2': []},
paramsData: {},
form: {},
storageKey: '',
@@ -87,14 +101,15 @@
this.paramsData = JSON.parse(localStorage.getItem(this.storageKey));
this.resourceType = this.paramsData && this.paramsData.resourceType;
if (this.paramsData && this.paramsData.dictList) {
this.switchData = this.paramsData.dictList.map((item,index) => {
this.typeObj[item.value] = {type: item.value, indexVal: index};
let obj = {
label: item.label,
value: item.value,
checkType: true
};
return obj;
this.paramsData.dictList.forEach((item,index) => {
if (item.value === '1' || item.value === '2') {
this.typeObj[item.value] = {type: item.value, indexVal: index};
this.switchData.push({
label: item.label,
value: item.value,
checkType: true
});
}
});
}
if (this.paramsData && this.paramsData.list) {
@@ -129,11 +144,15 @@
let monthList = this.getLastMonths();
this.graDailyList(dayList);
this.graMonthlyList(monthList);
this.graPackageList(dayList);
this.graAvgMonthlyList(monthList);
this.graEffectiveDailyList(dayList);
this.graEffectiveMonthlyList(monthList);
this.graEffectiveAvgMonthlyList(dayList);
// this.graPackageList(dayList);
// this.graAvgMonthlyList(monthList);
// this.graEffectiveDailyList(dayList);
// this.graEffectiveMonthlyList(monthList);
// this.graEffectiveAvgMonthlyList(dayList);
},
// 时间变化时
dateChange(val, idNum){
console.log('id=====',idNum, 'val===',val);
},
// 初始化
processData(list) {
@@ -173,15 +192,17 @@
};
}
this.paramsVal['calculationMode'] = this.activeName;
let dayList = this.getDaysOfPreviousMonth();
let monthList = this.getLastMonths();
let dayList = this.getBeforDay();
let monthList = this.getLastMonths(2);
this.timeList['1'] = [dayList.startTime + ' 00:00:00', dayList.endTime + ' 00:00:00'];
this.timeList['2'] = [monthList.startTime, monthList.endTime];
this.graDailyList(dayList);
this.graMonthlyList(monthList);
this.graPackageList(dayList);
this.graAvgMonthlyList(monthList);
this.graEffectiveDailyList(dayList);
this.graEffectiveMonthlyList(monthList);
this.graEffectiveAvgMonthlyList(dayList);
// this.graPackageList(dayList);
// this.graAvgMonthlyList(monthList);
// this.graEffectiveDailyList(dayList);
// this.graEffectiveMonthlyList(monthList);
// this.graEffectiveAvgMonthlyList(dayList);
}
},
// 95带宽值Mbps/日---图表
@@ -190,6 +211,7 @@
if (res && res.data && res.data.length > 0) {
res.data.forEach((item, index) => {
item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
item.resultData['hiddenTime'] = true;
let dataList = Object.assign({dateShowType: 'day', fnEvent: 'graDailyList'},item, this.typeObj[1]);
this.$set(this.echartListData, index * 7, dataList);
this.$set(this.disabledList, index * 7, dataList);
@@ -207,6 +229,7 @@
if (res && res.data && res.data.length > 0) {
res.data.forEach((item, index) => {
item.titleList = this.resourceType === 1 ? '【' + item.nodeName + '】【' + item.businessName + '】' : '【' + item.nodeName + '】【' + item.interfaceName + '】【' + item.businessName + '】';
item.resultData['hiddenTime'] = true;
let dataList = Object.assign({dateShowType: 'month', fnEvent: 'graMonthlyList'},item, this.typeObj[2]);
this.$set(this.echartListData, index * 7 + 1, dataList);
});
@@ -307,6 +330,18 @@
console.warn(`函数 ${funcName} 未定义`);
}
},
// 获取前一天的
getBeforDay() {
let startData = '';
let endData = '';
const year = new Date().getFullYear();
const month = String(new Date().getMonth() + 1).padStart(2, '0'); // 0=1月11=12月
const day = String(new Date().getDate()).padStart(2, '0'); // 当前日如8
const prevDay = String(new Date().getDate() - 1).padStart(2, '0');
startData = `${year}-${month}-${prevDay} 00:00:00`;
endData = `${year}-${month}-${day} 00:00:00`;
return {startTime: startData, endTime: endData};
},
// 获取前一个月的所有日期
getDaysOfPreviousMonth(star, end) {
const currentDate = new Date();
@@ -345,13 +380,13 @@
return {startTime: dateCollection[0], endTime: dateCollection[dateCollection.length - 1]};
},
// 获取前一年的月
getLastMonths() {
getLastMonths(num) {
const threeMonths = [];
const today = new Date(); // 当前日期
const currentYear = today.getFullYear();
const currentMonth = today.getMonth() + 1; // 月份从0开始0=1月11=12月
// 循环获取前3个月i=0: 前1个月i=1: 前2个月i=2: 前3个月
for (let i = 1; i <= 12; i++) {
for (let i = 1; i <= num; i++) {
// 计算目标月份(当前月 - i
let targetMonth = currentMonth - i;
let targetYear = currentYear;