From 885b616c718dcfe806b6e26e26917d03709012bf Mon Sep 17 00:00:00 2001
From: BianLzhaoMin <11485688+bianliangzhaomin123@user.noreply.gitee.com>
Date: Mon, 24 Nov 2025 15:42:22 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=8F=90=E4=BA=A4=E6=97=B6?=
 =?UTF-8?q?=E7=9A=84loading?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ComButton/index.vue            | 90 +++++++++++++++++++
 .../project-manage/dept-project/index.vue     | 49 +++++-----
 .../person-entry/add-or-edit-form.vue         |  1 +
 .../person-entry/index.vue                    | 48 ++++++----
 .../person-entry/shanghai-pro-setting.vue     | 16 ++--
 5 files changed, 161 insertions(+), 43 deletions(-)
 create mode 100644 src/components/ComButton/index.vue

diff --git a/src/components/ComButton/index.vue b/src/components/ComButton/index.vue
new file mode 100644
index 0000000..62f8d91
--- /dev/null
+++ b/src/components/ComButton/index.vue
@@ -0,0 +1,90 @@
+<template>
+    <el-button
+        :type="type"
+        :icon="icon"
+        :size="size"
+        :loading="loading"
+        :disabled="disabled || loading"
+        v-bind="$attrs"
+        v-on="otherListeners"
+        @click="debouncedHandleClick"
+    >
+        <slot></slot>
+    </el-button>
+</template>
+
+<script>
+import { debounce } from 'lodash'
+
+export default {
+    name: 'ComButton',
+    inheritAttrs: false,
+    props: {
+        type: {
+            type: String,
+            default: 'primary',
+        },
+        icon: {
+            type: String,
+            default: '',
+        },
+        size: {
+            type: String,
+            default: 'default',
+        },
+        disabled: {
+            type: Boolean,
+            default: false,
+        },
+        // 防抖延迟时间（毫秒）
+        debounceTime: {
+            type: Number,
+            default: 800,
+        },
+    },
+    data() {
+        return {
+            loading: false,
+        }
+    },
+    computed: {
+        // 过滤掉 click 事件，避免重复触发
+        otherListeners() {
+            const listeners = { ...this.$listeners }
+            delete listeners.click
+            return listeners
+        },
+    },
+    created() {
+        // 创建防抖函数
+        this.debouncedHandleClick = debounce(
+            this.handleClick,
+            this.debounceTime,
+        )
+    },
+    methods: {
+        async handleClick(event) {
+            // 如果正在 loading，直接返回
+            if (this.loading) {
+                return
+            }
+
+            this.loading = true
+            try {
+                // 执行父组件传入的点击事件
+                if (this.$listeners.click) {
+                    const result = this.$listeners.click(event)
+                    // 如果是 Promise，等待其完成
+                    if (result && typeof result.then === 'function') {
+                        await result
+                    }
+                }
+            } catch (error) {
+                console.error('按钮点击事件执行失败:', error)
+            } finally {
+                this.loading = false
+            }
+        },
+    },
+}
+</script>
diff --git a/src/views/basic-manage/project-manage/dept-project/index.vue b/src/views/basic-manage/project-manage/dept-project/index.vue
index 364c57e..c896bfc 100644
--- a/src/views/basic-manage/project-manage/dept-project/index.vue
+++ b/src/views/basic-manage/project-manage/dept-project/index.vue
@@ -147,13 +147,13 @@
                         >
                             取消
                         </el-button>
-                        <el-button
+                        <ComButton
                             size="medium"
                             type="primary"
                             @click="onHandleConfirmAddOrEdit"
                         >
                             确定
-                        </el-button>
+                        </ComButton>
                     </el-row>
                 </template>
 
@@ -214,6 +214,7 @@
 <script>
 import TableModel from '@/components/TableModel'
 import DialogModel from '@/components/DialogModel'
