联赛配置道具关联

src/api/system/business/items/index.ts

@@ -84,3 +84,9 @@ export const selectServiceItemsSelList = (): AxiosPromise<ItemsVO> => {
     method: 'get'
   });
 };
+export const selectMainTournamentSelList = (): AxiosPromise<ItemsVO> => {
+  return request({
+    url: '/business/items/selectMainTournamentSelList',
+    method: 'get'
+  });
+};

src/api/system/physical/leagueTournament/types.ts

@@ -65,6 +65,10 @@ export interface LeagueTournamentVO {
    * 计时器背景图片
    */
   timerBgPicture: string;
+
+  itemIds: string;
+
+  itemIdsArray: string[];
 }
 
 export interface LeagueTournamentForm extends BaseEntity {
@@ -136,6 +140,10 @@ export interface LeagueTournamentForm extends BaseEntity {
    * 计时器背景图片
    */
   timerBgPicture: string;
+
+  itemIds: string;
+
+  itemIdsArray: string[];
 }
 
 export interface LeagueTournamentQuery extends PageQuery {
@@ -203,4 +211,6 @@ export interface LeagueTournamentQuery extends PageQuery {
    * 计时器背景图片
    */
   timerBgPicture: string;
+
+  itemIds: string;
 }

src/views/system/physical/leagueTournament/index.vue

@@ -71,7 +71,7 @@
             <span v-else></span>
           </template>
         </el-table-column>
-<!--        <el-table-column label="计时器图片" align="center" width="90">
+        <!--        <el-table-column label="计时器图片" align="center" width="90">
           <template #default="scope">
             <el-image
               v-if="scope.row.timerBgPicture"
@@ -128,12 +128,21 @@
             <span v-else>未知</span>
           </template>
         </el-table-column>
+        <el-table-column label="关联道具" align="center" prop="itemIdsArray">
+          <!-- 使用作用域插槽来定制显示 -->
+          <template #default="scope">
+            <!-- 1. 如果绑定的 prop="itemIdsArray"，直接用 scope.row.itemIdsArray 即可 -->
+            <!-- 2. 用 join('、') 把数组拼接成 "主赛邀请函AB卡、主赛邀请函ABC卡" 这样的格式 -->
+            <!-- 3. 加上 ?. 防止数据为空时报错 -->
+            {{ scope.row.itemIdsArray?.join('、') }}
+          </template>
+        </el-table-column>
         <el-table-column label="创建时间" align="center" prop="createdAt" width="180">
           <template #default="scope">
             <span>{{ parseTime(scope.row.createdAt, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
           </template>
         </el-table-column>
-<!--        <el-table-column label="更新时间" align="center" prop="updatedAt" width="180">
+        <!--        <el-table-column label="更新时间" align="center" prop="updatedAt" width="180">
           <template #default="scope">
             <span>{{ parseTime(scope.row.updatedAt, '{y}-{m}-{d}') }}</span>
           </template>
@@ -216,7 +225,7 @@
             </el-upload>
           </div>
         </el-form-item>
-<!--        <el-form-item label="计时器背景图" prop="timerBgPicture">
+        <!--        <el-form-item label="计时器背景图" prop="timerBgPicture">
           <div class="upload-container">
             <el-upload
               class="upload-icon"
@@ -288,6 +297,16 @@
         <el-form-item label="比赛地址" prop="location">
           <el-input v-model="form.location" type="textarea" :rows="3" placeholder="请输入比赛地址" />
         </el-form-item>
+
+        <el-form-item label="关联道具" prop="itemIds">
+          <div style="display: flex; align-items: center; gap: 10px; width: 100%">
+            <!-- 加上 multiple 属性即可开启多选 -->
+            <el-select v-model="form.itemIdsArray" placeholder="请选择道具" multiple collapse-tags collapse-tags-tooltip style="flex: 1">
+              <!-- 把 value 绑定成 label 的字符串 -->
+              <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="String(item.id)" />
+            </el-select>
+          </div>
+        </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -315,6 +334,7 @@ import {
 } from '@/api/system/physical/leagueTournament';
 import { LeagueTournamentVO, LeagueTournamentQuery, LeagueTournamentForm } from '@/api/system/physical/leagueTournament/types';
 import { uploadTournament } from '@/api/system/business/tournaments';
+import { selectMainTournamentSelList, selectXianXiaItemsSelList } from '@/api/system/business/items';
 import { parseTime } from '@/utils/dateUtils';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { game_variant_type, tournaments_time, physical_tournaments_type } = toRefs<any>(
@@ -474,6 +494,16 @@ const handleUpdate = async (row?: LeagueTournamentVO) => {
       }
     ];
   }
+
+  // 3. 处理 itemIds 回显
+  if (typeof form.value.itemIds === 'string' && form.value.itemIds) {
+    // 只要后端给字符串，你就把它切成字符串数组赋值即可
+    // 此时组件里的 value 也是字符串，完美匹配，不再报错
+    form.value.itemIdsArray = form.value.itemIds.split(',');
+  } else {
+    // 兜底：如果没有，就给它一个空数组，或者如果它已经是数组就直接赋值
+    form.value.itemIdsArray = [];
+  }
 };
 
 /** 提交按钮 */
@@ -481,10 +511,15 @@ const submitForm = () => {
   leagueTournamentFormRef.value?.validate(async (valid: boolean) => {
     if (valid) {
       buttonLoading.value = true;
+      const params = { ...form.value };
+      // 2. 如果 itemIds 是数组，就转成逗号拼接的字符串；如果不是数组（比如编辑时已经是字符串了），就保持原样
+      if (Array.isArray(params.itemIdsArray)) {
+        params.itemIds = params.itemIdsArray.join(',');
+      }
       if (form.value.id) {
-        await updateLeagueTournament(form.value).finally(() => (buttonLoading.value = false));
+        await updateLeagueTournament(params).finally(() => (buttonLoading.value = false));
       } else {
-        await addLeagueTournament(form.value).finally(() => (buttonLoading.value = false));
+        await addLeagueTournament(params).finally(() => (buttonLoading.value = false));
       }
       proxy?.$modal.msgSuccess('操作成功');
       dialog.visible = false;
@@ -515,6 +550,7 @@ const handleExport = () => {
 
 onMounted(() => {
   getList();
+  loadItemOptions();
 });
 // 图片上传相关
 const fileList = ref([]); // ← 新增
@@ -683,4 +719,26 @@ const handleStatusChange = async (row: LeagueTournamentVO) => {
     }
   }
 };
+const itemOptions = ref<{ id: number; label: string }[]>([]);
+// 加载报名条件选项
+const loadItemOptions = async () => {
+  try {
+    const res = await selectMainTournamentSelList();
+    if (res.code === 200) {
+      // 类型断言
+      const data = res.data as unknown as { id: number; name: string }[];
+
+      // 过滤掉 id === 2 的项，并映射为 { id, label }
+      itemOptions.value = data.map((item) => ({
+        id: item.id,
+        label: item.name
+      }));
+    } else {
+      ElMessage.error('加载失败：' + res.msg);
+    }
+  } catch (error) {
+    console.error('请求出错:', error);
+    ElMessage.error('请求失败，请检查网络');
+  }
+};
 </script>