| | |
| | | <el-input v-model.trim="state.form.reviewName" :disabled="state.title =='查看'" placeholder="文件名称"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="文件:" prop="filePath"> |
| | | <el-upload accept=".doc,.docx" :action="state.uploadUrl" :headers="state.header" method="post" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile)" :on-exceed="showTip" :limit='state.fileLimit' v-model:file-list="state.fileList" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles)" > |
| | | <el-upload accept=".doc,.docx,.pptx,.ppt,.pdf" :action="state.uploadUrl" :headers="state.header" method="post" :on-success="(res, uploadFile)=>handleAvatarSuccess(res, uploadFile)" :on-exceed="showTip" :limit='state.fileLimit' v-model:file-list="state.fileList" :before-upload="picSize" :on-remove="(file, uploadFiles)=>handleRemove(file, uploadFiles)" > |
| | | <el-button type="primary">点击上传</el-button> |
| | | <template #tip> |
| | | <div class="el-upload__tip">支持上传.doc、.docx格式文档,尺寸小于5M,最多可上传1张</div> |
| | | <div class="el-upload__tip">支持上传.doc、.docx、.pptx、.ppt、.pdf格式文件,尺寸小于8M,最多可上传1份</div> |
| | | </template> |
| | | </el-upload> |
| | | </el-form-item> |
| | |
| | | }); |
| | | } |
| | | const picSize = async (rawFile) => { |
| | | if(rawFile.size / 1024 / 1024 > 5){ |
| | | if(rawFile.size / 1024 / 1024 > 8){ |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '文件大小不能超过5M' |
| | | message: '文件大小不能超过8M' |
| | | }); |
| | | return false |
| | | } |
| | |
| | | |
| | | const openFile = async(path)=>{ |
| | | const ext = path.split('.').pop().toLowerCase(); |
| | | if (ext === 'doc') { |
| | | ElMessageBox.confirm('暂不支持线上预览.doc文件,是否下载查看?', '提示', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' }).then(() => { |
| | | if (ext === 'doc' || ext === 'pptx' || ext === 'ppt') { |
| | | ElMessageBox.confirm(`暂不支持线上预览.${ext}文件,是否下载查看?`, '提示', { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' }).then(() => { |
| | | window.open(`${import.meta.env.VITE_APP_BASE_API}/${path}`, '_blank'); |
| | | }).catch(() => { |
| | | console.log('取消预览') |
| | | }); |
| | | return |
| | | } |
| | | try { |
| | | // 1. 获取文件 |
| | | const response = await fetch(import.meta.env.VITE_APP_BASE_API + '/' + path); |
| | | const arrayBuffer = await response.arrayBuffer(); |
| | | // 2. 创建新窗口 |
| | | const win = window.open('', '_blank'); |
| | | win.document.write(` |
| | | }else if(ext === 'pdf'){ |
| | | window.open(`${import.meta.env.VITE_APP_BASE_API}/${path}`, '_blank'); |
| | | }else{ |
| | | try { |
| | | // 1. 获取文件 |
| | | const response = await fetch(import.meta.env.VITE_APP_BASE_API + '/' + path); |
| | | const arrayBuffer = await response.arrayBuffer(); |
| | | // 2. 创建新窗口 |
| | | const win = window.open('', '_blank'); |
| | | win.document.write(` |
| | | <!DOCTYPE html> |
| | | <html> |
| | | <head> |
| | |
| | | </body> |
| | | </html> |
| | | `); |
| | | // 3. 渲染 DOCX |
| | | await renderAsync(arrayBuffer, win.document.getElementById('container')); |
| | | // 3. 渲染 DOCX |
| | | await renderAsync(arrayBuffer, win.document.getElementById('container')); |
| | | |
| | | } catch (error) { |
| | | console.error('预览失败:', error); |
| | | alert(`预览失败: ${error.message}`); |
| | | } catch (error) { |
| | | console.error('预览失败:', error); |
| | | alert(`预览失败: ${error.message}`); |
| | | } |
| | | } |
| | | } |
| | | |