订单日期选择功能完善

 <!--
  * @Date: 2023-12-14 10:04:23
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-12-15 10:48:55
+ * @LastEditTime: 2023-12-21 11:34:17
  * @FilePath: /meihuaApp/src/components/calendarSelect.vue
  * @Description: 文件描述
 -->
@@ -161,6 +161,7 @@ const themeVars = reactive({
 });
 
 onMounted(() => {
+  emit('on-dates-change', { startDate: state.checkinDate, endDate: state.checkoutDate, betweenDate: state.betweenDate, startDateWeek: JSON.stringify(getDayOfWeek(state.checkinDate)), endDateWeek: JSON.stringify(getDayOfWeek(state.checkoutDate)) });
 })
 
 const openSwitch = (param) => {
@@ -180,7 +181,7 @@ const setChooseValue = (param) => {
   state.checkoutDate = param[1][3];
   state.defaultDate = [state.checkinDate, state.checkoutDate];
   state.betweenDate = getDayDifference(state.checkinDate, state.checkoutDate);
-  emit('on-dates-change', { startDate: state.checkinDate, endDate: state.checkoutDate });
+  emit('on-dates-change', { startDate: state.checkinDate, endDate: state.checkoutDate, betweenDate: state.betweenDate, startDateWeek: JSON.stringify(getDayOfWeek(state.checkinDate)), endDateWeek: JSON.stringify(getDayOfWeek(state.checkoutDate)) });
 };
 
 

 <!--
  * @Date: 2023-12-13 13:42:23
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-12-20 10:57:44
+ * @LastEditTime: 2023-12-21 11:09:22
  * @FilePath: /meihuaApp/src/components/roomCard.vue
  * @Description: 房间详情组件
 -->
@@ -11,12 +11,12 @@
     <view class="room-info">
       <nut-row>
         <nut-col span="18" class="room-info-left">
-          <view style="color: #0B0B0B; font-weight: bold;">非凡魅力豪华总统套房</view>
-          <view style="color: #7D7C7C; font-size: 0.8rem;">两室 宜住3人</view>
+          <view class="room-info-title">非凡魅力豪华总统套房</view>
+          <view class="room-info-desc">两室 宜住3人</view>
         </nut-col>
         <nut-col span="6" class="room-info-right">
-          <view style="float: right; color: #EB2E2E; font-weight: bold; font-size: 1.1rem;">￥980</view>
-          <view style="float: right; color: #7D7C7C; font-size: 0.8rem; text-decoration: line-through;">￥1280</view>
+          <view class="room-info-discount">￥980</view>
+          <view class="room-info-price">￥1280</view>
         </nut-col>
       </nut-row>
     </view>
@@ -33,9 +33,9 @@ import { ref, defineProps, onMounted } from 'vue'
 import Taro from '@tarojs/taro'
 
 const props = defineProps({
-  status: {
-    type: String,
-    default: '',
+  data: {
+    type: Object,
+    default: {},
   },
 });
 
@@ -46,7 +46,7 @@ const handleTap = () => {
 }
 
 onMounted(() => {
-  console.warn('房间详情的状态属性', props.status);
+  console.warn('房间详情的属性', props.data);
 })
 
 </script>
@@ -66,6 +66,28 @@ onMounted(() => {
   }
   .room-info {
     padding: 0.5rem;
+    .room-info-left {
+      .room-info-title {
+        color: #0B0B0B; font-weight: bold;
+      }
+      .room-info-desc {
+        color: #7D7C7C; font-size: 0.8rem;
+      }
+    }
+    .room-info-right {
+      .room-info-discount {
+        float: right;
+        color: #EB2E2E;
+        font-weight: bold;
+        font-size: 1.1rem;
+      }
+      .room-info-price {
+        float: right;
+        color: #7D7C7C;
+        font-size: 0.8rem;
+        text-decoration: line-through;
+      }
+    }
   }
   .room-status {
     width: 100%;

 <!--
  * @Date: 2022-09-19 14:11:06
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-12-20 15:13:49
+ * @LastEditTime: 2023-12-21 11:31:46
  * @FilePath: /meihuaApp/src/pages/confirm/index.vue
  * @Description: 确认订单页面
 -->
@@ -33,7 +33,7 @@
         <nut-col span="9" class="calendar-select-left">
           <view class="text">入住日期</view>
           <view class="date">
-            {{ booking_info.check_in.year }}.{{ booking_info.check_in.month }}.{{ booking_info.check_in.day }} 星期{{ booking_info.check_in.day_of_week }}
+            {{ booking_info.check_in.year }}.{{ booking_info.check_in.month }}.{{ booking_info.check_in.day }} {{ booking_info.check_in.day_of_week }}
           </view>
         </nut-col>
         <nut-col span="5" class="calendar-select-center">
@@ -42,7 +42,7 @@
         <nut-col span="9" class="calendar-select-right">
           <view class="text">退房日期</view>
           <view class="date">
-            {{ booking_info.check_out.year }}.{{ booking_info.check_out.month }}.{{ booking_info.check_out.day }} 星期{{ booking_info.check_out.day_of_week }}
+            {{ booking_info.check_out.year }}.{{ booking_info.check_out.month }}.{{ booking_info.check_out.day }} {{ booking_info.check_out.day_of_week }}
           </view>
         </nut-col>
       </nut-row>
@@ -151,16 +151,16 @@ import payCard from '@/components/payCard.vue'
 const booking_info = ref({
   days: 1, // 入住天数
   check_in: {
-    year: '2023',
-    month: '12',
-    day: '07',
-    day_of_week: '四'
+    year: '',
+    month: '',
+    day: '',
+    day_of_week: ''
   },
   check_out: {
-    year: '2023',
-    month: '12',
-    day: '08',
-    day_of_week: '五'
+    year: '',
+    month: '',
+    day: '',
+    day_of_week: ''
   },
 });
 
@@ -192,8 +192,24 @@ const show_pay = ref(false);
 const payData = ref({});
 
 onMounted(() => {
-  const { id } = getCurrentPageParam();
-  console.log(id);
+  const { id, start_date, end_date, between_date, start_date_week, end_date_week } = getCurrentPageParam();
+  // console.log(id, start_date, end_date, between_date, start_date_week, end_date_week );
+  booking_info.value.days = between_date;
+  let check_in = start_date.split('-');
+  let check_out = end_date.split('-');
+  //
+  booking_info.value.check_in = {
+    year: check_in[0],
+    month: check_in[1],
+    day: check_in[2],
+    day_of_week: JSON.parse(start_date_week)
+  }
+  booking_info.value.check_out = {
+    year: check_out[0],
+    month: check_out[1],
+    day: check_out[2],
+    day_of_week: JSON.parse(end_date_week)
+  }
 });
 
 const goPay = () => {

 <!--
  * @Date: 2022-09-19 14:11:06
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-12-20 11:19:46
+ * @LastEditTime: 2023-12-21 11:21:04
  * @FilePath: /meihuaApp/src/pages/detail/index.vue
  * @Description: 房间详情页面
 -->
@@ -63,15 +63,25 @@ const showBook = computed(() => {
   return book_status.value !== '已约满'
 });
 
-const onDatesChange = ({ startDate, endDate }) => {
-  console.warn(startDate, endDate);
+const start_date = ref('');
+const end_date = ref('');
+const between_date = ref('');
+const start_date_week = ref('');
+const end_date_week = ref('');
+
+const onDatesChange = ({ startDate, endDate, betweenDate, startDateWeek, endDateWeek }) => {
+  start_date.value = startDate;
+  end_date.value = endDate;
+  start_date_week.value = startDateWeek;
+  end_date_week.value = endDateWeek;
+  between_date.value = betweenDate;
 }
 
 const page = ref(1);
 
 const goToConfirm = () => {
   Taro.navigateTo({
-    url: '/pages/confirm/index?id=123',
+    url: `/pages/confirm/index?id=123&start_date=${start_date.value}&end_date=${end_date.value}&between_date=${between_date.value}&start_date_week=${start_date_week.value}&end_date_week=${end_date_week.value}`,
   })
 }
 

@@ -16,7 +16,7 @@
       </view>
       <view class="index-title">热门推荐</view>
       <view class="index-list">
-        <room-card v-for="(item, index) in 5" :key="index" />
+        <room-card v-for="(item, index) in room_list" :key="index" :data="item" />
       </view>
     </scroll-view>
     <view style="height: 6rem;"></view>
@@ -140,11 +140,19 @@ export default {
       const navHeight = await $('#navbar-page').height();
       this.indexCoverHeight = windowHeight - navHeight;
     }, 500);
+    //
+    for (let index = 0; index < 5; index++) {
+      this.room_list.push({
+        id: index,
+        status: 'enable'
+      })
+    }
   },
   data() {
     return {
       indexCoverHeight: 0,
       scrollTop: 0,
+      room_list: [],
       flag: true,
       page: 0,
       limit: 10,