@xwink/ui

    DatePicker

    分段输入框加右侧日历按钮:能直接敲,也能点开日历选。外观与 XInput / XSelect 同一个壳,值是 ISO 字符串。

    单日与范围
    2026
    /
    10
    /
    31

    值:2026-10-31

    年
    /
    月
    /
    日
    年
    /
    月
    /
    日

    值:(空)

    • XDatePicker 的 v-model 是 ISO 日期,选中即收起;min / max / isDateDisabled 同 Calendar。
    • XDateRangePicker 的 v-model 是 { start, end },两端都含;弹层并排两个月(numberOfMonths),选完两端才收起。
    • 范围弹层左侧是快捷项,缺省今天、近 7 天、近 30 天、本月(「近 N 天」含今天),点了直接定值并收起。传 shortcuts 换成自己的({ label, range: (today) => ({ start, end }) }),false 不显示。

    放进筛选面板

    值本身就是字符串,直接摊进查询参数(createdFrom / createdTo),useTable 的查询不用再转格式。

    筛选面板里的日期范围
    年
    /
    月
    /
    日
    年
    /
    月
    /
    日
    {}

    API

    Props

    名称类型默认值说明
    weekStartsOn0 | 1 | 5 | 2 | 3 | 4 | 6 | undefined1—
    ariaLabelstring | undefinedundefined—
    minstring | undefinedundefined最早可选(`2026-01-01`)
    maxstring | undefinedundefined最晚可选
    isDateDisabled((date: string) => boolean) | undefinedundefined单独禁掉某些日子(周末、节假日),入参是 ISO 日期
    disabledboolean | undefinedfalse—
    readonlyboolean | undefinedfalse—
    size"mini" | "small" | "medium" | "large" | "super" | undefinedundefined尺寸:mini / small / medium(默认) / large / super;不传则跟随环境 data-size
    variantFieldVariant | undefinedundefined—
    modelValuestring | undefined——

    Emits

    事件载荷说明
    update:modelValue[value: string | undefined]—

    XDateRangePicker

    Props

    名称类型默认值说明
    weekStartsOn0 | 1 | 5 | 2 | 3 | 4 | 6 | undefined1—
    numberOfMonthsnumber | undefined2弹层里并排几个月,缺省 2
    shortcutsfalse | DateRangeShortcut[] | undefinedundefined左侧的快捷范围;缺省今天、近 7 天、近 30 天、本月,传 `false` 不显示
    ariaLabelstring | undefinedundefined—
    minstring | undefinedundefined最早可选(`2026-01-01`)
    maxstring | undefinedundefined最晚可选
    isDateDisabled((date: string) => boolean) | undefinedundefined单独禁掉某些日子(周末、节假日),入参是 ISO 日期
    disabledboolean | undefinedfalse—
    readonlyboolean | undefinedfalse—
    size"mini" | "small" | "medium" | "large" | "super" | undefinedundefined尺寸:mini / small / medium(默认) / large / super;不传则跟随环境 data-size
    variantFieldVariant | undefinedundefined—
    modelValueDateRange | undefined——

    Emits

    事件载荷说明
    update:modelValue[value: DateRange | undefined]—