From 004bb60d86b690f448375c0dfa6f79685d02e8dc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=AF=BA?= <1253070437@qq.com>
Date: Wed, 14 Jun 2023 23:37:26 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E6=9B=B4=E6=96=B0=E3=80=91=E6=89=B9?=
 =?UTF-8?q?=E9=87=8F=E6=93=8D=E4=BD=9C=E7=BB=84=E4=BB=B6=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E4=B8=94=E5=8A=A0=E5=85=A5=E5=9B=BE=E6=A0=87=E9=A2=9C=E8=89=B2?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=EF=BC=8C=E4=B8=8A=E4=BC=A0=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E4=BC=98=E5=A4=9A=E6=96=87=E4=BB=B6=E4=B8=8A=E4=BC=A0=E4=B8=94?=
 =?UTF-8?q?=E6=8F=90=E4=BE=9B=E4=B8=BB=E5=8A=A8=E8=8E=B7=E5=8F=96=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E6=96=B9=E6=B3=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/XnBatchButton/index.vue    | 21 +++++++++-
 .../src/components/XnUpload/index.vue         | 39 +++++++++++++++----
 2 files changed, 51 insertions(+), 9 deletions(-)

diff --git a/snowy-admin-web/src/components/XnBatchButton/index.vue b/snowy-admin-web/src/components/XnBatchButton/index.vue
index 46389e35..b8967320 100644
--- a/snowy-admin-web/src/components/XnBatchButton/index.vue
+++ b/snowy-admin-web/src/components/XnBatchButton/index.vue
@@ -5,9 +5,9 @@
 		@visibleChange="batchVisibleChange"
 		@confirm="deleteBatch"
 	>
-		<a-button :type="props.buttonType" :danger="props.buttonDanger">
+		<a-button :type="props.buttonType" :danger="props.buttonDanger" :size="props.size" :loading="buttonLoading">
 			<template #icon v-if="props.icon">
-				<component :is="props.icon" />
+				<component :is="props.icon" :style="{ color: props.color }" />
 			</template>
 			{{ props.buttonName }}
 		</a-button>
@@ -18,6 +18,7 @@
 	import { message } from 'ant-design-vue'
 	const batchVisible = ref(false)
 	const emit = defineEmits({ batchCallBack: null })
+	const buttonLoading = ref(false)
 	const props = defineProps({
 		buttonName: {
 			type: String,
@@ -35,9 +36,17 @@
 			type: String,
 			default: () => ''
 		},
+		size: {
+			type: String,
+			default: () => 'middle'
+		},
 		selectedRowKeys: {
 			type: Array,
 			default: () => []
+		},
+		color: {
+			type: String,
+			default: () => ''
 		}
 	})
 	// 参数校验
@@ -64,4 +73,12 @@
 		// 发起方法调用，谁的谁来实现
 		emit('batchCallBack', params)
 	}
+	// 打开loading
+	const loading = () => {
+		buttonLoading.value = true
+	}
+	// 关闭loading
+	const closeLoading = () => {
+		buttonLoading.value = true
+	}
 </script>
diff --git a/snowy-admin-web/src/components/XnUpload/index.vue b/snowy-admin-web/src/components/XnUpload/index.vue
index 9dc72d76..6645e42a 100644
--- a/snowy-admin-web/src/components/XnUpload/index.vue
+++ b/snowy-admin-web/src/components/XnUpload/index.vue
@@ -5,11 +5,11 @@
 		name="file"
 		:action="action"
 		:headers="headers"
-		:maxCount="props.uploadMumber"
+		:maxCount="props.uploadNumber"
 		@change="handleChange"
 	>
 		<a-button>
-			<upload-outlined></upload-outlined>
+			<upload-outlined />
 			上传
 		</a-button>
 	</a-upload>
@@ -21,11 +21,11 @@
 		:multiple="true"
 		:action="action"
 		:headers="headers"
-		:maxCount="props.uploadMumber"
+		:maxCount="props.uploadNumber"
 		@change="handleChange"
 	>
 		<p class="ant-upload-drag-icon">
-			<inbox-outlined></inbox-outlined>
+			<inbox-outlined />
 		</p>
 		<p class="ant-upload-text">单击或拖动文件到此区域上传</p>
 		<p class="ant-upload-hint"></p>
@@ -53,7 +53,7 @@
 			required: false
 		},
 		// 上传数量
-		uploadMumber: {
+		uploadNumber: {
 			type: Number,
 			default: 1,
 			required: false
@@ -61,11 +61,13 @@
 	})
 	const action = sysConfig.API_URL + props.action
 
+	// 上传时间，构造上传数组，主动推送至调用组件，单文件可以使用
 	const handleChange = () => {
+		// 单个文件可以使用回调方法，多个文件建议主动获取
 		let result = []
-		for (let a = 0; a < props.uploadMumber; a++) {
+		for (let a = 0; a < props.uploadNumber; a++) {
 			const file = fileList.value[a]
-			if (file.status === 'done' && file.response && file.response.code === 200) {
+			if (file && file.status === 'done' && file.response && file.response.code === 200) {
 				const resultObj = {
 					name: file.name,
 					url: file.response.data
@@ -77,4 +79,27 @@
 			emit('uploadDone', result)
 		}
 	}
+	// 通过DOM获取上传的文件
+	const uploadFileList = () => {
+		if (fileList.value) {
+			const result = []
+			// 只返回这些就够用了，其他基本用不到
+			fileList.value.forEach((item) => {
+				const obj = {
+					name: item.name,
+					type: item.type,
+					size: item.size,
+					url: item.response.data
+				}
+				result.push(obj)
+			})
+			return result
+		} else {
+			return []
+		}
+	}
+	// 抛出这个获取文件列表的方法
+	defineExpose({
+		uploadFileList
+	})
 </script>