feat(eventGroupConfig): 优化赛事分组配置功能

- 添加决赛组间隔天数和时间设置功能
- 实现决赛组日期自动计算功能
- 调整表单字段顺序，优化用户体验
- 修复模板ID类型转换问题
- 添加表单重置功能，确保数据正确初始化
- 实现决赛组日期自动计算和更新机制

src/views/system/business/eventGroupConfig/index.vue

@@ -22,12 +22,12 @@
           <el-col :span="1.5">
             <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['business:eventGroupConfig:add']">新增</el-button>
           </el-col>
-<!--          <el-col :span="1.5">
+          <!--          <el-col :span="1.5">
             <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['business:eventGroupConfig:edit']"
               >修改</el-button
             >
           </el-col>-->
-<!--          <el-col :span="1.5">
+          <!--          <el-col :span="1.5">
             <el-button
               type="danger"
               plain
@@ -38,7 +38,7 @@
               >删除</el-button
             >
           </el-col>-->
-<!--          <el-col :span="1.5">
+          <!--          <el-col :span="1.5">
             <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['business:eventGroupConfig:export']">导出</el-button>
           </el-col>-->
           <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
@@ -46,7 +46,7 @@
       </template>
 
       <el-table v-loading="loading" border :data="eventGroupConfigList">
-<!--        <el-table-column type="selection" width="55" align="center" />-->
+        <!--        <el-table-column type="selection" width="55" align="center" />-->
         <el-table-column label="编号" align="center" prop="id" v-if="true" width="70" />
         <el-table-column label="名称" align="center" prop="name" />
         <el-table-column label="决赛组模板" align="center" prop="finalTemplateName" />
@@ -129,28 +129,15 @@
         <el-form-item label="名称" prop="name">
           <el-input v-model="groupForm.name" placeholder="请输入名称" />
         </el-form-item>
-
-        <el-form-item label="常规组模板" prop="regularTemplateId">
-          <el-select v-model="groupForm.regularTemplateId" placeholder="选项">
-            <el-option v-for="item in itemOptionsTournamentTemplateList" :key="item.id" :label="item.label" :value="item.id" />
-          </el-select>
-        </el-form-item>
-
         <el-form-item label="决赛组模板" prop="finalTemplateId">
           <el-select v-model="groupForm.finalTemplateId" placeholder="选项">
             <el-option v-for="item in itemOptionsTournamentTemplateList" :key="item.id" :label="item.label" :value="item.id" />
           </el-select>
         </el-form-item>
-        <!-- 开始日期 -->
-        <el-form-item label="决赛组日期" prop="finalStartDate">
-          <el-date-picker
-            v-model="groupForm.finalStartDate"
-            type="datetime"
-            value-format="YYYY-MM-DD HH:mm"
-            format="YYYY-MM-DD HH:mm"
-            placeholder="选择开始日期和时间"
-            style="width: 100%"
-          />
+        <el-form-item label="常规组模板" prop="regularTemplateId">
+          <el-select v-model="groupForm.regularTemplateId" placeholder="选项">
+            <el-option v-for="item in itemOptionsTournamentTemplateList" :key="item.id" :label="item.label" :value="item.id" />
+          </el-select>
         </el-form-item>
         <!-- 开始日期 -->
         <el-form-item label="常规组日期" prop="startDate">
@@ -173,6 +160,38 @@
             <el-button type="primary" icon="Minus" @click="removeGroup(index)" v-else style="width: 40px; height: 40px" />
           </div>
         </el-form-item>
+        <el-form-item label="决赛组别">
+          <div style="display: flex; align-items: center; gap: 10px; margin-bottom: 10px">
+            <span style="width: 60px">决赛组</span>
+            间隔天数:<el-input-number
+              v-model="groupForm.finalIntervalDays"
+              :min="0"
+              :max="7"
+              controls-position="right"
+              placeholder="间隔天数"
+              style="width: 80px"
+            />
+            <el-time-picker
+              v-model="groupForm.finalTime"
+              value-format="HH:mm"
+              format="HH:mm"
+              placeholder="选择时间"
+              style="flex: 1; min-width: 120px"
+            />
+          </div>
+        </el-form-item>
+        <!-- 开始日期 -->
+        <el-form-item label="决赛组日期" prop="finalStartDate">
+          <el-date-picker
+            v-model="groupForm.finalStartDate"
+            disabled
+            type="datetime"
+            value-format="YYYY-MM-DD HH:mm"
+            format="YYYY-MM-DD HH:mm"
+            placeholder="选择开始日期和时间"
+            style="width: 100%"
+          />
+        </el-form-item>
       </el-form>
 
       <template #footer>
