diff options
author | Herbert Eiselt <herbert.eiselt@highstreet-technologies.com> | 2019-02-28 15:23:42 +0100 |
---|---|---|
committer | Herbert Eiselt <herbert.eiselt@highstreet-technologies.com> | 2019-02-28 15:24:28 +0100 |
commit | 7446f23b3abc30d7c53f2eaa951742371c071171 (patch) | |
tree | b76a8d2e64c7aa850c09f8e69f01e7a262ab5cd5 /sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx | |
parent | 49b155ec687cdf58fb51fe8245a2f5f4582b68f0 (diff) |
UX extensions
UX Maintenance client and further changes
Change-Id: I7643661d17db5fc3d3f94b58cb42ed0be558c64f
Issue-ID: SDNC-583
Signed-off-by: Herbert Eiselt <herbert.eiselt@highstreet-technologies.com>
Diffstat (limited to 'sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx')
-rw-r--r-- | sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx | 26 |
1 files changed, 15 insertions, 11 deletions
diff --git a/sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx b/sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx index 68e47d7ee..e21855abb 100644 --- a/sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx +++ b/sdnr/wt/odlux/framework/src/components/material-table/tableFilter.tsx @@ -7,6 +7,7 @@ import { withStyles, WithStyles, createStyles, Theme } from '@material-ui/core/s import TableCell from '@material-ui/core/TableCell'; import TableRow from '@material-ui/core/TableRow'; import Input from '@material-ui/core/Input'; +import { Select, FormControl, InputLabel, MenuItem } from '@material-ui/core'; const styles = (theme: Theme) => createStyles({ @@ -27,7 +28,7 @@ interface IEnhancedTableFilterComponentProps extends WithStyles<typeof styles> { } class EnhancedTableFilterComponent extends React.Component<IEnhancedTableFilterComponentProps> { - createFilterHandler = (property: string) => (event: React.ChangeEvent<HTMLInputElement>) => { + createFilterHandler = (property: string) => (event: React.ChangeEvent<HTMLInputElement|HTMLSelectElement|HTMLTextAreaElement>) => { this.props.onFilterChanged && this.props.onFilterChanged(property, event.target.value); }; @@ -35,11 +36,11 @@ class EnhancedTableFilterComponent extends React.Component<IEnhancedTableFilterC const { columns, filter, classes } = this.props; return ( <TableRow> - { this.props.enableSelection + { this.props.enableSelection ? <TableCell padding="checkbox" style={ { width: "50px" } }> </TableCell> : null - } + } { columns.map(col => { const style = col.width ? { width: col.width } : {}; return ( @@ -48,14 +49,17 @@ class EnhancedTableFilterComponent extends React.Component<IEnhancedTableFilterC padding={ col.disablePadding ? 'none' : 'default' } style={ style } > - { col.disableFilter || (col.type === ColumnType.custom) ? null : <Input - className={ classes.input } - inputProps={ { - 'aria-label': 'Filter', - } } - value={ filter[col.property] || '' } - onChange={ this.createFilterHandler(col.property) } - /> } + { col.disableFilter || (col.type === ColumnType.custom) + ? null + : (col.type === ColumnType.boolean) + ? <Select className={classes.input} value={filter[col.property] !== undefined ? filter[col.property] : ''} onChange={this.createFilterHandler(col.property)} inputProps={{ name: `${col.property}-bool`, id: `${col.property}-bool` }} > + <MenuItem value={undefined}> + <em>None</em> + </MenuItem> + <MenuItem value={true as any as string}>{ col.labels ? col.labels["true"]:"true"}</MenuItem> + <MenuItem value={false as any as string}>{ col.labels ? col.labels["false"] : "false"}</MenuItem> + </Select> + : <Input className={classes.input} inputProps={{ 'aria-label': 'Filter' }} value={filter[col.property] || ''} onChange={this.createFilterHandler(col.property)} />} </TableCell> ); }, this) } |