feat(num-filter.tsx): created to handle numerical inputs
This commit is contained in:
parent
21d47b1f90
commit
55ba6031eb
@ -227,7 +227,7 @@ export const _products: Product[] = [
|
|||||||
|
|
||||||
export const _filters: Filter[] = [
|
export const _filters: Filter[] = [
|
||||||
{ id: 1, label: 'Rechnungsnummer', name: 'invoiceNumber', type: 'VARCHAR' },
|
{ id: 1, label: 'Rechnungsnummer', name: 'invoiceNumber', type: 'VARCHAR' },
|
||||||
{ id: 2, label: 'Kundenname', name: 'customerName', type: 'VARCHAR' },
|
{ id: 2, label: 'Kundenname', name: 'customerName', type: 'INTEGER' },
|
||||||
{ id: 3, label: 'Startdatum', name: 'startDate', type: 'DATE' },
|
{ id: 3, label: 'Startdatum', name: 'startDate', type: 'DATE' },
|
||||||
{ id: 4, label: 'Enddatum', name: 'endDate', type: 'DATE' },
|
{ id: 4, label: 'Enddatum', name: 'endDate', type: 'DATE' },
|
||||||
{ id: 5, label: 'Status der Rechnung', name: 'status', type: 'VARCHAR' },
|
{ id: 5, label: 'Status der Rechnung', name: 'status', type: 'VARCHAR' },
|
||||||
|
|||||||
26
src/client/dd-hub-react/src/sections/document/num-filter.tsx
Normal file
26
src/client/dd-hub-react/src/sections/document/num-filter.tsx
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
import TextField from '@mui/material/TextField';
|
||||||
|
// ----------------------------------------------------------------------
|
||||||
|
|
||||||
|
type BoolFilterProps = {
|
||||||
|
label: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function IntFilter({ label }: BoolFilterProps) {
|
||||||
|
return (
|
||||||
|
<TextField
|
||||||
|
type="number"
|
||||||
|
label={label}
|
||||||
|
variant="standard"
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function DecimalFilter({ label }: BoolFilterProps) {
|
||||||
|
return (
|
||||||
|
<TextField
|
||||||
|
type="number"
|
||||||
|
label={label}
|
||||||
|
variant="standard"
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -1,3 +1,4 @@
|
|||||||
|
import React from 'react';
|
||||||
import { useState, useCallback, useEffect } from 'react';
|
import { useState, useCallback, useEffect } from 'react';
|
||||||
|
|
||||||
import Box from '@mui/material/Box';
|
import Box from '@mui/material/Box';
|
||||||
@ -14,6 +15,7 @@ import { Iconify } from 'src/components/iconify';
|
|||||||
|
|
||||||
import { DocItem } from '../doc-item';
|
import { DocItem } from '../doc-item';
|
||||||
import { BoolFilter } from '../bool-filter';
|
import { BoolFilter } from '../bool-filter';
|
||||||
|
import { DecimalFilter, IntFilter } from '../num-filter';
|
||||||
|
|
||||||
import type { IDocItem } from '../doc-item';
|
import type { IDocItem } from '../doc-item';
|
||||||
// ----------------------------------------------------------------------
|
// ----------------------------------------------------------------------
|
||||||
@ -104,9 +106,13 @@ export function DocSearchView({ posts }: Props) {
|
|||||||
case 'BOOLEAN':
|
case 'BOOLEAN':
|
||||||
filterComp = <BoolFilter label={filter.label ?? filter.name} />
|
filterComp = <BoolFilter label={filter.label ?? filter.name} />
|
||||||
break;
|
break;
|
||||||
case 'VARCHAR':
|
|
||||||
case 'INTEGER':
|
case 'INTEGER':
|
||||||
|
filterComp = <IntFilter label={filter.label ?? filter.name} />
|
||||||
|
break;
|
||||||
case 'DECIMAL':
|
case 'DECIMAL':
|
||||||
|
filterComp = <DecimalFilter label={filter.label ?? filter.name} />
|
||||||
|
break;
|
||||||
|
case 'VARCHAR':
|
||||||
case 'DATE':
|
case 'DATE':
|
||||||
default:
|
default:
|
||||||
filterComp = <TextField id={`filter-${filter.id.toString()}`} label={filter.label ?? filter.type} variant="filled" />
|
filterComp = <TextField id={`filter-${filter.id.toString()}`} label={filter.label ?? filter.type} variant="filled" />
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user