update

src/components/DateCalendar.vue

@@ -379,6 +379,7 @@ limitations under the License. -->
     classObj[`${state.pre}-date-disabled`] =
       (props.right && (t < start.value || t > maxEnd.value)) ||
       (props.left && t < minStart.value) ||
+      t > maxEnd.value ||
       props.disabledDate(time, format);
     classObj[`${state.pre}-date-on`] = (props.left && t > start.value) || (props.right && t < end.value);
     classObj[`${state.pre}-date-selected`] = flag;

src/layout/components/NavBar.vue

@@ -141,9 +141,17 @@ limitations under the License. -->
   function changeDataMode() {
     appStore.setColdStageMode(coldStage.value);
     if (coldStage.value) {
-      // const gap = appStore.duration.end.getTime() - appStore.duration.start.getTime();
-      // const dates: Date[] = [new Date(new Date().getTime() - gap), new Date()];
-      // appStore.setDuration(timeFormat(dates));
+      handleMetricsTTL({
+        minute: appStore.metricsTTL.coldMinute,
+        hour: appStore.metricsTTL.coldHour,
+        day: appStore.metricsTTL.coldDay,
+      });
+    } else {
+      handleMetricsTTL({
+        minute: appStore.metricsTTL.minute,
+        hour: appStore.metricsTTL.hour,
+        day: appStore.metricsTTL.day,
+      });
     }
   }
 
@@ -223,19 +231,8 @@ limitations under the License. -->
       coldHour: 10,
       coldDay: 9,
     };
-    if (coldStage.value) {
-      handleMetricsTTL({
-        minute: data.coldMinute,
-        hour: data.coldHour,
-        day: data.coldDay,
-      });
-    } else {
-      handleMetricsTTL({
-        minute: data.minute,
-        hour: data.hour,
-        day: data.day,
-      });
-    }
+    appStore.setMetricsTTL(data);
+    changeDataMode();
   }
 
   function handleMetricsTTL(params: { minute: number; hour: number; day: number }) {

src/store/modules/app.ts

@@ -21,7 +21,7 @@ import type { Duration, DurationTime } from "@/types/app";
 import getLocalTime from "@/utils/localtime";
 import dateFormatStep, { dateFormatTime } from "@/utils/dateFormat";
 import { TimeType } from "@/constants/data";
-import type { MenuOptions, SubItem } from "@/types/app";
+import type { MenuOptions, SubItem, MetricsTTL } from "@/types/app";
 import { Themes } from "@/constants/data";
 /*global Nullable*/
 interface AppState {
@@ -39,6 +39,7 @@ interface AppState {
   theme: string;
   coldStageMode: boolean;
   maxRange: Date[];
+  metricsTTL: Recordable<MetricsTTL>;
 }
 
 export const appStore = defineStore({
@@ -62,6 +63,7 @@ export const appStore = defineStore({
     theme: Themes.Dark,
     coldStageMode: false,
     maxRange: [],
+    metricsTTL: {},
   }),
   getters: {
     duration(): Duration {
@@ -129,6 +131,9 @@ export const appStore = defineStore({
     setMaxRange(times: Date[]) {
       this.maxRange = times;
     },
+    setMetricsTTL(data: MetricsTTL) {
+      this.metricsTTL = data;
+    },
     setTheme(data: string) {
       this.theme = data;
     },

src/types/app.d.ts

@@ -68,3 +68,12 @@ export interface SubItem {
   descKey: string;
   i18nKey: string;
 }
+
+export interface MetricsTTL {
+  minute: number;
+  hour: number;
+  day: number;
+  coldMinute: number;
+  coldHour: number;
+  coldDay: number;
+}