日期选择器的修复

This commit is contained in:
lq
2025-09-15 19:48:10 +08:00
parent f01fb13af5
commit 7c8495ed7c

View File

@ -7,6 +7,7 @@
@change="handleDateChange" @change="handleDateChange"
v-model="currentDate" v-model="currentDate"
format="YYYY年MM月DD日周dd" format="YYYY年MM月DD日周dd"
value-format="YYYY-MM-DD"
/> />
<!-- 周选择器 --> <!-- 周选择器 -->
<a-week-picker <a-week-picker
@ -15,6 +16,7 @@
@change="handleDateChange" @change="handleDateChange"
v-model="currentDate" v-model="currentDate"
format="YYYY年MM月DD日" format="YYYY年MM月DD日"
value-format="YYYY-MM-DD"
/> />
<!-- 月选择器 --> <!-- 月选择器 -->
<a-month-picker <a-month-picker
@ -23,6 +25,7 @@
@change="handleDateChange" @change="handleDateChange"
v-model="currentDate" v-model="currentDate"
format="YYYY年MM月" format="YYYY年MM月"
value-format="YYYY-MM"
/> />
<!-- 日期导航按钮 --> <!-- 日期导航按钮 -->
@ -43,7 +46,13 @@
<!-- 维度切换下拉框 --> <!-- 维度切换下拉框 -->
<div class="flex items-center"> <div class="flex items-center">
<a-dropdown position="bottom" @select="handleTypeChange" class="w-80px" :popupVisible="dropdownVisible" @popupVisibleChange="handleDropdownVisibleChange"> <a-dropdown
position="bottom"
@select="handleTypeChange"
class="w-80px"
:popupVisible="dropdownVisible"
@popupVisibleChange="handleDropdownVisibleChange"
>
<a-button type="text" class="prv-today"> {{ choseType }}<icon-down class="ml-4px" /> </a-button> <a-button type="text" class="prv-today"> {{ choseType }}<icon-down class="ml-4px" /> </a-button>
<template #content> <template #content>
<a-doption value="日" class="doption"></a-doption> <a-doption value="日" class="doption"></a-doption>
@ -151,7 +160,22 @@ const handleTypeChange = (val: '日' | '周' | '月') => {
// 6. 日期选择器变更处理 // 6. 日期选择器变更处理
const handleDateChange = (val: Date | string | undefined) => { const handleDateChange = (val: Date | string | undefined) => {
if (!val) return; if (!val) return;
const selectedDate = val instanceof Date ? val : new Date(val);
let selectedDate: Date;
if (val instanceof Date) {
selectedDate = val;
} else {
// 处理字符串格式的日期
if (choseType.value === '月') {
// 月份选择器返回 YYYY-MM 格式
const [year, month] = val.split('-').map(Number);
selectedDate = new Date(year, month - 1, 1);
} else {
// 日和周选择器返回 YYYY-MM-DD 格式
selectedDate = new Date(val);
}
}
currentDate.value = selectedDate; currentDate.value = selectedDate;
emitChange(); emitChange();
}; };
@ -245,7 +269,7 @@ setTimeout(() => {
color: #211f24 !important; color: #211f24 !important;
} }
.doption { .doption {
width: 80px !important; width: 78px !important;
} }
.prv-today { .prv-today {
color: #211f24 !important; color: #211f24 !important;