新增支付等待页

 /*
  * @Date: 2023-06-13 13:26:46
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-16 16:07:48
+ * @LastEditTime: 2024-01-19 21:59:56
  * @FilePath: /xysBooking/src/route.js
  * @Description: 路由列表
  */
@@ -77,6 +77,13 @@ export default [
     },
   },
   {
+    path: '/waiting',
+    component: () => import('@/views/waiting.vue'),
+    meta: {
+      title: '支付中',
+    },
+  },
+  {
     path: '/auth',
     component: () => import('@/views/auth.vue'),
     meta: {

@@ -2,14 +2,14 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2022-05-28 10:17:40
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-17 15:14:04
+ * @LastEditTime: 2024-01-20 08:05:56
  * @FilePath: /xysBooking/src/utils/axios.js
  * @Description:
  */
 import axios from 'axios';
 import router from '@/router';
-import qs from 'Qs'
-import { strExist } from '@/utils/tools'
+// import qs from 'Qs'
+// import { strExist } from '@/utils/tools'
 // import { parseQueryString } from '@/utils/tools'
 
 axios.defaults.params = {

 <!--
  * @Date: 2024-01-16 13:19:23
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-19 19:25:47
+ * @LastEditTime: 2024-01-19 21:53:06
  * @FilePath: /xysBooking/src/views/bookingDetail.vue
  * @Description: 文件描述
 -->
@@ -31,7 +31,7 @@
       </div>
     </div>
     <div style="height: 5rem;"></div>
-    <div v-if="status === '预约成功'" class="cancel-wrapper">
+    <div v-if="billInfo.status === '3'" class="cancel-wrapper">
       <div @click="cancelBooking" class="cancel-btn ">取消预约</div>
     </div>
   </div>

 <!--
  * @Date: 2024-01-16 11:37:10
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-19 19:04:27
+ * @LastEditTime: 2024-01-19 21:55:03
  * @FilePath: /xysBooking/src/views/bookingList.vue
  * @Description: 文件描述
 -->
@@ -85,7 +85,7 @@ const formatStatus = (status) => {
       }
     case '11':
       return {
-        key: 'used',
+        key: 'cancel',
         value: '退款中'
       }
   }

+<!--
+ * @Date: 2024-01-19 21:57:50
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2024-01-20 07:01:38
+ * @FilePath: /xysBooking/src/views/waiting.vue
+ * @Description: 文件描述
+-->
+<template>
+  <div class="waiting-page">
+    <div class="waiting-content">
+      <div>
+        <van-icon name="clock-o" size="2.5rem" color="#A67939" />
+      </div>
+      <div style="margin: 1rem 0;">支付中...</div>
+      <div>{{ current.seconds }} s</div>
+      <div style="margin: 1.5rem 0; font-size: 0.85rem; color: #A67939; text-align: center; line-height: 2;">
+        温馨提示：支付可能需要10s左右，请耐心等待<br />
+      </div>
+    </div>
+    <div class="go-back-wrapper">
+      <div @click="goBackBtn" class="button" style="background-color: #A67939;">返回首页</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import { useCountDown } from '@vant/use';
+import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
+//import { } from '@/utils/generateModules.js'
+//import { } from '@/utils/generateIcons.js'
+//import { } from '@/composables'
+import { showSuccessToast, showFailToast, showToast } from 'vant';
+import { useGo } from '@/hooks/useGo'
+const $route = useRoute();
+const $router = useRouter();
+useTitle($route.meta.title);
+
+const go = useGo();
+
+const countDown = useCountDown({
+  time: 10 * 1000,
+});
+
+// 开始倒计时
+countDown.start();
+
+const current = countDown.current;
+
+onMounted(() => {
+  const timer = setInterval(() => {
+    if (!current.value.seconds) {
+      clearInterval(timer);
+    }
+    // TODO：轮询支付回调
+    if (current.value.seconds === 3) {
+      console.warn('支付成功');
+      // 预约成功页面
+      // go('/success', { pay_id: 'test' });
+    }
+  }, 1000);
+  onUnmounted(() => {
+    clearInterval(timer);
+  })
+});
+
+const goBackBtn = () => {
+  go('/');
+}
+</script>
+
+<style lang="less" scoped>
+.waiting-page {
+  .waiting-content {
+    display: flex;
+    // justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    margin-top: 10vh;
+    background-color: #FFF;
+    margin: 1rem;
+    border-radius: 8px;
+    padding: 3rem 0;
+    height: 40vh;
+  }
+  .go-back-wrapper {
+    position: fixed;
+    bottom: 0;
+    height: 5rem;
+    width: 100vw;
+    display: flex;
+    left: 0;
+    background-color: #FFF;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0rem -0.33rem 0.25rem 0rem rgba(0,0,0,0.12);
+    .button {
+      color: #FFF;
+      padding: 0.85rem 0;
+      border-radius: 8px;
+      font-size: 1.1rem;
+      text-align: center;
+      flex-grow: 1;
+      margin: 1rem;
+    }
+  }
+}
+</style>