From 013afdf16e948a607765f74bbbf10f109b083602 Mon Sep 17 00:00:00 2001
From: weiwei <ctw@example.com>
Date: Wed, 26 Feb 2025 20:24:09 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=A1=E6=89=B9=E6=8F=90=E4=BA=A4=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0loading?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/taskDrawer/agree.vue    | 125 +++++++++++++-----------
 src/components/taskDrawer/index.vue    |   6 +-
 src/components/taskDrawer/refuse.vue   |  31 +++---
 src/components/taskDrawer/transfer.vue | 126 ++++++++++++++-----------
 4 files changed, 165 insertions(+), 123 deletions(-)

diff --git a/src/components/taskDrawer/agree.vue b/src/components/taskDrawer/agree.vue
index ae231cf..68b74bc 100644
--- a/src/components/taskDrawer/agree.vue
+++ b/src/components/taskDrawer/agree.vue
@@ -1,81 +1,96 @@
 <script setup lang="ts">
-import { ref } from 'vue'
-import { completeTask } from '/@/api/flow/task'
-import type { FlowFormItem, TaskData, TaskSubmitParam } from './types'
+import { ref } from "vue"
+import { completeTask } from "/@/api/flow/task"
+import type { FlowFormItem, TaskData, TaskSubmitParam } from "./types"
+import { useMessage } from "/@/hooks/message"
 
 const dialogVisible = ref(false)
-const submitDesc = ref('')
+const submitDesc = ref("")
 const currentData = ref<TaskData>()
 const currentOpenFlowForm = ref<FlowFormItem[]>()
+const loading = ref(false)
 
 const handle = (row: TaskData, formData: FlowFormItem[]) => {
-  submitDesc.value = ''
-  currentData.value = row
-  currentOpenFlowForm.value = formData
-  dialogVisible.value = true
+	submitDesc.value = ""
+	currentData.value = row
+	currentOpenFlowForm.value = formData
+	dialogVisible.value = true
 }
 
 defineExpose({ handle })
 const emit = defineEmits<{
-  (e: 'taskSubmitEvent'): void
+	(e: "taskSubmitEvent"): void
 }>()
 
 const submit = async () => {
-  if (!currentData.value || !currentOpenFlowForm.value) return
+	if (!currentData.value || !currentOpenFlowForm.value) return
 
-  const formData: Record<string, any> = {}
+	const formData: Record<string, any> = {}
 
-  for (const item of currentOpenFlowForm.value) {
-    formData[item.id] = item.props.value
+	for (const item of currentOpenFlowForm.value) {
+		formData[item.id] = item.props.value
 
-    if (item.type === 'Layout') {
-      const subList = item.props.value as FlowFormItem[][]
-      const processedData = subList.map(array =>
-        array.reduce((acc, subItem) => ({
-          ...acc,
-          [subItem.id]: subItem.props.value
-        }), {})
-      )
-      formData[item.id] = processedData
-    }
-  }
+		if (item.type === "Layout") {
+			const subList = item.props.value as FlowFormItem[][]
+			const processedData = subList.map((array) =>
+				array.reduce(
+					(acc, subItem) => ({
+						...acc,
+						[subItem.id]: subItem.props.value,
+					}),
+					{},
+				),
+			)
+			formData[item.id] = processedData
+		}
+	}
 
-  formData[`${currentData.value.nodeId}_approve_condition`] = true
+	formData[`${currentData.value.nodeId}_approve_condition`] = true
 
-  const param: TaskSubmitParam = {
-    paramMap: formData,
-    taskId: currentData.value.taskId,
-    taskLocalParamMap: {
-      approveDesc: submitDesc.value,
-    },
-  }
+	const param: TaskSubmitParam = {
+		paramMap: formData,
+		taskId: currentData.value.taskId,
+		taskLocalParamMap: {
+			approveDesc: submitDesc.value,
+		},
+	}
 
-  try {
-    await completeTask(param)
-    dialogVisible.value = false
-    emit('taskSubmitEvent')
-  } catch (error) {
-    console.error('Failed to complete task:', error)
-  }
+	try {
+		loading.value = true
+		const res = await completeTask(param).finally(() => (loading.value = false))
+		if (res.code === 0) {
+			dialogVisible.value = false
+			emit("taskSubmitEvent")
+			useMessage().success("通过成功")
+			return
+		}
+		useMessage().error("通过失败")
+	} catch (error) {
+		loading.value = false
+		useMessage().error("错误")
+	}
 }
 </script>
 
 <template>
