From 6443b67d1502d343b819c10c6c6b3abd856bfcdc Mon Sep 17 00:00:00 2001 From: zoujing Date: Tue, 16 Sep 2025 20:39:17 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=95=86=E5=93=81=E8=AF=A6=E6=83=85?= =?UTF-8?q?=E7=9A=84=E4=BB=B7=E6=A0=BC=E7=9A=84=E8=AE=A1=E7=AE=97=E5=A4=84?= =?UTF-8?q?=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/Calender/index.vue | 48 ++++++++++-- components/Calender/styles/index.scss | 2 +- pages/goods/components/GoodConfirm/index.vue | 25 ++++++- .../components/GoodConfirm/styles/index.scss | 7 ++ pages/goods/index.vue | 73 ++++++++++++++++++- 5 files changed, 142 insertions(+), 13 deletions(-) diff --git a/components/Calender/index.vue b/components/Calender/index.vue index 9a2ffa8..b1f9fa9 100644 --- a/components/Calender/index.vue +++ b/components/Calender/index.vue @@ -93,9 +93,7 @@ const props = defineProps({ // 价格数据数组 priceData: { type: Array, - default: () => [ - {date: '', price: '-', stock: '0'} - ], + default: () => [{ date: "", price: "-", stock: "0" }], }, // 默认选中日期 @@ -209,8 +207,8 @@ const getPriceForDate = (dateStr) => { if (!props.priceData || !Array.isArray(props.priceData)) { return null; } - - const priceItem = props.priceData.find(item => item.date === dateStr); + + const priceItem = props.priceData.find((item) => item.date === dateStr); return priceItem ? priceItem.price : null; }; @@ -387,22 +385,58 @@ const handleRangeSelection = (dateInfo) => { return; } + // 生成范围内所有日期的数组 + const dateRange = generateDateRange(rangeStart.value, rangeEnd.value); + emit("range-select", { startDate: rangeStart.value, endDate: rangeEnd.value, startPrice: getPriceForDate(rangeStart.value), endPrice: getPriceForDate(rangeEnd.value), totalDays: daysBetween, + dateRange: dateRange, // 新增：范围内所有日期的数组 }); } }; +// 生成日期范围内所有日期的数组 +const generateDateRange = (startDate, endDate) => { + const dateRange = []; + const start = new Date(startDate); + const end = new Date(endDate); + + // 如果是同一天，只返回一个日期 + if (startDate === endDate) { + return [ + { + date: startDate, + price: getPriceForDate(startDate), + }, + ]; + } + + // 生成范围内所有日期 + const current = new Date(start); + while (current <= end) { + const dateStr = current.toISOString().split("T")[0]; + dateRange.push({ + date: dateStr, + price: getPriceForDate(dateStr), + }); + current.setDate(current.getDate() + 1); + } + + return dateRange; +}; + // 计算两个日期之间的天数 const calculateDaysBetween = (startDate, endDate) => { const start = new Date(startDate); const end = new Date(endDate); const diffTime = Math.abs(end - start); - return Math.ceil(diffTime / (1000 * 60 * 60 * 24)); + const days = Math.ceil(diffTime / (1000 * 60 * 60 * 24)); + // 如果是同一天，返回1天而不是0天 + return days === 0 ? 1 : days; }; // 监听visible属性变化，控制uni-popup显示 @@ -441,4 +475,4 @@ onBeforeUnmount(() => { \ No newline at end of file + diff --git a/components/Calender/styles/index.scss b/components/Calender/styles/index.scss index bba01e7..feb023d 100644 --- a/components/Calender/styles/index.scss +++ b/components/Calender/styles/index.scss @@ -1,7 +1,7 @@ // 颜色系统 $primary-color: #1890ff; $primary-light: #e6f7ff; -$primary-dark: #0050b3; +$primary-dark: #1890ff; // 中性色 $text-primary: #262626; diff --git a/pages/goods/components/GoodConfirm/index.vue b/pages/goods/components/GoodConfirm/index.vue index e1d527b..b8ea00a 100644 --- a/pages/goods/components/GoodConfirm/index.vue +++ b/pages/goods/components/GoodConfirm/index.vue @@ -39,8 +39,18 @@ }} ¥ - - {{ goodsData.specificationPrice || 399 }} + + + {{ goodsData.specificationPrice || 0 }} @@ -180,7 +194,10 @@ const isDeleting = ref(false); // 标志位，防止删除时watch冲突 // 计算属性 const totalPrice = computed(() => { - const price = props.goodsData?.specificationPrice || DEFAULT_PRICE; + const price = + props.goodsData?.commodityTypeCode === "0" + ? props.goodsData?.calculatedTotalPrice + : props.goodsData?.specificationPrice || 0; return (price * quantity.value).toFixed(0); }); diff --git a/pages/goods/components/GoodConfirm/styles/index.scss b/pages/goods/components/GoodConfirm/styles/index.scss index f763e31..9146130 100644 --- a/pages/goods/components/GoodConfirm/styles/index.scss +++ b/pages/goods/components/GoodConfirm/styles/index.scss @@ -92,6 +92,13 @@ font-weight: 600; margin-left: 2px; } + + .price-desc { + font-size: 14px; + color: #999; + font-weight: 400; + margin-left: 12px; + } } .goods-service-list { diff --git a/pages/goods/index.vue b/pages/goods/index.vue index c950bf0..4d2e025 100644 --- a/pages/goods/index.vue +++ b/pages/goods/index.vue @@ -38,7 +38,7 @@ 价格： - {{ goodsData.specificationPrice || 399 }} + {{ calculatedTotalPrice }} 立即抢购 @@ -103,20 +103,34 @@ const selectedDate = ref({ }); const priceData = ref([]); +// 计算的总价格 +const calculatedTotalPrice = ref(0); + // 获取商品详情数据 const goodsInfo = async (params) => { const res = await goodsDetail(params); goodsData.value = res.data; + // 初始化计算价格 + calculatedTotalPrice.value = goodsData.value.specificationPrice || 0; + // 判断是酒店类型订单再获取获取商品日价格及库存 if (goodsData.value.commodityTypeCode === "0") { + configGoodsData(); getGoodsDailyPrice({ commodityId: goodsData.value.commodityId, }); } }; +const configGoodsData = () => { + goodsData.value.startDate = selectedDate.value.startDate; + goodsData.value.endDate = selectedDate.value.endDate; + goodsData.value.totalDays = selectedDate.value.totalDays; + goodsData.value.calculatedTotalPrice = calculatedTotalPrice.value; +}; + // 获取商品日价格及库存 const getGoodsDailyPrice = async (params) => { const res = await commodityDailyPriceList(params); @@ -272,6 +286,63 @@ const handleDateSelect = (data) => { totalDays: data.totalDays, }; + // 根据商品类型计算价格 + if (goodsData.value.commodityTypeCode === "0") { + // 酒店类型：计算dateRange总价格，排除最后一天（同一天除外） + if (data.dateRange && Array.isArray(data.dateRange)) { + // 获取默认价格作为回退值 + const defaultPrice = Number(goodsData.value.specificationPrice) || 0; + + // 检查价格是否有效的函数 + const isValidPrice = (price) => { + return ( + price !== null && + price !== undefined && + price !== "" && + price !== "-" && + !isNaN(Number(price)) && + Number(price) > 0 + ); + }; + + // 如果是同一天（数组长度为1），使用该天的价格 + if (data.dateRange.length === 1) { + const dayPrice = data.dateRange[0].price; + calculatedTotalPrice.value = isValidPrice(dayPrice) + ? Number(dayPrice) + : defaultPrice; + console.log( + "同一天选择，价格:", + calculatedTotalPrice.value, + "(原价格:", + dayPrice, + ")" + ); + } else { + // 多天选择，排除最后一天 + const dateRangeExcludingLast = data.dateRange.slice(0, -1); + calculatedTotalPrice.value = dateRangeExcludingLast.reduce( + (total, dateItem) => { + const dayPrice = dateItem.price; + const priceToAdd = isValidPrice(dayPrice) + ? Number(dayPrice) + : defaultPrice; + return total + priceToAdd; + }, + 0 + ); + console.log( + "酒店类型计算总价格(排除最后一天):", + calculatedTotalPrice.value + ); + } + configGoodsData(); + } + } else { + // 非酒店类型：如果没有dateRange，使用默认价格 + calculatedTotalPrice.value = goodsData.value.specificationPrice || 0; + } + // 日历组件会自动关闭，无需手动设置 calendarVisible.value = false; };