parent
44c044c777
commit
492c01d8c5
@ -0,0 +1,77 @@
|
||||
<template>
|
||||
<div class="survey-attachments">
|
||||
<div v-for="file in files" :key="file.id" class="attachment">
|
||||
<i class="el-icon-document" />
|
||||
<span class="filename" :title="file.original_name">{{
|
||||
file.original_name
|
||||
}}</span>
|
||||
<span class="filesize">{{ sizeLabel(file.size) }}</span>
|
||||
<el-button
|
||||
type="text"
|
||||
:loading="downloading === file.id"
|
||||
@click="download(file)"
|
||||
>下载</el-button>
|
||||
</div>
|
||||
<span v-if="!files.length">未上传</span>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import { saveAs } from 'file-saver'
|
||||
export default {
|
||||
props: { responseId: [Number, String], files: { type: Array, default: () => [] }},
|
||||
data() {
|
||||
return { downloading: null }
|
||||
},
|
||||
methods: {
|
||||
sizeLabel(size) {
|
||||
return Number(size) >= 1048576
|
||||
? (size / 1048576).toFixed(1) + ' MB'
|
||||
: Math.ceil(Number(size || 0) / 1024) + ' KB'
|
||||
},
|
||||
async download(file) {
|
||||
this.downloading = file.id
|
||||
try {
|
||||
const response = await axios.get('/api/admin/course-content-evaluation-form/show', {
|
||||
baseURL: process.env.VUE_APP_BASE_API,
|
||||
params: { id: this.responseId, download_file_id: file.id },
|
||||
headers: { Authorization: 'Bearer ' + getToken() },
|
||||
responseType: 'blob'
|
||||
})
|
||||
if ((response.headers['content-type'] || '').includes('application/json')) {
|
||||
const error = JSON.parse(await response.data.text())
|
||||
throw new Error(error.errmsg || '下载失败，请重新登录后重试')
|
||||
}
|
||||
saveAs(response.data, file.original_name || '附件')
|
||||
} catch (e) {
|
||||
let message = e.message || '下载失败，请稍后重试'
|
||||
if (e.response && e.response.data && typeof e.response.data.text === 'function') {
|
||||
try { message = JSON.parse(await e.response.data.text()).errmsg || message } catch (_) { /* Keep the original error. */ }
|
||||
}
|
||||
this.$message.error(message)
|
||||
} finally {
|
||||
this.downloading = null
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.attachment {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 8px 0;
|
||||
}
|
||||
.filename {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
.filesize {
|
||||
color: #909399;
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue