feat: ele 新增 RangePicker 和 getRangePickerDefaultProps 适配

pull/102/head
puhui999 2025-05-13 10:55:58 +08:00
parent a5df250b04
commit 2baf398c7f
3 changed files with 81 additions and 43 deletions

View File

@ -176,6 +176,7 @@ export type ComponentType =
| 'Input'
| 'InputNumber'
| 'RadioGroup'
| 'RangePicker'
| 'RichTextarea'
| 'Select'
| 'Space'
@ -299,6 +300,26 @@ async function initComponentAdapter() {
slots,
);
},
RangePicker: (props, { attrs, slots }) => {
const { name, id } = props;
const extraProps: Recordable<any> = {};
if (name && !Array.isArray(name)) {
extraProps.name = [name, `${name}_end`];
}
if (id && !Array.isArray(id)) {
extraProps.id = [id, `${id}_end`];
}
return h(
ElDatePicker,
{
...props,
type: 'datetimerange',
...attrs,
...extraProps,
},
slots,
);
},
DatePicker: (props, { attrs, slots }) => {
const { name, id, type } = props;
const extraProps: Recordable<any> = {};

View File

@ -1,59 +1,77 @@
import type { Dayjs } from 'dayjs';
import dayjs from 'dayjs';
import { $t } from '#/locales';
/** 时间段选择器拓展 */
/** 时间段选择器拓展 */
export function getRangePickerDefaultProps() {
return {
format: 'YYYY-MM-DD HH:mm:ss',
placeholder: [
$t('utils.rangePicker.beginTime'),
$t('utils.rangePicker.endTime'),
startPlaceholder: $t('utils.rangePicker.beginTime'),
endPlaceholder: $t('utils.rangePicker.endTime'),
shortcuts: [
{
text: $t('utils.rangePicker.today'),
value: () => {
return [dayjs().startOf('day'), dayjs().endOf('day')];
},
},
{
text: $t('utils.rangePicker.yesterday'),
value: () => {
return [
dayjs().subtract(1, 'day').startOf('day'),
dayjs().subtract(1, 'day').endOf('day'),
];
},
},
{
text: $t('utils.rangePicker.last7Days'),
value: () => {
return [
dayjs().subtract(7, 'day').startOf('day'),
dayjs().endOf('day'),
];
},
},
{
text: $t('utils.rangePicker.last30Days'),
value: () => {
return [
dayjs().subtract(30, 'day').startOf('day'),
dayjs().endOf('day'),
];
},
},
{
text: $t('utils.rangePicker.thisWeek'),
value: () => {
return [dayjs().startOf('week'), dayjs().endOf('day')];
},
},
{
text: $t('utils.rangePicker.lastWeek'),
value: () => {
return [
dayjs().subtract(1, 'week').startOf('day'),
dayjs().endOf('day'),
];
},
},
{
text: $t('utils.rangePicker.thisMonth'),
value: () => {
return [dayjs().startOf('month'), dayjs().endOf('day')];
},
},
],
ranges: {
[$t('utils.rangePicker.today')]: () =>
[dayjs().startOf('day'), dayjs().endOf('day')] as [Dayjs, Dayjs],
[$t('utils.rangePicker.last7Days')]: () =>
[dayjs().subtract(7, 'day').startOf('day'), dayjs().endOf('day')] as [
Dayjs,
Dayjs,
],
[$t('utils.rangePicker.last30Days')]: () =>
[dayjs().subtract(30, 'day').startOf('day'), dayjs().endOf('day')] as [
Dayjs,
Dayjs,
],
[$t('utils.rangePicker.yesterday')]: () =>
[
dayjs().subtract(1, 'day').startOf('day'),
dayjs().subtract(1, 'day').endOf('day'),
] as [Dayjs, Dayjs],
[$t('utils.rangePicker.thisWeek')]: () =>
[dayjs().startOf('week'), dayjs().endOf('day')] as [Dayjs, Dayjs],
[$t('utils.rangePicker.thisMonth')]: () =>
[dayjs().startOf('month'), dayjs().endOf('day')] as [Dayjs, Dayjs],
[$t('utils.rangePicker.lastWeek')]: () =>
[dayjs().subtract(1, 'week').startOf('day'), dayjs().endOf('day')] as [
Dayjs,
Dayjs,
],
},
showTime: {
defaultValue: [
dayjs('00:00:00', 'HH:mm:ss'),
dayjs('23:59:59', 'HH:mm:ss'),
],
format: 'HH:mm:ss',
},
transformDateFunc: (dates: any) => {
// TODO puhui999: 没起作用后面调试再看看
if (dates && dates.length === 2) {
// 格式化为后台支持的时间格式
return [dates.createTime[0], dates.createTime[1]].join(',');
}
return {};
},
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
};
}

View File

@ -149,7 +149,6 @@ export function useGridFormSchema(): VbenFormSchema[] {
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
},
},
// TODO @puhui999貌似创建时间出不来
{
fieldName: 'createTime',
label: '创建时间',