From 431bcc089142d87372aa2c3aa749fbaa4f1a0048 Mon Sep 17 00:00:00 2001 From: Fine0830 Date: Mon, 30 Mar 2026 12:36:59 +0800 Subject: [PATCH] fix: set the `step` to `SECOND` in the duration for Log/Trace/Alarm/Tag (#537) --- src/constants/data.ts | 1 + src/hooks/__tests__/useDuration.spec.ts | 12 +++++++----- src/hooks/useDuration.ts | 8 +++++--- .../related/trace/components/TraceList/Filter.vue | 6 +++--- .../related/trace/components/TraceList/SearchBar.vue | 7 +++++-- 5 files changed, 21 insertions(+), 13 deletions(-) diff --git a/src/constants/data.ts b/src/constants/data.ts index 9cbc1e17..31b86da2 100644 --- a/src/constants/data.ts +++ b/src/constants/data.ts @@ -16,6 +16,7 @@ */ export enum TimeType { + SECOND_TIME = "SECOND", MINUTE_TIME = "MINUTE", HOUR_TIME = "HOUR", DAY_TIME = "DAY", diff --git a/src/hooks/__tests__/useDuration.spec.ts b/src/hooks/__tests__/useDuration.spec.ts index 8f8e9834..6a66af95 100644 --- a/src/hooks/__tests__/useDuration.spec.ts +++ b/src/hooks/__tests__/useDuration.spec.ts @@ -46,6 +46,7 @@ vi.mock("@/utils/dateFormat", () => ({ describe("useDuration hook", () => { const mockAppStore = { utc: false, + coldStageMode: false, } as unknown as ReturnType; beforeEach(() => { @@ -66,7 +67,7 @@ describe("useDuration hook", () => { setDurationRow(newDuration); const result = getDurationTime(); - expect(result.step).toBe("DAY"); + expect(result.step).toBe("SECOND"); }); }); @@ -77,9 +78,10 @@ describe("useDuration hook", () => { const result = getDurationTime(); expect(result).toEqual({ - start: "2023-01-01", - end: "2023-01-01", - step: "HOUR", + start: "2023-01-01 00", + end: "2023-01-01 00", + step: "SECOND", + coldStage: false, }); }); @@ -152,7 +154,7 @@ describe("useDuration hook", () => { // Test getDurationTime const durationTime = getDurationTime(); - expect(durationTime.step).toBe("MINUTE"); + expect(durationTime.step).toBe("SECOND"); // Test getMaxRange const maxRange = getMaxRange(5); diff --git a/src/hooks/useDuration.ts b/src/hooks/useDuration.ts index e9cd4fa7..9cae6fb2 100644 --- a/src/hooks/useDuration.ts +++ b/src/hooks/useDuration.ts @@ -18,6 +18,7 @@ import { useAppStoreWithOut, InitializationDurationRow } from "@/store/modules/a import type { Duration, DurationTime } from "@/types/app"; import getLocalTime from "@/utils/localtime"; import dateFormatStep from "@/utils/dateFormat"; +import { TimeType } from "@/constants/data"; export function useDuration() { let durationRow: Duration = InitializationDurationRow; @@ -27,13 +28,14 @@ export function useDuration() { return { start: getLocalTime(appStore.utc, durationRow.start), end: getLocalTime(appStore.utc, durationRow.end), - step: durationRow.step, + step: TimeType.SECOND_TIME, coldStage: appStore.coldStageMode, }; } function getDurationTime(): DurationTime { const appStore = useAppStoreWithOut(); - const { start, step, end } = getDuration(); + const { start, end } = getDuration(); + const step = TimeType.SECOND_TIME; return { start: dateFormatStep(start, step, true), end: dateFormatStep(end, step, true), @@ -43,7 +45,7 @@ export function useDuration() { } function setDurationRow(data: Duration) { const appStore = useAppStoreWithOut(); - durationRow = { ...data, coldStage: appStore.coldStageMode }; + durationRow = { ...data, coldStage: appStore.coldStageMode, step: TimeType.SECOND_TIME }; } function getMaxRange(day: number) { if (day === undefined || day === null) { diff --git a/src/views/dashboard/related/trace/components/TraceList/Filter.vue b/src/views/dashboard/related/trace/components/TraceList/Filter.vue index fc09eb19..595e3043 100644 --- a/src/views/dashboard/related/trace/components/TraceList/Filter.vue +++ b/src/views/dashboard/related/trace/components/TraceList/Filter.vue @@ -105,6 +105,7 @@ limitations under the License. --> import { EntityType, QueryOrders, Status } from "@/views/dashboard/data"; import type { LayoutConfig, FilterDuration } from "@/types/dashboard"; import { useDuration } from "@/hooks/useDuration"; + import { TimeType } from "@/constants/data"; /*global defineProps, defineEmits, Recordable */ const emits = defineEmits(["get", "search"]); @@ -126,7 +127,7 @@ limitations under the License. --> const { duration: filtersDuration } = filters.value; const duration = ref( filtersDuration - ? { start: filtersDuration.startTime || "", end: filtersDuration.endTime || "", step: filtersDuration.step || "" } + ? { start: filtersDuration.startTime || "", end: filtersDuration.endTime || "", step: TimeType.SECOND_TIME } : getDurationTime(), ); const minTraceDuration = ref(); @@ -152,7 +153,6 @@ limitations under the License. --> } async function init() { - duration.value = filters.value.duration || appStore.durationTime; if (dashboardStore.entity === EntityType[1].value) { await getServices(); } @@ -335,7 +335,7 @@ limitations under the License. --> ? { start: filtersDuration.startTime || "", end: filtersDuration.endTime || "", - step: filtersDuration.step || "", + step: TimeType.SECOND_TIME, } : getDurationTime(); init(); diff --git a/src/views/dashboard/related/trace/components/TraceList/SearchBar.vue b/src/views/dashboard/related/trace/components/TraceList/SearchBar.vue index 17b7ca10..c8b54468 100644 --- a/src/views/dashboard/related/trace/components/TraceList/SearchBar.vue +++ b/src/views/dashboard/related/trace/components/TraceList/SearchBar.vue @@ -93,6 +93,8 @@ limitations under the License. --> import { ElMessage } from "element-plus"; import { EntityType, QueryOrders, Status } from "@/views/dashboard/data"; import type { LayoutConfig } from "@/types/dashboard"; + import { TimeType } from "@/constants/data"; + import { useDuration } from "@/hooks/useDuration"; const FiltersKeys: { [key: string]: string } = { status: "traceState", @@ -130,10 +132,11 @@ limitations under the License. --> const tagsMap = ref([]); const traceId = ref(filters.refId || ""); const { duration: filtersDuration } = props.data.filters || {}; + const { getDurationTime } = useDuration(); const duration = ref( filtersDuration - ? { start: filtersDuration.startTime || "", end: filtersDuration.endTime || "", step: filtersDuration.step || "" } - : appStore.durationTime, + ? { start: filtersDuration.startTime || "", end: filtersDuration.endTime || "", step: TimeType.SECOND_TIME } + : getDurationTime(), ); const state = reactive({ instance: "",