From 35a1ff9b24fb8d6baa2eb50371e843735f22aa02 Mon Sep 17 00:00:00 2001 From: Fine0830 Date: Tue, 3 Jun 2025 21:23:48 +0800 Subject: [PATCH] feat: enhance the TTL Tab on Setting page (#473) --- src/locales/lang/en.ts | 4 +- src/locales/lang/es.ts | 4 +- src/locales/lang/zh.ts | 4 +- src/store/data.ts | 16 ++++++ src/store/modules/settings.ts | 17 +++++- src/views/settings/components/TTL.vue | 33 +---------- src/views/settings/components/TTLTable.vue | 44 ++++++++++++++ src/views/settings/data.ts | 67 ++++++++-------------- 8 files changed, 109 insertions(+), 80 deletions(-) create mode 100644 src/views/settings/components/TTLTable.vue diff --git a/src/locales/lang/en.ts b/src/locales/lang/en.ts index ea77bc16..78029437 100644 --- a/src/locales/lang/en.ts +++ b/src/locales/lang/en.ts @@ -397,8 +397,8 @@ const msg = { instances: "Instances", snapshot: "Snapshot", expression: "Expression", - metricsTTL: "Metrics TTL", - recordsTTL: "Records TTL", + metricsTTL: "Metrics TTL (day)", + recordsTTL: "Records TTL (day)", clusterNodes: "Cluster Nodes", debuggingConfigDump: "Dump Effective Configurations", customDuration: "Custom Duration", diff --git a/src/locales/lang/es.ts b/src/locales/lang/es.ts index ba7d7edc..f088f27f 100644 --- a/src/locales/lang/es.ts +++ b/src/locales/lang/es.ts @@ -397,8 +397,8 @@ const msg = { snapshot: "Snapshot", expression: "Expression", asSelector: "As Selector", - metricsTTL: "Metrics TTL", - recordsTTL: "Records TTL", + metricsTTL: "Metrics TTL (day)", + recordsTTL: "Records TTL (day)", clusterNodes: "Cluster Nodes", debuggingConfigDump: "Dump Effective Configurations", customDuration: "Duración Personalizada", diff --git a/src/locales/lang/zh.ts b/src/locales/lang/zh.ts index 40c21e0e..a3b079b7 100644 --- a/src/locales/lang/zh.ts +++ b/src/locales/lang/zh.ts @@ -395,8 +395,8 @@ const msg = { instances: "实例", snapshot: "快照", expression: "表达式", - metricsTTL: "Metrics TTL", - recordsTTL: "Records TTL", + metricsTTL: "Metrics TTL (day)", + recordsTTL: "Records TTL (day)", clusterNodes: "集群节点", debuggingConfigDump: "转储有效配置", customDuration: "自定义时长", diff --git a/src/store/data.ts b/src/store/data.ts index 760e1107..f40dfa25 100644 --- a/src/store/data.ts +++ b/src/store/data.ts @@ -15,6 +15,7 @@ * limitations under the License. */ import { WidgetType } from "@/views/dashboard/data"; +import { HotAndWarmOpt } from "@/views/settings/data"; export const NewControl = { x: 0, @@ -58,3 +59,18 @@ export enum EBPFProfilingTriggerType { } export const EndpointsTopNDefault = 20; + +export const TTLTypes = { + HotAndWarm: "Hot / Warm", + Cold: "Cold", +}; +export const TTLColdMap: Indexable = { + coldDay: HotAndWarmOpt[0], + coldHour: HotAndWarmOpt[1], + coldMinute: HotAndWarmOpt[2], + coldNormal: HotAndWarmOpt[3], + coldTrace: HotAndWarmOpt[4], + coldZipkinTrace: HotAndWarmOpt[5], + coldLog: HotAndWarmOpt[6], + coldBrowserErrorLog: HotAndWarmOpt[7], +}; diff --git a/src/store/modules/settings.ts b/src/store/modules/settings.ts index e9dd3708..4341a1da 100644 --- a/src/store/modules/settings.ts +++ b/src/store/modules/settings.ts @@ -18,6 +18,8 @@ import { defineStore } from "pinia"; import { store } from "@/store"; import fetchQuery from "@/graphql/http"; import type { ClusterNode, ConfigTTL } from "@/types/settings"; +import { HotAndWarmOpt } from "@/views/settings/data"; +import { TTLTypes, TTLColdMap } from "../data"; interface SettingsState { clusterNodes: ClusterNode[]; @@ -46,7 +48,20 @@ export const settingsStore = defineStore({ method: "get", path: "ConfigTTL", }); - this.configTTL = response; + for (const item of Object.keys(response)) { + const rows = []; + const row: Indexable = { type: TTLTypes.HotAndWarm }; + const rowCold: Indexable = { type: TTLTypes.Cold }; + for (const key of Object.keys(response[item])) { + if (HotAndWarmOpt.includes(key)) { + row[key] = response[item][key]; + } else { + rowCold[TTLColdMap[key] as string] = response[item][key]; + } + } + rows.push(row, rowCold); + this.configTTL[item] = rows; + } return response; }, async getDebuggingConfigDump() { diff --git a/src/views/settings/components/TTL.vue b/src/views/settings/components/TTL.vue index 5e2a6ea8..bca4b77c 100644 --- a/src/views/settings/components/TTL.vue +++ b/src/views/settings/components/TTL.vue @@ -15,43 +15,16 @@ limitations under the License. --> diff --git a/src/views/settings/data.ts b/src/views/settings/data.ts index 83adaea8..1ac0ce98 100644 --- a/src/views/settings/data.ts +++ b/src/views/settings/data.ts @@ -49,72 +49,53 @@ export const SettingsTabs = [ value: "dumpEffectiveConfigurations", }, ]; + +export const HotAndWarmOpt = ["day", "hour", "minute", "normal", "trace", "zipkinTrace", "log", "browserErrorLog"]; + export const MetricsTTLRow = [ + { + label: "Type", + value: "type", + width: 260, + }, { label: "Day", - value: "day", + value: HotAndWarmOpt[0], }, { label: "Hour", - value: "hour", + value: HotAndWarmOpt[1], }, { label: "Minute", - value: "minute", - }, - { - label: "Cold Day", - value: "coldDay", - }, - { - label: "Cold Hour", - value: "coldHour", - }, - { - label: "Cold Minute", - value: "coldMinute", + value: HotAndWarmOpt[2], }, ]; export const RecordsTTLRow = [ + { + label: "Type", + value: "type", + width: 260, + }, { label: "Normal", - value: "normal", + value: HotAndWarmOpt[3], }, { label: "Trace", - value: "trace", - }, - { - label: "Log", - value: "log", + value: HotAndWarmOpt[4], }, { label: "Zipkin Trace", - value: "zipkinTrace", + value: HotAndWarmOpt[5], + }, + { + label: "Log", + value: HotAndWarmOpt[6], }, { label: "Browser Error Log", - value: "browserErrorLog", - }, - { - label: "Cold Normal", - value: "coldNormal", - }, - { - label: "Cold Trace", - value: "coldTrace", - }, - { - label: "Cold Zipkin Trace", - value: "coldZipkinTrace", - }, - { - label: "Cold Log", - value: "coldLog", - }, - { - label: "Cold Browser Error Log", - value: "coldBrowserErrorLog", + value: HotAndWarmOpt[7], }, ];