-  <div>
-    <el-dialog v-model="dialogVisible" title="提交审核" :width="400" class="rounded-lg shadow-xl">
-      <div class="p-4 space-y-4">
-        <el-input v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="请输入审核意见..."
-          show-word-limit class="w-full transition-all duration-300 focus:ring-2 focus:ring-primary" />
+	<div>
+		<el-dialog v-model="dialogVisible" title="提交审核" :width="400" class="rounded-lg shadow-xl">
+			<div class="p-4 space-y-4" v-loading="loading">
+				<el-input
+					v-model="submitDesc"
+					type="textarea"
+					maxlength="100"
+					:rows="5"
+					placeholder="请输入审核意见..."
+					show-word-limit
+					class="w-full transition-all duration-300 focus:ring-2 focus:ring-primary"
+				/>
 
-        <div class="flex justify-end pt-4 space-x-3">
-          <el-button @click="dialogVisible = false" class="hover:bg-gray-100 dark:hover:bg-gray-700">
-            取消
-          </el-button>
-          <el-button type="primary" @click="submit" class="bg-primary hover:bg-primary-focus">
-            确定
-          </el-button>
-        </div>
-      </div>
-    </el-dialog>
-  </div>
+				<div class="flex justify-end pt-4 space-x-3">
+					<el-button @click="dialogVisible = false" class="hover:bg-gray-100 dark:hover:bg-gray-700" :disabled="loading"> 取消 </el-button>
+					<el-button type="primary" @click="submit" class="bg-primary hover:bg-primary-focus" :disabled="loading"> 确定 </el-button>
+				</div>
+			</div>
+		</el-dialog>
+	</div>
 </template>
diff --git a/src/components/taskDrawer/index.vue b/src/components/taskDrawer/index.vue
index 24e609d..9b8c269 100644
--- a/src/components/taskDrawer/index.vue
+++ b/src/components/taskDrawer/index.vue
@@ -27,9 +27,9 @@
 		</template>
 		<template #footer>
 			<div style="flex: auto">
-				<el-button size="large" type="danger" icon="Close" @click="refuseTask">拒绝</el-button>
-				<el-button size="large" type="primary" icon="Check" @click="submitTask">提交</el-button>
-				<el-button size="large" type="info" icon="Share" @click="transferTask">转办</el-button>
+				<el-button size="large" type="danger" icon="Close" @click="refuseTask" :disabled="loading">拒绝</el-button>
+				<el-button size="large" type="primary" icon="Check" @click="submitTask" :disabled="loading">提交</el-button>
+				<el-button size="large" type="info" icon="Share" @click="transferTask" :disabled="loading">转办</el-button>
 			</div>
 		</template>
 	</el-drawer>
diff --git a/src/components/taskDrawer/refuse.vue b/src/components/taskDrawer/refuse.vue
index 52b3f9c..34cc281 100644
--- a/src/components/taskDrawer/refuse.vue
+++ b/src/components/taskDrawer/refuse.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { defineExpose } from "vue"
 import { completeTask } from "/@/api/flow/task"
+import { useMessage } from "/@/hooks/message"
 
 const dialogVisible = ref(false)
-
 const submitDesc = ref("")
-
 const currentData = ref()
 const currentOpenFlowForm = ref()