+import ComButton from '@/components/ComButton'
 import { formLabel, columnsList, dialogConfig } from './config'
 import {
     deleteDeptProjectAPI,
@@ -227,6 +228,7 @@ export default {
     components: {
         TableModel,
         DialogModel,
+        ComButton,
     },
 
     data() {
@@ -328,29 +330,32 @@ export default {
         },
 
         // 确定按钮
-        onHandleConfirmAddOrEdit() {
-            this.$refs.addOrEditFormRef.validate(async (valid) => {
-                if (valid) {
-                    const params = {
-                        ...this.addOrEditForm,
-                    }
+        async onHandleConfirmAddOrEdit() {
+            return new Promise(async (resolve) => {
+                this.$refs.addOrEditFormRef.validate(async (valid) => {
+                    if (valid) {
+                        const params = {
+                            ...this.addOrEditForm,
+                        }
 
-                    if (this.dialogConfig.outerTitle === '新增项目部') {
-                        delete params.id
-                    }
+                        if (this.dialogConfig.outerTitle === '新增项目部') {
+                            delete params.id
+                        }
 
-                    const res = await addAndEditDeptProjectAPI(params)
-                    if (res.code === 200) {
-                        this.$modal.msgSuccess(
-                            this.dialogConfig.outerTitle === '新增项目部'
-                                ? '新增成功'
-                                : '修改成功',
-                        )
-                        this.handleCloseDialogOuter()
-                        this.$refs.deptProjectTableRef.getTableList() // 更新列表
-                        this.$store.dispatch('getSubCompanySelectList') // 更新store中的分公司列表
+                        const res = await addAndEditDeptProjectAPI(params)
+                        if (res.code === 200) {
+                            this.$modal.msgSuccess(
+                                this.dialogConfig.outerTitle === '新增项目部'
+                                    ? '新增成功'
+                                    : '修改成功',
+                            )
+                            this.handleCloseDialogOuter()
+                            this.$refs.deptProjectTableRef.getTableList() // 更新列表
+                            this.$store.dispatch('getSubCompanySelectList') // 更新store中的分公司列表
+                        }
+                        resolve()
                     }
-                }
+                })
             })
         },
 
diff --git a/src/views/construction-person/entry-and-exit-manage/person-entry/add-or-edit-form.vue b/src/views/construction-person/entry-and-exit-manage/person-entry/add-or-edit-form.vue
index 8e0b929..35567b3 100644
--- a/src/views/construction-person/entry-and-exit-manage/person-entry/add-or-edit-form.vue
+++ b/src/views/construction-person/entry-and-exit-manage/person-entry/add-or-edit-form.vue
@@ -610,6 +610,7 @@
 <script>
 import UploadImgFormData from '@/components/UploadImgFormData'
 import UploadFileFormData from '@/components/UploadFileFormData'
+
 import {
     checkFaceImageAPI,
     checkFaceImageReadCardAPI,
diff --git a/src/views/construction-person/entry-and-exit-manage/person-entry/index.vue b/src/views/construction-person/entry-and-exit-manage/person-entry/index.vue
index cb8d90d..0ccf149 100644
--- a/src/views/construction-person/entry-and-exit-manage/person-entry/index.vue
+++ b/src/views/construction-person/entry-and-exit-manage/person-entry/index.vue
@@ -131,13 +131,14 @@
                         >
                             取消
                         </el-button>
-                        <el-button
+
+                        <ComButton
                             size="medium"
                             type="primary"
                             @click="onHandleConfirmAddOrEdit"
                         >
                             确定
-                        </el-button>
+                        </ComButton>
                     </el-row>
                 </template>
 
@@ -182,6 +183,7 @@ import TableModel from '@/components/TableModel'
 import DialogModel from '@/components/DialogModel'
 import ShanghaiProSetting from './shanghai-pro-setting'
 import UploadFileFormData from '@/components/UploadFileFormData'
+import ComButton from '@/components/ComButton'
 import { formLabel, columnsList, dialogConfig } from './config'
 import {
     getEntryPersonListAPI,
@@ -205,6 +207,7 @@ export default {
         AddOrEditForm,
         UploadFileFormData,
         ShanghaiProSetting,
+        ComButton,
     },
 
     data() {
@@ -220,6 +223,7 @@ export default {
             importFileList: [], // 导入文件列表
             idNumber: '', // 身份证号码
             getEntryPersonListAPI,
+            loading: false,
         }
     },
     methods: {
@@ -285,18 +289,32 @@ export default {
         },
 
         // 确定按钮
-        onHandleConfirmAddOrEdit: debounce(function () {
-            const handleAsync = async () => {
-                try {
-                    await this.$refs.addOrEditFormContentRef.onHandleConfirmAddOrEditFun()
-                    this.$refs.personEntryTableRef.getTableList()
-                    this.handleCloseDialogOuter()
-                } catch (error) {
-                    // console.log('表单提交失败', error)
-                }
-            }
-            handleAsync()
-        }, 1000),
+        // onHandleConfirmAddOrEdit: debounce(function () {
+        //     this.loading = true
+        //     const handleAsync = async () => {
+        //         try {
+        //             await this.$refs.addOrEditFormContentRef.onHandleConfirmAddOrEditFun()
+        //             this.loading = false
+        //             this.$refs.personEntryTableRef.getTableList()
+        //             this.handleCloseDialogOuter()
+        //         } catch (error) {
+        //             // console.log('表单提交失败', error)
+        //         }
+        //     }
+        //     handleAsync()
+        // }, 300),
+
+        onHandleConfirmAddOrEdit() {
+            return new Promise(async (resolve) => {
+                await this.$refs.addOrEditFormContentRef.onHandleConfirmAddOrEditFun()
+                this.$refs.personEntryTableRef.getTableList()
+                this.handleCloseDialogOuter()
+                resolve()
+            })
+            // await this.$refs.addOrEditFormContentRef.onHandleConfirmAddOrEditFun()
+            // this.$refs.personEntryTableRef.getTableList()
+            // this.handleCloseDialogOuter()
+        },
 
         // 关闭弹框
         handleCloseDialogOuter() {
@@ -370,7 +388,7 @@ export default {
         // 上海人员多工程设置
         onHandleShanghaiPersonMultiEngineSetting() {
             this.dialogConfig.outerTitle = '上海人员多工程设置'
-            this.dialogConfig.outerWidth = '80%'
+            this.dialogConfig.outerWidth = '90%'
             this.dialogConfig.minHeight = '90vh'
             this.dialogConfig.maxHeight = '90vh'
             this.dialogConfig.outerVisible = true
diff --git a/src/views/construction-person/entry-and-exit-manage/person-entry/shanghai-pro-setting.vue b/src/views/construction-person/entry-and-exit-manage/person-entry/shanghai-pro-setting.vue
index 19182f2..0af2da9 100644
--- a/src/views/construction-person/entry-and-exit-manage/person-entry/shanghai-pro-setting.vue
+++ b/src/views/construction-person/entry-and-exit-manage/person-entry/shanghai-pro-setting.vue
@@ -353,20 +353,20 @@
                     <el-button size="medium" @click="onHandleCloseDialogOuter">
                         取消
                     </el-button>
-                    <el-button
+                    <ComButton
                         size="medium"
                         type="primary"
                         @click="onHandleConfirmAddEntryProject"
                     >
                         提交
-                    </el-button>
-                    <el-button
+                    </ComButton>
+                    <ComButton
                         size="medium"
                         type="success"
                         @click="onHandleConfirmAddEntryProjectAndContinue"
                     >
                         提交并继续添加
-                    </el-button>
+                    </ComButton>
                 </el-row>
             </template>
         </DialogModel>
@@ -377,6 +377,7 @@
 import DialogModel from '@/components/DialogModel'
 import UploadImgFormData from '@/components/UploadImgFormData'
 import UploadFileFormData from '@/components/UploadFileFormData'
+import ComButton from '@/components/ComButton'
 import {
     getShanghaiProByIdNumberAPI,
     getShanghaiProListByWorkerIdAPI,
@@ -396,6 +397,7 @@ export default {
         DialogModel,
         UploadFileFormData,
         UploadImgFormData,
+        ComButton,
     },
     props: {
         idNumber: {
@@ -480,7 +482,7 @@ export default {
             dialogConfig: {
                 outerVisible: false,
                 outerTitle: '新增入场工程',
-                outerWidth: '60%',
+                outerWidth: '85%',
                 // minHeight: '78vh',
                 maxHeight: '90vh',
             },
@@ -689,6 +691,7 @@ export default {
             const res = await this.addShanghaiProEin()
             if (res) {
                 this.$emit('closeDialogOuter')
+                resolve()
             }
         },
 
@@ -699,6 +702,7 @@ export default {
                 this.$refs.addEntryProjectFormRef.resetFields()
                 this.dialogConfig.outerVisible = false
                 this.getShanghaiProList()
+                resolve()
             }
         },
 
@@ -854,7 +858,7 @@ export default {
                             }
                         } catch (err) {
                             // this.$modal.msgError('合同上传失败，请重试')
-                            reject(err)
+                            reject(false)
                         }
                     } else {
                         reject(false)