From cc9a176227083c4477339452383ba3c159be55e3 Mon Sep 17 00:00:00 2001
From: yyb <995253665@qq.com>
Date: 星期四, 23 四月 2026 11:21:00 +0800
Subject: [PATCH] 添加附件管理功能,支持上传、删除和查看设备报修附件
---
src/views/equipmentManagement/repair/index.vue | 177 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 176 insertions(+), 1 deletions(-)
diff --git a/src/views/equipmentManagement/repair/index.vue b/src/views/equipmentManagement/repair/index.vue
index 1e7af53..1f37fd7 100644
--- a/src/views/equipmentManagement/repair/index.vue
+++ b/src/views/equipmentManagement/repair/index.vue
@@ -112,6 +112,14 @@
缂栬緫
</el-button>
<el-button
+ type="info"
+ link
+ :disabled="row.status === 1"
+ @click="openAttachment(row)"
+ >
+ 闄勪欢
+ </el-button>
+ <el-button
type="success"
link
:disabled="row.status === 1"
@@ -132,23 +140,60 @@
</div>
<RepairModal ref="repairModalRef" @ok="getTableData"/>
<MaintainModal ref="maintainModalRef" @ok="getTableData"/>
+
+ <el-dialog v-model="attachment.visible" title="闄勪欢" width="860px" @closed="onAttachmentClosed">
+ <div v-loading="attachment.loading" class="attachment-wrap">
+ <div class="attachment-actions">
+ <el-upload
+ v-model:file-list="attachment.fileList"
+ :action="upload.url"
+ multiple
+ ref="attachmentFileUpload"
+ auto-upload
+ :headers="upload.headers"
+ :data="{ deviceRepairId: attachment.deviceRepairId }"
+ :before-upload="handleAttachmentBeforeUpload"
+ :on-error="handleAttachmentUploadError"
+ :on-success="handleAttachmentUploadSuccess"
+ :on-remove="handleAttachmentRemove"
+ list-type="picture-card"
+ :limit="9"
+ accept="image/png,image/jpeg,image/jpg"
+ >
+ +
+ </el-upload>
+ </div>
+
+ <el-empty v-if="!attachment.loading && attachment.files.length === 0" description="鏆傛棤闄勪欢" />
+ </div>
+ <template #footer>
+ <el-button @click="attachment.visible = false">鍏抽棴</el-button>
+ </template>
+ </el-dialog>
</div>
</template>
<script setup>
import { onMounted, getCurrentInstance, computed } from "vue";
import {usePaginationApi} from "@/hooks/usePaginationApi";
-import {getRepairPage, delRepair} from "@/api/equipmentManagement/repair";
+import {
+ getRepairPage,
+ delRepair,
+ getRepairFileList,
+ deleteRepairFile,
+} from "@/api/equipmentManagement/repair";
import RepairModal from "./Modal/RepairModal.vue";
import {ElMessageBox, ElMessage} from "element-plus";
import dayjs from "dayjs";
import MaintainModal from "./Modal/MaintainModal.vue";
+import { getToken } from "@/utils/auth";
defineOptions({
name: "璁惧鎶ヤ慨",
});
const {proxy} = getCurrentInstance();
+const javaApi = proxy?.javaApi || "";
// 妯℃�佹瀹炰緥
const repairModalRef = ref();
@@ -156,6 +201,47 @@
// 琛ㄦ牸澶氶�夋閫変腑椤�
const multipleList = ref([]);
+
+const attachment = reactive({
+ visible: false,
+ loading: false,
+ deviceRepairId: undefined,
+ files: [],
+ fileList: [],
+});
+
+const normalizeFileUrl = (rawUrl = '') => {
+ let fileUrl = rawUrl || '';
+
+ if (fileUrl && fileUrl.indexOf('\\') > -1) {
+ const lowerPath = fileUrl.toLowerCase();
+ const uploadPathIndex = lowerPath.indexOf('uploadpath');
+
+ if (uploadPathIndex > -1) {
+ fileUrl = fileUrl
+ .substring(uploadPathIndex)
+ .replace(/\\/g, '/');
+ } else {
+ fileUrl = fileUrl.replace(/\\/g, '/');
+ }
+ }
+ fileUrl = fileUrl.replace(/^\/?uploadPath/, '/profile');
+
+ if (!fileUrl.startsWith('http')) {
+ if (!fileUrl.startsWith('/')) fileUrl = '/' + fileUrl;
+ fileUrl = javaApi + fileUrl;
+ }
+
+ return fileUrl;
+};
+
+const attachmentUploadAction = "/device/repair/uploadFile";
+const upload = reactive({
+ url: import.meta.env.VITE_APP_BASE_API + attachmentUploadAction,
+ headers: {
+ Authorization: "Bearer " + getToken(),
+ },
+});
// 琛ㄦ牸閽╁瓙
const {
@@ -326,6 +412,83 @@
});
};
+const openAttachment = async (row) => {
+ attachment.fileList = [];
+ attachment.visible = true;
+ attachment.deviceRepairId = row?.id;
+ await refreshAttachmentList();
+};
+
+const refreshAttachmentList = async () => {
+ if (!attachment.deviceRepairId) return;
+ attachment.loading = true;
+ try {
+ const res = await getRepairFileList(attachment.deviceRepairId);
+ attachment.files = Array.isArray(res?.data) ? res.data : [];
+ attachment.fileList = attachment.files.map((item) => ({
+ id: item.id,
+ name: item.name,
+ url: normalizeFileUrl(item.url),
+ }));
+ } finally {
+ attachment.loading = false;
+ }
+};
+
+const onAttachmentClosed = () => {
+ attachment.loading = false;
+ attachment.deviceRepairId = undefined;
+ attachment.files = [];
+ attachment.fileList = [];
+};
+
+const handleAttachmentBeforeUpload = (file) => {
+ const isImage = ["image/png", "image/jpeg", "image/jpg"].includes(file.type);
+ if (!isImage) {
+ ElMessage.error("鍙兘涓婁紶 png/jpg/jpeg 鍥剧墖");
+ return false;
+ }
+ return true;
+};
+
+const handleAttachmentUploadSuccess = async (res) => {
+ if (res?.code === 200) {
+ ElMessage.success("涓婁紶鎴愬姛");
+ await refreshAttachmentList();
+ }
+};
+
+const handleAttachmentUploadError = () => {
+ ElMessage.error("涓婁紶澶辫触");
+};
+
+const handleAttachmentRemove = async (file) => {
+ // 浠呯Щ闄ゅ墠绔湭鍏ュ簱鏂囦欢鏃讹紝涓嶈皟鐢ㄥ垹闄ゆ帴鍙�
+ const matched = attachment.files.find((item) => item.id === file?.id)
+ || attachment.files.find((item) => item.name === file?.name);
+ if (!matched) return;
+ try {
+ await confirmDeleteAttachment(matched);
+ } finally {
+ // 鍙栨秷鍒犻櫎鏃讹紝el-upload 宸插厛绉婚櫎锛屽埛鏂颁竴娆′繚鎸佷笌鍚庣涓�鑷�
+ await refreshAttachmentList();
+ }
+};
+
+const confirmDeleteAttachment = (fileRow) => {
+ return ElMessageBox.confirm("纭鍒犻櫎璇ラ檮浠讹紵", "璀﹀憡", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ }).then(async () => {
+ const { code } = await deleteRepairFile(fileRow.id);
+ if (code === 200) {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ await refreshAttachmentList();
+ }
+ });
+};
+
onMounted(() => {
getTableData();
});
@@ -341,4 +504,16 @@
justify-content: space-between;
margin-bottom: 10px;
}
+
+.attachment-wrap {
+ min-height: 240px;
+}
+
+.attachment-actions {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 12px;
+}
+
</style>
--
Gitblit v1.9.3