开启篮球预定
This commit is contained in:
@ -29,10 +29,19 @@
|
||||
data: function () {
|
||||
const date = new Date();
|
||||
const weekMap = ['日', '一', '二', '三', '四', '五', '六'];
|
||||
// 生成前天、昨天、今天、明天、后天
|
||||
// 生成今天起未来7天,若当天已过22:00则不加入当天
|
||||
const dateList = [];
|
||||
for (let i = -2; i <= 2; i++) {
|
||||
for (let i = 0; i < 7; i++) {
|
||||
const d = new Date(date.getFullYear(), date.getMonth(), date.getDate() + i);
|
||||
// 判断当天是否已过22:00
|
||||
if (i === 0) {
|
||||
const now = new Date();
|
||||
if (now.getFullYear() === d.getFullYear() && now.getMonth() === d.getMonth() && now.getDate() === d.getDate()) {
|
||||
if (now.getHours() > 21 || (now.getHours() === 21 && now.getMinutes() >= 60)) {
|
||||
continue; // 跳过当天
|
||||
}
|
||||
}
|
||||
}
|
||||
const mm = (d.getMonth() + 1).toString().padStart(2, '0');
|
||||
const dd = d.getDate().toString().padStart(2, '0');
|
||||
const week = weekMap[d.getDay()];
|
||||
@ -41,64 +50,99 @@
|
||||
date: d
|
||||
});
|
||||
}
|
||||
// 小时 6-22
|
||||
const hourList = [];
|
||||
for (let i = 6; i <= 22; i++) {
|
||||
hourList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
}
|
||||
// 分钟 00\10\20\30\40\50
|
||||
const minuteList = [];
|
||||
for (let i = 0; i < 60; i += 10) {
|
||||
minuteList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
}
|
||||
// 默认选中今天
|
||||
let dateIndex = 2;
|
||||
// 当前小时和分钟
|
||||
const now = new Date();
|
||||
let hourIndex = hourList.findIndex(h => parseInt(h) === now.getHours());
|
||||
if (hourIndex === -1) hourIndex = 0;
|
||||
let minuteIndex = minuteList.findIndex(m => parseInt(m) === now.getMinutes());
|
||||
if (minuteIndex === -1) minuteIndex = 0;
|
||||
// 默认选中今天、当前小时、当前分钟
|
||||
return {
|
||||
title: 'picker-view',
|
||||
dateList,
|
||||
hourList,
|
||||
minuteList,
|
||||
value: [dateIndex, hourIndex, minuteIndex], // 默认选中今天、当前小时、当前分钟
|
||||
hourList: [],
|
||||
minuteList: [],
|
||||
value: [0, 0, 0],
|
||||
visible: true,
|
||||
indicatorStyle: `height: 50px;`
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.updateHourAndMinuteList(0, 0);
|
||||
},
|
||||
methods: {
|
||||
bindChange: function (e) {
|
||||
const val = e.detail.value;
|
||||
// 选中项索引分别为dateList、hourList、minuteList
|
||||
this.value = val;
|
||||
// 联动更新小时和分钟
|
||||
this.updateHourAndMinuteList(val[0], val[1]);
|
||||
},
|
||||
|
||||
// 联动生成小时和分钟列表
|
||||
updateHourAndMinuteList(dateIdx, hourIdx) {
|
||||
const now = new Date();
|
||||
const selectedDate = this.dateList[dateIdx]?.date;
|
||||
let hourList = [];
|
||||
let minuteList = [];
|
||||
// 判断是否为今天
|
||||
const isToday = selectedDate &&
|
||||
selectedDate.getFullYear() === now.getFullYear() &&
|
||||
selectedDate.getMonth() === now.getMonth() &&
|
||||
selectedDate.getDate() === now.getDate();
|
||||
if (isToday) {
|
||||
// 如果当前时间已超过 22:00,则不显示任何可选时间
|
||||
if (now.getHours() > 21 || (now.getHours() === 21 && now.getMinutes() >= 60)) {
|
||||
hourList = [];
|
||||
minuteList = [];
|
||||
} else {
|
||||
for (let i = 6; i <= 21; i++) {
|
||||
if (i > now.getHours()) {
|
||||
hourList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
} else if (i === now.getHours()) {
|
||||
// 当前小时,分钟要过滤
|
||||
let hasValidMinute = false;
|
||||
for (let m = 0; m < 60; m += 10) {
|
||||
if (m >= now.getMinutes()) {
|
||||
hasValidMinute = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (hasValidMinute) {
|
||||
hourList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
for (let i = 6; i <= 21; i++) {
|
||||
hourList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
}
|
||||
}
|
||||
// 选中的小时
|
||||
let selectedHour = hourList[hourIdx] ? parseInt(hourList[hourIdx]) : parseInt(hourList[0]);
|
||||
if (isToday && hourList.length > 0 && selectedHour === now.getHours()) {
|
||||
for (let m = 0; m < 60; m += 10) {
|
||||
if (m >= now.getMinutes()) {
|
||||
minuteList.push(m < 10 ? `0${m}` : `${m}`);
|
||||
}
|
||||
}
|
||||
} else if (hourList.length > 0) {
|
||||
for (let m = 0; m < 60; m += 10) {
|
||||
minuteList.push(m < 10 ? `0${m}` : `${m}`);
|
||||
}
|
||||
} else {
|
||||
minuteList = [];
|
||||
}
|
||||
// 修正value
|
||||
let value = [...this.value];
|
||||
// hourIdx/minuteIdx 越界修正
|
||||
if (value[1] >= hourList.length) value[1] = 0;
|
||||
if (value[2] >= minuteList.length) value[2] = 0;
|
||||
this.hourList = hourList;
|
||||
this.minuteList = minuteList;
|
||||
this.value = [dateIdx, value[1], value[2]];
|
||||
},
|
||||
|
||||
// 重置
|
||||
reset: function () {
|
||||
const now = new Date();
|
||||
// 日期始终选中“今天”
|
||||
let dateIndex = 2;
|
||||
// 重新生成小时列表,确保与当前小时对齐
|
||||
const hourList = [];
|
||||
for (let i = 6; i <= 21; i++) {
|
||||
hourList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
}
|
||||
let hourIndex = hourList.findIndex(h => parseInt(h) === now.getHours());
|
||||
if (hourIndex === -1) hourIndex = 0;
|
||||
// 重新生成分钟列表,确保与当前分钟对齐
|
||||
const minuteList = [];
|
||||
for (let i = 0; i < 60; i += 10) {
|
||||
minuteList.push(i < 10 ? `0${i}` : `${i}`);
|
||||
}
|
||||
let minuteIndex = minuteList.findIndex(m => parseInt(m) === now.getMinutes());
|
||||
if (minuteIndex === -1) minuteIndex = 0;
|
||||
this.value = [dateIndex, hourIndex, minuteIndex];
|
||||
// 重置为今天、可选的第一个小时和分钟
|
||||
this.updateHourAndMinuteList(0, 0);
|
||||
},
|
||||
|
||||
// 确认
|
||||
@ -106,15 +150,36 @@
|
||||
// 获取选中索引
|
||||
const [dateIdx, hourIdx, minuteIdx] = this.value;
|
||||
const dateObj = this.dateList[dateIdx];
|
||||
console.log("🚀 ~ dateObj:", this.value)
|
||||
const hour = this.hourList[hourIdx];
|
||||
const minute = this.minuteList[minuteIdx];
|
||||
// 组装时间戳
|
||||
let ts = 0;
|
||||
let endts = 0;
|
||||
if (dateObj && hour !== undefined && minute !== undefined) {
|
||||
// 构造 yyyy-mm-dd hh:mm:00 字符串
|
||||
const d = dateObj.date;
|
||||
const yyyy = d.getFullYear();
|
||||
|
||||
const mm = (d.getMonth() + 1).toString().padStart(2, '0');
|
||||
const dd = d.getDate().toString().padStart(2, '0');
|
||||
const hh = hour.toString().padStart(2, '0');
|
||||
const mi = minute.toString().padStart(2, '0');
|
||||
const dateStr = `${yyyy}-${mm}-${dd} ${hh}:${mi}:00`;
|
||||
const endStr = `${yyyy}-${mm}-${dd} 22:00:00`;
|
||||
console.log("🚀 ~ endStr:", endStr)
|
||||
ts = Math.floor(new Date(dateStr.replace(/-/g, '/')).getTime() / 1000);
|
||||
endts = Math.floor(new Date(endStr.replace(/-/g, '/')).getTime() / 1000);
|
||||
}
|
||||
// 传递给父组件
|
||||
this.$emit('confirm', {
|
||||
date: dateObj.date,
|
||||
dateLabel: dateObj.label,
|
||||
hour,
|
||||
minute,
|
||||
value: `${dateObj.label} ${hour}:${minute}`
|
||||
value: `${dateObj.label} ${hour}:${minute}`,
|
||||
timestamp: ts,
|
||||
endtimestamp: endts
|
||||
});
|
||||
this.$emit('close');
|
||||
},
|
||||
@ -141,6 +206,7 @@
|
||||
.item {
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.line {
|
||||
|
||||
Reference in New Issue
Block a user