refactor: ♻️ 完善 month-panel 的属性定义 (#1351)

* refactor: ♻️  完善 month-panel 的属性定义

* refactor: ♻️  解决潜在的跨天日期默认值异常问题
This commit is contained in:
不如摸鱼去 2025-11-04 16:54:28 +08:00 committed by GitHub
parent c84af08cfd
commit c913cf7a9a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 78 additions and 16 deletions

View File

@ -77,7 +77,8 @@ import { ref } from 'vue'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
const { t } = useI18n() const { t } = useI18n()
const minDate = ref<number>(new Date(new Date().getFullYear() - 20, new Date().getMonth() - 6, new Date().getDate()).getTime()) const now = new Date()
const minDate = ref<number>(new Date(now.getFullYear() - 20, now.getMonth() - 6, now.getDate()).getTime())
const value1 = ref<number>(Date.now()) const value1 = ref<number>(Date.now())
const value2 = ref<number[]>([Date.now() - 24 * 60 * 60 * 1000 * 3, Date.now()]) const value2 = ref<number[]>([Date.now() - 24 * 60 * 60 * 1000 * 3, Date.now()])

View File

@ -117,7 +117,8 @@ const valueClear2 = ref<any[]>([Date.now(), Date.now()])
const valueEllipsis = ref<number>(Date.now()) const valueEllipsis = ref<number>(Date.now())
const valueRangeEllipsis = ref<any[]>([Date.now(), Date.now() + 7 * 24 * 60 * 60 * 1000]) const valueRangeEllipsis = ref<any[]>([Date.now(), Date.now() + 7 * 24 * 60 * 60 * 1000])
const minDate = ref<number>(Date.now()) const minDate = ref<number>(Date.now())
const maxDate = ref<number>(new Date(new Date().getFullYear() + 1, new Date().getMonth(), new Date().getDate()).getTime()) const now = new Date()
const maxDate = ref<number>(new Date(now.getFullYear() + 1, now.getMonth(), now.getDate()).getTime())
const formatter: DatetimePickerViewFormatter = (type, value) => { const formatter: DatetimePickerViewFormatter = (type, value) => {
let formatValue = '' let formatValue = ''

View File

@ -1,7 +1,11 @@
import type { ComponentPublicInstance, ExtractPropTypes, PropType } from 'vue' import type { ComponentPublicInstance, ExtractPropTypes, PropType } from 'vue'
import { makeBooleanProp, makeRequiredProp } from '../../common/props' import { makeBooleanProp, makeNumberProp, makeStringProp } from '../../common/props'
import type { CalendarFormatter, CalendarTimeFilter, CalendarType } from '../types' import type { CalendarFormatter, CalendarTimeFilter, CalendarType } from '../types'
const now = new Date()
const defaultMinDate = new Date(now.getFullYear(), now.getMonth() - 6, now.getDate()).getTime()
const defaultMaxDate = new Date(now.getFullYear(), now.getMonth() + 6, now.getDate(), 23, 59, 59).getTime()
/** /**
* *
*/ */
@ -11,22 +15,66 @@ export interface MonthInfo {
} }
export const monthPanelProps = { export const monthPanelProps = {
type: makeRequiredProp(String as PropType<CalendarType>), /**
value: makeRequiredProp([Number, Array, null] as PropType<number | (number | null)[] | null>), *
minDate: makeRequiredProp(Number), */
maxDate: makeRequiredProp(Number), type: makeStringProp<CalendarType>('date'),
firstDayOfWeek: makeRequiredProp(Number), /**
* 13
*/
value: {
type: [Number, Array, null] as PropType<number | (number | null)[] | null>,
default: null
},
/**
* 13
*/
minDate: makeNumberProp(defaultMinDate),
/**
* 13
*/
maxDate: makeNumberProp(defaultMaxDate),
/**
*
*/
firstDayOfWeek: makeNumberProp(0),
/**
*
*/
formatter: Function as PropType<CalendarFormatter>, formatter: Function as PropType<CalendarFormatter>,
/**
* type
*/
maxRange: Number, maxRange: Number,
/**
* type
*/
rangePrompt: String, rangePrompt: String,
/**
* type
*/
allowSameDay: makeBooleanProp(false), allowSameDay: makeBooleanProp(false),
/**
*
*/
showPanelTitle: makeBooleanProp(false), showPanelTitle: makeBooleanProp(false),
/**
* 使
*/
defaultTime: { defaultTime: {
type: [Array] as PropType<Array<number[]>> type: [Array] as PropType<Array<number[]>>
}, },
panelHeight: makeRequiredProp(Number), /**
// type 为 'datetime' 或 'datetimerange' 时有效,用于过滤时间选择器的数据 *
*/
panelHeight: makeNumberProp(378),
/**
* type 'datetime' 'datetimerange'
*/
timeFilter: Function as PropType<CalendarTimeFilter>, timeFilter: Function as PropType<CalendarTimeFilter>,
/**
* type 'datetime' 'datetimerange'
*/
hideSecond: makeBooleanProp(false), hideSecond: makeBooleanProp(false),
/** /**
* picker-view的 change change 1.2.25 * picker-view的 change change 1.2.25

View File

@ -1,6 +1,10 @@
import type { ComponentPublicInstance, ExtractPropTypes, PropType } from 'vue' import type { ComponentPublicInstance, ExtractPropTypes, PropType } from 'vue'
import { baseProps, makeBooleanProp, makeNumberProp, makeRequiredProp, makeStringProp } from '../common/props' import { baseProps, makeBooleanProp, makeNumberProp, makeRequiredProp, makeStringProp } from '../common/props'
const now = new Date()
const defaultMinDate = new Date(now.getFullYear(), now.getMonth() - 6, now.getDate()).getTime()
const defaultMaxDate = new Date(now.getFullYear(), now.getMonth() + 6, now.getDate(), 23, 59, 59).getTime()
export type CalendarType = 'date' | 'dates' | 'datetime' | 'week' | 'month' | 'daterange' | 'datetimerange' | 'weekrange' | 'monthrange' export type CalendarType = 'date' | 'dates' | 'datetime' | 'week' | 'month' | 'daterange' | 'datetimerange' | 'weekrange' | 'monthrange'
export const calendarViewProps = { export const calendarViewProps = {
@ -16,11 +20,11 @@ export const calendarViewProps = {
/** /**
* 13 * 13
*/ */
minDate: makeNumberProp(new Date(new Date().getFullYear(), new Date().getMonth() - 6, new Date().getDate()).getTime()), minDate: makeNumberProp(defaultMinDate),
/** /**
* 13 * 13
*/ */
maxDate: makeNumberProp(new Date(new Date().getFullYear(), new Date().getMonth() + 6, new Date().getDate(), 23, 59, 59).getTime()), maxDate: makeNumberProp(defaultMaxDate),
/** /**
* *
*/ */

View File

@ -12,6 +12,10 @@ import { baseProps, makeArrayProp, makeBooleanProp, makeNumberProp, makeRequired
import type { CalendarFormatter, CalendarTimeFilter, CalendarType } from '../wd-calendar-view/types' import type { CalendarFormatter, CalendarTimeFilter, CalendarType } from '../wd-calendar-view/types'
import type { FormItemRule } from '../wd-form/types' import type { FormItemRule } from '../wd-form/types'
const now = new Date()
const defaultMinDate = new Date(now.getFullYear(), now.getMonth() - 6, now.getDate()).getTime()
const defaultMaxDate = new Date(now.getFullYear(), now.getMonth() + 6, now.getDate(), 23, 59, 59).getTime()
export const calendarProps = { export const calendarProps = {
...baseProps, ...baseProps,
/** /**
@ -25,11 +29,11 @@ export const calendarProps = {
/** /**
* 13 * 13
*/ */
minDate: makeNumberProp(new Date(new Date().getFullYear(), new Date().getMonth() - 6, new Date().getDate()).getTime()), minDate: makeNumberProp(defaultMinDate),
/** /**
* 13 * 13
*/ */
maxDate: makeNumberProp(new Date(new Date().getFullYear(), new Date().getMonth() + 6, new Date().getDate(), 23, 59, 59).getTime()), maxDate: makeNumberProp(defaultMaxDate),
/** /**
* *
*/ */

View File

@ -3,6 +3,10 @@ import { baseProps, makeArrayProp, makeBooleanProp, makeNumberProp, makeRequired
import type { DateTimeType, DatetimePickerViewFilter, DatetimePickerViewFormatter } from '../wd-datetime-picker-view/types' import type { DateTimeType, DatetimePickerViewFilter, DatetimePickerViewFormatter } from '../wd-datetime-picker-view/types'
import type { FormItemRule } from '../wd-form/types' import type { FormItemRule } from '../wd-form/types'
const now = new Date()
const defaultMinDate = new Date(now.getFullYear() - 10, 0, 1).getTime()
const defaultMaxDate = new Date(now.getFullYear() + 10, 11, 31, 23, 59, 59).getTime()
export const datetimePickerProps = { export const datetimePickerProps = {
...baseProps, ...baseProps,
/** /**
@ -96,11 +100,11 @@ export const datetimePickerProps = {
/** /**
* *
*/ */
minDate: makeNumberProp(new Date(new Date().getFullYear() - 10, 0, 1).getTime()), minDate: makeNumberProp(defaultMinDate),
/** /**
* *
*/ */
maxDate: makeNumberProp(new Date(new Date().getFullYear() + 10, 11, 31, 23, 59, 59).getTime()), maxDate: makeNumberProp(defaultMaxDate),
/** /**
* time类型时生效 * time类型时生效
*/ */