zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 商品详情的价格的计算处理

Browse Source
This commit is contained in:
zoujing
2025-09-16 20:39:17 +08:00
parent 8d0c93206b
commit 6443b67d15
5 changed files with 142 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
components/Calender/index.vue
View File

@@ -93,9 +93,7 @@ const props = defineProps({
// 价格数据数组
priceData: {
type: Array,
default: () => [
{date: '', price: '-', stock: '0'}
],
default: () => [{ date: "", price: "-", stock: "0" }],
},
// 默认选中日期
@@ -210,7 +208,7 @@ const getPriceForDate = (dateStr) => {
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显示

2
components/Calender/styles/index.scss
View File

@@ -1,7 +1,7 @@
// 颜色系统
$primary-color: #1890ff;
$primary-light: #e6f7ff;
$primary-dark: #0050b3;
$primary-dark: #1890ff;
// 中性色
$text-primary: #262626;

23
pages/goods/components/GoodConfirm/index.vue
View File

@@ -39,8 +39,18 @@
}}</view>
<view class="goods-price">
<text class="currency">¥</text>
<template v-if="goodsData.commodityTypeCode === '0'">
<text class="price">
{{ goodsData.specificationPrice || 399 }}
{{ goodsData.calculatedTotalPrice || 0 }}
</text>
<text class="price-desc">
({{ goodsData.startDate }}至{{ goodsData.endDate }}) 共{{
goodsData.totalDays
}}晚
</text>
</template>
<text v-else class="price">
{{ goodsData.specificationPrice || 0 }}
</text>
</view>
<view
@@ -95,7 +105,11 @@
<!-- 总价区域 -->
<SumCard
:referencePrice="goodsData.specificationPrice"
:referencePrice="
goodsData.commodityTypeCode === '0'
? goodsData.calculatedTotalPrice
: goodsData.specificationPrice
"
:discount="totalPrice"
/>
</view>
@@ -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);
});

7
pages/goods/components/GoodConfirm/styles/index.scss
View File

@@ -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 {

73
pages/goods/index.vue
View File

@@ -38,7 +38,7 @@
<view class="footer">
<view class="left">
<text class="label">价格：</text>
<text class="price">{{ goodsData.specificationPrice || 399 }}</text>
<text class="price">{{ calculatedTotalPrice }}</text>
</view>
<view class="buy-button" @click="showConfirmPopup">立即抢购</view>
</view>
@@ -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;
};