<template>
|
<el-dialog v-model="dialogVisible" title="附件" width="50%" :before-close="handleClose">
|
<el-table :data="tableData" border height="40vh">
|
<el-table-column label="附件名称" prop="name" min-width="400" show-overflow-tooltip />
|
<el-table-column fixed="right" label="操作" width="200" align="center">
|
<template #default="scope">
|
<el-button link type="primary" size="small" @click="downLoadFile(scope.row)">下载</el-button>
|
<el-button link type="primary" size="small" @click="lookFile(scope.row)">预览</el-button>
|
<el-button link type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-dialog>
|
<filePreview ref="filePreviewRef" />
|
<UploadModal ref="uploadModalRef" @uploadSuccess="handleUploadSuccess" />
|
</template>
|
|
<script setup>
|
import { ref } from 'vue'
|
import { ElMessageBox, ElMessage } from 'element-plus'
|
import filePreview from '@/components/filePreview/index.vue'
|
import UploadModal from './Modal/UploadModal.vue'
|
import { delCommonFileInvoiceLedger} from '@/api/publicApi/commonFile.js'
|
|
const dialogVisible = ref(false)
|
const tableData = ref([])
|
const currentId = ref('')
|
const { proxy } = getCurrentInstance();
|
const filePreviewRef = ref()
|
const uploadModalRef = ref()
|
|
const handleClose = () => {
|
dialogVisible.value = false
|
}
|
|
const open = (list, id = '') => {
|
dialogVisible.value = true
|
tableData.value = list
|
currentId.value = id
|
}
|
|
const handleUpload = () => {
|
if (!currentId.value) {
|
ElMessage.warning('无法获取当前记录ID，请关闭后重新打开附件窗口')
|
return
|
}
|
uploadModalRef.value.handleImport(currentId.value)
|
}
|
|
const handleUploadSuccess = (data) => {
|
ElMessage.success('上传成功')
|
// 这里可以添加刷新附件列表的逻辑
|
// 暂时先关闭上传模态框
|
}
|
|
const downLoadFile = (row) => {
|
proxy.$download.name(row.url);
|
}
|
|
const lookFile = (row) => {
|
filePreviewRef.value.open(row.url)
|
}
|
|
// 删除附件
|
const handleDelete = (row) => {
|
ElMessageBox.confirm(`确认删除附件"${row.name}"吗？`, '删除确认', {
|
confirmButtonText: '确认',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}).then(() => {
|
delCommonFileInvoiceLedger([row.id]).then(() => {
|
ElMessage.success('删除成功')
|
// 从列表中移除已删除的附件
|
const index = tableData.value.findIndex(item => item.id === row.id)
|
if (index !== -1) {
|
tableData.value.splice(index, 1)
|
}
|
}).catch(() => {
|
ElMessage.error('删除失败')
|
})
|
}).catch(() => {
|
proxy.$modal.msg('已取消删除')
|
})
|
}
|
|
defineExpose({
|
open
|
})
|
</script>
|
|
<style></style>
|
