From 27082634409f5c2cb50b9cf7bff0ccdd74b5c461 Mon Sep 17 00:00:00 2001
From: hi2hi <code@hi2hi.cc>
Date: Sat, 12 Apr 2025 01:44:01 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20=E6=96=B0=E5=A2=9E=E7=BD=91?=
 =?UTF-8?q?=E7=BB=9C=E7=9B=91=E6=8E=A7=E7=8A=B6=E6=80=81=E5=88=87=E6=8D=A2?=
 =?UTF-8?q?=E7=9A=84=E6=9C=AC=E5=9C=B0=E5=8C=96=E5=AD=98=E5=82=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/charts/line.vue                |  8 ++++++
 .../server-detail/server-monitor.vue          | 26 ++++++++++++++++---
 2 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/src/components/charts/line.vue b/src/components/charts/line.vue
index fac77e9..3d8d997 100644
--- a/src/components/charts/line.vue
+++ b/src/components/charts/line.vue
@@ -2,6 +2,7 @@
   <div
     v-if="option"
     class="line-box"
+    :style="boxStyle"
   >
     <v-chart
       ref="chartRef"
@@ -49,6 +50,13 @@ const option = computed(() => {
   }
   return null;
 });
+const boxStyle = computed(() => {
+  const style = {};
+  if (props.size > 0) {
+    style.height = `${props.size}px`;
+  }
+  return style;
+});
 
 function handleResize() {
   chartRef.value?.resize?.();
diff --git a/src/views/components/server-detail/server-monitor.vue b/src/views/components/server-detail/server-monitor.vue
index b54f27e..226d43d 100644
--- a/src/views/components/server-detail/server-monitor.vue
+++ b/src/views/components/server-detail/server-monitor.vue
@@ -2,6 +2,10 @@
   <dot-dot-box
     v-if="monitorData.length"
     class="server-monitor-group"
+    :class="{
+      'chart-type--multi': config.nazhua.monitorChartTypeToggle && monitorChartType === 'multi',
+      'chart-type--single': config.nazhua.monitorChartTypeToggle && monitorChartType === 'single',
+    }"
     padding="16px 20px"
   >
     <div class="module-head-group">
@@ -126,6 +130,7 @@
           <line-chart
             :date-list="monitorChartData.dateList"
             :value-list="[monitorChartData.valueList[index]]"
+            :size="240"
           />
         </div>
       </div>
@@ -234,13 +239,21 @@ const minutes = [{
   label: '24小时',
   value: 1440,
 }];
-const refreshData = ref(true);
-const peakShaving = ref(false);
+const localData = {
+  peakShaving: window.localStorage.getItem('nazhua_monitor_peak_shaving'),
+  refreshData: window.localStorage.getItem('nazhua_monitor_refresh_data'),
+  chartType: window.localStorage.getItem('nazhua_monitor_chart_type'),
+};
+
+const peakShaving = validate.isSet(localData.peakShaving) ? ref(localData.peakShaving) : ref(false);
+const refreshData = validate.isSet(localData.refreshData) ? ref(localData.refreshData) : ref(true);
 const showCates = ref({});
 const monitorData = ref([]);
 const longPressTimer = ref(null);
 
-const chartType = ref(config.nazhua.monitorChartType === 'single' ? 'single' : 'multi');
+const chartType = validate.isSet(localData.chartType)
+  ? ref(localData.chartType)
+  : ref(config.nazhua.monitorChartType === 'single' ? 'single' : 'multi');
 const monitorChartType = computed(() => {
   if (config.nazhua.monitorChartTypeToggle) {
     return chartType.value;
@@ -381,14 +394,17 @@ const monitorChartData = computed(() => {
 
 function switchPeakShaving() {
   peakShaving.value = !peakShaving.value;
+  window.localStorage.setItem('nazhua_monitor_peak_shaving', peakShaving.value);
 }
 
 function switchRefresh() {
   refreshData.value = !refreshData.value;
+  window.localStorage.setItem('nazhua_monitor_refresh_data', refreshData.value);
 }
 
 function switchChartType() {
   chartType.value = chartType.value === 'single' ? 'multi' : 'single';
+  window.localStorage.setItem('nazhua_monitor_chart_type', chartType.value);
 }
 
 function toggleMinute(value) {
@@ -478,6 +494,10 @@ onUnmounted(() => {
 .server-monitor-group {
   --line-chart-size: 300px;
 
+  &.chart-type--single {
+    --line-chart-size: 240px;
+  }
+
   .monitor-cate-item {
     --cate-item-height: 28px;
     --cate-item-font-size: 14px;