martial/martial-mini
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复赛事规程下载文件无后缀问题

Browse Source 
- event-rules页面H5环境使用a标签download属性指定文件名
- 修复api.config.js生产环境API地址配置
- 优化多个页面的附件展示

🤖 Generated with Claude Code

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
DevOps
2025-12-26 15:45:30 +08:00
parent 9c063a9779
commit 541c770f27
6 changed files with 606 additions and 495 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
package-lock.json generated
View File

@@ -77,7 +77,6 @@
"version": "7.28.5",
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
"integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
"peer": true,
"dependencies": {
"@babel/code-frame": "^7.27.1",
"@babel/generator": "^7.28.5",
@@ -2856,7 +2855,6 @@
"resolved": "https://registry.npmjs.org/@vue/cli-service/-/cli-service-4.5.19.tgz",
"integrity": "sha512-+Wpvj8fMTCt9ZPOLu5YaLkFCQmB4MrZ26aRmhhKiCQ/4PMoL6mLezfqdt6c+m2htM+1WV5RunRo+0WHl2DfwZA==",
"dev": true,
"peer": true,
"dependencies": {
"@intervolga/optimize-cssnano-plugin": "^1.0.5",
"@soda/friendly-errors-webpack-plugin": "^1.7.1",
@@ -3517,7 +3515,6 @@
"version": "6.12.6",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
"integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.1",
"fast-json-stable-stringify": "^2.0.0",
@@ -4414,7 +4411,6 @@
"url": "https://github.com/sponsors/ai"
}
],
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.9.0",
"caniuse-lite": "^1.0.30001759",
@@ -5334,7 +5330,6 @@
"resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.2.tgz",
"integrity": "sha512-Uh7crJAco3AjBvgAy9Z75CjK8IG+gxaErro71THQ+vv/bl4HaQcpkexAY8KVW/T6D2W2IRr+couF/knIRkZMIQ==",
"dev": true,
"peer": true,
"dependencies": {
"cacache": "^12.0.3",
"find-cache-dir": "^2.1.0",
@@ -7382,7 +7377,6 @@
"resolved": "https://registry.npmjs.org/file-loader/-/file-loader-4.3.0.tgz",
"integrity": "sha512-aKrYPYjF1yG3oX0kWRrqrSMfgftm7oJW5M+m4owoldH5C51C0RkIwB++JbRvEW3IU6/ZG5n8UvEcdgwOt2UOWA==",
"dev": true,
"peer": true,
"dependencies": {
"loader-utils": "^1.2.3",
"schema-utils": "^2.5.0"
@@ -8454,7 +8448,6 @@
"version": "4.5.2",
"resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-4.5.2.tgz",
"integrity": "sha512-q5oYdzjKUIPQVjOosjgvCHQOv9Ett9CYYHlgvJeXG0qQvdSojnBq4vAdQBwn1+yGveAwHCoe/rMR86ozX3+c2A==",
"peer": true,
"dependencies": {
"@types/html-minifier-terser": "^5.0.0",
"@types/tapable": "^1.0.5",
@@ -11314,7 +11307,6 @@
"version": "2.16.105",
"resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-2.16.105.tgz",
"integrity": "sha512-J4dn41spsAwUxCpEoVf6GVoz908IAA3mYiLmNxg8J9kfRXc2jxpbUepcP0ocp0alVNLFthTAM8DZ1RaHh8sU0A==",
"license": "Apache-2.0",
"dependencies": {
"dommatrix": "^1.0.3",
"web-streams-polyfill": "^3.2.1"
@@ -11436,7 +11428,6 @@
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz",
"integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
"dev": true,
"peer": true,
"dependencies": {
"picocolors": "^0.2.1",
"source-map": "^0.6.1"
@@ -13063,7 +13054,6 @@
"resolved": "https://registry.npmjs.org/sass/-/sass-1.96.0.tgz",
"integrity": "sha512-8u4xqqUeugGNCYwr9ARNtQKTOj4KmYiJAVKXf2CTIivTCR51j96htbMKWDru8H5SaQWpyVgTfOF8Ylyf5pun1Q==",
"dev": true,
"peer": true,
"dependencies": {
"chokidar": "^4.0.0",
"immutable": "^5.0.2",
@@ -16080,7 +16070,6 @@
"version": "4.47.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-4.47.0.tgz",
"integrity": "sha512-td7fYwgLSrky3fI1EuU5cneU4+pbH6GgOfuKNS1tNPcfdGinGELAqsb/BP4nnvZyKSG2i/xFGU7+n2PvZA8HJQ==",
"peer": true,
"dependencies": {
"@webassemblyjs/ast": "1.9.0",
"@webassemblyjs/helper-module-context": "1.9.0",

37
src/pages/add-player/add-player.vue
View File

@@ -141,7 +141,7 @@ export default {
this.competitionId = options.competitionId
}
if (options.projectIds) {
this.projectIds = options.projectIds.split(',').map(id => parseInt(id))
this.projectIds = options.projectIds.split(',')
}
console.log('新增选手页面接收参数:', {
competitionId: this.competitionId,
@@ -181,7 +181,38 @@ export default {
methods: {
validateIdCard(idCard) {
// 身份证号验证：18位，最后一位可以是数字或字母X
return /^\d{17}[\dXx]$/.test(idCard);
if (!/^\d{17}[\dXx]$/.test(idCard)) {
return false;
}
// 验证日期部分是否有效
const year = parseInt(idCard.substring(6, 10))
const month = parseInt(idCard.substring(10, 12))
const day = parseInt(idCard.substring(12, 14))
// 检查月份是否有效 (1-12)
if (month < 1 || month > 12) {
return false;
}
// 检查日期是否有效 (1-31)
if (day < 1 || day > 31) {
return false;
}
// 检查年份是否合理 (1900-当前年份)
const currentYear = new Date().getFullYear()
if (year < 1900 || year > currentYear) {
return false;
}
// 进一步验证日期是否真实存在
const date = new Date(year, month - 1, day)
if (date.getFullYear() !== year || date.getMonth() !== month - 1 || date.getDate() !== day) {
return false;
}
return true;
},
validatePhone(phone) {
// 手机号验证：11位数字
@@ -281,7 +312,7 @@ export default {
// 如果有赛事ID和项目ID，一起提交
if (this.competitionId) {
submitData.competitionId = parseInt(this.competitionId)
submitData.competitionId = this.competitionId
}
if (this.projectIds && this.projectIds.length > 0) {
// 如果有多个项目，取第一个项目ID

320
src/pages/event-info/event-info.vue
View File

@@ -1,5 +1,27 @@
<template>
<view class="event-info-page">
<!-- 附件下载区 -->
<view class="attachments-section" v-if="attachments.length > 0">
<view class="section-title">
<text class="title-icon">📎</text>
<text class="title-text">相关附件</text>
</view>
<view class="attachments-list">
<view class="attachment-item" v-for="(file, index) in attachments" :key="index" @click="downloadFile(file)">
<view class="file-info">
<text class="file-icon">{{ getFileIcon(file.fileType) }}</text>
<view class="file-details">
<text class="file-name">{{ file.fileName }}</text>
<text class="file-size">{{ file.fileSize }}</text>
</view>
</view>
<view class="download-btn">
<text class="download-icon">⬇</text>
</view>
</view>
</view>
</view>
<!-- 信息列表 -->
<view class="info-list">
<view class="info-item" v-for="(item, index) in infoList" :key="index" @click="handleItemClick(item)">
@@ -13,7 +35,7 @@
</view>
<!-- 空状态 -->
<view class="empty-state" v-if="infoList.length === 0">
<view class="empty-state" v-if="infoList.length === 0 && attachments.length === 0">
<text class="empty-text">暂无信息发布</text>
</view>
</view>
@@ -21,21 +43,57 @@
<script>
import infoAPI from '@/api/info.js'
import competitionAPI from '@/api/competition.js'
export default {
data() {
return {
eventId: '',
infoList: []
infoList: [],
attachments: []
};
},
onLoad(options) {
if (options.eventId) {
this.eventId = options.eventId
this.loadInfoList(options.eventId)
this.loadAttachments(options.eventId)
}
},
methods: {
/**
* 加载附件列表
*/
async loadAttachments(eventId) {
try {
const res = await competitionAPI.getAttachments({
competitionId: eventId,
type: 'info'
})
let list = []
if (res && Array.isArray(res)) {
list = res
} else if (res && res.records) {
list = res.records
} else if (res && res.data && Array.isArray(res.data)) {
list = res.data
}
if (list.length > 0) {
this.attachments = list.map(file => ({
id: file.id,
fileName: file.fileName || file.name,
fileUrl: file.fileUrl || file.url,
fileSize: this.formatFileSize(file.fileSize || file.size),
fileType: file.fileType || this.getFileType(file.fileName || file.name)
}))
}
} catch (err) {
console.error('加载附件失败:', err)
}
},
/**
* 加载信息发布列表
*/
@@ -50,11 +108,6 @@ export default {
list = res
}
// 如果后端没有数据，使用模拟数据
if (list.length === 0) {
list = this.getMockData()
}
// 数据映射
this.infoList = list.map(item => ({
id: item.id,
@@ -66,81 +119,100 @@ export default {
}))
} catch (err) {
console.error('加载信息列表失败:', err)
// 加载失败时使用模拟数据
const list = this.getMockData()
this.infoList = list.map(item => ({
id: item.id,
type: this.getInfoType(item.info_type || item.type),
typeText: this.getInfoTypeText(item.info_type || item.type),
title: item.title,
desc: item.content,
time: this.formatTime(item.publishTime)
}))
}
},
/**
* 获取模拟数据
* 下载文件
*/
getMockData() {
return [
{
id: 1,
info_type: 3,
title: '重要通知：赛事报名截止时间变更',
content: '由于场馆调整，本次赛事报名截止时间延长至2025年12月20日，请各位选手抓紧时间报名。如有疑问，请联系赛事组委会。',
publishTime: '2025-01-10 09:00:00'
downloadFile(file) {
const fileExt = file.fileType || this.getFileType(file.fileName) || 'pdf'
// #ifdef H5
const link = document.createElement('a')
link.href = file.fileUrl
link.download = file.fileName
link.target = '_blank'
link.style.display = 'none'
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
uni.showToast({
title: '开始下载',
icon: 'success'
})
return
// #endif
// #ifndef H5
uni.showLoading({ title: '准备下载' })
uni.downloadFile({
url: file.fileUrl,
success: (res) => {
if (res.statusCode === 200) {
uni.openDocument({
filePath: res.tempFilePath,
fileType: fileExt,
success: () => {
uni.hideLoading()
uni.showToast({ title: '打开成功', icon: 'success' })
},
fail: (err) => {
uni.hideLoading()
console.error('打开文件失败:', err)
uni.showToast({ title: '打开失败', icon: 'none' })
}
})
}
},
{
id: 2,
info_type: 1,
title: '参赛选手须知',
content: '请各位参赛选手提前1小时到达比赛场地进行检录，携带身份证原件及复印件。比赛期间请遵守赛场纪律，服从裁判判决。',
publishTime: '2025-01-09 14:30:00'
},
{
id: 3,
info_type: 2,
title: '比赛场地及交通指引',
content: '本次赛事在市体育中心举行，地址：XX市XX区XX路100号。可乘坐地铁2号线至体育中心站下车，或乘坐公交车88路、99路至体育中心站。场馆提供免费停车位。',
publishTime: '2025-01-08 16:00:00'
},
{
id: 4,
info_type: 1,
title: '赛前训练安排通知',
content: '为方便各位选手熟悉场地，组委会安排在比赛前一天（12月24日）下午14:00-17:00开放场地供选手训练。请需要训练的选手提前联系组委会预约。',
publishTime: '2025-01-07 10:20:00'
},
{
id: 5,
info_type: 2,
title: '比赛流程及注意事项',
content: '比赛采用淘汰赛制，分为预赛、半决赛和决赛三个阶段。每场比赛时长为5分钟，选手需提前做好热身准备。比赛过程中严禁使用违禁器材。',
publishTime: '2025-01-06 11:45:00'
},
{
id: 6,
info_type: 1,
title: '医疗保障及安全提示',
content: '赛事现场配备专业医疗团队和救护车，设有医疗服务点。建议选手自备常用药品，如有特殊疾病请提前告知组委会。比赛前请充分热身，避免受伤。',
publishTime: '2025-01-05 15:10:00'
},
{
id: 7,
info_type: 3,
title: '关于赛事直播安排的通知',
content: '本次赛事将进行全程网络直播，届时可通过官方网站和APP观看。精彩瞬间将在赛后剪辑发布，敬请期待！',
publishTime: '2025-01-04 13:00:00'
},
{
id: 8,
info_type: 2,
title: '志愿者招募公告',
content: '赛事组委会现招募志愿者50名，负责现场引导、秩序维护、后勤保障等工作。有意者请扫描海报二维码报名，报名截止时间为12月15日。',
publishTime: '2025-01-03 09:30:00'
fail: (err) => {
uni.hideLoading()
console.error('下载失败:', err)
uni.showToast({ title: '下载失败', icon: 'none' })
}
]
})
// #endif
},
/**
* 获取文件类型
*/
getFileType(fileName) {
if (!fileName) return 'pdf'
const ext = fileName.split('.').pop().toLowerCase()
return ext
},
/**
* 获取文件图标
*/
getFileIcon(fileType) {
const iconMap = {
'pdf': '📕',
'doc': '📘',
'docx': '📘',
'xls': '📗',
'xlsx': '📗',
'ppt': '📙',
'pptx': '📙',
'txt': '📄',
'zip': '📦',
'rar': '📦'
}
return iconMap[fileType] || '📄'
},
/**
* 格式化文件大小
*/
formatFileSize(bytes) {
if (!bytes || bytes === 0) return '0 B'
if (typeof bytes === 'string') return bytes
const k = 1024
const sizes = ['B', 'KB', 'MB', 'GB']
const i = Math.floor(Math.log(bytes) / Math.log(k))
return (bytes / Math.pow(k, i)).toFixed(2) + ' ' + sizes[i]
},
/**
@@ -190,7 +262,6 @@ export default {
},
handleItemClick(item) {
// 跳转到信息详情页
uni.navigateTo({
url: `/pages/event-info-detail/event-info-detail?id=${item.id}&type=${item.type}&typeText=${encodeURIComponent(item.typeText)}&title=${encodeURIComponent(item.title)}&content=${encodeURIComponent(item.desc)}&time=${encodeURIComponent(item.time)}`
})
@@ -206,6 +277,103 @@ export default {
padding: 20rpx 30rpx;
}
// 区块标题
.section-title {
display: flex;
align-items: center;
gap: 10rpx;
margin-bottom: 20rpx;
padding: 0 10rpx;
}
.title-icon {
font-size: 32rpx;
}
.title-text {
font-size: 30rpx;
font-weight: bold;
color: #333333;
}
// 附件下载区
.attachments-section {
margin-bottom: 30rpx;
}
.attachments-list {
display: flex;
flex-direction: column;
gap: 15rpx;
}
.attachment-item {
background-color: #fff;
border-radius: 16rpx;
padding: 25rpx 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
transition: all 0.3s;
&:active {
background-color: #f8f8f8;
transform: scale(0.98);
}
}
.file-info {
display: flex;
align-items: center;
gap: 20rpx;
flex: 1;
min-width: 0;
}
.file-icon {
font-size: 48rpx;
flex-shrink: 0;
}
.file-details {
display: flex;
flex-direction: column;
gap: 8rpx;
flex: 1;
min-width: 0;
}
.file-name {
font-size: 28rpx;
color: #333333;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.file-size {
font-size: 24rpx;
color: #999999;
}
.download-btn {
width: 60rpx;
height: 60rpx;
background-color: #C93639;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.download-icon {
font-size: 32rpx;
color: #fff;
}
.info-list {
display: flex;
flex-direction: column;

6
src/pages/event-register/event-register.vue
View File

@@ -485,9 +485,9 @@ export default {
// 构建提交数据 - 确保ID都是数字类型
const submitData = {
orderNo: orderNo,
competitionId: parseInt(this.eventId),
projectIds: this.selectedProjects.map(p => parseInt(p.id)),
athleteIds: selected.map(p => parseInt(p.id)),
competitionId: String(this.eventId),
projectIds: this.selectedProjects.map(p => String(p.id)),
athleteIds: selected.map(p => String(p.id)),
contactPhone: this.eventInfo.contact || '',
totalAmount: parseFloat(this.totalPrice) || 0
}

154
src/pages/event-rules/event-rules.vue
View File

@@ -71,40 +71,60 @@ export default {
data() {
return {
eventId: '',
// 附件列表
attachments: [],
// 规程章节列表
rulesList: []
};
},
onLoad(options) {
if (options.eventId) {
this.eventId = options.eventId
this.loadRulesData()
this.loadAttachments(options.eventId)
this.loadRulesData(options.eventId)
}
},
methods: {
/**
* 加载规程数据
* 加载附件列表
*/
async loadRulesData() {
async loadAttachments(eventId) {
try {
// 调用API获取规程数据
const res = await competitionAPI.getCompetitionRules(this.eventId)
const res = await competitionAPI.getAttachments({
competitionId: eventId,
type: 'rules'
})
// 处理附件数据
if (res.attachments && res.attachments.length > 0) {
this.attachments = res.attachments.map(file => ({
id: file.id,
fileName: file.name || file.fileName,
fileUrl: file.url || file.fileUrl,
fileSize: this.formatFileSize(file.size || file.fileSize),
fileType: this.getFileType(file.name || file.fileName)
}))
let list = []
if (res && Array.isArray(res)) {
list = res
} else if (res && res.records) {
list = res.records
} else if (res && res.data && Array.isArray(res.data)) {
list = res.data
}
if (list.length > 0) {
this.attachments = list.map(file => ({
id: file.id,
fileName: file.fileName || file.name,
fileUrl: file.fileUrl || file.url,
fileSize: this.formatFileSize(file.fileSize || file.size),
fileType: file.fileType || this.getFileType(file.fileName || file.name)
}))
}
} catch (err) {
console.error('加载附件失败:', err)
}
},
/**
* 加载规程数据
*/
async loadRulesData(eventId) {
try {
const res = await competitionAPI.getCompetitionRules(eventId)
// 处理规程内容数据
if (res.chapters && res.chapters.length > 0) {
if (res && res.chapters && res.chapters.length > 0) {
this.rulesList = res.chapters.map(chapter => ({
chapter: chapter.chapterNumber || chapter.number,
title: chapter.title || chapter.name,
@@ -114,76 +134,9 @@ export default {
}
} catch (err) {
console.error('加载规程数据失败:', err)
// 如果API失败，使用模拟数据
this.loadMockData()
}
},
/**
* 加载模拟数据（用于开发测试）
*/
loadMockData() {
this.attachments = [
{
id: '1',
fileName: '2025年郑州武术大赛规程.pdf',
fileUrl: 'https://example.com/rules.pdf',
fileSize: '2.5 MB',
fileType: 'pdf'
},
{
id: '2',
fileName: '参赛报名表.docx',
fileUrl: 'https://example.com/form.docx',
fileSize: '156 KB',
fileType: 'docx'
}
]
this.rulesList = [
{
chapter: '第一章',
title: '总则',
expanded: false,
contents: [
'1.1 本次比赛遵循国际武术联合会竞赛规则。',
'1.2 所有参赛选手必须持有效证件参赛。',
'1.3 参赛选手须服从裁判判决，不得有违规行为。'
]
},
{
chapter: '第二章',
title: '参赛资格',
expanded: false,
contents: [
'2.1 参赛选手年龄须在18-45周岁之间。',
'2.2 参赛选手须持有武术等级证书或相关证明。',
'2.3 参赛选手须通过健康检查，身体状况良好。'
]
},
{
chapter: '第三章',
title: '比赛规则',
expanded: false,
contents: [
'3.1 比赛采用单败淘汰制。',
'3.2 每场比赛时间为3分钟，分3局进行。',
'3.3 得分规则按照国际标准执行。'
]
},
{
chapter: '第四章',
title: '奖项设置',
expanded: false,
contents: [
'4.1 各组别设金、银、铜牌各一枚。',
'4.2 设最佳表现奖、体育道德风尚奖等特别奖项。',
'4.3 所有参赛选手均可获得参赛证书。'
]
}
]
},
/**
* 切换章节展开/收起
*/
@@ -195,14 +148,12 @@ export default {
* 下载文件
*/
downloadFile(file) {
// 获取文件后缀
const fileExt = file.fileType || this.getFileType(file.fileName) || 'pdf'
// #ifdef H5
// H5环境：直接使用a标签下载，确保文件名带后缀
const link = document.createElement('a')
link.href = file.fileUrl
link.download = file.fileName // 设置下载文件名（带后缀）
link.download = file.fileName
link.target = '_blank'
link.style.display = 'none'
document.body.appendChild(link)
@@ -216,37 +167,22 @@ export default {
// #endif
// #ifndef H5
// 非H5环境
uni.showLoading({
title: '准备下载'
})
// 下载文件
uni.showLoading({ title: '准备下载' })
uni.downloadFile({
url: file.fileUrl,
success: (res) => {
if (res.statusCode === 200) {
// 保存文件到本地
const filePath = res.tempFilePath
// 打开文档
uni.openDocument({
filePath: filePath,
filePath: res.tempFilePath,
fileType: fileExt,
success: () => {
uni.hideLoading()
uni.showToast({
title: '打开成功',
icon: 'success'
})
uni.showToast({ title: '打开成功', icon: 'success' })
},
fail: (err) => {
uni.hideLoading()
console.error('打开文件失败:', err)
uni.showToast({
title: '打开失败',
icon: 'none'
})
uni.showToast({ title: '打开失败', icon: 'none' })
}
})
}
@@ -254,10 +190,7 @@ export default {
fail: (err) => {
uni.hideLoading()
console.error('下载失败:', err)
uni.showToast({
title: '下载失败',
icon: 'none'
})
uni.showToast({ title: '下载失败', icon: 'none' })
}
})
// #endif
@@ -267,6 +200,7 @@ export default {
* 获取文件类型
*/
getFileType(fileName) {
if (!fileName) return 'pdf'
const ext = fileName.split('.').pop().toLowerCase()
return ext
},

573
src/pages/event-schedule/event-schedule.vue
View File

@@ -1,7 +1,29 @@
<template>
<view class="event-schedule-page">
<!-- 附件下载区 -->
<view class="attachments-section" v-if="attachments.length > 0">
<view class="section-title">
<text class="title-icon">📎</text>
<text class="title-text">日程附件</text>
</view>
<view class="attachments-list">
<view class="attachment-item" v-for="(file, index) in attachments" :key="index" @click="downloadFile(file)">
<view class="file-info">
<text class="file-icon">{{ getFileIcon(file.fileType) }}</text>
<view class="file-details">
<text class="file-name">{{ file.fileName }}</text>
<text class="file-size">{{ file.fileSize }}</text>
</view>
</view>
<view class="download-btn">
<text class="download-icon">⬇</text>
</view>
</view>
</view>
</view>
<!-- 日期选择器 -->
<view class="date-tabs">
<view class="date-tabs" v-if="dates.length > 0">
<view
class="date-tab"
v-for="(date, index) in dates"
@@ -15,7 +37,7 @@
</view>
<!-- 日程时间线 -->
<view class="schedule-timeline">
<view class="schedule-timeline" v-if="currentSchedule.length > 0">
<view class="timeline-item" v-for="(item, index) in currentSchedule" :key="index">
<view class="time-dot"></view>
<view class="time-line" v-if="index < currentSchedule.length - 1"></view>
@@ -29,11 +51,18 @@
</view>
</view>
</view>
<!-- 空状态 -->
<view class="empty-state" v-if="attachments.length === 0 && dates.length === 0">
<text class="empty-icon">📅</text>
<text class="empty-text">暂无日程安排</text>
</view>
</view>
</template>
<script>
import infoAPI from '@/api/info.js'
import competitionAPI from '@/api/competition.js'
export default {
data() {
@@ -41,7 +70,8 @@ export default {
eventId: '',
currentDate: 0,
dates: [],
schedules: {}
schedules: {},
attachments: []
};
},
computed: {
@@ -52,6 +82,7 @@ export default {
onLoad(options) {
if (options.eventId) {
this.eventId = options.eventId
this.loadAttachments(options.eventId)
this.loadScheduleDates(options.eventId)
}
},
@@ -63,6 +94,132 @@ export default {
}
},
methods: {
/**
* 加载附件列表
*/
async loadAttachments(eventId) {
try {
const res = await competitionAPI.getAttachments({
competitionId: eventId,
type: 'schedule'
})
let list = []
if (res && Array.isArray(res)) {
list = res
} else if (res && res.records) {
list = res.records
} else if (res && res.data && Array.isArray(res.data)) {
list = res.data
}
if (list.length > 0) {
this.attachments = list.map(file => ({
id: file.id,
fileName: file.fileName || file.name,
fileUrl: file.fileUrl || file.url,
fileSize: this.formatFileSize(file.fileSize || file.size),
fileType: file.fileType || this.getFileType(file.fileName || file.name)
}))
}
} catch (err) {
console.error('加载附件失败:', err)
}
},
/**
* 下载文件
*/
downloadFile(file) {
const fileExt = file.fileType || this.getFileType(file.fileName) || 'pdf'
// #ifdef H5
const link = document.createElement('a')
link.href = file.fileUrl
link.download = file.fileName
link.target = '_blank'
link.style.display = 'none'
document.body.appendChild(link)
link.click()
document.body.removeChild(link)
uni.showToast({
title: '开始下载',
icon: 'success'
})
return
// #endif
// #ifndef H5
uni.showLoading({ title: '准备下载' })
uni.downloadFile({
url: file.fileUrl,
success: (res) => {
if (res.statusCode === 200) {
uni.openDocument({
filePath: res.tempFilePath,
fileType: fileExt,
success: () => {
uni.hideLoading()
uni.showToast({ title: '打开成功', icon: 'success' })
},
fail: (err) => {
uni.hideLoading()
console.error('打开文件失败:', err)
uni.showToast({ title: '打开失败', icon: 'none' })
}
})
}
},
fail: (err) => {
uni.hideLoading()
console.error('下载失败:', err)
uni.showToast({ title: '下载失败', icon: 'none' })
}
})
// #endif
},
/**
* 获取文件类型
*/
getFileType(fileName) {
if (!fileName) return 'pdf'
const ext = fileName.split('.').pop().toLowerCase()
return ext
},
/**
* 获取文件图标
*/
getFileIcon(fileType) {
const iconMap = {
'pdf': '📕',
'doc': '📘',
'docx': '📘',
'xls': '📗',
'xlsx': '📗',
'ppt': '📙',
'pptx': '📙',
'txt': '📄',
'zip': '📦',
'rar': '📦'
}
return iconMap[fileType] || '📄'
},
/**
* 格式化文件大小
*/
formatFileSize(bytes) {
if (!bytes || bytes === 0) return '0 B'
if (typeof bytes === 'string') return bytes
const k = 1024
const sizes = ['B', 'KB', 'MB', 'GB']
const i = Math.floor(Math.log(bytes) / Math.log(k))
return (bytes / Math.pow(k, i)).toFixed(2) + ' ' + sizes[i]
},
/**
* 加载日程日期列表
*/
@@ -77,9 +234,8 @@ export default {
list = res
}
// 如果后端没有数据，使用模拟数据
if (list.length === 0) {
list = this.getMockScheduleData()
return
}
// 提取唯一日期
@@ -93,7 +249,7 @@ export default {
// 格式化日期选项卡并排序
this.dates = Array.from(dateSet)
.sort((a, b) => new Date(a) - new Date(b)) // 按日期升序排序
.sort((a, b) => new Date(a) - new Date(b))
.map(date => {
const d = new Date(date)
const month = d.getMonth() + 1
@@ -119,7 +275,7 @@ export default {
this.schedules[dateIndex].push({
time: this.formatTime(item.scheduleTime || item.schedule_time || item.time),
timeRaw: item.scheduleTime || item.schedule_time || item.time, // 保存原始时间用于排序
timeRaw: item.scheduleTime || item.schedule_time || item.time,
title: item.eventName || item.event_name || item.title || item.activityName || item.scheduleName,
location: item.venue || item.location || ''
})
@@ -141,59 +297,6 @@ export default {
}
} catch (err) {
console.error('加载日程日期失败:', err)
// 加载失败时使用模拟数据
const list = this.getMockScheduleData()
// 提取唯一日期
const dateSet = new Set()
list.forEach(item => {
if (item.scheduleDate) {
dateSet.add(item.scheduleDate)
}
})
// 格式化日期选项卡并排序
this.dates = Array.from(dateSet)
.sort((a, b) => new Date(a) - new Date(b)) // 按日期升序排序
.map(date => {
const d = new Date(date)
const month = d.getMonth() + 1
const day = d.getDate()
const weekDay = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'][d.getDay()]
return {
date: date,
day: `${month}月${day}日`,
text: weekDay
}
})
// 按日期分组日程
list.forEach(item => {
const dateIndex = this.dates.findIndex(d => d.date === item.scheduleDate)
if (dateIndex >= 0) {
if (!this.schedules[dateIndex]) {
this.schedules[dateIndex] = []
}
this.schedules[dateIndex].push({
time: this.formatTime(item.scheduleTime),
timeRaw: item.scheduleTime, // 保存原始时间用于排序
title: item.eventName,
location: item.venue || ''
})
}
})
// 对每个日期内的日程按时间排序
Object.keys(this.schedules).forEach(dateIndex => {
this.schedules[dateIndex].sort((a, b) => {
const timeA = a.timeRaw || a.time
const timeB = b.timeRaw || b.time
return timeA.localeCompare(timeB)
})
})
}
},
@@ -226,7 +329,6 @@ export default {
return timeA.localeCompare(timeB)
})
// 触发视图更新
this.$forceUpdate()
}
} catch (err) {
@@ -240,17 +342,14 @@ export default {
formatTime(timeStr) {
if (!timeStr) return ''
// 如果已经是 HH:MM 格式
if (/^\d{2}:\d{2}$/.test(timeStr)) {
return timeStr
}
// 如果是 HH:MM:SS 格式，直接截取前5位
if (/^\d{2}:\d{2}:\d{2}$/.test(timeStr)) {
return timeStr.substring(0, 5)
}
// 尝试解析完整的日期时间字符串
const date = new Date(timeStr)
if (!isNaN(date.getTime())) {
const hours = String(date.getHours()).padStart(2, '0')
@@ -258,235 +357,7 @@ export default {
return `${hours}:${minutes}`
}
// 如果无法解析，返回原字符串
return timeStr
},
/**
* 获取模拟日程数据
*/
getMockScheduleData() {
return [
// 第一天：2025-12-25 (报到日)
{
id: 2001,
competitionId: 200,
scheduleDate: '2025-12-25',
scheduleTime: '08:00',
eventName: '运动员报到',
venue: '赛事组委会接待处',
status: 1
},
{
id: 2002,
competitionId: 200,
scheduleDate: '2025-12-25',
scheduleTime: '09:00',
eventName: '领取参赛证件及装备',
venue: '赛事组委会接待处',
status: 1
},
{
id: 2003,
competitionId: 200,
scheduleDate: '2025-12-25',
scheduleTime: '10:00',
eventName: '赛前技术会议',
venue: '会议室A',
status: 1
},
{
id: 2004,
competitionId: 200,
scheduleDate: '2025-12-25',
scheduleTime: '14:00',
eventName: '场地开放训练',
venue: '主赛场',
status: 1
},
{
id: 2005,
competitionId: 200,
scheduleDate: '2025-12-25',
scheduleTime: '16:00',
eventName: '裁判员培训会',
venue: '会议室B',
status: 1
},
{
id: 2006,
competitionId: 200,
scheduleDate: '2025-12-25',
scheduleTime: '18:00',
eventName: '开幕式彩排',
venue: '主赛场',
status: 1
},
// 第二天：2025-12-26 (正式比赛第一天)
{
id: 2007,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '07:30',
eventName: '运动员检录',
venue: '检录处',
status: 1
},
{
id: 2008,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '08:30',
eventName: '开幕式',
venue: '主赛场',
status: 1
},
{
id: 2009,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '09:00',
eventName: '男子长拳预赛',
venue: '主赛场',
status: 1
},
{
id: 2010,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '10:30',
eventName: '女子长拳预赛',
venue: '主赛场',
status: 1
},
{
id: 2011,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '12:00',
eventName: '午休',
venue: '',
status: 1
},
{
id: 2012,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '14:00',
eventName: '男子太极拳预赛',
venue: '主赛场',
status: 1
},
{
id: 2013,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '15:30',
eventName: '女子太极拳预赛',
venue: '主赛场',
status: 1
},
{
id: 2014,
competitionId: 200,
scheduleDate: '2025-12-26',
scheduleTime: '17:00',
eventName: '当日赛事总结会',
venue: '会议室A',
status: 1
},
// 第三天：2025-12-27 (正式比赛第二天 - 决赛日)
{
id: 2015,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '07:30',
eventName: '运动员检录',
venue: '检录处',
status: 1
},
{
id: 2016,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '08:30',
eventName: '男子长拳半决赛',
venue: '主赛场',
status: 1
},
{
id: 2017,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '10:00',
eventName: '女子长拳半决赛',
venue: '主赛场',
status: 1
},
{
id: 2018,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '12:00',
eventName: '午休',
venue: '',
status: 1
},
{
id: 2019,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '14:00',
eventName: '男子长拳决赛',
venue: '主赛场',
status: 1
},
{
id: 2020,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '15:00',
eventName: '女子长拳决赛',
venue: '主赛场',
status: 1
},
{
id: 2021,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '16:00',
eventName: '男子太极拳决赛',
venue: '主赛场',
status: 1
},
{
id: 2022,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '17:00',
eventName: '女子太极拳决赛',
venue: '主赛场',
status: 1
},
{
id: 2023,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '18:00',
eventName: '颁奖典礼',
venue: '主赛场',
status: 1
},
{
id: 2024,
competitionId: 200,
scheduleDate: '2025-12-27',
scheduleTime: '19:00',
eventName: '闭幕式',
venue: '主赛场',
status: 1
}
]
}
}
};
@@ -498,6 +369,104 @@ export default {
background-color: #f5f5f5;
}
// 区块标题
.section-title {
display: flex;
align-items: center;
gap: 10rpx;
margin-bottom: 20rpx;
padding: 0 10rpx;
}
.title-icon {
font-size: 32rpx;
}
.title-text {
font-size: 30rpx;
font-weight: bold;
color: #333333;
}
// 附件下载区
.attachments-section {
padding: 20rpx 30rpx;
margin-bottom: 10rpx;
}
.attachments-list {
display: flex;
flex-direction: column;
gap: 15rpx;
}
.attachment-item {
background-color: #fff;
border-radius: 16rpx;
padding: 25rpx 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
transition: all 0.3s;
&:active {
background-color: #f8f8f8;
transform: scale(0.98);
}
}
.file-info {
display: flex;
align-items: center;
gap: 20rpx;
flex: 1;
min-width: 0;
}
.file-icon {
font-size: 48rpx;
flex-shrink: 0;
}
.file-details {
display: flex;
flex-direction: column;
gap: 8rpx;
flex: 1;
min-width: 0;
}
.file-name {
font-size: 28rpx;
color: #333333;
font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.file-size {
font-size: 24rpx;
color: #999999;
}
.download-btn {
width: 60rpx;
height: 60rpx;
background-color: #C93639;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.download-icon {
font-size: 32rpx;
color: #fff;
}
.date-tabs {
background-color: #fff;
display: flex;
@@ -594,4 +563,24 @@ export default {
.location-icon {
font-size: 22rpx;
}
// 空状态
.empty-state {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 200rpx 0;
gap: 20rpx;
}
.empty-icon {
font-size: 120rpx;
opacity: 0.3;
}
.empty-text {
font-size: 28rpx;
color: #999999;
}
</style>