hookehuyr

feat(日历): 禁用未来日期并添加样式

添加日期格式化函数中对未来日期的禁用逻辑,并设置对应的禁用样式
......@@ -429,6 +429,11 @@ const openImagePreview = (index, post) => {
const onChange = (index) => {
startPosition.value = index;
}
/**
* 日历日期格式化函数
* @param {Object} day - 日期对象
* @returns {Object} 格式化后的日期对象
*/
const formatter = (day) => {
const year = day.date.getFullYear();
const month = day.date.getMonth() + 1;
......@@ -436,6 +441,13 @@ const formatter = (day) => {
let checkin_days = myCheckinDates.value;
// 禁用未来日期
if (dayjs(day.date).isAfter(new Date(), 'day')) {
day.type = 'disabled';
day.className = 'calendar-disabled';
return day;
}
// 检查当前日期是否在签到日期列表中
if (checkin_days && checkin_days.length > 0) {
// 格式化当前日期为YYYY-MM-DD格式,与checkin_days中的格式匹配
......@@ -840,4 +852,15 @@ const formatData = (data) => {
:deep(.van-calendar__footer) {
display: none;
}
/* 禁用未来日期的样式 */
:deep(.calendar-disabled) {
color: #c8c9cc !important;
background-color: #f7f8fa !important;
cursor: not-allowed !important;
}
:deep(.calendar-disabled .van-calendar__day-text) {
color: #c8c9cc !important;
}
</style>
......