chore: 礼包充值支付状态查询优化

src/apis/equity.ts

@@ -4,12 +4,12 @@ export function fetchUserEquityInfo<T>() {
   return request.post<T>('/equityRest/getCurrentEquity.json')
 }
 
-export function fetchCreateEquityOrder<T>(payload: object) {
-  return request.post<T>('/equityOrderRest/createOrder.json', payload)
+export function fetchCreateEquityOrder<T>(payload: object, controller: AbortController) {
+  return request.post<T>('/equityOrderRest/createOrder.json', payload, { signal: controller.signal })
 }
 
-export function fetchGetEquityPayQrCode<T>(payload: object) {
-  return request.post<T>('/payRest/pay.json', null, { params: payload })
+export function fetchGetEquityPayQrCode<T>(payload: object, controller: AbortController) {
+  return request.post<T>('/payRest/pay.json', null, { params: payload, signal: controller.signal })
 }
 
 export function fetchGetPayStatus<T>(payOrderSn: string) {

src/views/equity/components/pay-sidebar.vue

@@ -38,6 +38,7 @@ const payInfo = ref({
 })
 const isPayQrcodeInvalid = ref(false)
 let payStatusTimer: NodeJS.Timeout | null = null
+let controller: AbortController | null = null
 
 const isShowPayQrCode = computed(() => {
   return !!(
@@ -97,9 +98,13 @@ function clearPayInfo() {
 }
 
 function getEquityPayQrCode() {
+  controller && controller.abort()
+
   clearPayStatusTimer()
   clearPayInfo()
 
+  controller = new AbortController()
+
   const payload = {
     type: '',
     domain: 'equity',
@@ -124,7 +129,7 @@ function getEquityPayQrCode() {
       break
   }
 
-  fetchCreateEquityOrder<string>(payload).then((orderRes) => {
+  fetchCreateEquityOrder<string>(payload, controller).then((orderRes) => {
     if (orderRes.code !== 0) return ''
 
     const payQrCodePayload = {
@@ -141,26 +146,28 @@ function getEquityPayQrCode() {
         break
     }
 
-    fetchGetEquityPayQrCode<{ packageExtra: string; payOrderSn: string }>(payQrCodePayload).then((qrcodeRes) => {
-      if (orderRes.code !== 0) return ''
+    fetchGetEquityPayQrCode<{ packageExtra: string; payOrderSn: string }>(payQrCodePayload, controller!).then(
+      (qrcodeRes) => {
+        if (orderRes.code !== 0) return ''
 
-      isPayQrcodeInvalid.value = false
+        isPayQrcodeInvalid.value = false
 
-      payInfo.value = {
-        url: qrcodeRes.data.packageExtra.replace('code_url=', ''),
-        payOrderSn: qrcodeRes.data.payOrderSn,
-      }
+        payInfo.value = {
+          url: qrcodeRes.data.packageExtra.replace('code_url=', ''),
+          payOrderSn: qrcodeRes.data.payOrderSn,
+        }
 
-      /* 延迟自动取消支付查询 */
-      setTimeout(
-        () => {
-          isPayQrcodeInvalid.value = true
-        },
-        10 * 60 * 1000,
-      )
+        /* 延迟自动取消支付查询 */
+        setTimeout(
+          () => {
+            isPayQrcodeInvalid.value = true
+          },
+          10 * 60 * 1000,
+        )
 
-      getPayStatus()
-    })
+        getPayStatus()
+      },
+    )
   })
 }
 
@@ -183,6 +190,8 @@ function getPayStatus() {
     })
   }
 
+  clearPayStatusTimer()
+
   payStatusTimer = setInterval(() => {
     request()
   }, 1000)

src/views/equity/components/point-recharge-modal.vue

@@ -41,8 +41,9 @@ const payInfo = ref({
   payOrderSn: '',
 })
 const isPayQrcodeInvalid = ref(false)
-let payStatusTimer: NodeJS.Timeout | null = null
 const currentPayPrice = ref(0)
+let payStatusTimer: NodeJS.Timeout | null = null
+let controller: AbortController | null = null
 
 watch(isShowPointRechargeModal, (newVal) => {
   if (newVal) {
@@ -82,9 +83,13 @@ function getPointsGiftPackageList() {
 }
 
 function getEquityPayQrCode() {
+  controller && controller.abort()
+
   clearPayStatusTimer()
   clearPayInfo()
 
+  controller = new AbortController()
+
   const payload = {
     type: '',
     domain: 'point',
@@ -106,7 +111,7 @@ function getEquityPayQrCode() {
       break
   }
 
-  fetchCreateEquityOrder<string>(payload).then((orderRes) => {
+  fetchCreateEquityOrder<string>(payload, controller).then((orderRes) => {
     if (orderRes.code !== 0) return ''
 
     const payQrCodePayload = {
@@ -123,26 +128,28 @@ function getEquityPayQrCode() {
         break
     }
 
-    fetchGetEquityPayQrCode<{ packageExtra: string; payOrderSn: string }>(payQrCodePayload).then((qrcodeRes) => {
-      if (orderRes.code !== 0) return ''
+    fetchGetEquityPayQrCode<{ packageExtra: string; payOrderSn: string }>(payQrCodePayload, controller!).then(
+      (qrcodeRes) => {
+        if (orderRes.code !== 0) return ''
 
-      isPayQrcodeInvalid.value = false
+        isPayQrcodeInvalid.value = false
 
-      payInfo.value = {
-        url: qrcodeRes.data.packageExtra.replace('code_url=', ''),
-        payOrderSn: qrcodeRes.data.payOrderSn,
-      }
+        payInfo.value = {
+          url: qrcodeRes.data.packageExtra.replace('code_url=', ''),
+          payOrderSn: qrcodeRes.data.payOrderSn,
+        }
 
-      /* 延迟自动取消支付查询 */
-      setTimeout(
-        () => {
-          isPayQrcodeInvalid.value = true
-        },
-        10 * 60 * 1000,
-      )
+        /* 延迟自动取消支付查询 */
+        setTimeout(
+          () => {
+            isPayQrcodeInvalid.value = true
+          },
+          10 * 60 * 1000,
+        )
 
-      getPayStatus()
-    })
+        getPayStatus()
+      },
+    )
   })
 }
 
@@ -165,16 +172,10 @@ function getPayStatus() {
     })
   }
 
-  const timerId = setInterval(() => {
-    if (!payInfo.value.payOrderSn) {
-      clearInterval(timerId)
-      payStatusTimer = null
-      return
-    }
-
+  clearPayStatusTimer()
+  payStatusTimer = setInterval(() => {
     request()
   }, 1000)
-  payStatusTimer = timerId
 }
 
 function handlePaymentMethodSwitch(method: 'alipay' | 'wechatpay') {