feat: 酒店的日期选择调整

src/components/Calender/index.vue

@@ -50,7 +50,13 @@
                     {{ dateInfo.label }}
                   </text>
                   <text class="date-number">{{ dateInfo.day }}</text>
-                  <text class="date-price" v-if="dateInfo.price !== null && dateInfo.price !== undefined">¥{{ dateInfo.price }}</text>
+                  <text
+                    class="date-price"
+                    v-if="
+                      dateInfo.price !== null && dateInfo.price !== undefined
+                    "
+                    >¥{{ dateInfo.price }}</text
+                  >
                 </template>
               </view>
             </view>
@@ -253,7 +259,7 @@ const generateCalendarGrid = (year, month) => {
   // 填充日期
   for (let day = 1; day <= daysInMonth; day++) {
     const dateStr = `${year}-${String(month).padStart(2, "0")}-${String(
-      day
+      day,
     ).padStart(2, "0")}`;
     const priceItem = getPriceItem(dateStr);
     grid.push({
@@ -344,7 +350,11 @@ const getDateCellClass = (dateInfo) => {
   if (dateInfo.selected) classes.push("date-cell-selected");
   if (dateInfo.inRange) classes.push("date-cell-in-range");
   // 标注无价格但可选的日期（用于视觉区分）
-  if (dateInfo.price === null || dateInfo.price === undefined || dateInfo.price === "-") {
+  if (
+    dateInfo.price === null ||
+    dateInfo.price === undefined ||
+    dateInfo.price === "-"
+  ) {
     classes.push("date-cell-no-price");
   }
 
@@ -404,13 +414,19 @@ const handleRangeSelection = (dateInfo) => {
   if (!rangeStart.value || (rangeStart.value && rangeEnd.value)) {
     // 开始新的范围选择：当作为价格区间选择器时，开始日必须有价格且有库存
     if (props.rangeRequirePrice) {
-      const hasPrice = dateInfo.price !== null && dateInfo.price !== undefined && dateInfo.price !== "-";
+      const hasPrice =
+        dateInfo.price !== null &&
+        dateInfo.price !== undefined &&
+        dateInfo.price !== "-";
       if (!hasPrice) {
         uni.showToast({ title: "所选日期不可预订，请重新选择", icon: "none" });
         return;
       }
       if (dateInfo.stock !== undefined && Number(dateInfo.stock) <= 0) {
-        uni.showToast({ title: "所选日期库存不足，请选择其他日期", icon: "none" });
+        uni.showToast({
+          title: "所选日期库存不足，请选择其他日期",
+          icon: "none",
+        });
         return;
       }
     }
@@ -421,11 +437,16 @@ const handleRangeSelection = (dateInfo) => {
     return;
   }
 
-  // 否则为结束日期（完成选择）——结束日允许无价格（如为紧接有价日的下一天），但区间内的夜晚必须有价格
+  // 否则为结束日期（完成选择）
+  if (rangeStart.value === dateInfo.date) {
+    uni.showToast({ title: "离店日期不能与入住日期相同", icon: "none" });
+    return;
+  }
+
   rangeEnd.value = dateInfo.date;
   isRangeSelecting.value = false;
 
-  // 允许选择相同日期，但确保开始日期不大于结束日期
+  // 确保开始日期不大于结束日期
   if (new Date(rangeStart.value) > new Date(rangeEnd.value)) {
     [rangeStart.value, rangeEnd.value] = [rangeEnd.value, rangeStart.value];
   }
@@ -433,7 +454,11 @@ const handleRangeSelection = (dateInfo) => {
   // 检查日期跨度是否超过28天
   const daysBetween = calculateDaysBetween(rangeStart.value, rangeEnd.value);
   if (daysBetween > 28) {
-    uni.showToast({ title: "预定时间不能超过28天", icon: "none", duration: 3000 });
+    uni.showToast({
+      title: "预定时间不能超过28天",
+      icon: "none",
+      duration: 3000,
+    });
     rangeStart.value = null;
     rangeEnd.value = null;
     isRangeSelecting.value = false;
@@ -443,9 +468,14 @@ const handleRangeSelection = (dateInfo) => {
   // 如果作为价格区间选择器，验证夜晚（不包含离店日）是否都有价格/库存
   if (props.rangeRequirePrice) {
     const nights = generateNightsRange(rangeStart.value, rangeEnd.value);
-    const missing = nights.find((d) => d.price === null || d.price === undefined || d.price === "-");
+    const missing = nights.find(
+      (d) => d.price === null || d.price === undefined || d.price === "-",
+    );
     if (missing) {
-      uni.showToast({ title: "所选区间包含无价格日期，请重新选择", icon: "none" });
+      uni.showToast({
+        title: "所选区间包含无价格日期，请重新选择",
+        icon: "none",
+      });
       rangeStart.value = null;
       rangeEnd.value = null;
       return;
@@ -456,7 +486,10 @@ const handleRangeSelection = (dateInfo) => {
       return item && item.stock !== undefined && Number(item.stock) <= 0;
     });
     if (badStock) {
-      uni.showToast({ title: "所选区间包含库存不足的日期，请重新选择", icon: "none" });
+      uni.showToast({
+        title: "所选区间包含库存不足的日期，请重新选择",
+        icon: "none",
+      });
       rangeStart.value = null;
       rangeEnd.value = null;
       return;
@@ -551,7 +584,7 @@ watch(
       popup.value?.close();
     }
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 // 生命周期钩子

src/components/UseDateRange/index.vue

@@ -1,22 +1,25 @@
 <template>
   <view class="bg-white rounded-12 overflow-hidden mb-12">
-    <view
+    <view class="border-box font-size-16 font-500 color-000 line-height-24 p-12"
-      class="border-box font-size-16 font-500 color-000 line-height-24 p-12"
       >使用日期</view
     >
-    <view class="flex flex-items-center border-box ">
+    <view class="flex flex-items-center border-box">
       <scroll-view class="date-scroll" scroll-x>
         <view class="date-list">
-          <block v-for="(item) in dates" :key="item.date">
+          <block v-for="item in openDateRangeList" :key="item.date">
             <view
               class="date-item"
               :class="{ selected: isSameDate(selectedDate, item.date) }"
               @click="onDateClick(item)"
             >
-              <view class="label font-size-12">{{ item.label }}</view>
+              <view class="label font-size-12">{{ item.weekDesc }}</view>
-              <view class="md font-size-16 font-600">{{ formatMD(item.date) }}</view>
+              <view class="md font-size-16 font-600">{{
-              <view class="status font-size-12">可订</view>
+                formatMD(item.date)
-              <view v-if="isSameDate(selectedDate, item.date)" class="check">✔</view>
+              }}</view>
+              <view class="status font-size-12">{{ item.canOrder }}</view>
+              <view v-if="isSameDate(selectedDate, item.date)" class="check"
+                >✔</view
+              >
             </view>
           </block>
         </view>
@@ -26,50 +29,35 @@
 </template>
 
 <script setup>
-import { ref, onMounted, watch } from 'vue';
+import { ref, watch } from "vue";
 const props = defineProps({
   selectedDate: { type: String, default: null },
-  days: { type: Number, default: 14 }
+  openDateRangeList: { type: Array, default: () => [] },
 });
-const emit = defineEmits(['update:selectedDate']);
+const emit = defineEmits(["update:selectedDate"]);
-
-const dates = ref([]);
 const selectedDate = ref(props.selectedDate);
 
-watch(() => props.selectedDate, (v) => {
+watch(
-  selectedDate.value = v;
+  () => props.selectedDate,
-});
+  (v) => {
-
+    selectedDate.value = v;
-const initDates = (days = props.days) => {
+  },
-  const arr = [];
+);
-  const today = new Date();
-  for (let i = 0; i < days; i++) {
-    const d = new Date(today);
-    d.setDate(today.getDate() + i);
-    const iso = d.toISOString().slice(0, 10);
-    arr.push({ date: iso, day: i, disabled: false, label: getLabel(i, d) });
-  }
-  dates.value = arr;
-}
-
-const getLabel = (i, d) => {
-  if (i === 0) return '今天';
-  if (i === 1) return '明天';
-  const week = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
-  return week[d.getDay()];
-}
-
-const formatMD = (dateStr) => {
-  const d = new Date(dateStr);
-  const mm = String(d.getMonth() + 1).padStart(2, '0');
-  const dd = String(d.getDate()).padStart(2, '0');
-  return `${mm}-${dd}`;
-}
 
 const isSameDate = (a, b) => {
   if (!a || !b) return false;
   return a === b;
-}
+};
+
+// 格式化展示日期，将 2026-04-13 转换为 04-13
+const formatMD = (dateStr) => {
+  if (!dateStr || typeof dateStr !== "string") return "";
+  const parts = dateStr.split("-");
+  if (parts.length >= 3) {
+    return `${parts[1]}-${parts[2]}`;
+  }
+  return dateStr;
+};
 
 const onDateClick = (item) => {
   const date = item.date;
@@ -78,9 +66,9 @@ const onDateClick = (item) => {
   } else {
     selectedDate.value = date;
   }
-  emit('update:selectedDate', selectedDate.value);
+  console.log("selectedDate:", selectedDate.value);
-}
+  emit("update:selectedDate", selectedDate.value);
-onMounted(() => initDates());
+};
 </script>
 
 <style scoped lang="scss">

src/pages-booking/components/ConactSection/index.vue

@@ -16,7 +16,12 @@
     </view>
   </view>
 
-  <UseDateRange v-if="reservationEnabled" v-model:selectedDate="reservationDate"/>
+   <!-- 使用日期 -->
+  <UseDateRange 
+    v-if="orderData.reservationEnabled" 
+    :openDateRangeList="orderData.openDateRangeList"  
+    v-model:selectedDate="reservationDate"
+    />
 
   <!-- 联系方式 -->
   <view class="bg-white rounded-12 overflow-hidden">
@@ -57,9 +62,9 @@ const props = defineProps({
     type: String,
     default: null,
   },
-  reservationEnabled: {
+  orderData: {
-    type: Boolean,
+    type: Object,
-    default: false,
+    default: () => ({}),
   },
 });
 

src/pages-booking/index.vue

@@ -70,7 +70,7 @@
         v-model="quantity"
         :userFormList="userFormList"
         v-model:reservationDate="selectedReservationDate"
-        :reservationEnabled="orderData.reservationEnabled"
+        :orderData="orderData"
       />
 
       <!-- 酒店类型 -->

src/pages-order/order/detail.vue

@@ -5,7 +5,7 @@
     <view class="order-detail-wrapper border-box flex-full overflow-hidden scroll-y">
       <OrderStatusInfo :orderData="orderData" />
 
-      <VoucherList v-if="orderData.orderStatus === '2'" :orderData="orderData" @selected="handleSelectedVoucher" />
+      <VoucherList v-if="orderData.orderType != 0 && orderData.orderStatus === '2'" :orderData="orderData" @selected="handleSelectedVoucher" />
 
       <AmtSection :orderData="orderData" @click="refundVisible = true" />