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

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

@@ -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>
+    );
 }

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

@@ -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;