refactor(gantt): 优化任务数据转换及甘特图日期范围计算

- 调整任务标签显示逻辑，左侧标签加入负责人括号显示
- 任务条标签独立显示任务名，保持界面简洁
- 计算甘特图日期范围时，优先使用任务实际日期动态计算
- 对日期范围添加了前后7天的边距，提高展示灵活性
- 兼容无项目结束日期情况，默认显示30天跨度
- 保持代码结构清晰，增强日期计算的鲁棒性

src/views/project/detail.vue

@@ -301,9 +301,12 @@ function getMaterialStatusType(
 
 // 将任务数据转换为 vue-ganttastic 格式
 const ganttTasks = computed(() => {
-  return taskList.value.map(task => ({
+  return taskList.value.map(task => {
+    const assigneeText = task.assigneeName ? `【${task.assigneeName}】` : "";
+    return {
       id: task.id,
-    label: task.taskName,
+      // 左侧标签显示：任务名 + 负责人
+      label: `${task.taskName} ${assigneeText}`,
       startDate: task.planStartDate || "",
       endDate: task.planEndDate || "",
       progress: task.progress || 0,
@@ -311,14 +314,16 @@ const ganttTasks = computed(() => {
       status: task.status || "pending",
       ganttBarConfig: {
         id: task.id,
-      label: `${task.taskName} ${task.assigneeName ? "负责人：" + task.assigneeName : ""}`,
+        // 任务条上显示任务名
+        label: task.taskName,
         hasHandles: false,
         style: {
           backgroundColor: getTaskColor(task.status, task.progress),
           color: "#fff"
         }
       }
-  }));
+    };
+  });
 });
 
 // 获取任务颜色
@@ -422,15 +427,47 @@ const sortedMilestones = computed(() => {
   });
 });
 
-// 计算甘特图日期范围
+// 计算甘特图日期范围（根据任务实际日期动态计算）
 const ganttDateRange = computed(() => {
-  const start = projectInfo.value.startDate || dayjs().format("YYYY-MM-DD");
+  // 1. 优先从任务列表获取日期范围
-  const end =
+  if (taskList.value.length > 0) {
-    projectInfo.value.endDate || dayjs().add(6, "month").format("YYYY-MM-DD");
+    const taskDates = taskList.value
-  return {
+      .filter(t => t.planStartDate || t.planEndDate)
-    start: dayjs(start).format("YYYY-MM-DD"),
+      .flatMap(t => [t.planStartDate, t.planEndDate].filter(d => d));
-    end: dayjs(end).format("YYYY-MM-DD")
+
-  };
+    if (taskDates.length > 0) {
+      const validDates = taskDates.filter(d => d);
+      const minDate = validDates.reduce(
+        (min, d) => (d < min ? d : min),
+        validDates[0]
+      );
+      const maxDate = validDates.reduce(
+        (max, d) => (d > max ? d : max),
+        validDates[0]
+      );
+
+      // 添加前后边距（各7天）
+      const start = dayjs(minDate).subtract(7, "day").format("YYYY-MM-DD");
+      const end = dayjs(maxDate).add(7, "day").format("YYYY-MM-DD");
+      return { start, end };
+    }
+  }
+
+  // 2. 使用项目日期（添加前后边距）
+  const projectStart =
+    projectInfo.value.startDate || dayjs().format("YYYY-MM-DD");
+  const projectEnd = projectInfo.value.endDate;
+
+  if (projectEnd) {
+    const start = dayjs(projectStart).subtract(7, "day").format("YYYY-MM-DD");
+    const end = dayjs(projectEnd).add(7, "day").format("YYYY-MM-DD");
+    return { start, end };
+  }
+
+  // 3. 无结束日期时，默认显示30天
+  const start = dayjs(projectStart).subtract(7, "day").format("YYYY-MM-DD");
+  const end = dayjs(projectStart).add(23, "day").format("YYYY-MM-DD");
+  return { start, end };
 });
 
 // 计算项目时间跨度（天数）