diff --git a/src/frontend/src/tables/Filter.tsx b/src/frontend/src/tables/Filter.tsx index 4105286703..9be775352b 100644 --- a/src/frontend/src/tables/Filter.tsx +++ b/src/frontend/src/tables/Filter.tsx @@ -11,6 +11,15 @@ export type TableFilterChoice = { label: string; }; +/** + * Available filter types + * + * boolean: A simple true/false filter + * choice: A filter which allows selection from a list of (supplied) + * date: A filter which allows selection from a date input + */ +export type TableFilterType = 'boolean' | 'choice' | 'date'; + /** * Interface for the table filter type. Provides a number of options for selecting filter value: * @@ -22,7 +31,7 @@ export type TableFilter = { name: string; label: string; description?: string; - type?: string; + type?: TableFilterType; choices?: TableFilterChoice[]; choiceFunction?: () => TableFilterChoice[]; defaultValue?: any; @@ -83,9 +92,12 @@ export function StatusFilterOptions( }; } +// Define some commonly used filters + export function AssignedToMeFilter(): TableFilter { return { name: 'assigned_to_me', + type: 'boolean', label: t`Assigned to me`, description: t`Show orders assigned to me` }; @@ -95,7 +107,7 @@ export function OutstandingFilter(): TableFilter { return { name: 'outstanding', label: t`Outstanding`, - description: t`Show outstanding orders` + description: t`Show outstanding items` }; } @@ -103,6 +115,33 @@ export function OverdueFilter(): TableFilter { return { name: 'overdue', label: t`Overdue`, - description: t`Show overdue orders` + description: t`Show overdue items` + }; +} + +export function MinDateFilter(): TableFilter { + return { + name: 'min_date', + label: t`Minimum Date`, + description: t`Show items after this date`, + type: 'date' + }; +} + +export function MaxDateFilter(): TableFilter { + return { + name: 'max_date', + label: t`Maximum Date`, + description: t`Show items before this date`, + type: 'date' + }; +} + +export function HasProjectCodeFilter(): TableFilter { + return { + name: 'has_project_code', + type: 'boolean', + label: t`Has Project Code`, + description: t`Show orders with an assigned project code` }; } diff --git a/src/frontend/src/tables/FilterSelectDrawer.tsx b/src/frontend/src/tables/FilterSelectDrawer.tsx index ce214c496b..de9b40202b 100644 --- a/src/frontend/src/tables/FilterSelectDrawer.tsx +++ b/src/frontend/src/tables/FilterSelectDrawer.tsx @@ -1,4 +1,5 @@ import { t } from '@lingui/macro'; +import { L } from '@lingui/react/dist/shared/react.e5f95de8'; import { Badge, Button, @@ -12,6 +13,8 @@ import { Text, Tooltip } from '@mantine/core'; +import { DateInput, DateValue } from '@mantine/dates'; +import dayjs from 'dayjs'; import { useCallback, useEffect, useMemo, useState } from 'react'; import { StylishText } from '../components/items/StylishText'; @@ -19,6 +22,7 @@ import { TableState } from '../hooks/UseTable'; import { TableFilter, TableFilterChoice, + TableFilterType, getTableFilterOptions } from './Filter'; @@ -99,6 +103,14 @@ function FilterAddGroup({ return getTableFilterOptions(filter); }, [selectedFilter]); + // Determine the "type" of filter (default = boolean) + const filterType: TableFilterType = useMemo(() => { + return ( + availableFilters?.find((flt) => flt.name === selectedFilter)?.type ?? + 'boolean' + ); + }, [selectedFilter]); + const setSelectedValue = useCallback( (value: string | null) => { // Find the matching filter @@ -126,6 +138,18 @@ function FilterAddGroup({ [selectedFilter] ); + const setDateValue = useCallback( + (value: DateValue) => { + if (value) { + let date = value.toString(); + setSelectedValue(dayjs(date).format('YYYY-MM-DD')); + } else { + setSelectedValue(''); + } + }, + [setSelectedValue] + ); + return ( @@ -137,16 +161,23 @@ function FilterAddGroup({ onChange={(value: string | null) => setSelectedFilter(value)} maxDropdownHeight={800} /> - {selectedFilter && ( - setSelectedValue(value)} + maxDropdownHeight={800} + /> + ))} ); } diff --git a/src/frontend/src/tables/build/BuildOrderTable.tsx b/src/frontend/src/tables/build/BuildOrderTable.tsx index 553ad44f3b..d09d476322 100644 --- a/src/frontend/src/tables/build/BuildOrderTable.tsx +++ b/src/frontend/src/tables/build/BuildOrderTable.tsx @@ -23,7 +23,15 @@ import { StatusColumn, TargetDateColumn } from '../ColumnRenderers'; -import { StatusFilterOptions, TableFilter } from '../Filter'; +import { + AssignedToMeFilter, + HasProjectCodeFilter, + MaxDateFilter, + MinDateFilter, + OverdueFilter, + StatusFilterOptions, + TableFilter +} from '../Filter'; import { InvenTreeTable } from '../InvenTreeTable'; /* @@ -115,29 +123,17 @@ export function BuildOrderTable({ description: t`Filter by order status`, choiceFunction: StatusFilterOptions(ModelType.build) }, - { - name: 'overdue', - label: t`Overdue`, - type: 'boolean', - description: t`Show overdue status` - }, - { - name: 'assigned_to_me', - type: 'boolean', - label: t`Assigned to me`, - description: t`Show orders assigned to me` - }, + OverdueFilter(), + AssignedToMeFilter(), + MinDateFilter(), + MaxDateFilter(), { name: 'project_code', label: t`Project Code`, description: t`Filter by project code`, choices: projectCodeFilters.choices }, - { - name: 'has_project_code', - label: t`Has Project Code`, - description: t`Filter by whether the purchase order has a project code` - }, + HasProjectCodeFilter(), { name: 'issued_by', label: t`Issued By`, diff --git a/src/frontend/src/tables/purchasing/PurchaseOrderTable.tsx b/src/frontend/src/tables/purchasing/PurchaseOrderTable.tsx index 9eba0509b2..e95166ca75 100644 --- a/src/frontend/src/tables/purchasing/PurchaseOrderTable.tsx +++ b/src/frontend/src/tables/purchasing/PurchaseOrderTable.tsx @@ -25,6 +25,9 @@ import { } from '../ColumnRenderers'; import { AssignedToMeFilter, + HasProjectCodeFilter, + MaxDateFilter, + MinDateFilter, OutstandingFilter, OverdueFilter, StatusFilterOptions, @@ -59,17 +62,15 @@ export function PurchaseOrderTable({ OutstandingFilter(), OverdueFilter(), AssignedToMeFilter(), + MinDateFilter(), + MaxDateFilter(), { name: 'project_code', label: t`Project Code`, description: t`Filter by project code`, choices: projectCodeFilters.choices }, - { - name: 'has_project_code', - label: t`Has Project Code`, - description: t`Filter by whether the purchase order has a project code` - }, + HasProjectCodeFilter(), { name: 'assigned_to', label: t`Responsible`, diff --git a/src/frontend/src/tables/sales/ReturnOrderTable.tsx b/src/frontend/src/tables/sales/ReturnOrderTable.tsx index 889933e805..7e6b35e999 100644 --- a/src/frontend/src/tables/sales/ReturnOrderTable.tsx +++ b/src/frontend/src/tables/sales/ReturnOrderTable.tsx @@ -25,6 +25,9 @@ import { } from '../ColumnRenderers'; import { AssignedToMeFilter, + HasProjectCodeFilter, + MaxDateFilter, + MinDateFilter, OutstandingFilter, OverdueFilter, StatusFilterOptions, @@ -50,17 +53,15 @@ export function ReturnOrderTable({ params }: Readonly<{ params?: any }>) { OutstandingFilter(), OverdueFilter(), AssignedToMeFilter(), + MinDateFilter(), + MaxDateFilter(), { name: 'project_code', label: t`Project Code`, description: t`Filter by project code`, choices: projectCodeFilters.choices }, - { - name: 'has_project_code', - label: t`Has Project Code`, - description: t`Filter by whether the purchase order has a project code` - }, + HasProjectCodeFilter(), { name: 'assigned_to', label: t`Responsible`, diff --git a/src/frontend/src/tables/sales/SalesOrderTable.tsx b/src/frontend/src/tables/sales/SalesOrderTable.tsx index b96aa3f2cc..96d9da6389 100644 --- a/src/frontend/src/tables/sales/SalesOrderTable.tsx +++ b/src/frontend/src/tables/sales/SalesOrderTable.tsx @@ -26,6 +26,9 @@ import { } from '../ColumnRenderers'; import { AssignedToMeFilter, + HasProjectCodeFilter, + MaxDateFilter, + MinDateFilter, OutstandingFilter, OverdueFilter, StatusFilterOptions, @@ -57,17 +60,15 @@ export function SalesOrderTable({ OutstandingFilter(), OverdueFilter(), AssignedToMeFilter(), + MinDateFilter(), + MaxDateFilter(), { name: 'project_code', label: t`Project Code`, description: t`Filter by project code`, choices: projectCodeFilters.choices }, - { - name: 'has_project_code', - label: t`Has Project Code`, - description: t`Filter by whether the purchase order has a project code` - }, + HasProjectCodeFilter(), { name: 'assigned_to', label: t`Responsible`, diff --git a/src/frontend/src/tables/settings/TemplateTable.tsx b/src/frontend/src/tables/settings/TemplateTable.tsx index 30db4b931b..ffb915e8cb 100644 --- a/src/frontend/src/tables/settings/TemplateTable.tsx +++ b/src/frontend/src/tables/settings/TemplateTable.tsx @@ -355,7 +355,7 @@ export function TemplateTable({ name: 'enabled', label: t`Enabled`, description: t`Filter by enabled status`, - type: 'checkbox' + type: 'boolean' }, { name: 'model_type',