components/GoodDetail/index.vue

@@ -1,106 +0,0 @@
-<template>
-  <view>
-    <view v-if="goodsData.commodityPurchaseInstruction" class="use-notice">
-      <ModuleTitle
-        v-if="showTitle"
-        :title="goodsData.commodityPurchaseInstruction.templateTitle"
-      />
-      <view
-        class="use-notice-content"
-        v-for="(moduleItem, index) in goodsData.commodityPurchaseInstruction
-          .commodityPurchaseInstructionModuleEntityList"
-        :key="index"
-      >
-        <view
-          class="module-item"
-          :class="{
-            'border-bottom':
-              index <
-              goodsData.commodityPurchaseInstruction
-                .commodityPurchaseInstructionModuleEntityList.length -
-                1,
-          }"
-        >
-          <view class="module-icon">
-            <uni-icons fontFamily="znicons" size="20" color="#333">{{
-              zniconsMap[moduleItem.moduleIcon]
-            }}</uni-icons>
-            <text class="module-title">{{ moduleItem.moduleTitle }}</text>
-          </view>
-          <text class="module-desc">{{ moduleItem.moduleContent }}</text>
-        </view>
-      </view>
-    </view>
-    <zero-markdown-view
-      v-else
-      :markdown="goodsData.commodityTip"
-      :aiMode="true"
-    />
-  </view>
-</template>
-
-<script setup>
-import ModuleTitle from "@/components/ModuleTitle/index.vue";
-import { zniconsMap } from "@/static/fonts/znicons.js";
-import { defineProps } from "vue";
-
-// Props定义
-const props = defineProps({
-  goodsData: {
-    type: Object,
-    default: () => ({}),
-  },
-  showTitle: {
-    type: Boolean,
-    default: true,
-  },
-});
-</script>
-
-<style scoped lang="scss">
-@font-face {
-  font-family: znicons;
-  src: url("@/static/fonts/znicons.ttf");
-}
-
-// 使用须知样式
-.use-notice {
-  margin: 16px 0;
-}
-
-.use-notice-content {
-  .module-item {
-    display: flex;
-    align-items: flex-start;
-    flex-direction: column;
-    padding: 12px 0;
-
-    .module-icon {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      margin-right: 8px;
-      flex-shrink: 0;
-
-      .module-title {
-        font-size: 14px;
-        color: #333;
-        text-align: center;
-        word-wrap: break-word;
-        margin-left: 4px;
-      }
-    }
-
-    .module-desc {
-      flex: 1;
-      font-size: 12px;
-      color: #666;
-      line-height: 1.5;
-      margin-top: 4px;
-    }
-  }
-  .border-bottom {
-    border-bottom: 1px solid #f0f0f0;
-  }
-}
-</style>

components/LocationCard/index.vue

@@ -1,7 +1,9 @@
 <template>
   <view class="store-address" @click="openMap">
     <view class="text-container">
-      <text class="location-label">位于 {{ orderData.oneLevelAddress }} </text>
+      <text class="location-label"
+        >位于「{{ orderData.oneLevelAddress }}」
+      </text>
       <text class="address-text">{{ orderData.commodityAddress }}</text>
     </view>
     <image

components/LocationCard/styles/index.scss

