rjl
9d801ba6b4
- 删除待定排名页面及相关路由配置 - 更新环境变量配置，调整API地址和主页路由 - 添加vite-auto-deploy依赖和nginx配置文件 - 更新组件类型定义，移除未使用的组件 - 调整页面标题和图片资源
65 lines
2.1 KiB
Vue
65 lines
2.1 KiB
Vue
<script setup lang="ts">
|
||
import { NGi, NGrid, NSpace } from 'naive-ui'
|
||
import { computed, onMounted, ref } from 'vue'
|
||
import { PublishStatus } from '@/enum/business'
|
||
import { useRouterPush } from '@/hooks/common/router'
|
||
import { fetchGetActivityList } from '@/service/api/competition'
|
||
import { useAppStore } from '@/store/modules/app'
|
||
import CompetitionCard from '@/views/competition/competition-list/modules/competition-card.vue'
|
||
|
||
const { routerPushByKey } = useRouterPush()
|
||
|
||
const appStore = useAppStore()
|
||
const gap = computed(() => (appStore.isMobile ? 12 : 26))
|
||
|
||
const competitionListRef = ref<Api.Competition.CompetitionItem[]>([])
|
||
|
||
/** 获取活动列表 */
|
||
async function fetchActivityList() {
|
||
try {
|
||
const { response, error } = await fetchGetActivityList()
|
||
if (!error) {
|
||
const list = response?.data?.data || []
|
||
competitionListRef.value = list.filter((item: any) => item.PublishStatus === PublishStatus.Processing || item.PublishStatus === PublishStatus.Published)
|
||
}
|
||
}
|
||
catch (e) {
|
||
console.error(e)
|
||
}
|
||
}
|
||
|
||
function toDetail(item: Api.Competition.CompetitionItem) {
|
||
routerPushByKey('results_results-detail', { query: { activityId: item.Id.toString(), roomId: item.RoomID.toString() } })
|
||
}
|
||
|
||
onMounted(() => fetchActivityList())
|
||
</script>
|
||
|
||
<template>
|
||
<NSpace vertical :size="24">
|
||
<!-- 顶部 Header 区域 -->
|
||
<div class="flex flex-col justify-between gap-4 sm:flex-row sm:items-center">
|
||
<div>
|
||
<h2 class="m-0 text-xl text-gray-800 font-bold dark:text-white">
|
||
实时结果列表
|
||
</h2>
|
||
<p class="mt-1 text-sm text-gray-500">
|
||
评委将对正在进行的比赛进行打分
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 卡片列表区域 -->
|
||
<!-- 响应式布局：手机1列，平板2列，中屏3列，大屏4列 -->
|
||
<NGrid :x-gap="gap" :y-gap="gap" responsive="screen" item-responsive>
|
||
<NGi v-for="item in competitionListRef" :key="item.Id" span="24 s:12 m:8 l:6" @click="toDetail(item)">
|
||
<CompetitionCard :item="item" />
|
||
</NGi>
|
||
</NGrid>
|
||
</NSpace>
|
||
</template>
|
||
|
||
<style scoped>
|
||
/* 针对不同屏幕微调间距 */
|
||
</style>
|