|
|
@@ -94,22 +94,22 @@
|
|
|
<span class="font-bold">日程预览</span>
|
|
|
</template>
|
|
|
|
|
|
- <el-table :data="scheduleData" border stripe>
|
|
|
- <el-table-column label="日期" prop="scheduleDate" />
|
|
|
- <el-table-column label="时间">
|
|
|
+ <el-table :data="scheduleData" border stripe class="schedule-table">
|
|
|
+ <el-table-column label="日期" prop="scheduleDate" align="center" />
|
|
|
+ <el-table-column label="时间" align="center">
|
|
|
<template #default="scope"> {{ scope.row.startTime }} - {{ scope.row.endTime }}</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="项目名称" prop="projectName" />
|
|
|
- <el-table-column label="项目类型">
|
|
|
+ <el-table-column label="项目名称" prop="projectName" align="center" />
|
|
|
+ <el-table-column label="项目类型" align="center">
|
|
|
<template #default="scope">
|
|
|
<dict-tag :options="game_project_type" :value="scope.row.projectType || ''" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<!-- <el-table-column label="项目组别" prop="groupType" width="120" /> -->
|
|
|
- <el-table-column label="比赛场地" prop="location" />
|
|
|
- <el-table-column label="分组数" prop="groupNum" />
|
|
|
- <el-table-column label="每组人数" prop="participateNum" />
|
|
|
- <el-table-column label="操作">
|
|
|
+ <el-table-column label="比赛场地" prop="location" align="center" />
|
|
|
+ <el-table-column label="分组数" prop="groupNum" align="center" />
|
|
|
+ <el-table-column label="每组人数" prop="participateNum" align="center" />
|
|
|
+ <el-table-column label="操作" align="center">
|
|
|
<template #default="scope">
|
|
|
<el-button type="danger" size="small" @click="deleteSchedule(scope.row)" v-hasPermi="['system:gameeventproject:remove']">
|
|
|
删除
|
|
|
@@ -324,41 +324,91 @@ const deleteSchedule = async (project: GameEventProjectVO) => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
-// 导出日程表
|
|
|
+// 根据字典获取项目类型文本
|
|
|
+const getProjectTypeLabel = (projectType: string) => {
|
|
|
+ const dict = game_project_type.value?.find((item: any) => item.value === projectType);
|
|
|
+ return dict ? dict.label : '未知类型';
|
|
|
+};
|
|
|
+
|
|
|
+// 导出日程表（使用 HTML 表格转 Excel，支持样式）
|
|
|
const exportSchedule = () => {
|
|
|
if (scheduleData.value.length === 0) {
|
|
|
ElMessage.warning('暂无日程安排数据可导出');
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
- // 创建表格数据
|
|
|
- const headers = ['日期', '时间', '项目名称', '项目类型', '比赛场地', '分组数', '每组人数'];
|
|
|
- let csvContent = headers.join(',') + '\n';
|
|
|
+ // 构建带样式的 HTML 表格
|
|
|
+ let html = `
|
|
|
+ <html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">
|
|
|
+ <head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <!--[if gte mso 9]>
|
|
|
+ <xml>
|
|
|
+ <x:ExcelWorkbook>
|
|
|
+ <x:ExcelWorksheets>
|
|
|
+ <x:ExcelWorksheet>
|
|
|
+ <x:Name>日程安排</x:Name>
|
|
|
+ <x:WorksheetOptions>
|
|
|
+ <x:DisplayGridlines/>
|
|
|
+ </x:WorksheetOptions>
|
|
|
+ </x:ExcelWorksheet>
|
|
|
+ </x:ExcelWorksheets>
|
|
|
+ </x:ExcelWorkbook>
|
|
|
+ </xml>
|
|
|
+ <![endif]-->
|
|
|
+ <style>
|
|
|
+ td, th {
|
|
|
+ text-align: center;
|
|
|
+ vertical-align: middle;
|
|
|
+ border: 1px solid #000;
|
|
|
+ padding: 8px;
|
|
|
+ }
|
|
|
+ th {
|
|
|
+ background-color: #E0E0E0;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+ </head>
|
|
|
+ <body>
|
|
|
+ <table>
|
|
|
+ <tr>
|
|
|
+ <th>日期</th>
|
|
|
+ <th>时间</th>
|
|
|
+ <th>项目名称</th>
|
|
|
+ <th>项目类型</th>
|
|
|
+ <th>比赛场地</th>
|
|
|
+ <th>分组数</th>
|
|
|
+ <th>每组人数</th>
|
|
|
+ </tr>
|
|
|
+ `;
|
|
|
|
|
|
scheduleData.value.forEach((item) => {
|
|
|
- const row = [
|
|
|
- item.scheduleDate,
|
|
|
- `${item.startTime}-${item.endTime}`,
|
|
|
- item.projectName,
|
|
|
- item.projectType === '0' ? '个人' : '团体',
|
|
|
- // item.groupType,
|
|
|
- item.location,
|
|
|
- item.groupNum,
|
|
|
- item.participateNum
|
|
|
- ].join(',');
|
|
|
- csvContent += row + '\n';
|
|
|
+ html += `
|
|
|
+ <tr>
|
|
|
+ <td>${item.scheduleDate || ''}</td>
|
|
|
+ <td>${item.startTime}-${item.endTime}</td>
|
|
|
+ <td>${item.projectName || ''}</td>
|
|
|
+ <td>${getProjectTypeLabel(item.projectType)}</td>
|
|
|
+ <td>${item.location || ''}</td>
|
|
|
+ <td>${item.groupNum || 0}</td>
|
|
|
+ <td>${item.participateNum || 0}</td>
|
|
|
+ </tr>
|
|
|
+ `;
|
|
|
});
|
|
|
|
|
|
- // 创建下载链接
|
|
|
- const blob = new Blob(['\uFEFF' + csvContent], { type: 'text/csv;charset=utf-8;' });
|
|
|
+ html += `
|
|
|
+ </table>
|
|
|
+ </body>
|
|
|
+ </html>
|
|
|
+ `;
|
|
|
+
|
|
|
+ // 创建 Blob 并下载
|
|
|
+ const blob = new Blob([html], { type: 'application/vnd.ms-excel;charset=utf-8' });
|
|
|
const link = document.createElement('a');
|
|
|
- const url = URL.createObjectURL(blob);
|
|
|
- link.setAttribute('href', url);
|
|
|
- link.setAttribute('download', `赛事日程安排_${defaultEvent.value.eventName}_${parseTime(new Date(), '{y}{m}{d}')}.csv`);
|
|
|
- link.style.visibility = 'hidden';
|
|
|
- document.body.appendChild(link);
|
|
|
+ link.href = URL.createObjectURL(blob);
|
|
|
+ link.download = `赛事日程安排_${defaultEvent.value.eventName}_${parseTime(new Date(), '{y}{m}{d}')}.xls`;
|
|
|
link.click();
|
|
|
- document.body.removeChild(link);
|
|
|
+ URL.revokeObjectURL(link.href);
|
|
|
};
|
|
|
|
|
|
onMounted(() => {
|
