TRKJ/profitManage1.2
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化批量流量图形展示页面Echarts图表X轴数据缩进逻辑，提升展示效果、单页面多路由缓存问题

Browse Source 
1、优化批量流量图形展示页面Echarts图表X轴数据缩进逻辑，提升展示效果
2、添加代码注释，移除冗余代码，优化代码体积与执行效率
3、优化自定义日期时间区间组件，完善功能与视觉表现
4、优化路由匹配逻辑，解决单页面适配多路由场景下的 keep-alive 缓存错乱问题
This commit is contained in:
康冉冉
2026-03-16 18:06:58 +08:00
parent 936b4dd885
commit ac163a126a
7 changed files with 223 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/customModule/dateTimeRange/dateTimeRange.vue
+16 -13
View File
@@ -23,7 +23,8 @@
props: {
type: {
type: String,
default: 'datetimerange'
default: 'datetimerange',
validator: (value) => ['datetimerange', 'daterange'].includes(value)
},
value: {
type: Array,
@@ -47,26 +48,28 @@
},
format: {
type: String,
default: 'YYYY-MM-DD HH:mm:ss'
default: 'YYYY-MM-DD HH:mm:ss',
validator: (value) => ['YYYY-MM-DD HH:mm:ss', 'yyyy-MM-dd HH:mm:ss', 'YYYY-MM-DD', 'yyyy-MM-dd'].includes(value)
},
defaultTime: {
type: Array,
default: () => ['00:00:00', '00:00:00']
default: () => ['00:00:00', '23:59:59'],
validator: (value) => {
if (!Array.isArray(value) || value.length !== 2) return false;
return value.every(time => typeof time === 'string' && /^([01]\d|2[0-3]):([0-5]\d):([0-5]\d)$/.test(time));
}
},
},
watch: {
value: {
immediate: true,
handler(val) {
this.dateRange = val || [];
computed: {
dateRange: {
get() {
return this.value || [];
},
set(newValue) {
this.$emit('input', newValue);
}
}
},
data() {
return {
dateRange: this.value || []
};
},
methods: {
handleDateChange(range) {
this.$emit('input', [range[0], range[1]]);
src/components/customModule/dateTimeRange/dateTimeRangePicker.vue
+172 -19
View File
@@ -107,7 +107,7 @@
v-for="(day, index) in days"
:key="index"
class="day-cell"
:class="getDayClass(day)"
:class="getDayClass(day, index)"
@click="selectDate(day)"
>
<div class="day-content">
@@ -185,7 +185,7 @@
},
pickerOptions: {
type: Object,
default: () => {shortcuts: []}
default: () => ({shortcuts: []})
},
placement: {
type: String,
@@ -210,7 +210,11 @@
startTime: '',
endTime: '',
panelStyle: {opacity: 0},
actualPlacement: this.placement
actualPlacement: this.placement,
updatePanelPositionDebounced: null, // 防抖函数引用
calendarCache: {}, // 日历数据缓存
focusedDayIndex: -1, // 当前焦点日期的索引
isKeyboardNavigating: false // 是否正在使用键盘导航
};
},
computed: {
@@ -222,8 +226,13 @@
return [start, end]
}
return [];
},
// 缓存键，用于判断是否需要重新生成日历
calendarCacheKey() {
return `${this.currentMonth}-${this.currentDate}`;
}
},
watch: {
value: {
immediate: true,
@@ -250,29 +259,58 @@
if (val) {
this.generateCalendar();
document.addEventListener('click', this.handleClickOutside);
document.addEventListener('scroll', this.updatePanelPosition, true);
window.addEventListener('resize', this.updatePanelPosition);
document.addEventListener('scroll', this.updatePanelPositionDebounced, true);
window.addEventListener('resize', this.updatePanelPositionDebounced);
document.addEventListener('keydown', this.handleKeydown);
// 初始化焦点到第一个当前月份的日期
this.$nextTick(() => {
this.focusFirstCurrentMonthDay();
setTimeout(() => {
this.updatePanelPosition();
},500);
});
} else {
document.removeEventListener('click', this.handleClickOutside);
document.removeEventListener('scroll', this.updatePanelPosition, true);
window.removeEventListener('resize', this.updatePanelPosition);
document.removeEventListener('scroll', this.updatePanelPositionDebounced, true);
window.removeEventListener('resize', this.updatePanelPositionDebounced);
document.removeEventListener('keydown', this.handleKeydown);
this.focusedDayIndex = -1;
this.isKeyboardNavigating = false;
}
}
},
mounted() {
this.generateCalendar();
// 创建防抖函数
this.updatePanelPositionDebounced = this.debounce(this.updatePanelPosition, 100);
},
beforeDestroy() {
document.removeEventListener('click', this.handleClickOutside);
document.removeEventListener('scroll', this.updatePanelPosition, true);
window.removeEventListener('resize', this.updatePanelPosition);
document.removeEventListener('scroll', this.updatePanelPositionDebounced, true);
window.removeEventListener('resize', this.updatePanelPositionDebounced);
document.removeEventListener('keydown', this.handleKeydown);
},
methods: {
// 简单的防抖函数实现
debounce(func, wait) {
let timeout;
return function executedFunction(...args) {
const later = () => {
clearTimeout(timeout);
func.apply(this, args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
},
// 解析时间字符串为Date对象
parseTimeString(timeStr) {
if (!timeStr) return new Date(0, 0, 0, 0, 0, 0);
const parts = timeStr.split(':').map(Number);
return new Date(0, 0, 0, parts[0] || 0, parts[1] || 0, parts[2] || 0);
},
// 更新面板位置
updatePanelPosition() {
if (!this.showPanel || !this.$refs.triggerRef || !this.$refs.panelRef) {
@@ -306,6 +344,13 @@
}
},
generateCalendar() {
// 检查缓存
const cacheKey = this.calendarCacheKey;
if (this.calendarCache[cacheKey]) {
this.days = this.calendarCache[cacheKey];
return;
}
const year = this.currentMonth;
const month = this.currentDate - 1;
const firstDayOfMonth = new Date(year, month, 1);
@@ -313,12 +358,12 @@
const daysInMonth = new Date(year, month + 1, 0).getDate();
const prevMonthDays = new Date(year, month, 0).getDate();
this.days = [];
const days = [];
// 添加上个月的天数
for (let i = 0; i < firstDayWeek; i++) {
const day = prevMonthDays - firstDayWeek + i + 1;
this.days.push({
days.push({
date: day,
month: 'prev',
fullDate: new Date(year, month - 1, day)
@@ -327,7 +372,7 @@
// 添加当月天数
for (let i = 1; i <= daysInMonth; i++) {
this.days.push({
days.push({
date: i,
month: 'current',
fullDate: new Date(year, month, i)
@@ -337,13 +382,23 @@
// 添加下个月的天数
const totalCells = 42; // 6行 * 7天
const nextMonthDay = 1;
while (this.days.length < totalCells) {
this.days.push({
date: nextMonthDay + (this.days.length - daysInMonth - firstDayWeek),
while (days.length < totalCells) {
days.push({
date: nextMonthDay + (days.length - daysInMonth - firstDayWeek),
month: 'next',
fullDate: new Date(year, month + 1, nextMonthDay + (this.days.length - daysInMonth - firstDayWeek))
fullDate: new Date(year, month + 1, nextMonthDay + (days.length - daysInMonth - firstDayWeek))
});
}
// 更新数据和缓存
this.days = days;
this.calendarCache[cacheKey] = days;
// 限制缓存大小，避免内存泄漏
const cacheKeys = Object.keys(this.calendarCache);
if (cacheKeys.length > 10) {
delete this.calendarCache[cacheKeys[0]];
}
},
selectDate(day) {
@@ -372,12 +427,12 @@
this.endDate = null;
}
if (this.startDate && this.endDate && this.dateType === 'datetimerange') {
this.startTime = this.startTime ? this.startTime : new Date(0,0,0,this.defaultTime[0].split(':').map(Number)[0],this.defaultTime[0].split(':').map(Number)[1],this.defaultTime[0].split(':').map(Number)[2]);
this.endTime = this.endTime ? this.endTime : new Date(0,0,0,this.defaultTime[1].split(':').map(Number)[0],this.defaultTime[1].split(':').map(Number)[1],this.defaultTime[1].split(':').map(Number)[2]);
this.startTime = this.startTime ? this.startTime : this.parseTimeString(this.defaultTime[0]);
this.endTime = this.endTime ? this.endTime : this.parseTimeString(this.defaultTime[1]);
}
},
getDayClass(day) {
getDayClass(day, index) {
const classes = [];
if (day.month !== 'current') {
@@ -399,6 +454,11 @@
if (this.isInRange(day.fullDate)) {
classes.push('in-range');
}
// 添加焦点样式
if (this.isKeyboardNavigating && index === this.focusedDayIndex) {
classes.push('focused');
}
return classes;
},
@@ -508,6 +568,93 @@
}
},
// 键盘事件处理
handleKeydown(event) {
if (!this.showPanel) return;
this.isKeyboardNavigating = true;
switch(event.key) {
case 'ArrowLeft':
event.preventDefault();
this.moveFocus(-1); // 向左移动
break;
case 'ArrowRight':
event.preventDefault();
this.moveFocus(1); // 向右移动
break;
case 'ArrowUp':
event.preventDefault();
this.moveFocus(-7); // 向上移动
break;
case 'ArrowDown':
event.preventDefault();
this.moveFocus(7); // 向下移动
break;
case 'Enter':
event.preventDefault();
this.selectFocusedDay();
break;
case 'Escape':
event.preventDefault();
this.closePanel();
break;
case 'Tab':
// 允许Tab键正常导航
this.isKeyboardNavigating = false;
break;
}
},
// 聚焦到第一个当前月份的日期
focusFirstCurrentMonthDay() {
const firstCurrentMonthIndex = this.days.findIndex(day => day.month === 'current');
if (firstCurrentMonthIndex !== -1) {
this.focusedDayIndex = firstCurrentMonthIndex;
} else {
this.focusedDayIndex = 0;
}
},
// 移动焦点
moveFocus(delta) {
if (this.days.length === 0) return;
let newIndex = this.focusedDayIndex + delta;
// 边界检查
if (newIndex < 0) {
// 移动到上个月
this.prevMonth();
this.$nextTick(() => {
newIndex = this.days.length - 7 + (newIndex % 7);
if (newIndex < 0) newIndex = 0;
this.focusedDayIndex = newIndex;
});
return;
}
if (newIndex >= this.days.length) {
// 移动到下个月
this.nextMonth();
this.$nextTick(() => {
newIndex = newIndex % 7;
this.focusedDayIndex = newIndex;
});
return;
}
this.focusedDayIndex = newIndex;
},
// 选择当前焦点的日期
selectFocusedDay() {
if (this.focusedDayIndex >= 0 && this.focusedDayIndex < this.days.length) {
const day = this.days[this.focusedDayIndex];
this.selectDate(day);
}
},
formatDateTime(date) {
if (!date) return '';
const d = new Date(date);
@@ -785,6 +932,12 @@
font-weight: 600;
}
.day-cell.focused .day-content {
box-shadow: 0 0 0 2px #409eff;
outline: none;
z-index: 2;
}
.day-cell.in-range:before {
content: '';
position: absolute;
src/router/index.js
+4 -4
View File
@@ -881,8 +881,8 @@ export const dynamicRoutes = [
{
path: ':id?',
component: () => import('@/views/resource/mtrProbe/mtrProbeView'),
name: 'mtrProbe_view',
meta: { title: '新建MTR探测策略', activeMenu: '/resource/mtrAgent' }
name: 'mtrAgentAndProbe',
meta: { title: '新建MTR探测策略', noCache: false, activeMenu: '/resource/mtrAgent' }
}
]
},
@@ -896,8 +896,8 @@ export const dynamicRoutes = [
{
path: ':id?',
component: () => import('@/views/resource/mtrProbe/mtrProbeView'),
name: 'mtrProbe_view',
meta: { title: 'MTR探测策略信息', activeMenu: '/resource/mtrProbe' }
name: 'mtrProbeView',
meta: { title: 'MTR探测策略信息', noCache: false, activeMenu: '/resource/mtrProbe' }
}
]
},
src/views/resource/mtrProbe/mtrProbeView.vue
+9 -2
View File
@@ -10,11 +10,11 @@
</div>
</template>
<script setup name="Handle">
<script>
import Form from '@/components/form/index.vue';
import {addMtrPolicy, updateMtrPolicy, getMtrPolicyt, allMtrClientIdData, networkInterList, getRegistList} from "@/api/disRevenue/resource"
export default {
name: 'mtrProbe_view',
name: 'mtrAgentAndProbe',
components: {Form},
dicts: ['policy_method', 'rm_register_online_state', 'agent_update_result', 'rm_register_status', 'rm_register_snmp_detect'],
props: {
@@ -64,6 +64,13 @@
}
},
created() {
// 方式1：根据路由路径动态设置组件name
if (this.$route.path.includes('/resource/mtrAgent/addMtrProbe')) {
this.$options.name = 'mtrAgentAndProbe' // 匹配mtrAgent新建路由的name
} else if (this.$route.path.includes('/resource/mtrProbe/view')) {
this.$options.name = 'mtrProbeView' // 匹配mtrProbe路由的name
}
this.paramsData = this.$route && this.$route.query;
if (this.open) {
this.paramsData = {};
src/views/resource/serverRegister/details.vue
-58
View File
@@ -268,9 +268,6 @@
controls: {
id: {label: 'ID',hidden: true},
clientId: {label: 'SN', span: 24, slotName: 'tempClient'},
// registrationStatus: {label: '', span: 3, type: 'select', options: this.dict.type.rm_register_status},
// onlineStatus: {label: '', span: 3, type: 'select', options: this.dict.type.rm_register_online_state},
// remark: {label: '', span: 14, type: 'dynamicTags'},
ip1PublicIp: {label: 'IP', span: 24, slotName: 'tempIp1public'},
}
}, {
@@ -400,8 +397,6 @@
} else if (this.activeName === '内存详细信息') {
this.fnInitialMemory(this.activeName);
}
// if (!this.mapDataList[this.activeName] || this.mapDataList[this.activeName].length <= 0) {
// }
},
// 收益信息的分页回调
fnPaging(val) {
@@ -509,13 +504,6 @@
interNetCardList() {
return postInterFaceName({clientId: this.paramsData.clientId,resourceType: 1});
},
// getMonitorData() {
// serverMonitorData({clientId: this.paramsData.clientId}).then(res => {
// if (res && res.data) {
// this.systemModel = res.data;
// }
// });
// },
// 挂载文件 === 接口名称
fnInterFaceNameList(keyName) {
mountNameList({clientId: this.paramsData.clientId}).then(res => {
@@ -548,19 +536,6 @@
this.$set(this.mapDataList, keyName, [{tableList: newList, queryParams: {total: 0}}]);
}
});
// diskAllNames({clientId: this.paramsData.clientId}).then(res => {
// if (res && res.data.length > 0) {
// let tabNameList = {};
// res && res.data.forEach(async(item,index) => {
// let oneData = JSON.parse(JSON.stringify(this.linuxSystem['disk']));
// oneData.title = item && item.name;
// oneData.toTitle = '硬盘设备';
// oneData.clientId = this.paramsData.clientId;
// tabNameList[item.name] = oneData;
// });
// this.$set(this.mapDataList, keyName, tabNameList);
// }
// });
},
// 回调
fnTimeChangeData(val) {
@@ -570,9 +545,6 @@
} else if (this.activeName && this.activeName === '挂载文件系统监控' && this.mapDataList[this.activeName]) {
this.fnMountCharList('挂载文件系统监控', val.currTimeList);
}
// else if (this.activeName && this.activeName === '硬盘设备监控' && this.mapDataList[this.activeName]) {
// this.fnDiskCharList('硬盘设备监控', val.currTimeList);
// }
},
// 网卡流量监控
async fnNetChartList(keyVal, time, interCardName, onlyInterCard) {
@@ -611,8 +583,6 @@
this.fnCpuTemperatureCharts(time, keyVal, keyName);
}
}
// Object.keys(this.mapDataList[keyVal]).forEach(async (keyName,index) => {
// });
}
},
// 挂载文件系统监控
@@ -696,25 +666,6 @@
name: content.echartFors[1].oneName,
data: res.data && res.data.yData['pingDropped'] || []
};
// if (content.echartFors[1].unitSel) {
// netEcharts.dataVal['unitModel'] = res && res.data && res.data.unit || '';
// netEcharts.dataVal['unitSelList'] = content.echartFors[0].unitSel;
// }
// let ledgendArr = [];
// if (res.data && res.data.showRealation) {
// Object.keys(res.data.showRealation).forEach((key,index) => {
// ledgendArr.push(res.data.showRealation[key]);
// netEcharts.dataVal.dataList[index] = {
// name: res.data.showRealation[key],
// data: res.data && res.data.yData[key] || []
// };
// });
// }
// if (res.data && res.data.showRealation && Object.keys(res.data.showRealation).length > 5) {
// netEcharts.dataVal.legend = Object.assign({}, netEcharts.dataVal.legend, {show: false, legendSelect: ledgendArr, data: ledgendArr});
// } else {
// netEcharts.dataVal.legend = Object.assign({}, netEcharts.dataVal.legend, {show: true, data: ledgendArr});
// }
mountCollect['echartList'][1] = netEcharts;
this.$set(this.mapDataList[keyVal], titleName, mountCollect);
}
@@ -964,9 +915,6 @@
if (this.activeName === '挂载文件系统监控' && !this.eventKeyName[val.key]) {
this.getSpaceRate(val.currTimeList, this.activeName, val.key);
}
// else if (this.activeName === '硬盘设备监控' && !this.eventKeyName[val.key]) {
// this.getSpeedEcharts(val.currTimeList, this.activeName, val.key);
// }
}
}
}
@@ -977,12 +925,6 @@
if (result && result.fnCode) {
switch (result.fnCode) {
case 'cancel':
// if (this.paramsData && this.paramsData.type === 'alarmLog') {
// // this.$router.push("/resource/alarmLog");
// history.go(-1);
// } else {
// this.$router.push("/resource/serverRegister");
// }
break;
default:
}
src/views/resource/serverRegister/index.vue
+14 -35
View File
@@ -346,8 +346,6 @@
{content: 'PPPoE配置', fnCode: 'poeConfig', type: 'text', icon: 'el-icon-data-analysis', hasPermi: 'resource:serverRegister:poeConfig'},
]
}
// {content: '注册', fnCode: 'enroll', showName: 'registrationStatus', showVal: '0', type: 'text', icon: 'el-icon-circle-check', hasPermi: 'resource:register:enroll'},
// {content: '取消注册', fnCode: 'unenroll', showName: 'registrationStatus', showVal: '1', type: 'text', icon: 'el-icon-circle-close', hasPermi: 'resource:register:unenroll'},
]
}
},
@@ -470,7 +468,6 @@
handleValueChange(newValue) {
// 父组件更新自身数据，实现同步
this.showSearch = newValue;
// console.log('父组件拿到新值:', newValue);
},
// 高亮数据查询
getHightLight() {
@@ -511,16 +508,13 @@
handleQuery() {
this.queryParams.pageNum = 1;
this.handleClick();
// this.getHightLight();
},
/** 重置按钮操作 */
resetQuery() {
this.$refs['queryRef'].resetFields();
this.queryParams = {pageNum: 1, pageSize: 10,total: 0, resetVal: true};
// this.resetForm("queryRef");
this.handleClick();
// this.handleQuery();
},
/** 多选框选中数据 */
@@ -559,29 +553,25 @@
});
},
/** 图形分析 */
graphicTraffic(list) {
// 生成唯一 key（避免数据冲突）
const storageKey = `temp_data_${Date.now()}`;
// 1. 将数据存入 localStorage（需序列化）
localStorage.setItem(storageKey, JSON.stringify({clientIdList: list}));
// 1. 用 Vue Router 解析目标路由的完整 URL
const routeLocation = this.$router.resolve({
name: 'TrafficChart',
query: { storageKey }
});
// 2. 打开新窗口（routeLocation.href 是完整路径）
window.open(routeLocation.href, '_blank');
// _blank：新标签页；_self：当前窗口（默认）
},
// graphicTraffic(list) {
// // 生成唯一 key（避免数据冲突）
// const storageKey = `temp_data_${Date.now()}`;
// // 1. 将数据存入 localStorage（需序列化）
// localStorage.setItem(storageKey, JSON.stringify({clientIdList: list}));
// // 1. 用 Vue Router 解析目标路由的完整 URL
// const routeLocation = this.$router.resolve({
// name: 'TrafficChart',
// query: { storageKey }
// });
// // 2. 打开新窗口（routeLocation.href 是完整路径）
// window.open(routeLocation.href, '_blank');
// // _blank：新标签页；_self：当前窗口（默认）
// },
async fnVirtualContent(rowData, content, formValCol) {
let virtuaContent = '';
let newVirtuaContent = '';
rowData && rowData.forEach(item => {
let interfaceName = this.ipContentList[item].interfaceName;
// if (this.virNetInterList[interfaceName] && this.virNetInterList[interfaceName].typeVal) {
// virtuaContent += this.virNetInterList[interfaceName].content;
// return;
// }
virNetInterfaceChild({clientId: this.pubilcNetRuleForm.clientId, parentInterface: interfaceName}).then(res => {
res && res.data.forEach((val, index) => {
virtuaContent += '<div style="padding-left: 20px;">'
@@ -824,7 +814,6 @@
this.pubilcNetFormList[0].controls.descriptionTwo['hidden'] = true;
}
this.fnVirtualContent([rowData], contentTow, 'descriptionTwo');
// this.$set(this.pubilcNetRuleForm, 'descriptionTwo', contentTow);
break;
case 'issueBusiness':
this.issueOpen = true;
@@ -956,18 +945,10 @@
this.copyDialogVisible = true;
break;
case 'export':
// let dataList = [];
// Object.keys(this.columns).forEach(item => {
// if (item.visible) {
// dataList.push(item.prop);
// }
// });
// this.download("/system/registration/export", {properties: dataList,}, `资源管理_${new Date().getTime()}.xlsx`);
let paramsList = Object.assign({}, this.queryParams,rowData);
this.download("system/registration/export", paramsList, `服务器管理_${new Date().getTime()}.xlsx`, null, 'json');
break;
default:
}
}
},
@@ -975,9 +956,7 @@
compareVersions(targetVer, version2) {
const v1 = targetVer.split('.').map(Number);
const v2 = version2.split('.').map(Number);
const maxLength = Math.max(v1.length, v2.length);
for (let i = 0; i < maxLength; i++) {
const num1 = v1[i] || 0;
const num2 = v2[i] || 0;
src/views/resource/serverRegister/trafficChart.vue
+8 -18
View File
@@ -48,6 +48,8 @@
titleVal: {textAlign: 'center'},
yAxisName: ' ',
gridTop: '30%',
gridLeft: '40px',
gridRight: '40px',
legend: {top: '12%', left: '10%',type: 'scroll',orient: 'horizontal'},
hiddenTime: true,
lineXData: [],
@@ -64,6 +66,8 @@
hiddenTime: true,
yAxisName: ' ',
gridTop: '30%',
gridLeft: '40px',
gridRight: '40px',
legend: {top: '15%', left: '10%'},
lineXData: [],
dataList: [
@@ -131,12 +135,10 @@
return Promise.resolve();
});
// 等待所有接口调用完成
Promise.all(promises)
.then(() => {
Promise.all(promises).then(() => {
// 设置5分钟的定时器刷新
this.fnTimeInter();
})
.catch(error => {
}).catch(error => {
// 即使失败也要设置定时器
this.fnTimeInter();
});
@@ -147,14 +149,7 @@
this.saveCheckOldData = JSON.parse(JSON.stringify(this.checkData));
},
initData(){
// 原打开新页面使用
// this.storageKey = this.$route.query && this.$route.query['storageKey'];
// if (this.storageKey) {
// this.paramsData = JSON.parse(localStorage.getItem(this.storageKey));
// this.getNetTraffic(this.paramsData.clientIdList);
// }
// this.getNetTraffic(this.paramsData.clientIdList);
// 内部路径跳转
let newParamsList = this.$route && this.$route.query;
if (newParamsList && newParamsList.clientIdList) {
this.paramsData = {clientIdList: JSON.parse(newParamsList.clientIdList)};
@@ -213,14 +208,10 @@
let newArr = [netEcharts];
this.$set(this.echartListData[item.clientId], 'traffic', newArr);
});
// 循环定时查询
// this.fnTimeInter();
}
resolve(); // 确保在完成后调用 resolve
}).catch(() => {
resolve(); // 确保在完成后调用 resolve
// 循环定时查询
// this.fnTimeInter();
});
});
},
@@ -274,8 +265,7 @@
if (res && res.data) {
cpuData['type'] = 'cpu';
cpuData.title = `【${item}】的CPU使用率(%)`;
cpuData.dataVal.lineXData = res && res.data && res.data['xData'] && res.data['xData'].length > 0 ? res.data['xData'] :
this.firstChartTrans && this.firstChartTrans['timeList'] && this.firstChartTrans['timeList'].length > 0 ? this.firstChartTrans['timeList'] : [];
cpuData.dataVal.lineXData = res && res.data && res.data['xData'] && res.data['xData'].length > 0 ? res.data['xData'] : [];
cpuData.dataVal.dataList[0].data = res && res.data && res.data['yData'] && res.data['yData']['utiData'] && res.data['yData']['utiData'].length > 0 ? res.data['yData']['utiData'] : [];
cpuData.dataVal.dataList[1].data = res && res.data && res.data['yData'] && res.data['yData']['load1Data'] && res.data['yData']['load1Data'].length > 0 ? res.data['yData']['load1Data'] : [];
cpuData.dataVal.dataList[2].data = res && res.data && res.data['yData'] && res.data['yData']['load5Data'] && res.data['yData']['load5Data'].length > 0 ? res.data['yData']['load5Data'] : [];