瀏覽代碼

feat(tournaments): 添加赛事展示隐藏功能并优化表单组件

- 新增 updateByTournament API 接口用于更新赛事信息
- 在赛事列表中添加展示/隐藏按钮,支持实时切换赛事显示状态
- 将表单项"目标锦标赛"文本改为"目标赛事"
- 为下拉选择框添加 filterable 属性支持搜索功能
- 添加空状态提示模板显示加载中和暂无数据状态
- 初始化表单数据时设置 gameVariant 默认值为 '0'
- 修复报名条件验证逻辑并注释掉相关校验规则
- 添加监听对话框显示状态的 watch,确保数据及时加载
- 优化数据转换逻辑使用 map 方法替代 for 循环
- 修复远程搜索方法中的数据过滤逻辑
- 在类型定义中新增 isShow 字段支持显示状态管理
fugui 3 周之前
父節點
當前提交
a18f25e502

+ 7 - 1
src/api/system/physical/tournaments/index.ts

@@ -50,7 +50,13 @@ export const updateTournaments = (data: TournamentsForm) => {
     data: data
   });
 };
-
+export const updateByTournament = (data: TournamentsForm) => {
+  return request({
+    url: '/physical/tournaments/updateByTournament',
+    method: 'put',
+    data: data
+  });
+};
 /**
  * 删除线下赛事
  * @param id

+ 4 - 1
src/api/system/physical/tournaments/types.ts

@@ -161,6 +161,8 @@ export interface TournamentsVO {
   qualifierValue: number;
 
   tournamentType?: number;
+
+  isShow: number;
 }
 
 export interface TournamentsForm extends BaseEntity {
@@ -343,6 +345,7 @@ export interface TournamentsForm extends BaseEntity {
   leagueTournamentRegionId?: number;
   leagueTournamentRegion?: string;
   judgeId?: number[];
+  isShow: number;
 }
 export interface ItemsPrize {
   ranking: number;
@@ -506,7 +509,7 @@ export interface TournamentsQuery extends PageQuery {
    */
   qualifierValue?: number;
   tournamentType?: number;
-
+  isShow: number;
   /**
    * 日期范围参数
    */

+ 70 - 19
src/views/system/physical/tournaments/index.vue

@@ -154,6 +154,17 @@
             <el-tooltip content="复制" placement="top" v-hasPermi="['business:tournaments:query']">
               <el-button link type="primary" icon="Files" @click="handleCopy(scope.row)"> 复制 </el-button>
             </el-tooltip>
+            <el-tooltip :content="scope.row.isShow === 1 ? '隐藏' : '展示'" placement="top">
+              <el-button
+                link
+                :type="scope.row.isShow === 1 ? 'warning' : 'success'"
+                :icon="scope.row.isShow === 1 ? 'Hide' : 'View'"
+                @click="handleToggleShow(scope.row)"
+                v-hasPermi="['physical:tournaments:edit']"
+              >
+                {{ scope.row.isShow === 1 ? '隐藏' : '展示' }}
+              </el-button>
+            </el-tooltip>
           </template>
         </el-table-column>
       </el-table>
@@ -424,7 +435,7 @@
             <el-option v-for="item in tournamentTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
           </el-select>
         </el-form-item>
-        <el-form-item label="目标锦标赛" prop="targetTournamentId" v-if="form.tournamentType === 1">
+        <el-form-item label="目标赛" prop="targetTournamentId" v-if="form.tournamentType === 1">
           <el-select
             v-model="form.targetTournamentId"
             placeholder="请选择比赛"
@@ -433,8 +444,18 @@
             :remote-method="loadTargetTournaments"
             :loading="selectLoading"
             clearable
+            filterable
           >
             <el-option v-for="item in selectOptions" :key="item.id" :label="item.label" :value="item.id" />
+            <!-- 添加空状态提示 -->
+            <template #empty>
+              <div v-if="selectLoading" class="el-select-dropdown__empty">
+                <span>加载中...</span>
+              </div>
+              <div v-else-if="selectOptions.length === 0" class="el-select-dropdown__empty">
+                <span>暂无数据</span>
+              </div>
+            </template>
           </el-select>
         </el-form-item>
         <el-form-item label="晋级条件类型" prop="qualifierType" v-if="form.tournamentType === 1">
