Selaa lähdekoodia

feat(components): 为通用图片上传组件增加默认上传接口支持

重构 image-upload 组件,将 uploadUrl 从 required 改为 optional,新增 code 参数用于指定上传场景。当未提供 uploadUrl 时,组件会自动使用默认的通用上传接口 `/api/token/mini/fileUpload/${code}`。

在退款申请页面中,将原有的 u-upload 组件替换为通用的 common-image-upload 组件,简化图片上传逻辑并统一上传接口调用方式。
ylong 1 päivä sitten
vanhempi
sitoutus
ec0ab5d865
2 muutettua tiedostoa jossa 26 lisäystä ja 27 poistoa
  1. 17 2
      components/image-upload.vue
  2. 9 25
      pages-car/pages/apply-refund.vue

+ 17 - 2
components/image-upload.vue

@@ -39,7 +39,11 @@
 			},
 			uploadUrl: {
 				type: String,
-				required: true
+				default: ''
+			},
+			code: {
+				type: String,
+				default: ''
 			},
 			header: {
 				type: Object,
@@ -91,8 +95,19 @@
 						...this.header
 					};
 
-					// 处理 URL,如果传入的是完整 URL 则直接使用,否则拼接 baseUrl
+					// 处理 URL
 					let url = this.uploadUrl;
+					if (!url) {
+						// 如果没有传入 uploadUrl,则使用默认的通用上传接口
+						// 默认接口需要 code 参数
+						if (!this.code) {
+							console.error('使用通用上传接口时,必须传入 code 参数');
+							reject({ msg: '缺少上传场景码' });
+							return;
+						}
+						url = `/api/token/mini/fileUpload/${this.code}`;
+					}
+
 					if (!url.startsWith('http')) {
 						url = uni.$u.http.config.baseUrl + url;
 					}

+ 9 - 25
pages-car/pages/apply-refund.vue

@@ -157,9 +157,9 @@
 							maxlength="200" />
 					</view>
 					<view class="upload-area">
-						<u-upload ref="uUpload" :action="uploadAction" :max-count="5" :header="uploadHeader" name="file"
-							:file-list="fileList" @on-list-change="handleUploadChange" width="160" height="160">
-						</u-upload>
+						<common-image-upload v-model="fileList" :max-count="5" code="shopRefund" width="160"
+							height="160">
+						</common-image-upload>
 					</view>
 				</view>
 				<view class="popup-footer safe-area-bottom">
@@ -213,7 +213,12 @@
 </template>
 
 <script>
+	import CommonImageUpload from "@/components/image-upload.vue";
+
 	export default {
+		components: {
+			CommonImageUpload
+		},
 		data() {
 			return {
 				orderId: '',
@@ -259,10 +264,6 @@
 					{ value: '3', label: '自行寄回' }
 				],
 
-				uploadAction: uni.$u.http.config.baseUrl + '/token/shop/feedback/fileUpload',
-				uploadHeader: {
-					'Authorization': uni.getStorageSync('token') || ''
-				},
 				submitBtnStyle: {
 					width: '100%',
 					height: '80rpx',
@@ -419,9 +420,6 @@
 					url: `/pages-mine/pages/address/list?id=${this.address.id || ''}&isSelect=1`
 				});
 			},
-			handleUploadChange(lists) {
-				this.fileList = lists;
-			},
 			submit() {
 				if (this.selectedGoods.length === 0) {
 					this.$u.toast('请选择退款商品');
@@ -441,21 +439,7 @@
 				}
 
 				// 处理图片
-				let files = [];
-				// 优先使用 fileList (因为 handleUploadChange 已同步)
-				// 或者直接从 ref 获取,双重保险
-				let uploadFiles = this.fileList;
-				if (this.$refs.uUpload && this.$refs.uUpload.lists) {
-					uploadFiles = this.$refs.uUpload.lists;
-				}
-
-				uploadFiles.forEach(item => {
-					if (item.response && item.response.code === 200) {
-						files.push(item.response.data);
-					} else if (item.url) {
-						files.push(item.url);
-					}
-				});
+				let files = this.fileList;
 
 				const params = {
 					orderId: this.orderId,