feat: 商品详情调整

src/pages/goods/components/GoodFacility/index.vue

@@ -0,0 +1,47 @@
+<template>
+  <view class="mt-16">
+    <view
+      v-for="(moduleItem, index) in goodsData.commodityPurchaseInstruction
+        .commodityPurchaseInstructionModuleEntityList"
+      :key="index"
+    >
+      <view
+        class="flex flex-items-start flex-col pt-12 pb-12"
+        :class="{
+          'border-bottom':
+            index <
+            goodsData.commodityPurchaseInstruction
+              .commodityPurchaseInstructionModuleEntityList.length -
+              1,
+        }"
+      >
+        <view class="flex flex-items-center flex-row flex-shrink-0 mr-8">
+          <uni-icons fontFamily="znicons" size="20" color="#171717">{{
+            zniconsMap[moduleItem.moduleIcon]
+          }}</uni-icons>
+          <text class="font-size-12 color-171717 line-height-20">{{
+            moduleItem.moduleTitle
+          }}</text>
+        </view>
+        <text class="flex-full font-size-12 color-525866 line-height-20 mt-4">{{
+          moduleItem.moduleContent
+        }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { zniconsMap } from "@/static/fonts/znicons.js";
+import { defineProps } from "vue";
+
+// Props定义
+const props = defineProps({
+  goodsData: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+</script>
+
+<style scoped lang="scss"></style>

src/pages/goods/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <view class="goods-container">
+  <view class="goods-container bg-gray">
     <TopNavBar title="商品详情" />
 
     <!-- 滚动区域 -->
@@ -29,6 +29,9 @@
           :nights="selectedDate.totalDays"
         />
 
+        <!-- 商品设施组件 -->
+        <GoodFacility :goodsData="goodsData" />
+
         <!-- 商品详情组件 -->
         <GoodDetail :goodsData="goodsData" />
       </view>
@@ -79,6 +82,7 @@ import Calender from "@/components/Calender/index.vue";
 import LocationCard from "@/components/LocationCard/index.vue";
 import DateSelector from "./components/DateSelector/index.vue";
 import GoodDetail from "@/components/GoodDetail/index.vue";
+import GoodFacility from "./components/GoodFacility/index.vue";
 
 const calendarVisible = ref(false);
 const goodsData = ref({});