feat(datepicker): 添加日期禁用功能,限制日期范围为一年内

- 新增 disabledDate 函数用于禁用超出当前日期前后一年范围的日期
- 在日期选择组件中绑定 disabledDate 函数
- 优化用户选择日期的有效范围,防止选取过早或过晚的日期
- 通过代码注释清晰说明禁用逻辑实现细节
This commit is contained in:
zhouyonggao 2025-12-19 00:06:34 +08:00
parent ae4d69edb9
commit 849e77b401
2 changed files with 15 additions and 0 deletions

View File

@ -240,6 +240,7 @@
value-format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
:shortcuts="dateShortcuts" :shortcuts="dateShortcuts"
:default-time="dateDefaultTime" :default-time="dateDefaultTime"
:disabled-date="disabledDate"
style="width:100%" style="width:100%"
/> />
</el-form-item> </el-form-item>

View File

@ -188,6 +188,19 @@ const app = createApp({
new Date(2000, 0, 1, 23, 59, 59), new Date(2000, 0, 1, 23, 59, 59),
]; ];
/**
* 禁用超过一年的日期
* @param {Date} date - 要检查的日期
* @returns {boolean} 是否禁用
*/
const disabledDate = (date) => {
if (!date) return false;
const today = new Date();
const oneYearAgo = new Date(today.getFullYear() - 1, today.getMonth(), today.getDate());
const oneYearLater = new Date(today.getFullYear() + 1, today.getMonth(), today.getDate());
return date < oneYearAgo || date > oneYearLater;
};
const dateShortcuts = [ const dateShortcuts = [
{ {
text: '本日', text: '本日',
@ -1010,6 +1023,7 @@ const app = createApp({
exportRules, exportRules,
dateDefaultTime, dateDefaultTime,
dateShortcuts, dateShortcuts,
disabledDate,
// 表单引用 // 表单引用
createFormRef, createFormRef,
editFormRef, editFormRef,