申请租赁页面-补充订单提交中提示，增加遮罩防止用户重复下订单

pages/lease/lease.vue

@@ -95,7 +95,7 @@
 
       <!-- 支付区域 -->
       <view class="payment-section">
-        <button :class="['pay-button']" @click="handlePayment">
+        <button :class="['pay-button']" @click="goTohandlePayment">
           {{ `立即支付 ¥${payAmount}` }}
         </button>
 
@@ -170,6 +170,7 @@
         </view>
       </view>
     </uv-popup>
+    <uv-toast ref="toast"></uv-toast>
   </view>
 </template>
 
@@ -390,6 +391,10 @@ export default {
     toggleDetails() {
       this.showDetails = !this.showDetails
     },
+    goTohandlePayment() {
+      uni.$uv.debounce(this.handlePayment, 1000, true)
+    },
+
     handlePayment() {
       this.formData.payAmount = this.payAmount
       if (checkLoginStatus()) {
@@ -476,9 +481,15 @@ export default {
         content: `确认支付 ¥${this.payAmount} 吗？\n\n${this.formData.quantity}台${this.formData.equipment}\n周期：${this.formData.period}`,
         success: async res => {
           if (res.confirm) {
+            this.$refs.toast.show({
+              type: 'loading',
+              message: '正在提交订单中...',
+              overlay: true, // 启用遮罩
+              duration: 10000,
+            })
             // 这里可以调用支付API
             const response = await createLeaseOrder(this.formData)
-
+            this.$refs.toast.hide()
             if (response.code === 200) {
               const data = response.data
               console.log(data)