diff --git a/public/config.js b/public/config.js index 796b24f..10a7a0a 100644 --- a/public/config.js +++ b/public/config.js @@ -33,6 +33,8 @@ window.$$nazhuaConfig = { // hideTag: false, // 隐藏标签 // hideDotBG: true, // 隐藏框框里面的点点背景 // monitorRefreshTime: 10, // 监控刷新时间间隔,单位s(秒), 0为不刷新,为保证不频繁请求源站,最低生效值为10s + monitorChartType: 'multi', // 监控图表类型 single/multi + monitorChartTypeToggle: true, // 监控图表类型切换 // filterGPUKeywords: ['Virtual Display'], // 如果GPU名称中包含这些关键字,则过滤掉 // customCodeMap: {}, // 自定义的地图点信息 // nezhaVersion: 'v1', // 哪吒版本 diff --git a/src/components/charts/line.js b/src/components/charts/line.js index 28b902b..5abcf89 100644 --- a/src/components/charts/line.js +++ b/src/components/charts/line.js @@ -3,7 +3,6 @@ import { SVGRenderer } from 'echarts/renderers'; import { LineChart } from 'echarts/charts'; import { TooltipComponent, - // LegendComponent, GridComponent, DataZoomComponent, } from 'echarts/components'; @@ -15,13 +14,11 @@ use([ SVGRenderer, LineChart, TooltipComponent, - // LegendComponent, GridComponent, DataZoomComponent, ]); export default ( - cateList, dateList, valueList, mode = 'dark', @@ -69,23 +66,6 @@ export default ( fontSize: 14, }, }, - // legend: { - // show: false, - // data: cateList.map((i) => ({ - // name: i.name, - // itemStyle: { - // color: i.color, - // }, - // lineStyle: { - // color: i.color, - // }, - // })), - // textStyle: { - // color: mode === 'dark' ? '#ddd' : '#222', - // fontFamily, - // fontSize: 14, - // }, - // }, grid: { top: 10, left: 5, diff --git a/src/components/charts/line.vue b/src/components/charts/line.vue index 3729caf..fac77e9 100644 --- a/src/components/charts/line.vue +++ b/src/components/charts/line.vue @@ -25,10 +25,6 @@ import VChart from 'vue-echarts'; import lineChart from './line'; const props = defineProps({ - cateList: { - type: Array, - default: () => [], - }, dateList: { type: Array, default: () => [], @@ -45,9 +41,8 @@ const props = defineProps({ const chartRef = ref(); const option = computed(() => { - if (props.cateList && props.dateList && props.valueList) { + if (props.dateList && props.valueList) { return lineChart( - props.cateList, props.dateList, props.valueList, ); diff --git a/src/views/components/server-detail/server-monitor.vue b/src/views/components/server-detail/server-monitor.vue index d0f2eed..b54f27e 100644 --- a/src/views/components/server-detail/server-monitor.vue +++ b/src/views/components/server-detail/server-monitor.vue @@ -11,6 +11,22 @@
+
+ 聚合 +
+ +
+
-
- +
- + + @@ -175,6 +240,14 @@ const showCates = ref({}); const monitorData = ref([]); const longPressTimer = ref(null); +const chartType = ref(config.nazhua.monitorChartType === 'single' ? 'single' : 'multi'); +const monitorChartType = computed(() => { + if (config.nazhua.monitorChartTypeToggle) { + return chartType.value; + } + return config.nazhua.monitorChartType; +}); + const now = ref(Date.now()); const accpetShowTime = computed(() => now.value - (minute.value * 60 * 1000)); @@ -314,6 +387,10 @@ function switchRefresh() { refreshData.value = !refreshData.value; } +function switchChartType() { + chartType.value = chartType.value === 'single' ? 'multi' : 'single'; +} + function toggleMinute(value) { now.value = store.state.serverTime || Date.now(); minute.value = value; @@ -400,6 +477,51 @@ onUnmounted(() => {