diff --git a/src/components/MilestonePoint.vue b/src/components/MilestonePoint.vue index bdf1985..0789aa5 100644 --- a/src/components/MilestonePoint.vue +++ b/src/components/MilestonePoint.vue @@ -2,6 +2,13 @@ import { computed, ref, onUnmounted } from 'vue' import type { Milestone } from '../models/classes/Milestone' import { TimelineScale } from '../models/types/TimelineScale' +import { useI18n } from '../composables/useI18n' + +const { setLocale, getTranslation } = useI18n() + +const t = (key: string): string => { + return getTranslation(key) +} interface Props { date: string // 里程碑日期 @@ -478,26 +485,26 @@ const handleMilestoneMouseLeave = () => { // 格式化日期显示 const formatDisplayDate = (dateStr: string): string => { - if (!dateStr) return '未设置' + if (!dateStr) return t('dateNotSet') //Not Set try { const date = new Date(dateStr) - if (isNaN(date.getTime())) return '未设置' + if (isNaN(date.getTime())) return t('dateNotSet') 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}` } catch { - return '未设置' + return t('dateNotSet') } } -// Tooltip内容 +// Tooltip内容 Target date const tooltipContent = computed(() => { - const milestoneName = props.name || props.milestone?.name || '里程碑' + const milestoneName = props.name || props.milestone?.name || t('milestone') const targetDate = formatDisplayDate(props.date || props.milestone?.startDate || '') - return `里程碑:${milestoneName} - 目标日期:${targetDate}` + return `${t('milestone')}:${milestoneName} - ${t('targetDate')}:${targetDate}` }) // 组件销毁时清理事件监听器 diff --git a/src/composables/useI18n.ts b/src/composables/useI18n.ts index c126f53..21b503d 100644 --- a/src/composables/useI18n.ts +++ b/src/composables/useI18n.ts @@ -41,6 +41,7 @@ const messages = { // 其他 milestone: '里程碑', + targetDate: '目标日期', today: '今天', // 里程碑对话框 milestoneDetails: '里程碑详情', @@ -192,6 +193,7 @@ const messages = { // 其他 milestone: 'Milestone', + targetDate: 'Target Date', today: 'Today', // 里程碑对话框 milestoneDetails: 'Milestone Details',