From e852bb49cbf0d860d784cf3b7a76a9202d19dd9c Mon Sep 17 00:00:00 2001
From: chenhj <1263187585@qq.com>
Date: 星期四, 30 四月 2026 15:13:11 +0800
Subject: [PATCH] 安全生产附件上传弹窗
---
src/components/Dialog/FileList.vue | 179 +++++++++++++++++++++++++++--------------------------------
1 files changed, 83 insertions(+), 96 deletions(-)
diff --git a/src/components/Dialog/FileList.vue b/src/components/Dialog/FileList.vue
index e373c27..1506b25 100644
--- a/src/components/Dialog/FileList.vue
+++ b/src/components/Dialog/FileList.vue
@@ -1,73 +1,55 @@
<template>
- <el-dialog
- v-model="isShow"
- :title="title"
- :width="width"
- @close="handleClose"
- class="attachment-dialog"
- >
+ <el-dialog v-model="isShow"
+ :title="title"
+ :width="width"
+ @close="handleClose"
+ class="attachment-dialog">
<!-- 宸ュ叿鏍� -->
<div class="toolbar">
- <el-button
- type="primary"
- size="small"
- @click="handleUpload"
- >
+ <el-button type="primary"
+ size="small"
+ @click="handleUpload">
涓婁紶闄勪欢
</el-button>
</div>
-
<!-- 涓婁紶缁勪欢寮圭獥 -->
<el-dialog
v-model="uploadDialogVisible"
title="涓婁紶闄勪欢"
width="50%"
- @close="handleUploadClose"
- >
- <AttachmentUpload
- v-model:file-list="newFileList"
- />
+ @close="closeUpload">
+ <AttachmentUpload v-model:file-list="newFileList"/>
<template #footer>
- <el-button @click="handleUploadClose">鍏抽棴</el-button>
+ <el-button @click="saveUpload">淇濆瓨</el-button>
+ <el-button @click="closeUpload">鍏抽棴</el-button>
</template>
</el-dialog>
-
<!-- 鏂囦欢鍒楄〃琛ㄦ牸 -->
<div class="table-container">
- <el-table
- :data="tableData"
- border
- class="attachment-table"
- :height="tableData.length > 0 ? 'auto' : '120px'"
- >
- <el-table-column
- label="闄勪欢鍚嶇О"
- prop="originalFilename"
- show-overflow-tooltip
- />
- <el-table-column
- v-if="showActions"
- fixed="right"
- label="鎿嶄綔"
- :width="120"
- align="center"
- >
+ <el-table :data="tableData"
+ border
+ class="attachment-table"
+ :height="tableData.length > 0 ? 'auto' : '120px'">
+ <el-table-column label="闄勪欢鍚嶇О"
+ prop="originalFilename"
+ show-overflow-tooltip/>
+ <el-table-column v-if="showActions"
+ fixed="right"
+ label="鎿嶄綔"
+ :width="120"
+ align="center">
<template #default="scope">
- <el-button
- link
- type="primary"
- size="small"
- :href="scope.row.downloadURL"
- class="download-link"
- >
+ <el-button link
+ type="primary"
+ size="small"
+ class="download-link"
+ @click="downloadFile(scope.row.downloadURL)">
涓嬭浇
</el-button>
- <el-button
- link
- type="danger"
- size="small"
- @click="handleDelete(scope.row)"
- >
+ <el-button link
+ type="danger"
+ size="small"
+ @click="handleDelete(scope.row)">
鍒犻櫎
</el-button>
</template>
@@ -78,9 +60,13 @@
</template>
<script setup>
-import { ref, computed, getCurrentInstance, onMounted, watch } from 'vue'
-import AttachmentUpload from '@/components/AttachmentUpload/file/index.vue'
-import {attachmentList, deleteAttachment, createAttachment} from "@/api/basicData/storageAttachment.js";
+import {ref, computed, getCurrentInstance, onMounted, watch} from "vue";
+import AttachmentUpload from "@/components/AttachmentUpload/file/index.vue";
+import {
+ attachmentList,
+ deleteAttachment,
+ createAttachment,
+} from "@/api/basicData/storageAttachment.js";
const props = defineProps({
visible: {
@@ -89,39 +75,34 @@
},
recordType: {
type: String,
- default: '',
- required: true
+ default: "",
+ required: true,
},
recordId: {
type: Number,
default: 0,
- required: true
+ required: true,
},
title: {
type: String,
- default: '闄勪欢'
+ default: "闄勪欢",
},
width: {
type: String,
- default: '50%'
+ default: "50%",
},
showActions: {
type: Boolean,
- default: true
- }
-})
+ default: true,
+ },
+});
-const emit = defineEmits([
- 'close',
- 'download',
- 'upload',
- 'delete'
-])
+const emit = defineEmits(["close", "download", "upload", "delete"]);
-const { proxy } = getCurrentInstance()
-const tableData = ref([])
-const uploadDialogVisible = ref(false)
-const newFileList = ref([])
+const {proxy} = getCurrentInstance();
+const tableData = ref([]);
+const uploadDialogVisible = ref(false);
+const newFileList = ref([]);
const isShow = computed({
get() {
@@ -133,44 +114,47 @@
});
const handleClose = () => {
- isShow.value = false
-}
+ isShow.value = false;
+};
const handleUpload = () => {
- uploadDialogVisible.value = true
-}
+ uploadDialogVisible.value = true;
+};
-const handleUploadClose = async () => {
+const saveUpload = async () => {
// 妫�鏌ユ槸鍚︽湁鏂颁笂浼犵殑鏂囦欢
if (newFileList.value.length > 0) {
try {
await createAttachment({
- application: 'file',
+ application: "file",
recordType: props.recordType,
recordId: props.recordId,
- storageBlobDTOs: [...newFileList.value, ...tableData.value]
- })
- newFileList.value = []
+ storageBlobDTOs: [...newFileList.value, ...tableData.value],
+ });
+ newFileList.value = [];
// 鍒锋柊鍒楄〃
- setList()
+ setList();
} catch (error) {
- proxy?.$modal?.msgError('涓婁紶澶辫触')
+ proxy?.$modal?.msgError("涓婁紶澶辫触");
}
}
- uploadDialogVisible.value = false
+ uploadDialogVisible.value = false;
+};
+
+const closeUpload = () => {
+ newFileList.value = [];
+ uploadDialogVisible.value = false;
}
-
-
const handleDelete = async (row, index) => {
try {
- await deleteAttachment([row.storageAttachmentId])
- proxy?.$modal?.msgSuccess('鍒犻櫎鎴愬姛')
- setList()
+ await deleteAttachment([row.storageAttachmentId]);
+ proxy?.$modal?.msgSuccess("鍒犻櫎鎴愬姛");
+ setList();
} catch (error) {
- proxy?.$modal?.msgError('鍒犻櫎澶辫触')
+ proxy?.$modal?.msgError("鍒犻櫎澶辫触");
}
-}
+};
const setList = () => {
attachmentList({
@@ -178,14 +162,17 @@
recordId: props.recordId,
}).then(res => {
if (res && res.data) {
- tableData.value = res.data || []
+ tableData.value = res.data || [];
}
- })
-}
+ });
+};
+const downloadFile = (url) => {
+ window.open(url, "_blank");
+};
onMounted(() => {
- setList()
-})
+ setList();
+});
</script>
<style scoped>
--
Gitblit v1.9.3