fix: 修复音频上传格式校验逻辑并移除未使用的Divider组件
重构 beforeReadGuard 函数,为视频和音频类型分别添加格式校验逻辑。视频类型保持原有的 MOV 格式拦截,音频类型新增对 .mp3, .m4a, .aac, .wav 格式的支持,并拦截不支持的格式(如 .wma)。同时更新了 accept 类型和上传提示文案以保持一致性。 移除 components.d.ts 中未使用的 VanDivider 类型声明。
Showing
2 changed files
with
42 additions
and
17 deletions
| ... | @@ -69,7 +69,6 @@ declare module 'vue' { | ... | @@ -69,7 +69,6 @@ declare module 'vue' { |
| 69 | VanConfigProvider: typeof import('vant/es')['ConfigProvider'] | 69 | VanConfigProvider: typeof import('vant/es')['ConfigProvider'] |
| 70 | VanDatePicker: typeof import('vant/es')['DatePicker'] | 70 | VanDatePicker: typeof import('vant/es')['DatePicker'] |
| 71 | VanDialog: typeof import('vant/es')['Dialog'] | 71 | VanDialog: typeof import('vant/es')['Dialog'] |
| 72 | - VanDivider: typeof import('vant/es')['Divider'] | ||
| 73 | VanDropdownItem: typeof import('vant/es')['DropdownItem'] | 72 | VanDropdownItem: typeof import('vant/es')['DropdownItem'] |
| 74 | VanDropdownMenu: typeof import('vant/es')['DropdownMenu'] | 73 | VanDropdownMenu: typeof import('vant/es')['DropdownMenu'] |
| 75 | VanEmpty: typeof import('vant/es')['Empty'] | 74 | VanEmpty: typeof import('vant/es')['Empty'] | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-09-30 17:05 | 2 | * @Date: 2025-09-30 17:05 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2026-01-24 15:23:44 | 4 | + * @LastEditTime: 2026-01-24 15:32:45 |
| 5 | * @FilePath: /mlaj/src/views/checkin/CheckinDetailPage.vue | 5 | * @FilePath: /mlaj/src/views/checkin/CheckinDetailPage.vue |
| 6 | * @Description: 用户打卡详情页 | 6 | * @Description: 用户打卡详情页 |
| 7 | --> | 7 | --> |
| ... | @@ -225,22 +225,48 @@ const { | ... | @@ -225,22 +225,48 @@ const { |
| 225 | } = useCheckin() | 225 | } = useCheckin() |
| 226 | 226 | ||
| 227 | const beforeReadGuard = (file) => { | 227 | const beforeReadGuard = (file) => { |
| 228 | - if (activeType.value !== 'video') return beforeRead(file) | ||
| 229 | - | ||
| 230 | const files = Array.isArray(file) ? file : [file] | 228 | const files = Array.isArray(file) ? file : [file] |
| 231 | - const hasMov = files.some(item => { | 229 | + if (activeType.value === 'video') { |
| 232 | - const fileName = String(item?.name || '').toLowerCase() | 230 | + const hasMov = files.some(item => { |
| 233 | - const fileType = String(item?.type || '').toLowerCase() | 231 | + const fileName = String(item?.name || '').toLowerCase() |
| 234 | - return fileName.endsWith('.mov') || fileType.includes('quicktime') | 232 | + const fileType = String(item?.type || '').toLowerCase() |
| 235 | - }) | 233 | + return fileName.endsWith('.mov') || fileType.includes('quicktime') |
| 234 | + }) | ||
| 235 | + | ||
| 236 | + if (hasMov) { | ||
| 237 | + showDialog({ | ||
| 238 | + title: '不支持 MOV 格式', | ||
| 239 | + message: 'MOV(QuickTime)在非苹果系统/部分播放器兼容性较差,可能出现无法打开、黑屏、无声等问题。\n\n请将视频导出/转换为 MP4(更通用)后再上传。', | ||
| 240 | + confirmButtonText: '我知道了', | ||
| 241 | + }) | ||
| 242 | + return false | ||
| 243 | + } | ||
| 244 | + | ||
| 245 | + return beforeRead(file) | ||
| 246 | + } | ||
| 236 | 247 | ||
| 237 | - if (hasMov) { | 248 | + if (activeType.value === 'audio') { |
| 238 | - showDialog({ | 249 | + const supportedExt = ['mp3', 'm4a', 'aac', 'wav'] |
| 239 | - title: '不支持 MOV 格式', | 250 | + const unsupportedFiles = files.filter(item => { |
| 240 | - message: 'MOV(QuickTime)在非苹果系统/部分播放器兼容性较差,可能出现无法打开、黑屏、无声等问题。\n\n请将视频导出/转换为 MP4(更通用)后再上传。', | 251 | + const fileName = String(item?.name || '').toLowerCase() |
| 241 | - confirmButtonText: '我知道了', | 252 | + const ext = fileName.includes('.') ? fileName.split('.').pop() : '' |
| 253 | + if (supportedExt.includes(ext)) return false | ||
| 254 | + const fileType = String(item?.type || '').toLowerCase() | ||
| 255 | + if (!fileType) return true | ||
| 256 | + if (!fileType.startsWith('audio/')) return true | ||
| 257 | + return true | ||
| 242 | }) | 258 | }) |
| 243 | - return false | 259 | + |
| 260 | + if (unsupportedFiles.length > 0) { | ||
| 261 | + showDialog({ | ||
| 262 | + title: '不支持的音频格式', | ||
| 263 | + message: '当前音频播放基于系统浏览器能力,不同机型/系统对音频格式支持差异较大(例如 .wma 等常见无法播放)。\n\n为避免上传后无法播放,请使用 .mp3 或 .m4a(推荐)重新导出/转换后再上传。', | ||
| 264 | + confirmButtonText: '我知道了', | ||
| 265 | + }) | ||
| 266 | + return false | ||
| 267 | + } | ||
| 268 | + | ||
| 269 | + return beforeRead(file) | ||
| 244 | } | 270 | } |
| 245 | 271 | ||
| 246 | return beforeRead(file) | 272 | return beforeRead(file) |
| ... | @@ -708,7 +734,7 @@ const getAcceptType = () => { | ... | @@ -708,7 +734,7 @@ const getAcceptType = () => { |
| 708 | const acceptMap = { | 734 | const acceptMap = { |
| 709 | 'image': 'image/*', | 735 | 'image': 'image/*', |
| 710 | 'video': '.mp4,video/mp4', | 736 | 'video': '.mp4,video/mp4', |
| 711 | - 'audio': '.mp3,.wav,.aac,.flac,.ogg,.wma,.m4a' | 737 | + 'audio': '.mp3,.m4a,.aac,.wav' |
| 712 | } | 738 | } |
| 713 | return acceptMap[activeType.value] || '*' | 739 | return acceptMap[activeType.value] || '*' |
| 714 | } | 740 | } |
| ... | @@ -721,7 +747,7 @@ const getUploadTips = () => { | ... | @@ -721,7 +747,7 @@ const getUploadTips = () => { |
| 721 | const tipsMap = { | 747 | const tipsMap = { |
| 722 | 'image': '支持格式:.jpg/.jpeg/.png', | 748 | 'image': '支持格式:.jpg/.jpeg/.png', |
| 723 | 'video': '支持格式:.mp4(不支持 .mov)', | 749 | 'video': '支持格式:.mp4(不支持 .mov)', |
| 724 | - 'audio': '支持格式:.mp3/.wav/.aac/.flac/.ogg/.wma/.m4a' | 750 | + 'audio': '支持格式:.mp3/.m4a/.aac/.wav(不支持 .wma)' |
| 725 | } | 751 | } |
| 726 | return tipsMap[activeType.value] || '' | 752 | return tipsMap[activeType.value] || '' |
| 727 | } | 753 | } | ... | ... |
-
Please register or login to post a comment