收入合同审核按钮重复点击问题

src/views/contractManagement/revenueContract/modules/RevenueContractAduitModule.vue

@@ -5,32 +5,37 @@
     :visible="visible"
     :confirmLoading="confirmLoading"
     switchFullscreen
-    @ok="handleOk"
-    @cancel="handleCancel"
     cancelText="关闭">
-    <a-form :form="form">
-      <a-form-item label="审核人" :labelCol="labelCol" :wrapperCol="wrapperCol">
-        <a-input placeholder="请输入审核人"
-                 v-decorator="['userName',validatorRules.userName]"
-                 :maxLength='50'
-                 :disabled="true"
-                 @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
-      </a-form-item>
-      <a-form-item label="审核" :labelCol="labelCol" :wrapperCol="wrapperCol">
-        <a-radio-group v-decorator="['contractStatus', validatorRules.contractStatus]" @change="contractAuditStatuChange">
-          <a-radio :value="3">通过</a-radio>
-          <a-radio :value="4">拒绝</a-radio>
-        </a-radio-group>
-      </a-form-item>
-      <a-form-item label="拒绝说明" :labelCol="labelCol" :wrapperCol="wrapperCol" v-if="showExplainRemarks">
-        <a-textarea
-          placeholder="请输入拒绝说明"
-          v-decorator="['explainRemarks', validatorRules.explainRemarks]"
-          :auto-size="{ minRows: 3, maxRows: 6 }"
-          :maxLength='200'
-          @change="e => {e.target.value = (e.target.value + '').trim()}"/>
-      </a-form-item>
-    </a-form>
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+        <a-form-item label="审核人" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input placeholder="请输入审核人"
+                   v-decorator="['userName',validatorRules.userName]"
+                   :maxLength='50'
+                   :disabled="true"
+                   @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+        </a-form-item>
+        <a-form-item label="审核" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-radio-group v-decorator="['contractStatus', validatorRules.contractStatus]"
+                         @change="contractAuditStatuChange">
+            <a-radio :value="3">通过</a-radio>
+            <a-radio :value="4">拒绝</a-radio>
+          </a-radio-group>
+        </a-form-item>
+        <a-form-item label="拒绝说明" :labelCol="labelCol" :wrapperCol="wrapperCol" v-if="showExplainRemarks">
+          <a-textarea
+            placeholder="请输入拒绝说明"
+            v-decorator="['explainRemarks', validatorRules.explainRemarks]"
+            :auto-size="{ minRows: 3, maxRows: 6 }"
+            :maxLength='200'
+            @change="e => {e.target.value = (e.target.value + '').trim()}"/>
+        </a-form-item>
+      </a-form>
+    </a-spin>
+    <template slot="footer">
+      <a-button @click="handleCancel">关闭</a-button>
+      <a-button @click="handleOk" type="primary" v-preventclick :loading="confirmLoading">确定</a-button>
+    </template>
   </j-modal>
 </template>
 
@@ -81,6 +86,7 @@ export default {
       // 触发表单验证
       this.form.validateFields((err, values) => {
         if (!err) {
+          this.confirmLoading = true
           values.contractId = this.contractId
           const formData = Object.assign(this.model, values)
           console.log('表单提交数据', formData)