diff --git a/web/src/components/layout/TopBar.vue b/web/src/components/layout/TopBar.vue index eaf71ef..7dae4cb 100644 --- a/web/src/components/layout/TopBar.vue +++ b/web/src/components/layout/TopBar.vue @@ -266,29 +266,22 @@ const calendarOpen = ref(false) const draftStart = ref(props.customRange.start) const draftEnd = ref(props.customRange.end) -const fallbackRangeLabels = ['今日', '本周', '本月'] -const dateLabels = { - '今日': '2024-07-12', - '本周': '2024-07-06 ~ 2024-07-12', - '本月': '2024-07' -} - -const rangeOptions = computed(() => - props.ranges.map((range, index) => ({ - value: range, - label: fallbackRangeLabels[index] ?? String(range) - })) -) +const rangeOptions = computed(() => + props.ranges.map((range, index) => ({ + value: range, + label: String(range) + })) +) const activeOption = computed(() => rangeOptions.value.find((option) => option.value === props.activeRange) ?? rangeOptions.value[0] ) const isCustomRange = computed(() => props.activeRange === 'custom') -const activeDateLabel = computed(() => { - if (isCustomRange.value) return formatRangeLabel(props.customRange.start, props.customRange.end) - return dateLabels[activeOption.value?.label] ?? '2024-07-06 ~ 2024-07-12' -}) +const activeDateLabel = computed(() => { + if (isCustomRange.value) return formatRangeLabel(props.customRange.start, props.customRange.end) + return buildPresetRangeLabel(activeOption.value?.label) +}) const canApplyCustomRange = computed(() => Boolean(draftStart.value && draftEnd.value && draftStart.value <= draftEnd.value) @@ -315,12 +308,49 @@ function applyCustomRange() { calendarOpen.value = false } -function formatRangeLabel(start, end) { - if (!start || !end) return '选择时间段' - if (start === end) return start - return `${start} ~ ${end}` -} - +function formatRangeLabel(start, end) { + if (!start || !end) return '选择时间段' + if (start === end) return start + return `${start} ~ ${end}` +} + +function toDateLabel(date) { + const year = date.getFullYear() + const month = String(date.getMonth() + 1).padStart(2, '0') + const day = String(date.getDate()).padStart(2, '0') + return `${year}-${month}-${day}` +} + +function buildPresetRangeLabel(label) { + const now = new Date() + const today = toDateLabel(now) + + if (label === '今日') { + return today + } + + if (label === '近10日') { + const start = new Date(now) + start.setHours(0, 0, 0, 0) + start.setDate(start.getDate() - 9) + return `${toDateLabel(start)} ~ ${today}` + } + + if (label === '本周') { + const start = new Date(now) + const day = start.getDay() || 7 + start.setHours(0, 0, 0, 0) + start.setDate(start.getDate() - day + 1) + return `${toDateLabel(start)} ~ ${today}` + } + + if (label === '本月') { + return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}` + } + + return today +} +