feat: 商品详情交互开发

components/Calender/index.vue

@@ -1,5 +1,10 @@
 <template>
-  <uni-popup ref="popup" type="bottom" @maskClick="handleMaskClick">
+  <uni-popup
+    ref="popup"
+    type="bottom"
+    :safe-area="false"
+    @maskClick="handleMaskClick"
+  >
     <!-- 弹窗主体 -->
     <view class="calendar-popup" @tap.stop>
       <!-- 头部区域 -->
@@ -7,7 +12,7 @@
         <view class="header-content">
           <text class="header-title">日历选择</text>
           <text class="header-subtitle"
-            >选择入住和离店日期，以下价格为单晚参考价</text
+            >选择住宿日期，以下价格为单晚参考价</text
           >
         </view>
         <view class="header-close" @tap="handleClose">
@@ -269,8 +274,12 @@ const getDateLabel = (dateStr) => {
     return props.customLabels[dateStr];
   }
 
-  // 为范围选择模式自动生成入住/离店标签
+  // 为范围选择模式自动生成住/离标签
   if (props.mode === "range") {
+    if (dateStr === rangeStart.value && dateStr === rangeEnd.value) {
+      // 当入住和离店是同一天时，显示"住/离"
+      return "住/离";
+    }
     if (dateStr === rangeStart.value) {
       return "入住";
     }
@@ -343,26 +352,26 @@ const handleRangeSelection = (dateInfo) => {
     rangeEnd.value = dateInfo.date;
     isRangeSelecting.value = false;
 
-    // 确保开始日期小于结束日期
+    // 允许选择相同日期，但确保开始日期不大于结束日期
     if (new Date(rangeStart.value) > new Date(rangeEnd.value)) {
       [rangeStart.value, rangeEnd.value] = [rangeEnd.value, rangeStart.value];
     }
 
-    // 检查日期跨度是否超过28天
+    // 检查日期跨度是否超过28天（相同日期跨度为0天，允许通过）
     const daysBetween = calculateDaysBetween(rangeStart.value, rangeEnd.value);
     if (daysBetween > 28) {
       // 使用uni.showToast显示错误提示
       uni.showToast({
-        title: '预定时间不能超过28天',
-        icon: 'none',
-        duration: 3000
+        title: "预定时间不能超过28天",
+        icon: "none",
+        duration: 3000,
       });
-      
+
       // 重置选择状态
       rangeStart.value = null;
       rangeEnd.value = null;
       isRangeSelecting.value = false;
-      
+
       return;
     }