+const loading = ref(false)
 
 const handle = (row, formData) => {
 	submitDesc.value = ""
@@ -20,7 +20,7 @@ const handle = (row, formData) => {
 defineExpose({ handle })
 const emit = defineEmits(["taskSubmitEvent"])
 
-const submit = () => {
+const submit = async () => {
 	let value = currentOpenFlowForm.value
 
 	var formData = {}
@@ -52,22 +52,31 @@ const submit = () => {
 			approveDesc: "拒绝原因：" + submitDesc.value,
 		},
 	}
-
-	completeTask(param).then((res) => {
-		dialogVisible.value = false
-		emit("taskSubmitEvent")
-	})
+	try {
+		loading.value = true
+		const res = await completeTask(param).finally(() => (loading.value = false))
+		if (res.code === 0) {
+			useMessage().success("拒绝成功")
+			dialogVisible.value = false
+			emit("taskSubmitEvent")
+			return
+		}
+		useMessage().error("拒绝失败")
+	} catch (error) {
+		useMessage().error("错误")
+		loading.value = false
+	}
 }
 </script>
 
 <template>
 	<div>
 		<el-dialog v-model="dialogVisible" title="拒绝审核" width="400px">
-			<el-input v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="审核意见" show-word-limit />
+			<el-input v-loading="loading" v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="审核意见" show-word-limit />
 			<template #footer>
 				<span class="dialog-footer">
-					<el-button @click="dialogVisible = false">取消</el-button>
-					<el-button type="primary" @click="submit"> 确定 </el-button>
+					<el-button @click="dialogVisible = false" :disabled="loading">取消</el-button>
+					<el-button type="primary" @click="submit" :disabled="loading">确定</el-button>
 				</span>
 			</template>
 		</el-dialog>
diff --git a/src/components/taskDrawer/transfer.vue b/src/components/taskDrawer/transfer.vue
index 9e03300..85542fc 100644
--- a/src/components/taskDrawer/transfer.vue
+++ b/src/components/taskDrawer/transfer.vue
@@ -1,84 +1,85 @@
 <script setup lang="ts">
-import { defineExpose, ref } from 'vue';
-import { transferTask } from '/@/api/flow/task';
-import selectShow from '/@/components/OrgSelector/index.vue';
-import { ElMessage } from 'element-plus';
+import { defineExpose, ref } from "vue"
+import { transferTask } from "/@/api/flow/task"
+import selectShow from "/@/components/OrgSelector/index.vue"
+import { ElMessage } from "element-plus"
 
 interface FlowFormItem {
-	id: string;
-	type: string;
+	id: string
+	type: string
 	props: {
-		value: any;
-		label?: string;
-	};
+		value: any
+		label?: string
+	}
 }
 
 interface TaskData {
-	taskId: string;
-	nodeId: string;
+	taskId: string
+	nodeId: string
 }
 
-const dialogVisible = ref(false);
-const submitDesc = ref('');
-const userList = ref<Array<{ id: string }>>([]);
-const currentData = ref<TaskData>();
-const currentOpenFlowForm = ref<FlowFormItem[]>();
+const dialogVisible = ref(false)
+const submitDesc = ref("")
+const userList = ref<Array<{ id: string }>>([])
+const currentData = ref<TaskData>()
+const currentOpenFlowForm = ref<FlowFormItem[]>()
+const loading = ref(false)
 
 const handle = (row: TaskData, formData: FlowFormItem[]) => {
-	submitDesc.value = '';
-	currentData.value = row;
-	currentOpenFlowForm.value = formData;
-	dialogVisible.value = true;
-};
+	submitDesc.value = ""
+	currentData.value = row
+	currentOpenFlowForm.value = formData
+	dialogVisible.value = true
+}
 