@@ -1,17 +1,30 @@
 .store-address {
   display: flex;
   align-items: center;
-  margin: 6px 0;
   padding: 16px 12px;
+  background-color: #f8f9fa;
   background-image: url("./images/loc_bg_img.png"); // 预留背景图片位置，用户手动导入
   background-size: cover;
   background-position: center;
-  border-radius: 20px;
+  border-radius: 12px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
   font-size: 14px;
   color: #333;
   position: relative;
   overflow: hidden;
 
+  // 添加半透明遮罩层确保文字可读性
+  &::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(255, 255, 255, 0.8);
+    z-index: 1;
+  }
+
   // 左侧文本容器
   .text-container {
     display: flex;

pages/goods/components/DateSelector/index.vue

@@ -1,130 +0,0 @@
-<template>
-  <view class="date-selector" @click="showCalendar">
-    <view class="date-item">
-      <view class="date-label">入住日期</view>
-      <view class="date-box">
-        <view class="date-content">
-          <text class="date-text">{{ checkInDate }}</text>
-          <text class="day-text">{{ checkInDay }}</text>
-        </view>
-      </view>
-    </view>
-
-    <view class="nights-info">
-      <text class="nights-text">{{ nights }}晚</text>
-    </view>
-
-    <view class="date-item">
-      <view class="date-label">退房日期</view>
-      <view class="date-box">
-        <view class="date-content">
-          <text class="date-text">{{ checkOutDate }}</text>
-          <text class="day-text">{{ checkOutDay }}</text>
-        </view>
-      </view>
-    </view>
-  </view>
-</template>
-
-<script setup>
-import { defineProps, defineEmits } from "vue";
-
-// 定义事件
-const emit = defineEmits(["showCalendar"]);
-
-// 定义方法
-const showCalendar = () => {
-  emit("showCalendar");
-};
-
-// Props定义
-const props = defineProps({
-  checkInDate: {
-    type: String,
-    default: "08月25日",
-  },
-  checkOutDate: {
-    type: String,
-    default: "08月25日",
-  },
-  checkInDay: {
-    type: String,
-    default: "周一",
-  },
-  checkOutDay: {
-    type: String,
-    default: "周一",
-  },
-  nights: {
-    type: Number,
-    default: 1,
-  },
-});
-</script>
-
-<style scoped lang="scss">
-.date-selector {
-  display: flex;
-  align-items: flex-end;
-  justify-content: space-between;
-  margin: 24rpx 0 12rpx;
-  padding: 12rpx 0;
-}
-
-.date-item {
-  flex: 1;
-  position: relative;
-}
-
-.date-label {
-  position: absolute;
-  top: -12rpx;
-  left: 24rpx;
-  font-size: 20rpx;
-  color: #999999;
-  background: #ffffff;
-  padding: 0 8rpx;
-  z-index: 1;
-}
-
-.date-box {
-  padding: 20rpx 24rpx;
-  background: #ffffff;
-  border-radius: 16rpx;
-  border: 2rpx solid #f0f0f0;
-  display: flex;
-  align-items: center;
-  justify-content: start;
-}
-
-.date-content {
-  display: flex;
-  align-items: baseline;
-  gap: 8rpx;
-}
-
-.date-text {
-  font-size: 32rpx;
-  font-weight: 500;
-  color: #333333;
-}
-
-.day-text {
-  font-size: 20rpx;
-  color: #666666;
-}
-
-.nights-info {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  min-width: 80rpx;
-  margin: 0 16rpx;
-  margin-bottom: 20rpx;
-}
-
-.nights-text {
-  font-size: 24rpx;
-  color: #666666;
-}
-</style>

pages/goods/components/GoodInfo/index.vue

@@ -8,6 +8,20 @@
       <view class="tag-wrapper" v-if="goodsData.timeTag">
         <view class="time-tag">{{ goodsData.timeTag || "随时可退" }}</view>
       </view>
+      <!-- 日历ICON，酒店订单显示 -->
+      <uni-icons
+        class="calender-icon"
+        v-if="isShowCalendar"
+        type="calendar"
+        size="24"
+        color="#00A6FF"
+        @click="showCalendar"
+      />
+    </view>
+
+    <!-- 地址区域 -->
+    <view class="address-section">
+      <LocationCard :orderData="goodsData" />
     </view>
 
     <!-- 设施信息区域 -->
@@ -26,7 +40,11 @@
 </template>
 
 <script setup>
-import { computed, defineProps } from "vue";
+import { computed, defineProps, defineEmits } from "vue";
+import LocationCard from "@/components/LocationCard/index.vue";
+
+// 事件定义
+const emits = defineEmits(["showCalendar"]);
 
 // Props定义
 const props = defineProps({
@@ -48,6 +66,13 @@ const facilitiesList = computed(() => {
   return [];
 });
 
+// 日历弹窗
+const showCalendar = () => emits("showCalendar");
+
+// 是否显示日历按钮
+const isShowCalendar = computed(() => {
+  return props.goodsData.commodityTypeCode === "0";
+});
 </script>
 
 <style scoped lang="scss">

pages/goods/components/GoodInfo/styles/index.scss

@@ -36,6 +36,24 @@
     }
   }
 
+  // 地址区域
+  .address-section {
+    padding: 6px 0;
+
+    .address-item {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+
+      .address-text {
+        flex: 1;
+        font-size: 14px;
+        color: #333;
+        line-height: 1.4;
+      }
+    }
+  }
+
   // 设施信息区域
   .facilities-section {
     margin-top: 12px;

pages/goods/index.vue

@@ -13,24 +13,44 @@
 
       <view class="goods-content">
         <!-- 商品信息组件 -->
-        <GoodInfo :goodsData="goodsData" />
+        <GoodInfo :goodsData="goodsData" @showCalendar="showCalendar" />
 
-        <!-- 地址区域 -->
+        <view v-if="goodsData.commodityPurchaseInstruction" class="use-notice">
-        <LocationCard :orderData="goodsData" />
+          <ModuleTitle
+            :title="goodsData.commodityPurchaseInstruction.templateTitle"
+          />
+          <view
+            class="use-notice-content"
+            v-for="(moduleItem, index) in goodsData.commodityPurchaseInstruction
+              .commodityPurchaseInstructionModuleEntityList"
+            :key="index"
+          >
+            <view
+              class="module-item"
+              :class="{
+                'border-bottom':
+                  index <
+                  goodsData.commodityPurchaseInstruction
+                    .commodityPurchaseInstructionModuleEntityList.length -
+                    1,
+              }"
+            >
+              <view class="module-icon">
+                <uni-icons fontFamily="znicons" size="20" color="#333">{{
+                  zniconsMap[moduleItem.moduleIcon]
+                }}</uni-icons>
+                <text class="module-title">{{ moduleItem.moduleTitle }}</text>
+              </view>
+              <text class="module-desc">{{ moduleItem.moduleContent }}</text>
+            </view>
+          </view>
+        </view>
 
-        <!-- 日期选择区域 -->
+        <zero-markdown-view
-        <DateSelector
+          v-else
-          v-if="goodsData.commodityTypeCode === '0'"
+          :markdown="goodsData.commodityTip"
-          @showCalendar="showCalendar"
+          :aiMode="true"
-          :checkInDate="selectedDate.startDate"
-          :checkOutDate="selectedDate.endDate"
-          :checkInDay="''"
-          :checkOutDay="''"
-          :nights="selectedDate.totalDays"
         />
-
-        <!-- 商品详情组件 -->
-        <GoodDetail :goodsData="goodsData" />
       </view>
     </scroll-view>
 
@@ -73,34 +93,15 @@ import {
 import TopNavBar from "@/components/TopNavBar/index.vue";
 import ImageSwiper from "@/components/ImageSwiper/index.vue";
 import GoodInfo from "./components/GoodInfo/index.vue";
+import ModuleTitle from "@/components/ModuleTitle/index.vue";
 import GoodConfirm from "./components/GoodConfirm/index.vue";
 import Calender from "@/components/Calender/index.vue";
-import LocationCard from "@/components/LocationCard/index.vue";
+import { zniconsMap } from "@/static/fonts/znicons.js";
-import DateSelector from "./components/DateSelector/index.vue";
-import GoodDetail from "@/components/GoodDetail/index.vue";
 
 const calendarVisible = ref(false);
 const goodsData = ref({});
 const goodConfirmRef = ref(null);
-
+const selectedDate = ref();
-// 格式化日期为 yyyy-mm-dd 格式
-const formatDate = (date) => {
-  const year = date.getFullYear();
-  const month = String(date.getMonth() + 1).padStart(2, "0");
-  const day = String(date.getDate()).padStart(2, "0");
-  return `${year}-${month}-${day}`;
-};
-
-// 获取今天和明天的日期
-const today = new Date();
-const tomorrow = new Date(today);
-tomorrow.setDate(today.getDate() + 1);
-
-const selectedDate = ref({
-  startDate: formatDate(today),
-  endDate: formatDate(tomorrow),
-  totalDays: 1,
-});
 const priceData = ref([]);
 
 // 获取商品详情数据
@@ -279,4 +280,8 @@ const handleDateSelect = (data) => {
 
 <style scoped lang="scss">
 @import "./styles/index.scss";
+@font-face {
+  font-family: znicons;
+  src: url("@/static/fonts/znicons.ttf");
+}
 </style>

pages/module/detail/DetailCardGoodsContentList.vue

@@ -82,6 +82,7 @@ const placeOrderHandle = (item) => {
       flex-direction: column;
       align-items: start;
       width: 188px;
+      //   height: 244px;
       background-color: #ffffff;
       border-radius: 10px;
       margin-right: 8px;

pages/order/components/NoticeInfo/index.vue

@@ -1,13 +1,17 @@
 <template>
   <view class="notice-info mb12">
     <view class="notice-title"> 购买须知 </view>
-    <GoodDetail :goodsData="orderData" :showTitle="false" />
+
+    <zero-markdown-view
+      :markdown="orderData.commodityTip"
+      :fontSize="14"
+      :aiMode="true"
+    />
   </view>
 </template>
 
 <script setup>
 import { defineProps } from "vue";
-import GoodDetail from "@/components/GoodDetail/index.vue";
 
 const props = defineProps({
   orderData: {