图形监控优化、业务95值计算和交换机收益管理模块开发
This commit is contained in:
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user