审核相关按钮增加loading

src/views/demo/handlingmanagement/intend/src/AuditModel.vue

@@ -3,15 +3,15 @@
     <template #footer v-if="type == 'detail'"> </template>
     <template #footer v-else>
       <template v-if="modelNodeType == NodeType.Parallel">
-        <a-button type="primary" @click="audit('Pass')">通过</a-button>
-        <a-button type="primary" danger @click="audit('Reject')">退回</a-button>
+        <a-button type="primary" :loading="iconLoading" @click="audit('Pass')">通过</a-button>
+        <a-button type="primary" :loading="iconLoading" danger @click="audit('Reject')">退回</a-button>
       </template>
       <template v-else-if="modelNodeType == NodeType.Common">
         <a-button v-if="transpondvisible" type="primary" @click="transpond">转发</a-button>
       </template>
       <template v-else-if="modelNodeType == NodeType.Branch">
-        <a-button type="primary" @click="audit('Pass')">归档</a-button>
-        <a-button type="primary" danger @click="audit('Reject')">退回</a-button>
+        <a-button type="primary" :loading="iconLoading" @click="audit('Pass')">归档</a-button>
+        <a-button type="primary" :loading="iconLoading" danger @click="audit('Reject')">退回</a-button>
       </template>
     </template>
     <div class="container">
@@ -90,6 +90,7 @@ enum NodeType {
 }
 const modelNodeType = ref(NodeType.Other);
 const [registerTranspondModel, { openModal: openAregisterTranspondModel }] = useModal();
+const iconLoading = ref(false);
 
 const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
   setModalProps({ confirmLoading: false });
@@ -161,14 +162,19 @@ async function audit(val) {
       workitemId: obj.value.workitemId,
       auditResult: val,
     };
+    iconLoading.value = true;
     handleWorkitem(query).then((data) => {
       if (data) {
+       setTimeout(() => {
         setModalProps({ confirmLoading: true });
         // TODO custom api
         closeModal();
         emit('success');
+        iconLoading.value = false;
         return createMessage.success('审核成功');
+       }, 2000);
       } else {
+        iconLoading.value = false;
         return createMessage.error('审核失败');
       }
     });

src/views/demo/handlingmanagement/intend/src/TranspondModel.vue

@@ -7,8 +7,12 @@
     @ok="handleSubmit" 
     :okText="okTextVal"
     :destroyOnClose="true" 
+    :confirmLoading="iconLoading"
     width="1000px"
   >
+    <template #footer>
+        <a-button type="primary" :loading="iconLoading" @click="handleSubmit">确认</a-button>
+    </template>
     <!-- 部门选择界面 -->
     <div class="dept-box" v-if="okTextVal === '确认'">
       <!-- 左侧部门树 -->
@@ -74,7 +78,7 @@ const defaultOrg = ref([]); // 默认选中的部门
 const expandedKeys = ref<any>([]); // 展开的节点键值
 const orgList = ref<any[]>([]); // 已选部门列表
 const rowId = ref(''); // 记录ID
-
+const iconLoading = ref(false); // 图标加载状态
 
 /**
  * 展开节点处理函数
@@ -167,26 +171,33 @@ async function handleSubmit() {
     orgList.value.forEach((element) => {
       orgIds.push(element.id);
     });
-    
+    if(orgIds.length == 0){
+      return createMessage.warning('请先选择转发部门');
+    }
     // 构建请求参数
     const query = {
       workitemId: props.workItemId,
       orgIds: orgIds,
     };
-    
+    iconLoading.value = true;
     // 调用转发接口
     handleWorkitem(query).then((data) => {
       if (data) {
-        // 设置加载状态
-        setModalProps({ confirmLoading: true });
-        // 关闭模态框
-        closeModal();
-        // 触发成功事件
-        emit('success');
-        // 显示成功消息
-        return createMessage.success('转发成功');
+        setTimeout(() => {
+          iconLoading.value = false;
+          // 设置加载状态
+          setModalProps({ confirmLoading: true });
+          // 关闭模态框
+          closeModal();
+          // 触发成功事件
+          emit('success');
+          // 显示成功消息
+          return createMessage.success('转发成功');
+      }, 2000);
+       
       } else {
         // 显示失败消息
+        iconLoading.value = false;
         return createMessage.error('转发失败');
       }
     });