fix(booking): 修复日期选择逻辑和空数据情况处理

修复日期选择时未判空导致的潜在错误
处理日期数据为空时周历显示问题
添加日期索引作为循环key提高性能

 <!--
 <!--
  * @Date: 2024-01-15 13:35:51
  * @Date: 2024-01-15 13:35:51
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2026-01-22 10:56:01
+ * @LastEditTime: 2026-01-22 11:03:35
  * @FilePath: /git/xysBooking/src/views/booking.vue
  * @FilePath: /git/xysBooking/src/views/booking.vue
  * @Description: 预约页面
  * @Description: 预约页面
 -->
 -->
@@ -17,12 +17,12 @@
           <div v-for="day in daysOfWeek" :key="day" class="item">{{ day }}</div>
           <div v-for="day in daysOfWeek" :key="day" class="item">{{ day }}</div>
         </div>
         </div>
         <div class="weeks-wrapper">
         <div class="weeks-wrapper">
-          <div v-for="(week, index) in weeks" :key="week" class="weeks">
-            <div v-for="date in week" :key="date"
+          <div v-for="(week, index) in weeks" :key="index" class="weeks">
+            <div v-for="(date, dateIndex) in week" :key="dateIndex"
               @click="chooseDay(date)"
               @click="chooseDay(date)"
               :class="[ 'item',
               :class="[ 'item',
-                checked_day === findDatesInfo(date).date ? 'checked' : '',
-                findDatesInfo(date).reserve_full === ReserveStatus.FULL || findDatesInfo(date).reserve_full === ReserveStatus.OVERDUE ? 'disabled' : ''
+                date && checked_day === findDatesInfo(date).date ? 'checked' : '',
+                date && (findDatesInfo(date).reserve_full === ReserveStatus.FULL || findDatesInfo(date).reserve_full === ReserveStatus.OVERDUE) ? 'disabled' : ''
               ]"
               ]"
             >
             >
               <div v-if="findDatesInfo(date).date">
               <div v-if="findDatesInfo(date).date">
@@ -97,7 +97,7 @@
 </template>
 </template>
 
 
 <script setup>
 <script setup>
-import { ref } from 'vue'
+import { ref, computed, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useRoute, useRouter } from 'vue-router'
 import { showSuccessToast, showFailToast, showToast } from 'vant';
 import { showSuccessToast, showFailToast, showToast } from 'vant';
 import { Cookies, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
 import { Cookies, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
@@ -174,6 +174,7 @@ const daysOfWeek = ["周一", "周二", "周三", "周四", "周五", "周六",
  * @return {array} [array]
  * @return {array} [array]
  */
  */
 const weeks = computed(() => {
 const weeks = computed(() => {
+  if (dates.value.length === 0) return [];
   const result = [];
   const result = [];
   let currentWeek = [];
   let currentWeek = [];
   let currentDate = new Date(dates.value[0]);
   let currentDate = new Date(dates.value[0]);
@@ -203,6 +204,9 @@ const weeks = computed(() => {
 
 
   // 添加最后一行
   // 添加最后一行
   if (currentWeek.length > 0) {
   if (currentWeek.length > 0) {
+    while (currentWeek.length < 7) {
+      currentWeek.push('');
+    }
     result.push(currentWeek);
     result.push(currentWeek);
   }
   }
 
 
@@ -242,12 +246,14 @@ const QtyStatus = {
 }
 }
 
 
 const chooseDay = async (date) => { // 点击日期回调
 const chooseDay = async (date) => { // 点击日期回调
-  if (findDatesInfo(date).reserve_full === ReserveStatus.AVAILABLE || findDatesInfo(date).reserve_full === ReserveStatus.INFINITY) { // 状态 1可约 || -1不限制
+  if (!date) return;
+  const info = findDatesInfo(date);
+  if (info.reserve_full === ReserveStatus.AVAILABLE || info.reserve_full === ReserveStatus.INFINITY) { // 状态 1可约 || -1不限制
     checked_day.value = date; // 当前日期
     checked_day.value = date; // 当前日期
-    checked_day_reserve_full.value = findDatesInfo(date).reserve_full; // 当前状态
-    if (findDatesInfo(date).reserve_full === ReserveStatus.AVAILABLE) {
+    checked_day_reserve_full.value = info.reserve_full; // 当前状态
+    if (info.reserve_full === ReserveStatus.AVAILABLE) {
       // 选择日期后，查询时间段信息
       // 选择日期后，查询时间段信息
-      const { code, data } = await canReserveTimeListAPI({ month_date: checked_day.value});
+      const { code, data } = await canReserveTimeListAPI({ month_date: checked_day.value });
       if (code) {
       if (code) {
         // rest_qty >0表示有余量，可约；=0表示没有余量，不可约；<0表示不限，可约；
         // rest_qty >0表示有余量，可约；=0表示没有余量，不可约；<0表示不限，可约；
         timePeriod.value = data;
         timePeriod.value = data;