feat: 接口数据对接

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

@@ -14,7 +14,7 @@
         {{ selectedDate.endDate }}
       </text>
     </view>
-    <view class="flex flex-items-center">
+    <view class="flex flex-items-center" @click="emit('click')">
       <text class="font-size-12 color-2D91FF line-height-16">房间详情</text>
       <uni-icons type="right" size="15" color="#99A0AE" />
     </view>
@@ -22,7 +22,7 @@
 </template>
 
 <script setup>
-import { defineProps } from "vue";
+import { defineProps, defineEmits } from "vue";
 
 // Props
 const props = defineProps({
@@ -36,6 +36,7 @@ const props = defineProps({
     },
   },
 });
+const emit = defineEmits(["click"]);
 </script>
 
 <style scoped lang="scss">

src/pages-booking/index.vue

@@ -18,31 +18,27 @@
         <DateRangeSection
           v-if="orderData.commodityTypeCode === '0'"
           :selectedDate="selectedDate"
+          @click="navigateToDetail(orderData)"
         />
 
-        <view class="font-size-16 font-500 color-000 line-height-24 ellipsis-1"
+        <view class="font-size-16 font-500 color-000 line-height-24 ellipsis-1">
-          >宽敞大床房/奶油ins风/交通便捷/投影电影/近地铁站/氛围灯/舒适温暖/出行必备/独享整套房源
+          {{ orderData.commodityName }}
         </view>
 
         <view class="border-box border-bottom">
-          <view class="font-size-12 color-99A0AE line-height-16 pb-12"
+          <view class="font-size-12 color-99A0AE line-height-16 pb-12">
-            >温泉早鸟票2张 黄南武辣子鸡2人套餐1份</view
+            {{ orderData.commodityDescription }}
-          >
+          </view>
 
           <!-- 权益部分 -->
           <view class="flex flex-items-center mb-8">
             <text
               class="bg-F7F7F7 border-box rounded-4 font-size-11 color-525866 mr-4 pt-4 pb-4 pl-6 pr-6"
-              >自助早餐券*2</text
+              v-for="(item, index) in orderData.commodityFacilityList"
-            >
+              :key="index"
-            <text
-              class="bg-F7F7F7 border-box rounded-4 font-size-11 color-525866 mr-4 pt-4 pb-4 pl-6 pr-6"
-              >自助早餐券*2</text
-            >
-            <text
-              class="bg-F7F7F7 border-box rounded-4 font-size-11 color-525866 mr-4 pt-4 pb-4 pl-6 pr-6"
-              >自助早餐券*2</text
             >
+              {{ item }}
+            </text>
           </view>
         </view>
 
@@ -64,10 +60,10 @@
       </view>
 
       <!-- 非酒店类型 -->
-      <ContactSection v-if="false" />
+      <ContactSection v-if="orderData.commodityTypeCode !== '0'" />
 
       <!-- 酒店类型 -->
-      <UserSection />
+      <UserSection v-if="orderData.commodityTypeCode === '0'" />
     </view>
 
     <!-- 底部 -->
@@ -115,9 +111,21 @@ onLoad((options) => {
 const getGoodsDetail = async (commodityId) => {
   const res = await goodsDetail({ commodityId });
 
-  if (res.code === 200) {
+  console.log("获取商品详情", res);
+
   orderData.value = res.data;
-  }
+  // 取commodityFacilityList前3个
+  orderData.value.commodityFacilityList = res.data.commodityFacilityList.slice(
+    0,
+    3
+  );
+};
+
+// 跳转商品详情
+const navigateToDetail = ({ commodityId }) => {
+  uni.navigateTo({
+    url: `/pages/goods/index?commodityId=${commodityId}`,
+  });
 };
 </script>