index.vue 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848
  1. <template>
  2. <div class="p-2">
  3. <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
  4. <div v-show="showSearch" class="mb-[20px]">
  5. <el-card shadow="hover">
  6. <el-form ref="queryFormRef" :model="queryParams" :inline="true">
  7. <el-form-item label="赛事名称" prop="name">
  8. <el-input v-model="queryParams.name" placeholder="请输入赛事名称" clearable @keyup.enter="handleQuery" />
  9. </el-form-item>
  10. <el-form-item label="开始时间" prop="startTime">
  11. <el-date-picker clearable v-model="queryParams.startTime" type="date" value-format="YYYY-MM-DD" placeholder="请选择比赛开始时间" />
  12. </el-form-item>
  13. <el-form-item label="记分牌数量" prop="startingChips">
  14. <el-input v-model="queryParams.startingChips" placeholder="请输入起始记分牌数量" clearable @keyup.enter="handleQuery" />
  15. </el-form-item>
  16. <el-form-item label="持续时间" prop="levelDuration">
  17. <el-input v-model="queryParams.levelDuration" placeholder="请输入级别持续时间" clearable @keyup.enter="handleQuery" />
  18. </el-form-item>
  19. <el-form-item label="报名级别" prop="lateRegistrationLevel">
  20. <el-input v-model="queryParams.lateRegistrationLevel" placeholder="请输入截止报名级别" clearable @keyup.enter="handleQuery" />
  21. </el-form-item>
  22. <el-form-item label="最大参赛人数" prop="maxPlayers">
  23. <el-input v-model="queryParams.maxPlayers" placeholder="请输入最大参赛人数" clearable @keyup.enter="handleQuery" />
  24. </el-form-item>
  25. <el-form-item>
  26. <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
  27. <el-button icon="Refresh" @click="resetQuery">重置</el-button>
  28. </el-form-item>
  29. </el-form>
  30. </el-card>
  31. </div>
  32. </transition>
  33. <el-card shadow="never">
  34. <template #header>
  35. <el-row :gutter="10" class="mb8">
  36. <el-col :span="1.5">
  37. <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['business:tournaments:add']">新增</el-button>
  38. </el-col>
  39. <el-col :span="1.5">
  40. <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['business:tournaments:edit']"
  41. >修改</el-button
  42. >
  43. </el-col>
  44. <el-col :span="1.5">
  45. <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['business:tournaments:remove']"
  46. >删除</el-button
  47. >
  48. </el-col>
  49. <el-col :span="1.5">
  50. <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['business:tournaments:export']">导出</el-button>
  51. </el-col>
  52. <!-- 新增的 “盲注管理” 按钮 -->
  53. <el-col :span="1.5">
  54. <el-button type="info" plain icon="Operation">
  55. <router-link to="/business/structures">盲注管理</router-link>
  56. </el-button>
  57. </el-col>
  58. <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
  59. </el-row>
  60. </template>
  61. <el-table v-loading="loading" border :data="tournamentsList" @selection-change="handleSelectionChange">
  62. <el-table-column type="selection" width="55" align="center" />
  63. <el-table-column label="" align="center" prop="id" v-if="false" />
  64. <el-table-column label="赛事名称" align="center" prop="name" />
  65. <el-table-column label="开始时间" align="center" prop="startTime" width="180">
  66. <template #default="scope">
  67. <span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
  68. </template>
  69. </el-table-column>
  70. <el-table-column label="游戏类型" align="center" prop="gameType" />
  71. <el-table-column label="起始记分牌数量" align="center" prop="startingChips" />
  72. <el-table-column label="级别持续时间" align="center" prop="levelDuration" />
  73. <el-table-column label="截止报名级别" align="center" prop="lateRegistrationLevel" />
  74. <el-table-column label="最大参赛人数" align="center" prop="maxPlayers" />
  75. <el-table-column label="赛事状态" align="center" prop="status" />
  76. <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
  77. <template #default="scope">
  78. <el-tooltip content="查看" placement="top">
  79. <el-button
  80. link
  81. type="primary"
  82. icon="View"
  83. @click="handleUpdate(scope.row, 'view')"
  84. v-hasPermi="['business:tournaments:edit']"
  85. ></el-button>
  86. </el-tooltip>
  87. <el-tooltip content="编辑" placement="top">
  88. <el-button
  89. link
  90. type="primary"
  91. icon="Edit"
  92. @click="handleUpdate(scope.row, 'edit')"
  93. v-hasPermi="['business:tournaments:edit']"
  94. ></el-button>
  95. </el-tooltip>
  96. <!-- <el-tooltip content="删除" placement="top">
  97. <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['business:tournaments:remove']"></el-button>
  98. </el-tooltip>-->
  99. <!-- 新增:分配按钮 -->
  100. <el-tooltip content="分配盲注" placement="top">
  101. <el-button link type="success" icon="Document" @click="openAssignDialog(scope.row)" v-hasPermi="['business:tournaments:assign']">
  102. 分配
  103. </el-button>
  104. </el-tooltip>
  105. </template>
  106. </el-table-column>
  107. </el-table>
  108. <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
  109. </el-card>
  110. <!-- 添加或修改【请填写功能名称】对话框 -->
  111. <!-- <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
  112. <el-form ref="tournamentsFormRef" :model="form" :rules="rules" label-width="80px">
  113. <el-form-item label="赛事名称" prop="name">
  114. <el-input v-model="form.name" placeholder="请输入赛事名称" />
  115. </el-form-item>
  116. <el-form-item label="比赛开始时间" prop="startTime">
  117. <el-date-picker clearable v-model="form.startTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择比赛开始时间">
  118. </el-date-picker>
  119. </el-form-item>
  120. <el-form-item label="起始记分牌数量" prop="startingChips">
  121. <el-input v-model="form.startingChips" placeholder="请输入起始记分牌数量" />
  122. </el-form-item>
  123. <el-form-item label="级别持续时间" prop="levelDuration">
  124. <el-input v-model="form.levelDuration" placeholder="请输入级别持续时间" />
  125. </el-form-item>
  126. <el-form-item label="截止报名级别" prop="lateRegistrationLevel">
  127. <el-input v-model="form.lateRegistrationLevel" placeholder="请输入截止报名级别" />
  128. </el-form-item>
  129. <el-form-item label="最大参赛人数" prop="maxPlayers">
  130. <el-input v-model="form.maxPlayers" placeholder="请输入最大参赛人数" />
  131. </el-form-item>
  132. </el-form>
  133. <template #footer>
  134. <div class="dialog-footer">
  135. <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
  136. <el-button @click="cancel">取 消</el-button>
  137. </div>
  138. </template>
  139. </el-dialog>-->
  140. <el-dialog :title="dialog.title" v-model="dialog.visible" width="600px" append-to-body @close="cancel">
  141. <el-form ref="tournamentsFormRef" :model="form" :rules="rules" label-width="120px">
  142. <!-- 赛事名称 -->
  143. <el-form-item label="比赛名称" prop="name">
  144. <el-input v-model="form.name" placeholder="请输入比赛名称" :disabled="dialog.mode === 'view'" />
  145. </el-form-item>
  146. <!-- 比赛图标 -->
  147. <el-form-item label="比赛图标" prop="icon">
  148. <div class="upload-container">
  149. <el-upload
  150. class="upload-icon"
  151. action="#"
  152. :on-change="handleIconChange"
  153. :auto-upload="false"
  154. :limit="1"
  155. accept="image/*"
  156. :disabled="dialog.mode === 'view'"
  157. >
  158. <template #trigger>
  159. <el-button type="primary" :disabled="dialog.mode === 'view'">点击选择图标</el-button>
  160. </template>
  161. </el-upload>
  162. </div>
  163. </el-form-item>
  164. <!-- 开始时间 -->
  165. <el-form-item label="开始时间" prop="startTime">
  166. <el-date-picker
  167. clearable
  168. v-model="form.startTime"
  169. type="datetime"
  170. value-format="YYYY-MM-DD HH:mm:ss"
  171. placeholder="请选择开始时间"
  172. :disabled="dialog.mode === 'view'"
  173. />
  174. </el-form-item>
  175. <!-- 报名时间 -->
  176. <el-form-item label="报名时间">
  177. <el-select v-model="form.signTime" placeholder="请选择" :disabled="dialog.mode === 'view'">
  178. <el-option label="比赛前5分钟" :value="5" />
  179. <el-option label="比赛前10分钟" :value="10" />
  180. </el-select>
  181. </el-form-item>
  182. <!-- 报名条件 -->
  183. <el-form-item label="报名条件">
  184. <div style="display: flex; align-items: center; gap: 10px">
  185. <el-select v-model="form.itemsId" placeholder="请选择道具类型" :disabled="dialog.mode === 'view'">
  186. <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="item.id" />
  187. </el-select>
  188. <el-input v-model="form.itemsNum" :min="1" placeholder="数量" :disabled="dialog.mode === 'view'" />
  189. </div>
  190. </el-form-item>
  191. <!-- 盲注表 -->
  192. <el-form-item label="盲注表">
  193. <div style="display: flex; align-items: center">
  194. <el-select
  195. v-model="form.blindStructureId"
  196. placeholder="选项"
  197. style="width: 200px"
  198. @change="handleBlindStructureChange"
  199. :disabled="dialog.mode === 'view'"
  200. >
  201. <el-option v-for="item in itemOptionsStructures" :key="item.id" :label="item.label" :value="item.id" />
  202. </el-select>
  203. <el-button type="primary" :disabled="dialog.mode === 'view'">上传新盲注</el-button>
  204. <el-button type="primary" @click="handleViewLevels" :disabled="dialog.mode === 'view'">预览</el-button>
  205. </div>
  206. </el-form-item>
  207. <!-- 报名截止等级 -->
  208. <el-form-item label="报名截止等级">
  209. <el-select v-model="form.lateRegistrationLevel" placeholder="选项" style="width: 200px" :disabled="dialog.mode === 'view'">
  210. <el-option v-for="item in itemOptionsStructuresLevel" :key="item.id" :label="item.label" :value="item.id" />
  211. </el-select>
  212. </el-form-item>
  213. <!-- 奖励内容 -->
  214. <el-form-item label="奖励内容">
  215. <div v-for="(reward, index) in formPrize.rewards" :key="index" style="display: flex; align-items: center; margin-bottom: 8px">
  216. <span>第{{ reward.ranking }}名</span>
  217. <!-- 道具选择 -->
  218. <el-select v-model="reward.itemId" placeholder="选项" style="width: 120px; margin-right: 8px" :disabled="dialog.mode === 'view'">
  219. <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="item.id" />
  220. </el-select>
  221. <!-- 数量输入 -->
  222. <el-input v-model="reward.quantity" placeholder="请输入数量" style="width: 100px; margin-right: 8px" :disabled="dialog.mode === 'view'" />
  223. <!-- 操作按钮 -->
  224. <el-button type="primary" @click="addReward" v-if="index === 0 && dialog.mode !== 'view'">+</el-button>
  225. <el-button type="primary" @click="removeReward(index)" v-if="index !== 0 && dialog.mode !== 'view'">-</el-button>
  226. </div>
  227. </el-form-item>
  228. </el-form>
  229. <template #footer>
  230. <div class="dialog-footer">
  231. <el-button :loading="buttonLoading" type="primary" @click="submitForm" v-if="dialog.mode !== 'view'">确 定</el-button>
  232. <el-button @click="cancel">取 消</el-button>
  233. </div>
  234. </template>
  235. </el-dialog>
  236. <!-- 分配模态框 -->
  237. <el-dialog title="分配盲注信息" v-model="assignDialog.visible" width="800px" append-to-body destroy-on-close>
  238. <el-form ref="assignFormRef" :model="assignForm" label-width="100px">
  239. <!-- 可勾选的列表 -->
  240. <el-form-item label="">
  241. <div style="display: flex; flex-direction: column; align-items: center; width: 100%">
  242. <div style="width: 100%; height: 400px; overflow-y: auto; padding: 0">
  243. <el-table border ref="assignTable" :data="assignList" :row-key="'blindStructuresId'" style="width: 100%">
  244. <el-table-column label="操作" align="center" width="55">
  245. <template #default="{ row }">
  246. <el-radio v-model="selectedRadio" :label="row.blindStructuresId">&nbsp;</el-radio>
  247. </template>
  248. </el-table-column>
  249. <!-- <el-table-column label="blindStructuresId" align="center" prop="blindStructuresId" width="100" show-overflow-tooltip />-->
  250. <el-table-column prop="blindStructuresName" label="盲注结构名称" align="center" width="150" show-overflow-tooltip />
  251. <el-table-column prop="blindDescription" label="盲注结构描述" align="center" width="200" show-overflow-tooltip />
  252. <el-table-column prop="allocationStatus" label="绑定情况" align="center" width="100">
  253. <template #default="scope">
  254. {{ scope.row.allocationStatus === 0 ? '未绑定' : '已绑定' }}
  255. </template>
  256. </el-table-column>
  257. <el-table-column prop="tournamentsName" label="赛事名称" align="center" width="150" show-overflow-tooltip />
  258. </el-table>
  259. </div>
  260. <!-- 分页(如果数据量大) -->
  261. <div style="display: flex; justify-content: center; margin-top: 20px; width: 100%">
  262. <pagination
  263. v-if="assignTotal > 0"
  264. :total="assignTotal"
  265. v-model:page="assignQuery.pageNum"
  266. v-model:limit="assignQuery.pageSize"
  267. @pagination="getAssignList"
  268. />
  269. </div>
  270. </div>
  271. </el-form-item>
  272. </el-form>
  273. <template #footer>
  274. <div class="dialog-footer" style="text-align: center">
  275. <el-button :loading="buttonLoading" type="primary" @click="submitAssign">保 存</el-button>
  276. <el-button @click="assignDialog.visible = false">取 消</el-button>
  277. </div>
  278. </template>
  279. </el-dialog>
  280. <el-dialog v-model="levelsDialogVisible" title="盲注等级列表" width="80%">
  281. <!-- 使用 component 动态加载目标组件 -->
  282. <levels-index :blind-structure-id="dialogParams.blindStructureId" :name="dialogParams.name" />
  283. </el-dialog>
  284. </div>
  285. </template>
  286. <script setup name="Tournaments" lang="ts">
  287. import {
  288. listTournaments,
  289. getTournaments,
  290. delTournaments,
  291. addTournaments,
  292. updateTournaments,
  293. getSelectTournamentBlindStructuresList,
  294. assignTournamentBlindStructures,
  295. uploadTournament
  296. } from '@/api/system/business/tournaments';
  297. import { selectItemsSelList } from '@/api/system/business/items';
  298. import { selectBlindLevelsById } from '@/api/system/business/levels';
  299. import { selectBlingStructuresInfo } from '@/api/system/business/structures';
  300. import { TournamentsVO, TournamentsQuery, TournamentsForm, TournamentsBindStructuresVO } from '@/api/system/business/tournaments/types';
  301. import { ref } from 'vue';
  302. import LevelsIndex from '@/views/system/business/levels/index.vue';
  303. const { proxy } = getCurrentInstance() as ComponentInternalInstance;
  304. const tournamentsList = ref<TournamentsVO[]>([]);
  305. const buttonLoading = ref(false);
  306. const loading = ref(true);
  307. const showSearch = ref(true);
  308. const ids = ref<Array<string | number>>([]);
  309. const single = ref(true);
  310. const multiple = ref(true);
  311. const total = ref(0);
  312. const queryFormRef = ref<ElFormInstance>();
  313. const tournamentsFormRef = ref<ElFormInstance>();
  314. const iconFile = ref<File | null>(null); // 存储选中的图标文件
  315. const dialog = reactive<{
  316. visible: boolean;
  317. title: string;
  318. mode: 'edit' | 'view'; // 新增字段
  319. }>({
  320. visible: false,
  321. title: '',
  322. mode: 'edit'
  323. });
  324. const assignDialog = reactive({
  325. visible: false,
  326. title: '分配盲注'
  327. });
  328. const assignForm = reactive({
  329. tournamentId: undefined as number | undefined,
  330. selectedIds: [] as number[]
  331. });
  332. // 控制 Dialog 是否显示
  333. const levelsDialogVisible = ref(false);
  334. // 传递给子组件的参数
  335. const dialogParams = ref({
  336. blindStructureId: null,
  337. name: null
  338. });
  339. // 下拉选项数据 selectBlingStructuresInfo
  340. const itemOptions = ref<{ id: number; label: string }[]>([]);
  341. // 加载报名条件选项
  342. const loadItemOptions = async () => {
  343. try {
  344. const res = await selectItemsSelList();
  345. if (res.code === 200) {
  346. // 使用 unknown 中间类型进行类型转换
  347. const data = res.data as unknown as { id: number; name: string }[];
  348. const list = [];
  349. for (let i = 0; i < data.length; i++) {
  350. const item = data[i];
  351. list.push({
  352. id: item.id,
  353. label: item.name
  354. });
  355. }
  356. itemOptions.value = list;
  357. } else {
  358. alert('加载失败:' + res.msg);
  359. }
  360. } catch (error) {
  361. console.error('请求出错:', error);
  362. }
  363. };
  364. // 下拉选项数据 selectBlingStructuresInfo
  365. const itemOptionsStructures = ref<{ id: number; label: string }[]>([]);
  366. // 加载报名条件选项
  367. const loadItemStructuresOptions = async () => {
  368. try {
  369. const res = await selectBlingStructuresInfo();
  370. if (res.code === 200) {
  371. // 使用 unknown 中间类型进行类型转换
  372. const data = res.data as unknown as { id: number; name: string }[];
  373. const list = [];
  374. for (let i = 0; i < data.length; i++) {
  375. const item = data[i];
  376. list.push({
  377. id: item.id,
  378. label: item.name
  379. });
  380. }
  381. itemOptionsStructures.value = list;
  382. } else {
  383. alert('加载失败:' + res.msg);
  384. }
  385. } catch (error) {
  386. console.error('请求出错:', error);
  387. }
  388. };
  389. // 下拉选项数据
  390. const itemOptionsStructuresLevel = ref<{ id: number; label: string }[]>([]);
  391. // 加载报名条件选项
  392. const handleBlindStructureChange = async (value: number) => {
  393. try {
  394. const res = await selectBlindLevelsById(value);
  395. if (res.code === 200) {
  396. // 使用 unknown 中间类型进行类型转换
  397. const data = res.data as unknown as { id: number; levelNumber: number }[];
  398. const list = [];
  399. for (let i = 0; i < data.length; i++) {
  400. const item = data[i];
  401. list.push({
  402. id: item.levelNumber,
  403. label: item.levelNumber
  404. });
  405. }
  406. itemOptionsStructuresLevel.value = list;
  407. } else {
  408. alert('加载失败:' + res.msg);
  409. }
  410. } catch (error) {
  411. console.error('请求出错:', error);
  412. }
  413. };
  414. const formPrize = reactive({
  415. // ...其他表单字段
  416. rewards: [
  417. {
  418. ranking: 1,
  419. itemId: null,
  420. quantity: null
  421. }
  422. ]
  423. });
  424. const addReward = () => {
  425. const currentLength = formPrize.rewards.length;
  426. // 判断是否超过 itemOptions 的数量限制
  427. if (currentLength < itemOptions.value.length) {
  428. formPrize.rewards.push({
  429. ranking: currentLength + 1, // 自动生成排名,从 1 开始
  430. itemId: null,
  431. quantity: null
  432. });
  433. } else {
  434. ElMessage.warning(`最多只能添加 ${itemOptions.value.length} 个奖励项`);
  435. }
  436. };
  437. const removeReward = (index: number) => {
  438. formPrize.rewards.splice(index, 1);
  439. // 删除后重新设置排名
  440. formPrize.rewards.forEach((r, i) => {
  441. r.ranking = i + 1;
  442. });
  443. };
  444. // 单选控制变量(用于绑定 el-radio)
  445. const selectedRadio = ref<number | null>(null);
  446. const assignList = ref<TournamentsBindStructuresVO[]>([]);
  447. const assignSelectedList = ref<TournamentsBindStructuresVO[]>([]);
  448. const assignTotal = ref(0);
  449. const assignQuery = reactive<{
  450. pageNum: number;
  451. pageSize: number;
  452. tournamentId: number | undefined;
  453. }>({
  454. pageNum: 1,
  455. pageSize: 10,
  456. tournamentId: undefined
  457. });
  458. const initFormData: TournamentsForm = {
  459. id: undefined,
  460. name: undefined,
  461. startTime: undefined,
  462. gameType: undefined,
  463. startingChips: undefined,
  464. levelDuration: undefined,
  465. lateRegistrationLevel: undefined,
  466. maxPlayers: undefined,
  467. status: undefined,
  468. createdAt: undefined,
  469. updatedAt: undefined,
  470. signTime: null,
  471. competitionIcon: null,
  472. itemsId: null,
  473. itemsNum: null,
  474. blindStructureId: null,
  475. itemsPrizeList: []
  476. };
  477. const data = reactive<PageData<TournamentsForm, TournamentsQuery>>({
  478. form: { ...initFormData },
  479. queryParams: {
  480. pageNum: 1,
  481. pageSize: 10,
  482. name: undefined,
  483. startTime: undefined,
  484. gameType: undefined,
  485. startingChips: undefined,
  486. levelDuration: undefined,
  487. lateRegistrationLevel: undefined,
  488. maxPlayers: undefined,
  489. status: undefined,
  490. createdAt: undefined,
  491. updatedAt: undefined,
  492. params: {}
  493. },
  494. rules: {
  495. id: [{ required: true, message: '不能为空', trigger: 'blur' }],
  496. name: [{ required: true, message: '赛事名称不能为空', trigger: 'blur' }],
  497. startTime: [{ required: true, message: '比赛开始时间不能为空', trigger: 'blur' }],
  498. /* gameType: [{ required: true, message: '游戏类型不能为空', trigger: 'change' }],*/
  499. startingChips: [{ required: true, message: '起始记分牌数量不能为空', trigger: 'blur' }],
  500. levelDuration: [{ required: true, message: '级别持续时间不能为空', trigger: 'blur' }],
  501. lateRegistrationLevel: [{ required: true, message: '截止报名级别不能为空', trigger: 'blur' }],
  502. maxPlayers: [{ required: true, message: '最大参赛人数不能为空', trigger: 'blur' }],
  503. status: [{ required: true, message: '赛事状态不能为空', trigger: 'change' }]
  504. }
  505. });
  506. const { queryParams, form, rules } = toRefs(data);
  507. /** 查询【请填写功能名称】列表 */
  508. const getList = async () => {
  509. loading.value = true;
  510. const res = await listTournaments(queryParams.value);
  511. tournamentsList.value = res.rows;
  512. total.value = res.total;
  513. loading.value = false;
  514. };
  515. /** 取消按钮 */
  516. const cancel = () => {
  517. reset();
  518. dialog.visible = false;
  519. };
  520. /** 表单重置 */
  521. const reset = () => {
  522. form.value = { ...initFormData };
  523. tournamentsFormRef.value?.resetFields();
  524. };
  525. /** 搜索按钮操作 */
  526. const handleQuery = () => {
  527. queryParams.value.pageNum = 1;
  528. getList();
  529. };
  530. /** 重置按钮操作 */
  531. const resetQuery = () => {
  532. queryFormRef.value?.resetFields();
  533. handleQuery();
  534. };
  535. /** 多选框选中数据 */
  536. const handleSelectionChange = (selection: TournamentsVO[]) => {
  537. ids.value = selection.map((item) => item.id);
  538. single.value = selection.length != 1;
  539. multiple.value = !selection.length;
  540. };
  541. /** 新增按钮操作 */
  542. const handleAdd = () => {
  543. reset();
  544. dialog.visible = true;
  545. dialog.title = '创建比赛';
  546. };
  547. /** 修改按钮操作 */
  548. const handleUpdate = async (row?: TournamentsVO, mode: 'edit' | 'view' = 'edit') => {
  549. reset(); // 重置表单
  550. const _id = row?.id || ids.value[0];
  551. const res = await getTournaments(_id);
  552. Object.assign(form.value, res.data);
  553. // 处理奖励表单数据
  554. const prizeItems = res.data.itemsPrizeList || [];
  555. if (prizeItems.length > 0) {
  556. formPrize.rewards = prizeItems.map((item, index) => ({
  557. ranking: item.ranking || index + 1,
  558. itemId: Number(item.itemId),
  559. quantity: Number(item.quantity)
  560. }));
  561. } else {
  562. formPrize.rewards = [
  563. {
  564. ranking: 1,
  565. itemId: null,
  566. quantity: null
  567. }
  568. ];
  569. }
  570. dialog.visible = true;
  571. dialog.title = mode === 'view' ? '查看比赛' : '编辑比赛';
  572. dialog.mode = mode; // 设置模式
  573. };
  574. /** 提交按钮 */
  575. const submitForm = () => {
  576. tournamentsFormRef.value?.validate(async (valid: boolean) => {
  577. // 校验奖励内容是否至少填写了一项
  578. if (!formPrize.rewards.some((r) => r.itemId && r.quantity)) {
  579. ElMessage.warning('请至少填写一项奖励内容');
  580. return;
  581. }
  582. if (!valid) return;
  583. try {
  584. buttonLoading.value = true;
  585. // 1. 创建 FormData 对象
  586. const formData = new FormData();
  587. // 2. 添加普通表单字段
  588. for (const key in data.form) {
  589. const value = data.form[key];
  590. if (value !== undefined && value !== null) {
  591. formData.append(key, String(value));
  592. }
  593. }
  594. // 3. 添加奖励列表(itemsPrizeList)
  595. const itemsPrizeListJson = JSON.stringify(
  596. formPrize.rewards.map((reward) => ({
  597. ranking: reward.ranking,
  598. itemId: reward.itemId,
  599. quantity: reward.quantity
  600. }))
  601. );
  602. formData.append('itemsPrizeList', itemsPrizeListJson);
  603. // 4. 添加图标文件(如果存在)
  604. if (iconFile.value) {
  605. formData.append('competitionIcon', iconFile.value);
  606. }
  607. debugger;
  608. // 5. 判断新增或编辑
  609. let response;
  610. if (data.form.id) {
  611. response = await updateTournaments(formData);
  612. } else {
  613. response = await addTournaments(formData);
  614. }
  615. proxy?.$modal.msgSuccess('操作成功');
  616. dialog.visible = false;
  617. await getList();
  618. } catch (error) {
  619. proxy?.$modal.msgError('提交失败,请重试');
  620. } finally {
  621. buttonLoading.value = false;
  622. }
  623. });
  624. };
  625. /** 删除按钮操作 */
  626. const handleDelete = async (row?: TournamentsVO) => {
  627. const _ids = row?.id || ids.value;
  628. await proxy?.$modal.confirm('是否确认删除【赛事信息】编号为"' + _ids + '"的数据项?').finally(() => (loading.value = false));
  629. await delTournaments(_ids);
  630. proxy?.$modal.msgSuccess('删除成功');
  631. await getList();
  632. };
  633. /** 导出按钮操作 */
  634. const handleExport = () => {
  635. proxy?.download(
  636. 'business/tournaments/export',
  637. {
  638. ...queryParams.value
  639. },
  640. `赛事列表_${new Date().getTime()}.xlsx`
  641. );
  642. };
  643. onMounted(() => {
  644. getList();
  645. loadItemOptions();
  646. loadItemStructuresOptions();
  647. });
  648. async function getAssignList() {
  649. const res = await getSelectTournamentBlindStructuresList(assignQuery);
  650. assignList.value = res.rows;
  651. assignTotal.value = res.total;
  652. }
  653. async function openAssignDialog(row: TournamentsVO) {
  654. assignForm.tournamentId = Number(row.id);
  655. assignQuery.tournamentId = Number(row.id); // 这里明确转成 number
  656. // 加载盲注列表
  657. assignDialog.visible = true;
  658. // 请求分配盲注结构列表
  659. getAssignList().then(() => {
  660. nextTick(() => {
  661. initSelectedRows(); // 等待 DOM 完全渲染后再初始化选中状态
  662. });
  663. });
  664. }
  665. function handleAssignSelectionChange(selection: TournamentsBindStructuresVO[]) {
  666. assignSelectedList.value = selection;
  667. assignForm.selectedIds = selection.map((item) => item.blindStructuresId);
  668. }
  669. async function submitAssign() {
  670. if (!assignForm.tournamentId || assignForm.selectedIds.length === 0) {
  671. proxy?.$modal.msgError('请选择至少一个盲注结构');
  672. return;
  673. }
  674. buttonLoading.value = true;
  675. try {
  676. await assignTournamentBlindStructures({
  677. tournamentId: assignForm.tournamentId,
  678. blindStructureIds: assignForm.selectedIds
  679. });
  680. proxy?.$modal.msgSuccess('分配成功');
  681. assignDialog.visible = false;
  682. } catch (err) {
  683. proxy?.$modal.msgError('分配失败');
  684. } finally {
  685. buttonLoading.value = false;
  686. }
  687. }
  688. const assignTable = ref(); // 对应 el-table 的 ref
  689. // 初始化选中行
  690. function initSelectedRows() {
  691. const selected = assignList.value.find((item) => item.allocationStatus === 1);
  692. if (selected) {
  693. selectedRadio.value = selected.blindStructuresId;
  694. assignForm.selectedIds = [selected.blindStructuresId];
  695. }
  696. }
  697. watch(
  698. () => assignList.value,
  699. (newVal) => {
  700. if (newVal.length > 0) {
  701. nextTick(() => {
  702. initSelectedRows();
  703. });
  704. }
  705. },
  706. { deep: true, immediate: true }
  707. );
  708. watch(
  709. () => selectedRadio.value,
  710. (newVal) => {
  711. if (newVal !== null) {
  712. assignForm.selectedIds = [newVal];
  713. } else {
  714. assignForm.selectedIds = [];
  715. }
  716. }
  717. );
  718. const handleIconChange = (file: any) => {
  719. if (file.raw) {
  720. iconFile.value = file.raw; // 缓存原始文件对象
  721. } else {
  722. iconFile.value = null;
  723. }
  724. };
  725. /*
  726. const fileList = ref([]);
  727. const handleIconChange = async (file) => {
  728. const index = fileList.value.findIndex((f) => f.uid === file.uid);
  729. fileList.value = [];
  730. if (index === -1) {
  731. // 如果文件不在列表中,则添加进去
  732. fileList.value.push(file);
  733. }
  734. try {
  735. const rawFile = file.raw;
  736. const res = await uploadTournament(rawFile);
  737. if (res.code === 200) {
  738. // 更新文件状态为成功
  739. fileList.value[index] = {
  740. ...file,
  741. status: 'success',
  742. response: res.data.url
  743. };
  744. data.form.competitionIcon = fileList.value[index].response;
  745. ElMessage.success('上传成功');
  746. } else {
  747. throw new Error(res.msg);
  748. }
  749. } catch (error) {
  750. // 更新文件状态为失败
  751. fileList.value[index] = {
  752. ...file,
  753. status: 'fail',
  754. error: '上传失败'
  755. };
  756. ElMessage.error('上传失败,请重试');
  757. }
  758. };
  759. */
  760. const handleViewLevels = () => {
  761. const blindStructureId = data.form.blindStructureId;
  762. if (blindStructureId === null || blindStructureId === undefined) {
  763. ElMessage.warning('请先选择一个盲注表');
  764. return;
  765. }
  766. dialogParams.value.blindStructureId = blindStructureId;
  767. /* dialogParams.value.name = row.name;*/
  768. levelsDialogVisible.value = true;
  769. };
  770. </script>