fix bugs
This commit is contained in:
880
pages/attachment-view/attachment-view.vue
Normal file
880
pages/attachment-view/attachment-view.vue
Normal file
@@ -0,0 +1,880 @@
|
||||
<template>
|
||||
<view class="attachment-page">
|
||||
<!-- 赛事信息卡片 -->
|
||||
<view class="event-info-card">
|
||||
<view class="event-title">{{ competitionName || '赛事名称' }}</view>
|
||||
<view class="event-time-row">
|
||||
<view class="time-item">
|
||||
<text class="time-label">开始时间</text>
|
||||
<text class="time-value">{{ startTime || '待定' }}</text>
|
||||
</view>
|
||||
<view class="time-divider"></view>
|
||||
<view class="time-item">
|
||||
<text class="time-label">结束时间</text>
|
||||
<text class="time-value">{{ endTime || '待定' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 加载状态 -->
|
||||
<view class="loading-state" v-if="loading">
|
||||
<view class="loading-spinner"></view>
|
||||
<text class="loading-text">加载中...</text>
|
||||
</view>
|
||||
|
||||
<!-- 附件列表 -->
|
||||
<view class="attachments-section" v-if="!loading && attachments.length > 0">
|
||||
<view class="section-header">
|
||||
<text class="section-title">{{ pageTitle }}文件</text>
|
||||
<text class="section-count">共{{ attachments.length }}个文件</text>
|
||||
</view>
|
||||
|
||||
<view class="attachments-list">
|
||||
<view
|
||||
class="attachment-item"
|
||||
v-for="(file, index) in attachments"
|
||||
:key="index"
|
||||
>
|
||||
<!-- 文件图标 -->
|
||||
<view class="file-icon" :class="'icon-' + file.fileType">
|
||||
<text class="icon-text">{{ getFileIconText(file.fileType) }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 文件信息 -->
|
||||
<view class="file-content">
|
||||
<text class="file-name">{{ file.fileName }}</text>
|
||||
<view class="file-meta">
|
||||
<text class="meta-item">{{ file.fileSize }}</text>
|
||||
<text class="meta-dot" v-if="file.uploadTime">·</text>
|
||||
<text class="meta-item" v-if="file.uploadTime">{{ file.uploadTime }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 操作按钮 -->
|
||||
<view class="file-actions">
|
||||
<view class="action-btn preview-btn" @click="previewFile(file)">
|
||||
<text class="action-text">预览</text>
|
||||
</view>
|
||||
<view class="action-btn download-btn" @click="downloadFile(file)">
|
||||
<text class="action-text">下载</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view class="empty-state" v-if="!loading && attachments.length === 0">
|
||||
<image class="empty-image" src="/static/images/empty.png" mode="aspectFit" />
|
||||
<text class="empty-title">暂无{{ pageTitle }}文件</text>
|
||||
<text class="empty-desc">相关文件正在整理中,请稍后查看</text>
|
||||
</view>
|
||||
|
||||
<!-- PDF预览弹窗 (仅H5) -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="preview-modal" v-if="showPreview" @click="closePreview">
|
||||
<view class="preview-container" @click.stop>
|
||||
<view class="preview-header">
|
||||
<text class="preview-title">{{ previewFileName }}</text>
|
||||
<view class="preview-close" @click="closePreview">
|
||||
<text class="close-icon">×</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="preview-body">
|
||||
<iframe
|
||||
:src="previewUrl"
|
||||
class="preview-iframe"
|
||||
frameborder="0"
|
||||
></iframe>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import competitionAPI from '@/api/competition.js'
|
||||
|
||||
// 页面类型配置
|
||||
const PAGE_CONFIG = {
|
||||
'info': { title: '信息发布', type: 'info' },
|
||||
'rules': { title: '赛事规程', type: 'rules' },
|
||||
'schedule': { title: '活动日程', type: 'schedule' },
|
||||
'score': { title: '成绩公告', type: 'results' },
|
||||
'results': { title: '成绩公告', type: 'results' },
|
||||
'awards': { title: '奖牌榜', type: 'medals' },
|
||||
'medals': { title: '奖牌榜', type: 'medals' },
|
||||
'photos': { title: '图片直播', type: 'photos' }
|
||||
}
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
pageType: 'rules',
|
||||
pageTitle: '赛事规程',
|
||||
competitionId: '',
|
||||
competitionName: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
attachments: [],
|
||||
// H5预览相关
|
||||
showPreview: false,
|
||||
previewUrl: '',
|
||||
previewFileName: ''
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
// 获取页面类型
|
||||
if (options.type && PAGE_CONFIG[options.type]) {
|
||||
this.pageType = options.type
|
||||
this.pageTitle = PAGE_CONFIG[options.type].title
|
||||
}
|
||||
|
||||
// 获取赛事ID
|
||||
if (options.competitionId || options.eventId) {
|
||||
this.competitionId = options.competitionId || options.eventId
|
||||
}
|
||||
|
||||
// 获取赛事名称
|
||||
if (options.name) {
|
||||
this.competitionName = decodeURIComponent(options.name)
|
||||
}
|
||||
|
||||
// 获取比赛时间
|
||||
if (options.startTime) {
|
||||
this.startTime = decodeURIComponent(options.startTime)
|
||||
}
|
||||
if (options.endTime) {
|
||||
this.endTime = decodeURIComponent(options.endTime)
|
||||
}
|
||||
|
||||
// 设置导航栏标题
|
||||
uni.setNavigationBarTitle({
|
||||
title: this.pageTitle
|
||||
})
|
||||
|
||||
// 加载数据
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 加载数据
|
||||
*/
|
||||
async loadData() {
|
||||
this.loading = true
|
||||
try {
|
||||
// 如果没有赛事信息,先获取赛事详情
|
||||
if (!this.startTime || !this.endTime) {
|
||||
await this.loadCompetitionInfo()
|
||||
}
|
||||
// 加载附件列表
|
||||
await this.loadAttachments()
|
||||
} finally {
|
||||
this.loading = false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 加载赛事信息
|
||||
*/
|
||||
async loadCompetitionInfo() {
|
||||
try {
|
||||
const res = await competitionAPI.getCompetitionDetail(this.competitionId)
|
||||
if (res) {
|
||||
this.competitionName = res.name || res.title || this.competitionName
|
||||
this.startTime = this.formatDate(res.startTime || res.competitionStartTime)
|
||||
this.endTime = this.formatDate(res.endTime || res.competitionEndTime)
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('加载赛事信息失败:', err)
|
||||
// 使用模拟数据
|
||||
this.startTime = '2025.12.12'
|
||||
this.endTime = '2025.12.14'
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 加载附件列表
|
||||
*/
|
||||
async loadAttachments() {
|
||||
try {
|
||||
// 使用 PAGE_CONFIG 映射的 type 值
|
||||
const attachmentType = PAGE_CONFIG[this.pageType]?.type || this.pageType
|
||||
console.log('=== 加载附件 ===')
|
||||
console.log('competitionId:', this.competitionId)
|
||||
console.log('pageType:', this.pageType)
|
||||
console.log('attachmentType (发送给后端):', attachmentType)
|
||||
|
||||
const res = await competitionAPI.getAttachments({
|
||||
competitionId: this.competitionId,
|
||||
type: attachmentType
|
||||
})
|
||||
|
||||
console.log('API返回结果:', res)
|
||||
console.log('API返回结果类型:', typeof res)
|
||||
console.log('是否为数组:', Array.isArray(res))
|
||||
|
||||
// 兼容不同的返回格式
|
||||
let attachmentList = []
|
||||
if (Array.isArray(res)) {
|
||||
attachmentList = res
|
||||
} else if (res && res.records && Array.isArray(res.records)) {
|
||||
// 分页格式
|
||||
attachmentList = res.records
|
||||
} else if (res && typeof res === 'object') {
|
||||
// 可能是单个对象,转为数组
|
||||
attachmentList = [res]
|
||||
}
|
||||
|
||||
console.log('处理后的附件列表:', attachmentList)
|
||||
|
||||
if (attachmentList.length > 0) {
|
||||
this.attachments = attachmentList.map(file => ({
|
||||
id: file.id,
|
||||
fileName: file.fileName || file.name,
|
||||
fileUrl: file.fileUrl || file.url,
|
||||
fileSize: this.formatFileSize(file.fileSize || file.size),
|
||||
fileType: this.getFileType(file.fileName || file.name),
|
||||
uploadTime: this.formatDate(file.uploadTime || file.createTime)
|
||||
}))
|
||||
console.log('附件加载成功,共', this.attachments.length, '个文件')
|
||||
} else {
|
||||
console.log('没有附件数据,显示空状态')
|
||||
this.attachments = []
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('=== 加载附件失败 ===')
|
||||
console.error('错误详情:', err)
|
||||
console.error('错误消息:', err.message)
|
||||
console.error('错误代码:', err.code)
|
||||
// 显示空状态,不使用模拟数据,方便调试
|
||||
this.attachments = []
|
||||
// 如果需要模拟数据,取消下面的注释
|
||||
// this.loadMockData()
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 加载模拟数据
|
||||
*/
|
||||
loadMockData() {
|
||||
const mockDataMap = {
|
||||
'info': [
|
||||
{ id: '1', fileName: '2025年郑州武术大赛通知.pdf', fileUrl: '', fileSize: '1.2 MB', fileType: 'pdf', uploadTime: '2025-12-20' }
|
||||
],
|
||||
'rules': [
|
||||
{ id: '1', fileName: '2025年郑州武术大赛竞赛规程.pdf', fileUrl: '', fileSize: '2.5 MB', fileType: 'pdf', uploadTime: '2025-12-18' },
|
||||
{ id: '2', fileName: '参赛报名表.pdf', fileUrl: '', fileSize: '156 KB', fileType: 'pdf', uploadTime: '2025-12-18' }
|
||||
],
|
||||
'schedule': [
|
||||
{ id: '1', fileName: '比赛日程安排表.pdf', fileUrl: '', fileSize: '890 KB', fileType: 'pdf', uploadTime: '2025-12-19' }
|
||||
],
|
||||
'score': [
|
||||
{ id: '1', fileName: '比赛成绩公告.pdf', fileUrl: '', fileSize: '1.8 MB', fileType: 'pdf', uploadTime: '2025-12-25' }
|
||||
],
|
||||
'results': [
|
||||
{ id: '1', fileName: '比赛成绩公告.pdf', fileUrl: '', fileSize: '1.8 MB', fileType: 'pdf', uploadTime: '2025-12-25' }
|
||||
],
|
||||
'awards': [
|
||||
{ id: '1', fileName: '奖牌榜统计.pdf', fileUrl: '', fileSize: '520 KB', fileType: 'pdf', uploadTime: '2025-12-25' }
|
||||
],
|
||||
'medals': [
|
||||
{ id: '1', fileName: '奖牌榜统计.pdf', fileUrl: '', fileSize: '520 KB', fileType: 'pdf', uploadTime: '2025-12-25' }
|
||||
],
|
||||
'photos': [
|
||||
{ id: '1', fileName: '比赛精彩瞬间.pdf', fileUrl: '', fileSize: '15.6 MB', fileType: 'pdf', uploadTime: '2025-12-25' }
|
||||
]
|
||||
}
|
||||
|
||||
this.attachments = mockDataMap[this.pageType] || []
|
||||
},
|
||||
|
||||
/**
|
||||
* 预览文件
|
||||
*/
|
||||
previewFile(file) {
|
||||
if (!file.fileUrl) {
|
||||
uni.showToast({
|
||||
title: '文件暂不可用',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// #ifdef H5
|
||||
// H5端:根据文件类型选择预览方式
|
||||
if (file.fileType === 'pdf') {
|
||||
// 方案1: 直接在新标签页打开PDF(浏览器内置PDF阅读器)
|
||||
window.open(file.fileUrl, '_blank')
|
||||
|
||||
// 方案2: 使用微软 Office Online Viewer(备选,需要公网可访问)
|
||||
// const msViewerUrl = `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(file.fileUrl)}`
|
||||
// window.open(msViewerUrl, '_blank')
|
||||
|
||||
// 方案3: 使用内嵌弹窗(如果服务器支持)
|
||||
// this.previewFileName = file.fileName
|
||||
// this.previewUrl = file.fileUrl
|
||||
// this.showPreview = true
|
||||
} else if (['jpg', 'jpeg', 'png', 'gif', 'webp'].includes(file.fileType)) {
|
||||
// 图片使用弹窗显示
|
||||
this.previewFileName = file.fileName
|
||||
this.previewUrl = file.fileUrl
|
||||
this.showPreview = true
|
||||
} else if (['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'].includes(file.fileType)) {
|
||||
// Office 文档使用微软在线预览
|
||||
const msViewerUrl = `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(file.fileUrl)}`
|
||||
window.open(msViewerUrl, '_blank')
|
||||
} else {
|
||||
// 其他文件类型,在新窗口打开
|
||||
window.open(file.fileUrl, '_blank')
|
||||
}
|
||||
return
|
||||
// #endif
|
||||
|
||||
// #ifndef H5
|
||||
// 非H5端使用下载+打开文档的方式
|
||||
uni.showLoading({
|
||||
title: '加载中...'
|
||||
})
|
||||
|
||||
uni.downloadFile({
|
||||
url: file.fileUrl,
|
||||
success: (res) => {
|
||||
uni.hideLoading()
|
||||
if (res.statusCode === 200) {
|
||||
uni.openDocument({
|
||||
filePath: res.tempFilePath,
|
||||
fileType: file.fileType,
|
||||
showMenu: true,
|
||||
success: () => {
|
||||
console.log('打开文档成功')
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('打开文档失败:', err)
|
||||
uni.showToast({
|
||||
title: '无法预览此文件',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '文件加载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
uni.hideLoading()
|
||||
console.error('下载失败:', err)
|
||||
uni.showToast({
|
||||
title: '下载失败,请重试',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
|
||||
/**
|
||||
* 关闭预览弹窗
|
||||
*/
|
||||
closePreview() {
|
||||
this.showPreview = false
|
||||
this.previewUrl = ''
|
||||
this.previewFileName = ''
|
||||
},
|
||||
|
||||
/**
|
||||
* 下载文件
|
||||
*/
|
||||
downloadFile(file) {
|
||||
if (!file.fileUrl) {
|
||||
uni.showToast({
|
||||
title: '文件暂不可用',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '下载中...'
|
||||
})
|
||||
|
||||
uni.downloadFile({
|
||||
url: file.fileUrl,
|
||||
success: (res) => {
|
||||
uni.hideLoading()
|
||||
if (res.statusCode === 200) {
|
||||
// #ifdef MP-WEIXIN
|
||||
// 微信小程序保存文件
|
||||
uni.saveFile({
|
||||
tempFilePath: res.tempFilePath,
|
||||
success: (saveRes) => {
|
||||
uni.showToast({
|
||||
title: '下载成功',
|
||||
icon: 'success'
|
||||
})
|
||||
},
|
||||
fail: () => {
|
||||
// 保存失败则打开文档
|
||||
uni.openDocument({
|
||||
filePath: res.tempFilePath,
|
||||
fileType: file.fileType,
|
||||
showMenu: true
|
||||
})
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
// H5端打开新窗口下载
|
||||
window.open(file.fileUrl)
|
||||
uni.showToast({
|
||||
title: '开始下载',
|
||||
icon: 'success'
|
||||
})
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
// APP端保存到相册或文件
|
||||
uni.saveFile({
|
||||
tempFilePath: res.tempFilePath,
|
||||
success: (saveRes) => {
|
||||
uni.showToast({
|
||||
title: '下载成功',
|
||||
icon: 'success'
|
||||
})
|
||||
},
|
||||
fail: () => {
|
||||
uni.openDocument({
|
||||
filePath: res.tempFilePath,
|
||||
fileType: file.fileType,
|
||||
showMenu: true
|
||||
})
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '下载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
uni.hideLoading()
|
||||
console.error('下载失败:', err)
|
||||
uni.showToast({
|
||||
title: '下载失败,请重试',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取文件类型
|
||||
*/
|
||||
getFileType(fileName) {
|
||||
if (!fileName) return 'pdf'
|
||||
const ext = fileName.split('.').pop().toLowerCase()
|
||||
return ext
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取文件图标文字
|
||||
*/
|
||||
getFileIconText(fileType) {
|
||||
const iconMap = {
|
||||
'pdf': 'PDF',
|
||||
'doc': 'DOC',
|
||||
'docx': 'DOC',
|
||||
'xls': 'XLS',
|
||||
'xlsx': 'XLS',
|
||||
'ppt': 'PPT',
|
||||
'pptx': 'PPT',
|
||||
'txt': 'TXT',
|
||||
'jpg': 'IMG',
|
||||
'jpeg': 'IMG',
|
||||
'png': 'IMG',
|
||||
'zip': 'ZIP',
|
||||
'rar': 'RAR'
|
||||
}
|
||||
return iconMap[fileType] || 'FILE'
|
||||
},
|
||||
|
||||
/**
|
||||
* 格式化文件大小
|
||||
*/
|
||||
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(1) + ' ' + sizes[i]
|
||||
},
|
||||
|
||||
/**
|
||||
* 格式化日期
|
||||
*/
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return ''
|
||||
const date = new Date(dateStr)
|
||||
if (isNaN(date.getTime())) return dateStr
|
||||
const year = date.getFullYear()
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0')
|
||||
const day = String(date.getDate()).padStart(2, '0')
|
||||
return `${year}.${month}.${day}`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.attachment-page {
|
||||
min-height: 100vh;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
// 赛事信息卡片
|
||||
.event-info-card {
|
||||
background: #fff;
|
||||
margin: 20rpx;
|
||||
border-radius: 16rpx;
|
||||
padding: 30rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.event-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 24rpx;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.event-time-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #f8f8f8;
|
||||
border-radius: 12rpx;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.time-item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
.time-label {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.time-value {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.time-divider {
|
||||
width: 1rpx;
|
||||
height: 60rpx;
|
||||
background: #e0e0e0;
|
||||
margin: 0 20rpx;
|
||||
}
|
||||
|
||||
// 加载状态
|
||||
.loading-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 120rpx 0;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border: 4rpx solid #f0f0f0;
|
||||
border-top-color: #C93639;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.8s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
margin-top: 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
// 附件区域
|
||||
.attachments-section {
|
||||
margin: 20rpx;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.section-count {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.attachments-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
// 附件项
|
||||
.attachment-item {
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
// 文件图标
|
||||
.file-icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 12rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
background: #C93639;
|
||||
}
|
||||
|
||||
.file-icon.icon-pdf {
|
||||
background: #E74C3C;
|
||||
}
|
||||
|
||||
.file-icon.icon-doc,
|
||||
.file-icon.icon-docx {
|
||||
background: #3498DB;
|
||||
}
|
||||
|
||||
.file-icon.icon-xls,
|
||||
.file-icon.icon-xlsx {
|
||||
background: #27AE60;
|
||||
}
|
||||
|
||||
.file-icon.icon-ppt,
|
||||
.file-icon.icon-pptx {
|
||||
background: #E67E22;
|
||||
}
|
||||
|
||||
.file-icon.icon-jpg,
|
||||
.file-icon.icon-jpeg,
|
||||
.file-icon.icon-png {
|
||||
background: #9B59B6;
|
||||
}
|
||||
|
||||
.icon-text {
|
||||
font-size: 22rpx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
// 文件内容
|
||||
.file-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
.file-name {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.file-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
.meta-item {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.meta-dot {
|
||||
font-size: 24rpx;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
// 操作按钮
|
||||
.file-actions {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
padding: 12rpx 24rpx;
|
||||
border-radius: 30rpx;
|
||||
transition: all 0.3s;
|
||||
|
||||
&:active {
|
||||
opacity: 0.8;
|
||||
transform: scale(0.95);
|
||||
}
|
||||
}
|
||||
|
||||
.preview-btn {
|
||||
background: #C93639;
|
||||
|
||||
.action-text {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.download-btn {
|
||||
background: #fff;
|
||||
border: 1rpx solid #C93639;
|
||||
|
||||
.action-text {
|
||||
color: #C93639;
|
||||
}
|
||||
}
|
||||
|
||||
.action-text {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
// 空状态
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 120rpx 60rpx;
|
||||
}
|
||||
|
||||
.empty-image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
margin-bottom: 30rpx;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.empty-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.empty-desc {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
// PDF预览弹窗样式
|
||||
.preview-modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.preview-container {
|
||||
width: 95%;
|
||||
height: 90%;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.preview-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 24rpx 30rpx;
|
||||
background: #C93639;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.preview-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
|
||||
.preview-close {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
font-size: 40rpx;
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.preview-body {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.preview-iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
@@ -125,7 +125,7 @@ export default {
|
||||
res.registerTime || res.registrationPeriod || '待定',
|
||||
matchTime: this.formatTimeRange(startTime, endTime) ||
|
||||
res.matchTime || res.competitionTime || '待定',
|
||||
registerCount: res.registrationCount || res.registerCount || res.signUpCount || '0',
|
||||
registerCount: res.registrationCount || res.registerCount || res.signUpCount || res.totalParticipants || '0',
|
||||
status: this.getStatus(res.status)
|
||||
}
|
||||
|
||||
@@ -169,16 +169,23 @@ export default {
|
||||
},
|
||||
|
||||
handleFunction(type) {
|
||||
// 需要跳转到附件展示页面的类型
|
||||
const attachmentTypes = ['info', 'rules', 'schedule', 'score', 'awards', 'photos']
|
||||
|
||||
if (attachmentTypes.includes(type)) {
|
||||
// 跳转到通用附件展示页面
|
||||
const name = encodeURIComponent(this.eventInfo.title)
|
||||
uni.navigateTo({
|
||||
url: `/pages/attachment-view/attachment-view?type=${type}&competitionId=${this.eventId}&name=${name}`
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// 其他功能页面的路由映射
|
||||
const routeMap = {
|
||||
'info': '/pages/event-info/event-info',
|
||||
'rules': '/pages/event-rules/event-rules',
|
||||
'schedule': '/pages/event-schedule/event-schedule',
|
||||
'players': '/pages/event-players/event-players',
|
||||
'match': '/pages/event-live/event-live',
|
||||
'lineup': '/pages/event-lineup/event-lineup',
|
||||
'score': '/pages/event-score/event-score',
|
||||
'awards': '/pages/event-medals/event-medals',
|
||||
'photos': '' // 图片直播暂未实现
|
||||
'lineup': '/pages/event-lineup/event-lineup'
|
||||
};
|
||||
|
||||
const url = routeMap[type];
|
||||
|
||||
@@ -228,7 +228,7 @@ export default {
|
||||
item.registerTime || item.registrationPeriod || '待定',
|
||||
matchTime: this.formatTimeRange(startTime, endTime) ||
|
||||
item.matchTime || item.competitionTime || '待定',
|
||||
registerCount: item.registrationCount || item.registerCount || item.signUpCount || '0',
|
||||
registerCount: item.registrationCount || item.registerCount || item.signUpCount || item.totalParticipants || '0',
|
||||
status: this.getStatus(item.status)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -137,7 +137,7 @@ export default {
|
||||
item.registerTime || item.registrationPeriod || '待定',
|
||||
matchTime: this.formatTimeRange(startTime, endTime) ||
|
||||
item.matchTime || item.competitionTime || '待定',
|
||||
registerCount: item.registrationCount || item.registerCount || item.signUpCount || '0',
|
||||
registerCount: item.registrationCount || item.registerCount || item.signUpCount || item.totalParticipants || '0',
|
||||
status: this.getStatus(item.status)
|
||||
}
|
||||
})
|
||||
|
||||
@@ -243,7 +243,7 @@ export default {
|
||||
matchTime: '',
|
||||
projects: '',
|
||||
contact: orderItem.contactPhone || '',
|
||||
participants: `${orderItem.totalParticipants || 0}人`
|
||||
participants: `${orderItem.registerCount || 0}人`
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
</view>
|
||||
<view class="status-item">
|
||||
<text class="label">参赛人数:</text>
|
||||
<text class="value">{{ scheduleData.totalParticipants || 0 }}</text>
|
||||
<text class="value">{{ scheduleData.registerCount || 0 }}</text>
|
||||
</view>
|
||||
<view class="status-item" v-if="scheduleData.lastAutoScheduleTime">
|
||||
<text class="label">最后编排时间:</text>
|
||||
|
||||
Reference in New Issue
Block a user