-defineExpose({ handle });
-const emit = defineEmits(['taskSubmitEvent']);
+defineExpose({ handle })
+const emit = defineEmits(["taskSubmitEvent"])
 
 const validateForm = (): boolean => {
 	if (userList.value.length === 0) {
-		ElMessage.warning('请选择转办人员');
-		return false;
+		ElMessage.warning("请选择转办人员")
+		return false
 	}
 
 	if (!submitDesc.value.trim()) {
-		ElMessage.warning('请输入审核意见');
-		return false;
+		ElMessage.warning("请输入审核意见")
+		return false
 	}
 
 	if (submitDesc.value.trim().length < 2) {
-		ElMessage.warning('审核意见至少需要2个字符');
-		return false;
+		ElMessage.warning("审核意见至少需要2个字符")
+		return false
 	}
 
-	return true;
-};
+	return true
+}
 
 const submit = async () => {
-	if (!currentOpenFlowForm.value || !currentData.value) return;
+	if (!currentOpenFlowForm.value || !currentData.value) return
 
 	// 表单校验
-	if (!validateForm()) return;
+	if (!validateForm()) return
 
 	try {
-		const formData: Record<string, any> = {};
+		const formData: Record<string, any> = {}
 
 		for (const item of currentOpenFlowForm.value) {
-			formData[item.id] = item.props.value;
+			formData[item.id] = item.props.value
 
-			if (item.type === 'Layout') {
-				const subList = item.props.value as Array<FlowFormItem[]>;
+			if (item.type === "Layout") {
+				const subList = item.props.value as Array<FlowFormItem[]>
 				const d = subList.map((array) => {
-					const v: Record<string, any> = {};
+					const v: Record<string, any> = {}
 					for (const subItem of array) {
-						v[subItem.id] = subItem.props.value;
+						v[subItem.id] = subItem.props.value
 					}
-					return v;
-				});
-				formData[item.id] = d;
+					return v
+				})
+				formData[item.id] = d
 			}
 		}
 
-		formData[`${currentData.value.nodeId}_approve_condition`] = true;
+		formData[`${currentData.value.nodeId}_approve_condition`] = true
 
 		const param = {
 			paramMap: formData,
@@ -87,22 +88,32 @@ const submit = async () => {
 			taskLocalParamMap: {
 				approveDesc: submitDesc.value.trim(),
 			},
-		};
+		}
 
-		await transferTask(param);
-		ElMessage.success('转办成功');
-		dialogVisible.value = false;
-		emit('taskSubmitEvent');
+		try {
+			loading.value = true
+			const res = await transferTask(param).finally(() => (loading.value = false))
+			if (res.code === 0) {
+				ElMessage.success("转办成功")
+				dialogVisible.value = false
+				emit("taskSubmitEvent")
+				return
+			}
+			ElMessage.error("转办失败")
+		} catch (error) {
+			loading.value = false
+			ElMessage.error("错误")
+		}
 	} catch (error) {
-		ElMessage.error('转办失败，请重试');
+		ElMessage.error("转办失败，请重试")
 	}
-};
+}
 </script>
 
 <template>
 	<div>
 		<el-dialog v-model="dialogVisible" width="400px" :close-on-click-modal="false" :close-on-press-escape="false" class="transfer-dialog">
-			<div class="space-y-4">
+			<div v-loading="loading" class="space-y-4">
 				<div class="w-full">
 					<label class="block pb-2">
 						<span class="text-base font-medium after:content-['*'] after:text-red-500 after:ml-1"> 选择转办人员 </span>
@@ -114,14 +125,21 @@ const submit = async () => {
 					<label class="block pb-2">
 						<span class="text-base font-medium after:content-['*'] after:text-red-500 after:ml-1"> 审核意见 </span>
 					</label>
-					<el-input v-model="submitDesc" type="textarea" maxlength="100" :rows="5" placeholder="请输入审核意见（2-100字）" show-word-limit />
+					<el-input
+						v-model="submitDesc"
+						type="textarea"
+						maxlength="100"
+						:rows="5"
+						placeholder="请输入审核意见（2-100字）"
+						show-word-limit
+					/>
 				</div>
 			</div>
 
 			<template #footer>
 				<span class="flex justify-end gap-2">
-					<el-button @click="dialogVisible = false">取消</el-button>
-					<el-button type="primary" @click="submit">确定</el-button>
+					<el-button @click="dialogVisible = false" :disabled="loading">取消</el-button>
+					<el-button type="primary" @click="submit" :disabled="loading">确定</el-button>
 				</span>
 			</template>
 		</el-dialog>