feat(qrCode): 添加payId属性并优化二维码状态检查逻辑

重构qrCode组件，添加payId属性以支持从父组件传入支付ID 优化二维码状态检查逻辑，过滤无效数据并添加空状态处理调整vite配置，添加/admin代理规则

feat(qrCode): 添加payId属性并优化二维码状态检查逻辑
重构qrCode组件，添加payId属性以支持从父组件传入支付ID 优化二维码状态检查逻辑，过滤无效数据并添加空状态处理调整vite配置，添加/admin代理规则
hookehuyr
Commit ab9ab49848722276d24c4ed1b423d34195fbfc2a ab9ab498 1 parent 8d052703
Showing 3 changed files with 43 additions and 28 deletions
src/components/qrCode.vue
src/views/bookingDetail.vue
vite.config.js
--- a/src/components/qrCode.vue
View file @ab9ab49
+++ b/src/components/qrCode.vue
View file @ab9ab49
@@ -78,6 +78,10 @@ const props = defineProps({
     type: String,
     default: ''
   },
+  payId: {
+    type: String,
+    default: ''
+  },
 });
 const select_index = ref(0);
@@ -151,7 +155,9 @@ const STATUS_CODE = {
 };
 const refreshBtn = async () => {
-  const { code, data } = await qrcodeStatusAPI({ qr_code: userList.value[select_index.value].qr_code });
+  const current_item = userList.value[select_index.value];
+  if (!current_item?.qr_code) return;
+  const { code, data } = await qrcodeStatusAPI({ qr_code: current_item.qr_code });
   if (code) {
     useStatus.value = data.status;
   }
@@ -212,28 +218,31 @@ onMounted(async () => {
         item.datetime = formatDatetime({ begin_time: item.begin_time, end_time: item.end_time })
         item.sort = 0;
       });
-      const { code: status_code, data: status_data } = await qrcodeStatusAPI({ qr_code: data[select_index.value]?.qr_code });
+      const valid_data = data.filter(item => item.qr_code !== '');
-      if (status_code) {
+      if (valid_data.length) {
-        useStatus.value = status_data.status;
+        userList.value = formatGroup(valid_data);
-        // 剔除qr_code为空的二维码
+        refreshBtn();
-        userList.value = data.filter(item => item.qr_code !== '');
+      } else {
-        // TAG: 预约码入口的才需要分组
+        userList.value = [];
-        userList.value = formatGroup(userList.value);
       }
     }
   } else {
-    const { code, data } = await billPersonAPI({ pay_id });
+    const current_pay_id = props.payId || pay_id;
-    if (code) {
+    if (current_pay_id) {
-      data.forEach(item => {
+      const { code, data } = await billPersonAPI({ pay_id: current_pay_id });
-        // 生成二维码地址
+      if (code) {
-        item.qr_code_url = '/admin?m=srv&a=get_qrcode&key=' + item.qr_code;
+        data.forEach(item => {
-        item.sort = 0;
+          // 生成二维码地址
-      });
+          item.qr_code_url = '/admin?m=srv&a=get_qrcode&key=' + item.qr_code;
-      const { code: status_code, data: status_data } = await qrcodeStatusAPI({ qr_code: data[select_index.value]?.qr_code });
+          item.sort = 0;
-      if (status_code) {
+        });
-        useStatus.value = status_data.status;
+        const valid_data = data.filter(item => item.qr_code !== '');
-        // 剔除qr_code为空的二维码
+        if (valid_data.length) {
-        userList.value = data.filter(item => item.qr_code !== '');
+          userList.value = valid_data;
+          refreshBtn();
+        } else {
+          userList.value = [];
+        }
       }
     }
   }
--- a/src/views/bookingDetail.vue
View file @ab9ab49
+++ b/src/views/bookingDetail.vue
View file @ab9ab49
 <!--
  * @Date: 2024-01-16 13:19:23
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-01-30 16:10:10
+ * @LastEditTime: 2026-01-22 11:12:18
- * @FilePath: /xysBooking/src/views/bookingDetail.vue
+ * @FilePath: /git/xysBooking/src/views/bookingDetail.vue
  * @Description: 预约记录详情
 -->
 <template>
   <div class="booking-detail-page">
-    <qrCode :status="qrCodeStatus" type="detail"></qrCode>
+    <qrCode :status="qrCodeStatus" type="detail" :payId="pay_id"></qrCode>
     <div v-if="billInfo.pay_id" class="detail-wrapper">
       <div class="detail-item">
         <div>参访时间：</div>
--- a/vite.config.js
View file @ab9ab49
+++ b/vite.config.js
View file @ab9ab49
 /*
  * @Date: 2023-06-13 13:26:46
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-08-25 14:14:26
+ * @LastEditTime: 2026-01-22 11:28:42
- * @FilePath: /xysBooking/vite.config.js
+ * @FilePath: /git/xysBooking/vite.config.js
  * @Description: 文件描述
  */
 import vue from '@vitejs/plugin-vue';
@@ -15,16 +15,22 @@ import { defineConfig, loadEnv } from 'vite';
 import { createProxy } from './build/proxy'
 import DefineOptions from 'unplugin-vue-define-options/vite';
 import AutoImport from 'unplugin-auto-import/vite';
-import postcsspxtoviewport from 'postcss-px-to-viewport'
 var path = require('path');
-export default ({ command, mode }) => {
+export default ({ mode }) => {
   const root = process.cwd();
   const viteEnv = loadEnv(mode, root);
   // let isProd = (command === 'serve'); // 情景配置是否为开发模式 serve 或 build
+  const proxy = createProxy(viteEnv.VITE_PROXY_PREFIX, viteEnv.VITE_PROXY_TARGET);
+  proxy['/admin'] = {
+    target: viteEnv.VITE_PROXY_TARGET,
+    changeOrigin: true,
+    ws: true,
+  };
+
   return defineConfig({
     // root: '',
     // root: './src/packages', // 多页面应用配置入口根目录
@@ -130,7 +136,7 @@ export default ({ command, mode }) => {
       //     // rewrite: (path) => path.replace(/^\/api/, '')
       //   },
       // },
-      proxy: createProxy(viteEnv.VITE_PROXY_PREFIX, viteEnv.VITE_PROXY_TARGET),
+      proxy,
       // cors: '', // 为开发服务器配置 CORS。默认启用并允许任何源，传递一个 选项对象 来调整行为或设为 false 表示禁用。
       // force: '', // 设置为 true 强制使依赖预构建。
       // hmr: '', // 禁用或配置 HMR 连接（用于 HMR websocket 必须使用不同的 http 服务器地址的情况）。 设置 server.hmr.overlay 为 false 可以禁用服务器错误遮罩层。