处理 CPU usage of diferent cores 折线图的图例的样式,增加图例翻页的功能

处理cup tab页面,时间和日期调整,页面不刷新的问题
服务器server 模块 tabs 页面,增加切换服务器名称,页面刷新的逻辑
This commit is contained in:
任珮宇 2023-10-07 14:46:07 +08:00
parent 619c57e7b5
commit caabe0e6e9
3 changed files with 14 additions and 7 deletions

View File

@ -231,7 +231,6 @@ export default {
}, },
methods: { methods: {
getTheData() { getTheData() {
console.log(this.serverOptions)
let hostId = this.serverOptions.find((item) => { let hostId = this.serverOptions.find((item) => {
return item.value == this.currId return item.value == this.currId
}).hostId }).hostId
@ -278,7 +277,6 @@ export default {
totalCpu.push(item) totalCpu.push(item)
} }
}) })
console.log(totalCpu)
this.cpuDiff_xData = totalCpu[0].list.map((item) => { this.cpuDiff_xData = totalCpu[0].list.map((item) => {
return dateFormat(new Date(item.date * 1000), 'hh:mm') return dateFormat(new Date(item.date * 1000), 'hh:mm')
}) })
@ -357,14 +355,17 @@ export default {
onServerChange(val) { onServerChange(val) {
this.currId = val.key this.currId = val.key
this.currLabel = val.label this.currLabel = val.label
this.getTheData()
}, },
onTimeChange(val) { onTimeChange(val) {
this.getBeforeHours(val) this.getBeforeHours(val)
this.getTheData()
}, },
onRangeDateChange(date, dateString) { onRangeDateChange(date, dateString) {
this.queryParams.timer = 0 this.queryParams.timer = 0
this.queryParams.startDate = dateString[0] this.queryParams.startDate = dateString[0]
this.queryParams.endDate = dateString[1] this.queryParams.endDate = dateString[1]
this.getTheData()
}, },
drawChart1() { drawChart1() {
let myLine = echarts.init(document.getElementById('chart1')) let myLine = echarts.init(document.getElementById('chart1'))
@ -754,6 +755,11 @@ export default {
data: item.data, data: item.data,
} }
}) })
option.legend.type = 'scroll'
option.legend.pageIconColor = '#9ab1bc'
option.legend.pageTextStyle = {
color: '#9ab1bc',
}
this.drawLine(option) this.drawLine(option)
} else { } else {
this.drawLine(option) this.drawLine(option)

View File

@ -15,7 +15,7 @@
:class="{ 'ant-list-item-active': index === currIndex }" :class="{ 'ant-list-item-active': index === currIndex }"
slot="renderItem" slot="renderItem"
slot-scope="item, index" slot-scope="item, index"
@click="handleBasicItem(index)" @click="handleBasicItem(index, item)"
> >
<div>{{ item.sourceName }}</div> <div>{{ item.sourceName }}</div>
</a-list-item> </a-list-item>
@ -512,7 +512,6 @@ export default {
methods: { methods: {
// Echarts (线) // Echarts (线)
EchartsTimeline() { EchartsTimeline() {
console.log(3456789)
const params = { const params = {
itemId: '37550', itemId: '37550',
itemType: 0, itemType: 0,
@ -647,7 +646,6 @@ export default {
} }
getAction('/systemMonitor/queryItemHistoryData', params).then((res) => { getAction('/systemMonitor/queryItemHistoryData', params).then((res) => {
const arr = res.result.map((x) => x.value) const arr = res.result.map((x) => x.value)
console.log(Math.max(...arr), Math.min(...arr))
this.cpuData.max = Math.max(...arr).toFixed(2) this.cpuData.max = Math.max(...arr).toFixed(2)
this.cpuData.min = Math.min(...arr).toFixed(2) this.cpuData.min = Math.min(...arr).toFixed(2)
let sum = arr.reduce((tatal, num) => tatal + num, 0) let sum = arr.reduce((tatal, num) => tatal + num, 0)
@ -743,8 +741,12 @@ export default {
} }
} }
}, },
handleBasicItem(i) { handleBasicItem(i, item) {
this.currIndex = i this.currIndex = i
this.currItemId = item.cpuUsedItemId
this.getBasiclnfo(item.hostId)
this.getCpuUtilizationData()
this.getTimeLineData()
}, },
getServerAlarmHistory(callBack) { getServerAlarmHistory(callBack) {
this.loading = true this.loading = true

View File

@ -333,7 +333,6 @@ export default {
let oneHourAgo = moment().subtract(num, 'hours') let oneHourAgo = moment().subtract(num, 'hours')
this.queryParams.startDate = oneHourAgo.format('YYYY-MM-DD HH:mm:ss') this.queryParams.startDate = oneHourAgo.format('YYYY-MM-DD HH:mm:ss')
this.queryParams.endDate = currentTime.format('YYYY-MM-DD HH:mm:ss') this.queryParams.endDate = currentTime.format('YYYY-MM-DD HH:mm:ss')
console.log(this.queryParams)
}, },
moment, moment,
onRangeDateChange(date, dateString) { onRangeDateChange(date, dateString) {