feat: 酒店的日期选择调整
This commit is contained in:
@@ -50,7 +50,13 @@
|
|||||||
{{ dateInfo.label }}
|
{{ dateInfo.label }}
|
||||||
</text>
|
</text>
|
||||||
<text class="date-number">{{ dateInfo.day }}</text>
|
<text class="date-number">{{ dateInfo.day }}</text>
|
||||||
<text class="date-price" v-if="dateInfo.price !== null && dateInfo.price !== undefined">¥{{ dateInfo.price }}</text>
|
<text
|
||||||
|
class="date-price"
|
||||||
|
v-if="
|
||||||
|
dateInfo.price !== null && dateInfo.price !== undefined
|
||||||
|
"
|
||||||
|
>¥{{ dateInfo.price }}</text
|
||||||
|
>
|
||||||
</template>
|
</template>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@@ -253,7 +259,7 @@ const generateCalendarGrid = (year, month) => {
|
|||||||
// 填充日期
|
// 填充日期
|
||||||
for (let day = 1; day <= daysInMonth; day++) {
|
for (let day = 1; day <= daysInMonth; day++) {
|
||||||
const dateStr = `${year}-${String(month).padStart(2, "0")}-${String(
|
const dateStr = `${year}-${String(month).padStart(2, "0")}-${String(
|
||||||
day
|
day,
|
||||||
).padStart(2, "0")}`;
|
).padStart(2, "0")}`;
|
||||||
const priceItem = getPriceItem(dateStr);
|
const priceItem = getPriceItem(dateStr);
|
||||||
grid.push({
|
grid.push({
|
||||||
@@ -344,7 +350,11 @@ const getDateCellClass = (dateInfo) => {
|
|||||||
if (dateInfo.selected) classes.push("date-cell-selected");
|
if (dateInfo.selected) classes.push("date-cell-selected");
|
||||||
if (dateInfo.inRange) classes.push("date-cell-in-range");
|
if (dateInfo.inRange) classes.push("date-cell-in-range");
|
||||||
// 标注无价格但可选的日期(用于视觉区分)
|
// 标注无价格但可选的日期(用于视觉区分)
|
||||||
if (dateInfo.price === null || dateInfo.price === undefined || dateInfo.price === "-") {
|
if (
|
||||||
|
dateInfo.price === null ||
|
||||||
|
dateInfo.price === undefined ||
|
||||||
|
dateInfo.price === "-"
|
||||||
|
) {
|
||||||
classes.push("date-cell-no-price");
|
classes.push("date-cell-no-price");
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -404,13 +414,19 @@ const handleRangeSelection = (dateInfo) => {
|
|||||||
if (!rangeStart.value || (rangeStart.value && rangeEnd.value)) {
|
if (!rangeStart.value || (rangeStart.value && rangeEnd.value)) {
|
||||||
// 开始新的范围选择:当作为价格区间选择器时,开始日必须有价格且有库存
|
// 开始新的范围选择:当作为价格区间选择器时,开始日必须有价格且有库存
|
||||||
if (props.rangeRequirePrice) {
|
if (props.rangeRequirePrice) {
|
||||||
const hasPrice = dateInfo.price !== null && dateInfo.price !== undefined && dateInfo.price !== "-";
|
const hasPrice =
|
||||||
|
dateInfo.price !== null &&
|
||||||
|
dateInfo.price !== undefined &&
|
||||||
|
dateInfo.price !== "-";
|
||||||
if (!hasPrice) {
|
if (!hasPrice) {
|
||||||
uni.showToast({ title: "所选日期不可预订,请重新选择", icon: "none" });
|
uni.showToast({ title: "所选日期不可预订,请重新选择", icon: "none" });
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (dateInfo.stock !== undefined && Number(dateInfo.stock) <= 0) {
|
if (dateInfo.stock !== undefined && Number(dateInfo.stock) <= 0) {
|
||||||
uni.showToast({ title: "所选日期库存不足,请选择其他日期", icon: "none" });
|
uni.showToast({
|
||||||
|
title: "所选日期库存不足,请选择其他日期",
|
||||||
|
icon: "none",
|
||||||
|
});
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -421,11 +437,16 @@ const handleRangeSelection = (dateInfo) => {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 否则为结束日期(完成选择)——结束日允许无价格(如为紧接有价日的下一天),但区间内的夜晚必须有价格
|
// 否则为结束日期(完成选择)
|
||||||
|
if (rangeStart.value === dateInfo.date) {
|
||||||
|
uni.showToast({ title: "离店日期不能与入住日期相同", icon: "none" });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
rangeEnd.value = dateInfo.date;
|
rangeEnd.value = dateInfo.date;
|
||||||
isRangeSelecting.value = false;
|
isRangeSelecting.value = false;
|
||||||
|
|
||||||
// 允许选择相同日期,但确保开始日期不大于结束日期
|
// 确保开始日期不大于结束日期
|
||||||
if (new Date(rangeStart.value) > new Date(rangeEnd.value)) {
|
if (new Date(rangeStart.value) > new Date(rangeEnd.value)) {
|
||||||
[rangeStart.value, rangeEnd.value] = [rangeEnd.value, rangeStart.value];
|
[rangeStart.value, rangeEnd.value] = [rangeEnd.value, rangeStart.value];
|
||||||
}
|
}
|
||||||
@@ -433,7 +454,11 @@ const handleRangeSelection = (dateInfo) => {
|
|||||||
// 检查日期跨度是否超过28天
|
// 检查日期跨度是否超过28天
|
||||||
const daysBetween = calculateDaysBetween(rangeStart.value, rangeEnd.value);
|
const daysBetween = calculateDaysBetween(rangeStart.value, rangeEnd.value);
|
||||||
if (daysBetween > 28) {
|
if (daysBetween > 28) {
|
||||||
uni.showToast({ title: "预定时间不能超过28天", icon: "none", duration: 3000 });
|
uni.showToast({
|
||||||
|
title: "预定时间不能超过28天",
|
||||||
|
icon: "none",
|
||||||
|
duration: 3000,
|
||||||
|
});
|
||||||
rangeStart.value = null;
|
rangeStart.value = null;
|
||||||
rangeEnd.value = null;
|
rangeEnd.value = null;
|
||||||
isRangeSelecting.value = false;
|
isRangeSelecting.value = false;
|
||||||
@@ -443,9 +468,14 @@ const handleRangeSelection = (dateInfo) => {
|
|||||||
// 如果作为价格区间选择器,验证夜晚(不包含离店日)是否都有价格/库存
|
// 如果作为价格区间选择器,验证夜晚(不包含离店日)是否都有价格/库存
|
||||||
if (props.rangeRequirePrice) {
|
if (props.rangeRequirePrice) {
|
||||||
const nights = generateNightsRange(rangeStart.value, rangeEnd.value);
|
const nights = generateNightsRange(rangeStart.value, rangeEnd.value);
|
||||||
const missing = nights.find((d) => d.price === null || d.price === undefined || d.price === "-");
|
const missing = nights.find(
|
||||||
|
(d) => d.price === null || d.price === undefined || d.price === "-",
|
||||||
|
);
|
||||||
if (missing) {
|
if (missing) {
|
||||||
uni.showToast({ title: "所选区间包含无价格日期,请重新选择", icon: "none" });
|
uni.showToast({
|
||||||
|
title: "所选区间包含无价格日期,请重新选择",
|
||||||
|
icon: "none",
|
||||||
|
});
|
||||||
rangeStart.value = null;
|
rangeStart.value = null;
|
||||||
rangeEnd.value = null;
|
rangeEnd.value = null;
|
||||||
return;
|
return;
|
||||||
@@ -456,7 +486,10 @@ const handleRangeSelection = (dateInfo) => {
|
|||||||
return item && item.stock !== undefined && Number(item.stock) <= 0;
|
return item && item.stock !== undefined && Number(item.stock) <= 0;
|
||||||
});
|
});
|
||||||
if (badStock) {
|
if (badStock) {
|
||||||
uni.showToast({ title: "所选区间包含库存不足的日期,请重新选择", icon: "none" });
|
uni.showToast({
|
||||||
|
title: "所选区间包含库存不足的日期,请重新选择",
|
||||||
|
icon: "none",
|
||||||
|
});
|
||||||
rangeStart.value = null;
|
rangeStart.value = null;
|
||||||
rangeEnd.value = null;
|
rangeEnd.value = null;
|
||||||
return;
|
return;
|
||||||
@@ -551,7 +584,7 @@ watch(
|
|||||||
popup.value?.close();
|
popup.value?.close();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ immediate: true }
|
{ immediate: true },
|
||||||
);
|
);
|
||||||
|
|
||||||
// 生命周期钩子
|
// 生命周期钩子
|
||||||
|
|||||||
Reference in New Issue
Block a user