AppStd/DigitalData.Hub
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(date-filter): Hinzufügen von Zeit- und DateTime-Filtern

Browse Source
This commit is contained in:
tekh 2025-07-07 13:24:10 +02:00
parent cf67c387c6
commit 042a1a76c3
2 changed files with 40 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/client/dd-hub-react/src/sections/document/date-filter.tsx
View File

@ -1,5 +1,7 @@
import { DatePicker } from '@mui/x-date-pickers/DatePicker';
import { TimePicker } from '@mui/x-date-pickers/TimePicker';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
// ----------------------------------------------------------------------
@ -7,7 +9,7 @@ type DateFilterProps = {
label: string;
}
export default function DateFilter({ label }: DateFilterProps) {
export function DateFilter({ label }: DateFilterProps) {
return (
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DatePicker
@ -20,4 +22,34 @@ export default function DateFilter({ label }: DateFilterProps) {
/>
</LocalizationProvider>
);
}
export function TimeFilter({ label }: DateFilterProps) {
return (
<LocalizationProvider dateAdapter={AdapterDayjs}>
<TimePicker
slotProps={{
openPickerIcon: (ownerState: any) => ({
color: ownerState.isPickerOpen ? 'secondary' : 'primary',
}),
}}
label={label}
/>
</LocalizationProvider>
);
}
export function DateTimeFilter({ label }: DateFilterProps) {
return (
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DateTimePicker
slotProps={{
openPickerIcon: (ownerState: any) => ({
color: ownerState.isPickerOpen ? 'secondary' : 'primary',
}),
}}
label={label}
/>
</LocalizationProvider>
);
}

8
src/client/dd-hub-react/src/sections/document/view/doc-search-view.tsx
View File

@ -14,10 +14,10 @@ import { Filter, getFiltersAsync } from 'src/api/filter-service';
import { Iconify } from 'src/components/iconify';
import { DocItem } from '../doc-item';
import DateFilter from '../date-filter';
import { BoolFilter } from '../bool-filter';
import { TextFilter } from '../text-filter';
import { DecimalFilter, IntFilter } from '../num-filter';
import { DateFilter, DateTimeFilter, TimeFilter } from '../date-filter';
import type { IDocItem } from '../doc-item';
// ----------------------------------------------------------------------
@ -104,6 +104,12 @@ export function DocSearchView({ posts }: Props) {
case 'DATE':
filterComp = <DateFilter label={filter.label ?? filter.name} />
break;
case 'TIME':
filterComp = <TimeFilter label={filter.label ?? filter.name} />
break;
case 'DATETIME':
filterComp = <DateTimeFilter label={filter.label ?? filter.name} />
break;
default:
filterComp = <TextField label={filter.label ?? filter.type} variant="filled" />
break;