feat(competition): 新增比赛活动管理功能模块

实现比赛活动的创建、编辑、详情查看功能,包括基础信息配置、分组管理、题库配置和硬件绑定
添加比赛列表页面的路由跳转逻辑,优化卡片点击交互
完善比赛详情页的编辑状态管理,支持基础信息和题包配置的修改
新增本地SVG图标资源,更新系统Logo组件样式
This commit is contained in:
2026-01-19 18:03:45 +08:00
parent 77315b36ed
commit d13077a3f1
24 changed files with 971 additions and 200 deletions

View File

@ -0,0 +1,95 @@
<script setup lang="ts">
import { NGrid, NGridItem, NSelect } from 'naive-ui'
import { ref } from 'vue'
const questionOptions = [
{ label: '汉字听写 - 根据提示书写汉字', value: 'hanzi' },
{ label: '同音字辨析 - 根据拼音书写', value: 'tongyin' },
{ label: '偏旁部首 - 按要求写字', value: 'pianpang' },
{ label: '词语听写 - 综合练习', value: 'ciyu' },
{ label: '成语填空 - 四字成语', value: 'chengyu' },
{ label: '反义词挑战', value: 'fanyi' },
{ label: '近义词挑战', value: 'jinyi' },
]
const pkOptions = [
{ label: '极速成语接龙 - 每题10秒', value: 'speed10' },
{ label: '极速成语接龙 - 每题20秒', value: 'speed20' },
]
const regularQuestions = ref([
{ value: 'hanzi' },
{ value: 'tongyin' },
{ value: 'pianpang' },
{ value: 'ciyu' },
{ value: 'chengyu' },
{ value: 'fanyi' },
{ value: 'jinyi' },
])
const pkQuestions = ref([
{ value: 'speed10' },
{ value: 'speed10' },
{ value: 'speed10' },
{ value: 'speed10' },
{ value: 'speed10' },
])
</script>
<template>
<div class="py-4">
<NGrid :x-gap="48" :y-gap="24" cols="1 l:2" responsive="screen">
<!-- 左侧常规赛题包 -->
<NGridItem>
<div class="h-full rounded-xl bg-gray-50/50 p-6">
<div class="mb-6 flex items-center gap-2 text-gray-800 font-bold">
<div class="i-carbon-notebook text-lg text-blue-500" />
<span>常规赛题包</span>
</div>
<div class="flex flex-col gap-4">
<div
v-for="(item, idx) in regularQuestions"
:key="idx"
class="flex items-center gap-4"
>
<span class="w-12 text-xs text-gray-400 font-medium">{{ idx + 1 }}</span>
<NSelect
v-model:value="item.value"
:options="questionOptions"
placeholder="请选择题型"
class="flex-1 bg-white"
/>
</div>
</div>
</div>
</NGridItem>
<!-- 右侧加时赛 (PK环节) -->
<NGridItem>
<div class="h-full border border-orange-100/50 rounded-xl bg-orange-50/30 p-6">
<div class="mb-6 flex items-center gap-2 text-gray-800 font-bold">
<div class="i-carbon-timer text-lg text-orange-500" />
<span>加时赛 (PK环节)</span>
</div>
<div class="flex flex-col gap-4">
<div
v-for="(item, idx) in pkQuestions"
:key="idx"
class="flex items-center gap-4"
>
<span class="w-8 text-xs text-orange-400 font-medium">PK{{ idx + 1 }}</span>
<NSelect
v-model:value="item.value"
:options="pkOptions"
placeholder="请选择PK规则"
class="flex-1 bg-white"
/>
</div>
</div>
</div>
</NGridItem>
</NGrid>
</div>
</template>