Преглед на файлове

feat(gameEventGroup): 添加项目参赛人数统计和运动员列表查看功能

- 新增getAthleteCount API获取项目参赛人数
- 新增AthleteListDialog组件显示参赛运动员列表
- 在赛事分组页面添加参赛人数显示和查看运动员列表功能
- 集成运动员列表弹窗组件,支持分页展示运动员信息
zhou преди 1 месец
родител
ревизия
bac2b37441
променени са 3 файла, в които са добавени 153 реда и са изтрити 0 реда
  1. 13 0
      src/api/system/gameAthlete/index.ts
  2. 100 0
      src/components/AthleteListDialog/index.vue
  3. 40 0
      src/views/system/gameEventGroup/index.vue

+ 13 - 0
src/api/system/gameAthlete/index.ts

@@ -73,4 +73,17 @@ export function validateProjectSelection(data: any) {
     method: 'post',
     data: data
   });
+}
+
+/**
+ * 获取项目参赛人数
+ * @param projectId 
+ * @param eventId
+ */
+export function getAthleteCount(projectId: string | number, eventId?: string | number): AxiosPromise<number> {
+  return request({
+    url: '/system/gameAthlete/count/' + projectId,
+    method: 'get',
+    params: { eventId }
+  });
 }

+ 100 - 0
src/components/AthleteListDialog/index.vue

@@ -0,0 +1,100 @@
+<template>
+  <el-dialog title="参赛运动员列表" :model-value="visible" @update:model-value="updateVisible" width="800px" append-to-body>
+    <el-table v-loading="loading" :data="athleteList" border>
+      <el-table-column label="序号" align="center" type="index" width="60" />
+      <el-table-column label="姓名" align="center" prop="name" />
+      <el-table-column label="运动员编号" align="center" prop="athleteCode" />
+      <el-table-column label="性别" align="center" prop="gender">
+        <template #default="scope">
+          <dict-tag :options="sys_user_sex" :value="scope.row.gender" />
+        </template>
+      </el-table-column>
+      <el-table-column label="队伍" align="center" prop="unit" />
+      <!-- <el-table-column label="所属单位" align="center" prop="unit" /> -->
+    </el-table>
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="updateVisible(false)">关 闭</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup name="AthleteListDialog" lang="ts">
+import { ref, reactive, watch, getCurrentInstance } from 'vue';
+import { listGameAthlete } from '@/api/system/gameAthlete';
+
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  projectId: {
+    type: [String, Number],
+    default: ''
+  },
+  eventId: {
+    type: [String, Number],
+    default: ''
+  }
+});
+
+const emit = defineEmits(['update:visible']);
+
+const { proxy } = getCurrentInstance();
+const { sys_user_sex } = toRefs(proxy.useDict('sys_user_sex'));
+
+const loading = ref(false);
+const athleteList = ref([]);
+const total = ref(0);
+
+const queryParams = reactive({
+  pageNum: 1,
+  pageSize: 10,
+  projectId: undefined,
+  eventId: undefined
+});
+
+/** 更新显示状态 */
+const updateVisible = (val) => {
+  emit('update:visible', val);
+};
+
+/** 查询运动员列表 */
+const getList = async () => {
+  if (!props.projectId) return;
+  loading.value = true;
+  try {
+    queryParams.projectId = props.projectId;
+    queryParams.eventId = props.eventId;
+    const res = await listGameAthlete(queryParams as any);
+    athleteList.value = res.rows;
+    total.value = res.total;
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 监听 projectId 变化
+watch(() => props.projectId, () => {
+  if (props.visible) {
+    queryParams.pageNum = 1;
+    getList();
+  }
+});
+
+// 监听 visible 变化
+watch(() => props.visible, (val) => {
+  if (val && props.projectId) {
+    queryParams.pageNum = 1;
+    getList();
+  }
+});
+</script>

+ 40 - 0
src/views/system/gameEventGroup/index.vue

@@ -146,6 +146,12 @@
                   :value="project.projectId"
                 />
               </el-select>
+              <div v-if="form.projectId" style="margin-top: 5px;">
+                <span style="font-size: 13px; color: #606266;">当前参赛人数:</span>
+                <el-link type="primary" :underline="false" @click="handleViewAthletes" style="font-size: 13px; font-weight: bold;">
+                  {{ athleteCount }} 人
+                </el-link>
+              </div>
             </el-form-item>
           </el-col>
         </el-row>
@@ -242,6 +248,13 @@
         </div>
       </template>
     </el-dialog>
+
+    <!-- 运动员列表对话框组件 -->
+    <athlete-list-dialog
+      v-model:visible="athleteDialogVisible"
+      :project-id="athleteProjectId"
+      :event-id="form.eventId"
+    />
   </div>
 </template>
 
@@ -250,6 +263,8 @@ import { nextTick, ref, onMounted, computed } from 'vue';
 import { useRouter } from 'vue-router';
 import { listGameEventGroup, getGameEventGroup, delGameEventGroup, addGameEventGroup, updateGameEventGroup } from '@/api/system/gameEventGroup';
 import { listGameEventProject } from '@/api/system/gameEventProject';
+import { listGameAthlete, getAthleteCount as getAthleteCountApi } from '@/api/system/gameAthlete';
+import AthleteListDialog from '@/components/AthleteListDialog/index.vue';
 import { GameEventGroupVO, GameEventGroupQuery, GameEventGroupForm } from '@/api/system/gameEventGroup/types';
 import { GameEventProjectVO } from '@/api/system/gameEventProject/types';
 
@@ -269,6 +284,11 @@ const single = ref(true);
 const multiple = ref(true);
 const total = ref(0);
 
+// 参赛人数及运动员列表相关
+const athleteCount = ref(0);
+const athleteDialogVisible = ref(false);
+const athleteProjectId = ref<string | number>('');
+
 // 项目类型过滤器(用于查询和表单,不存储在数据中)
 const projectTypeFilter = ref<string>('');
 const formProjectTypeFilter = ref<string>('');
@@ -501,9 +521,26 @@ const handleFormProjectChange = () => {
       // 可以在这里设置一些默认值或者进行其他处理
       console.log('选中的项目:', selectedProject);
     }
+    getAthleteCount();
+  } else {
+    athleteCount.value = 0;
   }
 };
 
+/** 获取运动员人数 */
+const getAthleteCount = async () => {
+  if (!form.value.projectId) return;
+  const res = await getAthleteCountApi(form.value.projectId, form.value.eventId);
+  athleteCount.value = res.data || 0;
+};
+
+/** 查看运动员列表 */
+const handleViewAthletes = () => {
+  if (athleteCount.value === 0) return;
+  athleteProjectId.value = form.value.projectId!;
+  athleteDialogVisible.value = true;
+};
+
 /** 取消按钮 */
 const cancel = () => {
   reset();
@@ -560,6 +597,9 @@ const handleUpdate = async (row?: GameEventGroupVO) => {
   const _groupId = row?.groupId || ids.value[0];
   const res = await getGameEventGroup(_groupId);
   Object.assign(form.value, res.data);
+  
+  // 获取项目参赛人数
+  getAthleteCount();
 
   // 根据项目ID设置项目类型过滤器
   if (res.data.projectId) {