fix: show configured workbench time label

This commit is contained in:
lyon
2026-06-20 13:44:47 +08:00
parent 028df20e39
commit f2a54532a2
3 changed files with 21 additions and 6 deletions
@@ -1,19 +1,22 @@
<script setup lang="ts">
import { computed, ref } from "vue";
import StatusBadge from "@/components/common/StatusBadge.vue";
import { displayTimeLabel } from "@/config/runtime";
import type { LiveSurface } from "@/types";
import { formatTimestamp, summarizeBuilds } from "@/stores/workbench-live";
const props = defineProps<{ live: LiveSurface | null }>();
const open = ref(false);
const summary = computed(() => summarizeBuilds(props.live));
const timeLabel = computed(() => displayTimeLabel());
const unavailableTimeText = computed(() => `构建时间不可用(${timeLabel.value}`);
</script>
<template>
<section class="live-build-summary" data-live-build-summary>
<button id="live-build-toggle" class="status-chip-button" type="button" aria-haspopup="dialog" @click="open = true">
<span class="status-chip-label">最新镜像构建时间</span>
<StatusBadge :status="summary.tone" :label="summary.latest.builtAt ? formatTimestamp(summary.latest.builtAt) : '构建时间不可用'" />
<span class="status-chip-label">最新镜像构建时间{{ timeLabel }}</span>
<StatusBadge :status="summary.tone" :label="summary.latest.builtAt ? formatTimestamp(summary.latest.builtAt) : unavailableTimeText" />
<span class="status-chip-meta">{{ summary.latest.label }} · tag {{ summary.latest.tag || 'unknown' }} · commit {{ summary.latest.commitShort || 'unknown' }}</span>
</button>
<div v-if="open" class="workbench-dialog-backdrop" role="presentation" @click.self="open = false">
@@ -30,7 +33,7 @@ const summary = computed(() => summarizeBuilds(props.live));
<li v-for="row in summary.rows" :key="row.key" class="live-build-row" :data-live-build-row="row.key">
<div class="live-build-row-head">
<strong>{{ row.label }}</strong>
<StatusBadge :status="row.status" :label="row.builtAt ? formatTimestamp(row.builtAt) : '构建时间不可用'" />
<StatusBadge :status="row.status" :label="row.builtAt ? formatTimestamp(row.builtAt) : unavailableTimeText" />
</div>
<div class="live-build-meta">
<span>tag {{ row.tag || 'unknown' }}</span>
+12 -1
View File
@@ -6,6 +6,16 @@ export interface DisplayTimeConfig {
label: string;
}
const DEFAULT_DISPLAY_DATE_TIME_OPTIONS: Intl.DateTimeFormatOptions = {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
hour12: false
};
export function displayTimeConfig(): DisplayTimeConfig {
const config = window.HWLAB_CLOUD_WEB_CONFIG?.displayTime;
const timeZone = requiredDisplayTimeField(config?.timeZone, "timeZone");
@@ -24,7 +34,8 @@ export function formatDisplayDateTime(value: string | Date, options: Intl.DateTi
const date = value instanceof Date ? value : new Date(value);
if (!Number.isFinite(date.getTime())) return String(value);
const config = displayTimeConfig();
return new Intl.DateTimeFormat(config.locale, { hour12: false, ...options, timeZone: config.timeZone }).format(date);
const dateTimeOptions = Object.keys(options).length > 0 ? options : DEFAULT_DISPLAY_DATE_TIME_OPTIONS;
return new Intl.DateTimeFormat(config.locale, { hour12: false, ...dateTimeOptions, timeZone: config.timeZone }).format(date);
}
function requiredDisplayTimeField(value: unknown, field: string): string {
@@ -149,7 +149,7 @@ export function formatTimestamp(value: unknown): string {
if (!text) return "未观测";
const date = new Date(text);
if (!Number.isFinite(date.getTime())) return text;
return formatDisplayDateTime(date, { hour12: false });
return formatDisplayDateTime(date);
}
export function shortToken(value: unknown, size = 12): string | null {
@@ -225,7 +225,8 @@ function rowFromLiveHealth(payload: LiveProbePayload | null): BuildRow {
}
function latestBuildText(row: BuildRow): string {
const time = row.builtAt ? `${formatTimestamp(row.builtAt)} ${displayTimeLabel()}` : "构建时间不可用";
const label = displayTimeLabel();
const time = row.builtAt ? `${formatTimestamp(row.builtAt)} ${label}` : `构建时间不可用(${label}`;
return `最新镜像构建时间:${time} · ${row.label} · tag ${row.tag ?? "unknown"} · commit ${row.commitShort ?? "unknown"} · env ${row.envImageTag ?? row.envCommitShort ?? "unknown"} · revision ${row.revisionShort ?? "unknown"}`;
}