支持设置默认timeline scale

src/components/GanttChart.vue

@@ -117,6 +117,15 @@ const timelineRef = ref<InstanceType<typeof Timeline> | null>(null)
 // 时间刻度状态
 const currentTimeScale = ref<TimelineScale>(TimelineScale.DAY)
 
+watch(
+  () => timelineRef.value,
+  newTimeline => {
+    if (newTimeline) {
+      newTimeline.updateTimeScale(currentTimeScale.value)
+    }
+  },
+)
+
 // TaskList的固定总长度（所有列的最小宽度之和 + 边框等额外空间）
 // 列宽: 300+120+120+140+140+100+100+100 = 1120px
 // 边框: 7个列间边框 * 1px = 7px

src/components/GanttToolbar.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, computed } from 'vue'
+import { ref, onMounted, onUnmounted, computed, watch } from 'vue'
 import { useI18n } from '../composables/useI18n'
 import type { ToolbarConfig } from '../models/configs/ToolbarConfig'
 import { TimelineScale } from '../models/types/TimelineScale'
@@ -266,6 +266,44 @@ const handleFullscreenToggle = () => {
   }
 }
 
+// 时间刻度配置映射
+const timeScaleMap = {
+  hour: { value: TimelineScale.HOUR, label: () => t('timeScaleHour') },
+  day: { value: TimelineScale.DAY, label: () => t('timeScaleDay') },
+  week: { value: TimelineScale.WEEK, label: () => t('timeScaleWeek') },
+  month: { value: TimelineScale.MONTH, label: () => t('timeScaleMonth') },
+  quarter: { value: TimelineScale.QUARTER, label: () => t('timeScaleQuarter') },
+  year: { value: TimelineScale.YEAR, label: () => t('timeScaleYear') },
+}
+
+type TimeScaleKey = keyof typeof timeScaleMap
+const defaultScaleKeys: TimeScaleKey[] = ['hour', 'day', 'week', 'month', 'year']
+
+// 获取可用的时间刻度维度
+const availableTimeScales = computed<TimeScaleKey[]>(() => {
+  const configured = props.config?.timeScaleDimensions as TimeScaleKey[] | undefined
+  const normalized = (configured ?? defaultScaleKeys).filter(
+    (scale): scale is TimeScaleKey => scale in timeScaleMap,
+  )
+  return normalized.length > 0 ? normalized : [...defaultScaleKeys]
+})
+
+// 根据配置解析默认时间刻度
+const resolvedDefaultScaleKey = computed<TimeScaleKey>(() => {
+  const keys = availableTimeScales.value
+  const candidate = props.config?.defaultTimeScale as TimeScaleKey | undefined
+
+  if (candidate && keys.includes(candidate)) {
+    return candidate
+  }
+
+  if (keys.includes('day')) {
+    return 'day'
+  }
+
+  return keys[0] ?? 'day'
+})
+
 // 时间刻度切换处理
 const handleTimeScaleChange = (scale: TimelineScale) => {
   currentTimeScale.value = scale
@@ -277,28 +315,26 @@ const handleTimeScaleChange = (scale: TimelineScale) => {
   }
 }
 
-// 获取可用的时间刻度维度
+// 监听配置变化并应用默认时间刻度
-const availableTimeScales = computed(() => {
+let hasAppliedConfigScale = false
-  const defaultScales = ['hour', 'day', 'week', 'month', 'year'] as const
+watch(
-  return props.config?.timeScaleDimensions || defaultScales
+  () => resolvedDefaultScaleKey.value,
-})
+  newKey => {
-
+    const targetScale = timeScaleMap[newKey].value
-// 时间刻度配置映射
+    if (currentTimeScale.value !== targetScale || !hasAppliedConfigScale) {
-const timeScaleMap = {
+      hasAppliedConfigScale = true
-  hour: { value: TimelineScale.HOUR, label: () => t('timeScaleHour') },
+      handleTimeScaleChange(targetScale)
-  day: { value: TimelineScale.DAY, label: () => t('timeScaleDay') },
+    }
-  week: { value: TimelineScale.WEEK, label: () => t('timeScaleWeek') },
+  },
-  month: { value: TimelineScale.MONTH, label: () => t('timeScaleMonth') },
+  { immediate: true },
-  quarter: { value: TimelineScale.QUARTER, label: () => t('timeScaleQuarter') },
+)
-  year: { value: TimelineScale.YEAR, label: () => t('timeScaleYear') },
-}
 
 // 获取当前时间刻度对应的字符串键
-const currentTimeScaleKey = computed(() => {
+const currentTimeScaleKey = computed<TimeScaleKey>(() => {
-  const entry = Object.entries(timeScaleMap).find(
+  const matchedKey = availableTimeScales.value.find(
-    ([, config]) => config.value === currentTimeScale.value,
+    scaleKey => timeScaleMap[scaleKey].value === currentTimeScale.value,
   )
-  return entry ? entry[0] : 'day'
+  return matchedKey ?? resolvedDefaultScaleKey.value
 })
 
 // 计算分段控制器滑块位置

src/components/TaskRow.vue

@@ -438,7 +438,7 @@ onUnmounted(() => {
         @add-successor="emit('add-successor', $event)"
         @delete="handleTaskDelete"
       >
-        <template v-if="hasContentSlot" #custom-task-content="childScope">
+        <template v-if="hasContentSlot" #custom-task-content="childScope: any">
           <slot name="custom-task-content" v-bind="childScope" />
         </template>
       </TaskRow>

src/models/configs/ToolbarConfig.ts

@@ -1,3 +1,5 @@
+import type { TimelineScale } from '../types/TimelineScale'
+
 // ToolbarConfig 类型定义
 export interface ToolbarConfig {
   showAddTask?: boolean
@@ -9,5 +11,6 @@ export interface ToolbarConfig {
   showTheme?: boolean
   showFullscreen?: boolean
   showTimeScale?: boolean // 显示时间刻度按钮组
-  timeScaleDimensions?: ('hour' | 'day' | 'week' | 'month' | 'year')[] // 设置时间刻度按钮的展示维度
+  timeScaleDimensions?: TimelineScale[] // 设置时间刻度按钮的展示维度
+  defaultTimeScale?: TimelineScale // 默认选中的时间刻度
 }