@@ -289,12 +308,29 @@ const handleSelectionChange = (selection: EventGroupConfigVO[]) => {
 
 /** 新增按钮操作 */
 const handleAdd = () => {
-  reset();
+  resetAll();
   dialog.visible = true;
   dialog.title = '添加';
 };
-
-/** 修改按钮操作 */
+// 在 script setup 中添加
+const resetAll = () => {
+  reset(); // 重置 form.value
+
+  // 重置 groupForm
+  groupForm.value = {
+    regularTemplateId: '',
+    finalTemplateId: '',
+    startDate: '',
+    finalStartDate: '',
+    generateDays: 1,
+    name: '',
+    finalIntervalDays: 0,
+    finalTime: ''
+  };
+
+  // 重置 groupList
+  groupList.value = [{ name: 'A', time: '', intervalDays: 0 }];
+};
 /** 修改按钮操作 */
 const handleUpdate = async (row?: EventGroupConfigVO) => {
   reset();
@@ -306,7 +342,8 @@ const handleUpdate = async (row?: EventGroupConfigVO) => {
 
     // 将数据赋值到 form.value
     Object.assign(form.value, res.data);
-
+    form.value.regularTemplateId = Number(res.data.regularTemplateId);
+    form.value.finalTemplateId = Number(res.data.finalTemplateId);
     // 处理 groupList 数据
     if (res.data.groups && Array.isArray(res.data.groups)) {
       groupList.value = res.data.groups.map((group) => ({
@@ -318,10 +355,10 @@ const handleUpdate = async (row?: EventGroupConfigVO) => {
       // 如果没有 groups 数据，初始化默认值
       groupList.value = [{ name: 'A', time: '', intervalDays: 0 }];
     }
-
+    await handleBlindStructureChange(); // 确保选项已加载
     // 设置表单其他字段
-    groupForm.value.regularTemplateId = res.data.regularTemplateId;
-    groupForm.value.finalTemplateId = res.data.finalTemplateId;
+    groupForm.value.regularTemplateId = Number(res.data.regularTemplateId);
+    groupForm.value.finalTemplateId = Number(res.data.finalTemplateId);
     groupForm.value.startDate = res.data.startDate;
     groupForm.value.name = res.data.name;
     groupForm.value.finalStartDate = res.data.finalStartDate;
@@ -393,13 +430,17 @@ const groupForm = ref<{
   finalStartDate: string;
   generateDays: number;
   name: string;
+  finalIntervalDays: number;
+  finalTime: string;
 }>({
   regularTemplateId: '',
   finalTemplateId: '',
   startDate: '',
   finalStartDate: '',
   generateDays: 1,
-  name: ''
+  name: '',
+  finalIntervalDays: 0,
+  finalTime: ''
 });
 
 // 组别列表（修改为包含时间和名称的对象数组）
@@ -503,4 +544,34 @@ const handleGenerateMatchesForNextSevenDays = async (row?: EventGroupConfigVO) =
   proxy?.$modal.msgSuccess('生成成功');
   await getList();
 };
+// 添加计算属性来自动计算决赛组日期
+const computedFinalStartDate = computed(() => {
+  if (!groupForm.value.startDate || !groupForm.value.finalTime) {
+    return '';
+  }
+
+  // 解析常规组日期
+  const startDate = new Date(groupForm.value.startDate);
+
+  // 添加间隔天数
+  const intervalDays = parseInt(groupForm.value.finalIntervalDays.toString()) || 0;
+  startDate.setDate(startDate.getDate() + intervalDays);
+
+  // 设置时间为决赛组时间
+  const timeParts = groupForm.value.finalTime.split(':');
+  startDate.setHours(parseInt(timeParts[0]), parseInt(timeParts[1]));
+
+  // 格式化为 YYYY-MM-DD HH:mm
+  return `${startDate.getFullYear()}-${String(startDate.getMonth() + 1).padStart(2, '0')}-${String(startDate.getDate()).padStart(2, '0')} ${timeParts[0]}:${timeParts[1]}`;
+});
+// 在 script setup 中添加
+watch(
+  [() => groupForm.value.finalIntervalDays, () => groupForm.value.finalTime],
+  () => {
+    if (groupForm.value.finalIntervalDays !== undefined && groupForm.value.finalTime) {
+      groupForm.value.finalStartDate = computedFinalStartDate.value;
+    }
+  },
+  { deep: true }
+);
 </script>