From 226a9245d5b060836ab0a858e1623d365113e9ac Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期五, 15 五月 2026 16:03:43 +0800
Subject: [PATCH] 上传封装组件，且设备保修应用
---
src/pages/equipmentManagement/repair/add.vue | 110 ---------------------
src/components/CommonUpload.vue | 164 ++++++++++++++++++++++++++++++++
2 files changed, 166 insertions(+), 108 deletions(-)
diff --git a/src/components/CommonUpload.vue b/src/components/CommonUpload.vue
new file mode 100644
index 0000000..8910206
--- /dev/null
+++ b/src/components/CommonUpload.vue
@@ -0,0 +1,164 @@
+<template>
+ <view class="common-upload">
+ <u-upload
+ :fileList="internalFileList"
+ @afterRead="afterRead"
+ @delete="deleteFile"
+ :name="name"
+ :multiple="multiple"
+ :maxCount="maxCount"
+ :accept="accept"
+ :disabled="disabled"
+ ></u-upload>
+ </view>
+</template>
+
+<script setup>
+import { ref, watch, onMounted } from 'vue';
+import { getToken } from "@/utils/auth";
+import config from "@/config";
+
+const props = defineProps({
+ // 鐖剁粍浠朵紶鍏ョ殑鏂囦欢鍒楄〃锛堝搴斿悗绔瓨鍌ㄧ殑瀵硅薄鍒楄〃锛�
+ modelValue: {
+ type: Array,
+ default: () => []
+ },
+ // 鏈�澶т笂浼犳暟閲�
+ maxCount: {
+ type: Number,
+ default: 9
+ },
+ // 鏄惁鏀寔澶氶��
+ multiple: {
+ type: Boolean,
+ default: true
+ },
+ // 鎺ュ彈鐨勬枃浠剁被鍨�
+ accept: {
+ type: String,
+ default: 'image'
+ },
+ // 涓婁紶鎺ュ彛瀵瑰簲鐨勫弬鏁板悕
+ name: {
+ type: String,
+ default: 'file'
+ },
+ // 鏄惁绂佺敤
+ disabled: {
+ type: Boolean,
+ default: false
+ }
+});
+
+const emit = defineEmits(['update:modelValue']);
+
+// 鐢ㄤ簬 u-upload 鏄剧ず鐨勫唴閮ㄥ垪琛�
+const internalFileList = ref([]);
+
+// 鐩戝惉澶栭儴 modelValue 鍙樺寲锛屽悓姝ュ埌鍐呴儴鏄剧ず鍒楄〃
+watch(() => props.modelValue, (newVal) => {
+ if (newVal) {
+ internalFileList.value = newVal.map(item => ({
+ ...item,
+ url: item.url || item.previewURL,
+ status: 'success',
+ message: ''
+ }));
+ }
+}, { immediate: true, deep: true });
+
+const showToast = (message) => {
+ uni.showToast({
+ title: message,
+ icon: "none",
+ });
+};
+
+// 涓婁紶閫昏緫
+const uploadFilePromise = (url) => {
+ return new Promise((resolve, reject) => {
+ uni.uploadFile({
+ url: config.baseUrl + "/common/upload",
+ filePath: url,
+ name: "files", // 娉ㄦ剰锛氳繖閲屾牴鎹師浠ｇ爜鏄� "files"
+ header: {
+ Authorization: "Bearer " + getToken(),
+ },
+ success: (res) => {
+ try {
+ const data = JSON.parse(res.data);
+ if (data.code === 200) {
+ // 濡傛灉杩斿洖鐨勬槸鏁扮粍锛屽彇绗竴涓厓绱�
+ const resultData = Array.isArray(data.data) ? data.data[0] : data.data;
+
+ // 澶勭悊 url 璧嬪��
+ if (!resultData.url && resultData.previewURL) {
+ resultData.url = resultData.previewURL;
+ }
+ // 鍏煎鍘熶唬鐮佷腑鐨� name 璧嬪��
+ if (!resultData.name && resultData.originalFilename) {
+ resultData.name = resultData.originalFilename;
+ }
+
+ resolve(resultData);
+ } else {
+ reject(data.msg || "涓婁紶澶辫触");
+ }
+ } catch (e) {
+ reject("瑙ｆ瀽鍝嶅簲澶辫触");
+ }
+ },
+ fail: (err) => {
+ reject(err);
+ },
+ });
+ });
+};
+
+// 涓婁紶鍚庣殑澶勭悊
+const afterRead = async (event) => {
+ let lists = [].concat(event.file);
+ let currentModelValue = [...props.modelValue];
+
+ // 鍏堝湪鍐呴儴鍒楄〃涓坊鍔犲崰浣嶏紙涓婁紶涓姸鎬侊級
+ lists.forEach(item => {
+ internalFileList.value.push({
+ ...item,
+ status: 'uploading',
+ message: '涓婁紶涓�'
+ });
+ });
+
+ for (let i = 0; i < lists.length; i++) {
+ try {
+ const result = await uploadFilePromise(lists[i].url);
+
+ // 鏇存柊 modelValue
+ currentModelValue.push(result);
+ emit('update:modelValue', currentModelValue);
+
+ } catch (e) {
+ // 濡傛灉涓婁紶澶辫触锛屼粠鍐呴儴鍒楄〃涓Щ闄ゅ垰鎵嶆坊鍔犵殑椤�
+ const errorIndex = internalFileList.value.findIndex(item => item.status === 'uploading');
+ if (errorIndex > -1) {
+ internalFileList.value.splice(errorIndex, 1);
+ }
+ showToast(typeof e === "string" ? e : "涓婁紶澶辫触");
+ }
+ }
+};
+
+// 鍒犻櫎澶勭悊
+const deleteFile = (event) => {
+ const newList = [...props.modelValue];
+ newList.splice(event.index, 1);
+ emit('update:modelValue', newList);
+};
+</script>
+
+<style scoped lang="scss">
+.common-upload {
+ width: 100%;
+}
+</style>
diff --git a/src/pages/equipmentManagement/repair/add.vue b/src/pages/equipmentManagement/repair/add.vue
index b92ec4a..73c4eba 100644
--- a/src/pages/equipmentManagement/repair/add.vue
+++ b/src/pages/equipmentManagement/repair/add.vue
@@ -97,13 +97,7 @@
<u-form-item label="鍥剧墖闄勪欢"
prop="storageBlobDTOs"
border-bottom>
- <u-upload :fileList="fileList"
- @afterRead="afterRead"
- @delete="deleteFile"
- name="file"
- multiple
- :maxCount="9"
- accept="image"></u-upload>
+ <CommonUpload v-model="form.storageBlobDTOs" />
</u-form-item>
</u-cell-group>
<!-- 鎻愪氦鎸夐挳 -->
@@ -135,6 +129,7 @@
import { ref, computed, onMounted, onUnmounted } from "vue";
import { onShow, onLoad } from "@dcloudio/uni-app";
import PageHeader from "@/components/PageHeader.vue";
+ import CommonUpload from "@/components/CommonUpload.vue";
import { getDeviceLedger } from "@/api/equipmentManagement/ledger";
import {
addRepair,
@@ -143,8 +138,6 @@
} from "@/api/equipmentManagement/repair";
import dayjs from "dayjs";
import { formatDateToYMD } from "@/utils/ruoyi";
- import { getToken } from "@/utils/auth";
- import config from "@/config";
const showToast = message => {
uni.showToast({
title: message,
@@ -210,8 +203,6 @@
storageBlobDTOs: [], // 鍥剧墖闄勪欢
});
- const fileList = ref([]);
-
// 鎶ヤ慨鐘舵�侀�夐」
const repairStatusOptions = ref([
{ name: "寰呯淮淇�", value: "0" },
@@ -265,15 +256,6 @@
form.value.machineryCategory = data.machineryCategory;
form.value.remark = data.remark;
form.value.storageBlobDTOs = data.storageBlobVOs || [];
- // 璁剧疆鍥剧墖鍒楄〃鏄剧ず
- if (data.storageBlobVOs && data.storageBlobVOs.length > 0) {
- fileList.value = data.storageBlobVOs.map(item => ({
- url: item.url,
- name: item.name,
- status: "success",
- message: "",
- }));
- }
repairStatusText.value =
repairStatusOptions.value.find(item => item.value == data.status)
?.name || "";
@@ -377,94 +359,6 @@
form.value.repairTime = formatDateToYMD(e.value);
pickerDateValue.value = dayjs(e.value).format("YYYY-MM-DD");
showDate.value = false;
- };
-
- // 鍥剧墖涓婁紶鍚庣殑澶勭悊
- const afterRead = async event => {
- // 褰撹缃� mutiple 涓� true 鏃�, file 涓烘暟缁勬牸寮忥紝鍚﹀垯涓哄璞℃牸寮�
- let lists = [].concat(event.file);
- let fileListLen = fileList.value.length;
- lists.map(item => {
- fileList.value.push({
- ...item,
- status: "uploading",
- message: "涓婁紶涓�",
- });
- });
- for (let i = 0; i < lists.length; i++) {
- try {
- const result = await uploadFilePromise(lists[i].url);
- let item = fileList.value[fileListLen];
- fileList.value.splice(
- fileListLen,
- 1,
- Object.assign(item, {
- status: "success",
- message: "",
- url: result.url,
- name: result.name,
- })
- );
- // 鍚屾鍒拌〃鍗曟暟鎹�
- form.value.storageBlobDTOs.push(result);
- fileListLen++;
- } catch (e) {
- let item = fileList.value[fileListLen];
- fileList.value.splice(
- fileListLen,
- 1,
- Object.assign(item, {
- status: "failed",
- message: "涓婁紶澶辫触",
- })
- );
- showToast(typeof e === "string" ? e : "涓婁紶澶辫触");
- }
- }
- };
-
- const uploadFilePromise = url => {
- return new Promise((resolve, reject) => {
- uni.uploadFile({
- url: config.baseUrl + "/common/upload",
- filePath: url,
- name: "files",
- header: {
- Authorization: "Bearer " + getToken(),
- },
- success: res => {
- try {
- const data = JSON.parse(res.data);
- if (data.code === 200) {
- // 濡傛灉杩斿洖鐨勬槸鏁扮粍锛屽彇绗竴涓厓绱狅紝閬垮厤宓屽鏁扮粍
- const resultData = Array.isArray(data.data)
- ? data.data[0]
- : data.data;
-
- // 濡傛灉 url 涓虹┖涓� previewURL 瀛樺湪锛屽垯澶勭悊 previewURL 璧嬪�肩粰 url
- if (!resultData.url && resultData.previewURL) {
- resultData.url = resultData.previewURL;
- }
- resultData.name = resultData.originalFilename;
-
- resolve(resultData);
- } else {
- reject(data.msg || "涓婁紶澶辫触");
- }
- } catch (e) {
- reject("瑙ｆ瀽鍝嶅簲澶辫触");
- }
- },
- fail: err => {
- reject(err);
- },
- });
- });
- };
-
- const deleteFile = event => {
- fileList.value.splice(event.index, 1);
- form.value.storageBlobDTOs.splice(event.index, 1);
};
onShow(() => {
--
Gitblit v1.9.3