网页查看附件功能，查看附件（转为PDF格式查看的）

1.效果图-答辩项目有

就是在单独的一个浏览器页面 查询附件内容

2.简单看下前端

查看

点击查看案件 触发下面这个方法

viewFile(row) {

if (['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'].includes(row.attachmentType.toLowerCase())) {

previewFile({

attachmentUrl: row.attachmentUrl.replace(/\\/g, ',') }).then(res => {

const blob = new Blob([res.data], {

type: 'application/pdf' })

const src = window.URL.createObjectURL(blob)

window.open(src)

})

} else {

fileApi

.viewFile({

attachmentUrl: row.attachmentUrl, attachmentType: row.attachmentType, attachmentName: row.attachmentName }).then(res => {

if (res.status === 200 && res.data) {

const obj = {

pdf: 'application/pdf',

aac: 'audio/aac',

abw: 'application/x-abiword',

arc: 'application/x-freearc',

avi: 'video/x-msvideo',

css: 'text/css',

csv: 'text/csv',

doc: 'application/msword',

docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',

gif: 'image/gif',

htm: 'text/html',

html: 'text/html',

ico: 'image/vnd.microsoft.icon',

ics: 'text/calendar',

jar: 'application/java-archive',

jpeg: 'image/jpeg',

jpg: 'image/jpeg',

js: 'text/javascript',

json: 'application/json',

mp3: 'audio/mpeg',

mpeg: 'video/mpeg',

png: 'image/png',

ppt: 'application/vnd.ms-powerpoint',

pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',

rar: 'application/x-rar-compressed',

svg: 'image/svg+xml',

tif: 'image/tiff',

tiff: 'image/tiff',

txt: 'text/plain',

vsd: 'application/vnd.visio',

wav: 'audio/wav',

weba: 'audio/webm',

webm: 'video/webm',

webp: 'image/webp',

xls: 'application/vnd.ms-excel',

xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',

zip: 'application/zip'

}

const blob = new Blob([res.data], {

type: obj[row.attachmentType.toLowerCase()] })

const src = window.URL.createObjectURL(blob)

if (['jpg', 'jpeg', 'png', 'svg', 'gif'].includes(row.attachmentType.toLowerCase())) {

this.imgsVisible = true

this.imgUrlList.push(src)

} else if (['pdf'].includes(row.attachmentType.toLowerCase())) {

window.open(src)

} else {

this.$message.error('该附件无法打开')

}

} else {

this.$message.error('查看失败')

}

})

}

},

previewFile然后会触发这个请求

import axios from './index'

export function previewFile(params) {

return axios.request({

url