新增防抖 修改暂无数据内容

src/utils/util.ts

@@ -6,3 +6,11 @@ export const serialize = (data: Record<string, any>) => {
   })
   return list.join('&')
 }
+
+export function useDebounceFn<T extends (...args: any[]) => void>(fn: T, delay = 800) {
+  let timer: number | null = null
+  return (...args: Parameters<T>) => {
+    if (timer) clearTimeout(timer)
+    timer = window.setTimeout(() => fn(...args), delay)
+  }
+}

src/views/invoice-information/detail.vue

@@ -43,18 +43,7 @@
       </div>
 
       <!-- 无数据 -->
-      <div v-else class="empty">
-        暂无税费数据
-        <van-button
-          size="small"
-          type="primary"
-          plain
-          style="margin-top: 3vw"
-          @click="getInvoiceTax"
-        >
-          重新加载
-        </van-button>
-      </div>
+      <div v-else class="empty">暂无税费数据</div>
     </div>
 
     <!-- 底部栏 -->
@@ -74,13 +63,16 @@ import type {
   InvoiceTaxDetailApiResponse,
   InvoiceTaxDetailItem,
 } from '@/services/modules/invoiceInformation/type.d.ts'
+import { useUserStore } from '@/stores/modules/user'
+
+const userStore = useUserStore()
 
 const loading = ref(true)
 const taxList = ref<(InvoiceTaxDetailItem & { open: boolean })[]>([])
 const totalAmount = ref('0.00')
 
 const params = reactive<PushRecordIdRequest>({
-  pushRecordId: '12345',
+  pushRecordId: userStore.pushRecordId,
 })
 
 const toggle = (index: number) => {

src/views/invoice-information/index.vue

@@ -73,7 +73,9 @@
             <div class="info-item">
               <span class="label">应税发生地</span>
               <span class="value">{{
-                invoiceInfo?.province + ' ' + invoiceInfo?.city + ' ' + invoiceInfo?.district
+                [invoiceInfo?.province, invoiceInfo?.city, invoiceInfo?.district]
+                  .filter(Boolean)
+                  .join(' ')
               }}</span>
             </div>
             <div class="info-item">
@@ -82,7 +84,7 @@
             </div>
             <div class="info-item">
               <span class="label">税前金额</span>
-              <span class="value highlight">505.00</span>
+              <span class="value highlight">{{ invoiceInfo?.amount }}</span>
             </div>
           </div>
         </div>
@@ -111,7 +113,7 @@
         round
         color="linear-gradient(90deg, #ff7a00, #ffa94d)"
         class="next-btn"
-        @click="nextBtn"
+        @click="handleNext"
       >
         下一步
       </van-button>
@@ -147,6 +149,7 @@
 
 <script setup lang="ts">
 import { useRouter } from 'vue-router'
+import { useDebounceFn } from '@/utils/util'
 import {
   getConfirmInvoiceInfoApi,
   getStatusApi,
@@ -156,19 +159,24 @@ import type { PushRecordIdRequest } from '@/services/modules/invoiceInformation/
 import { reactive, onMounted, ref } from 'vue'
 import StepProgress from '@/components/StepProgress.vue'
 import { showToast } from 'vant'
+import { useUserStore } from '@/stores/modules/user'
+
+const userStore = useUserStore()
 
 const router = useRouter()
 const loading = ref(true)
 const invoiceInfo = ref<any>({})
 
 const params = reactive<PushRecordIdRequest>({
-  pushRecordId: '12345',
+  pushRecordId: userStore.pushRecordId,
 })
 
 const getConfirmInvoiceInfo = async () => {
   try {
     loading.value = true
     const res = await getConfirmInvoiceInfoApi(params)
+    console.log('res', res)
+
     if (res.code === 0) {
       invoiceInfo.value = res.data
     }
@@ -179,10 +187,8 @@ const getConfirmInvoiceInfo = async () => {
   }
 }
 
-const nextBtn = async () => {
+const handleNext = useDebounceFn(async () => {
   const res = await getStatusApi(params)
-  console.log('res', res)
-
   if (res.code === 0) {
     if (!res.data.eventStatus) {
       return router.push({
@@ -196,7 +202,7 @@ const nextBtn = async () => {
       })
     }
   }
-}
+}, 1000)
 
 const showDialog = ref(false)
 const submitInvoiceApply = async () => {