@@ -481,6 +502,7 @@ import {
   delTournaments,
   addTournaments,
   updateTournaments,
+  updateByTournament,
   selectPhysicalTournamentsLeagueId
 } from '@/api/system/physical/tournaments';
 import { TournamentsVO, TournamentsQuery, TournamentsForm } from '@/api/system/physical/tournaments/types';
@@ -525,13 +547,14 @@ const dialog = reactive<{
 });
 
 const initFormData: TournamentsForm = {
+
   id: undefined,
   name: undefined,
   startTime: undefined,
   endTime: undefined,
   pauseTime: undefined,
   gameType: undefined,
-  gameVariant: undefined,
+  gameVariant: '0',
   startingChips: undefined,
   levelDuration: undefined,
   lateRegistrationLevel: undefined,
@@ -615,15 +638,14 @@ const data = reactive<PageData<TournamentsForm, TournamentsQuery>>({
             callback();
             return;
           }
-
+          callback();
           // 检查是否至少有一个报名条件被设置
-          const hasValidCondition = formConditions.conditions.some((condition) => condition.itemId && condition.quantity);
-
-          if (!hasValidCondition) {
+          /*  const hasValidCondition = formConditions.conditions.some((condition) => condition.itemId && condition.quantity);
+         if (!hasValidCondition) {
             callback(new Error('报名条件不能为空'));
           } else {
             callback();
-          }
+          }*/
         },
         trigger: 'change'
       }
@@ -973,6 +995,16 @@ watch(
   },
   { immediate: false }
 );
+// 添加watch监听对话框显示状态,确保打开时数据已加载
+watch(
+  () => dialog.visible,
+  async (newVal) => {
+    if (newVal && selectOptions.value.length === 0) {
+      // 只有在选项为空时才重新加载,避免重复请求
+      await loadLeagueRelatedTournaments();
+    }
+  }
+);
 const itemOptions = ref<{ id: number; label: string }[]>([]);
 // 加载报名条件选项
 const loadItemOptions = async () => {
@@ -1431,15 +1463,12 @@ const loadLeagueRelatedTournaments = async () => {
     selectLoading.value = true;
     const res = await selectPhysicalTournamentsLeagueId();
     const data2 = res.data as unknown as { id: number; name: string }[];
-    const list = [];
-    for (let i = 0; i < data2.length; i++) {
-      const item = data2[i];
-      list.push({
-        id: item.id,
-        label: item.name
-      });
-    }
-    selectOptions.value = list;
+
+    // 使用map方法提高效率和可读性
+    selectOptions.value = data2.map((item) => ({
+      id: item.id,
+      label: item.name
+    }));
   } catch (error) {
     console.error('加载联赛关联赛事失败', error);
     ElMessage.error('加载失败');
@@ -1449,12 +1478,11 @@ const loadLeagueRelatedTournaments = async () => {
 };
 const loadTargetTournaments = (query: string) => {
   if (!query.trim()) {
-    selectOptions.value = leagueRelatedTournaments.value;
+    selectOptions.value = selectOptions.value;
     return;
   }
   // 这里可加模糊搜索逻辑(如 filter)222
-  selectOptions.value = leagueRelatedTournaments.value.filter((item) => item.name.toLowerCase().includes(query.toLowerCase()));
-};
+  selectOptions.value = selectOptions.value.filter((item) => item.label.toLowerCase().includes(query.toLowerCase()));};
 const handleCompetitionZoneChange = (value: number) => {
   const selectedZone = competitionZoneOptions.value.find((item) => item.id === value);
   if (selectedZone) {
@@ -1463,4 +1491,27 @@ const handleCompetitionZoneChange = (value: number) => {
     form.value.leagueTournamentRegion = '';
   }
 };
+/** 切换展示/隐藏状态 */
+const handleToggleShow = async (row: TournamentsVO) => {
+  const newStatus = row.isShow === 1 ? 0 : 1;
+  const statusText = newStatus === 1 ? '展示' : '隐藏';
+
+  try {
+    await proxy?.$modal.confirm(`确认要${statusText}该赛事吗?`);
+
+    // 使用 updateTournaments 接口,只传入 id 和 isShow 字段
+    await updateByTournament({
+      id: row.id,
+      isShow: newStatus
+    } as TournamentsForm);
+
+    proxy?.$modal.msgSuccess(`${statusText}成功`);
+    await getList();
+  } catch (error) {
+    if (error !== 'cancel') {
+      console.error('切换状态失败:', error);
+      proxy?.$modal.msgError(`${statusText}失败,请重试`);
+    }
+  }
+};
 </script>