52 lines
1.6 KiB
JavaScript
52 lines
1.6 KiB
JavaScript
import {IconButton, Paper, TextField} from '@mui/material';
|
|
import ArtTrackIcon from '@mui/icons-material/ArtTrack';
|
|
import {useEffect, useState} from "react";
|
|
import FilterBox from "@/components/FilterBox";
|
|
|
|
const TextFieldWithFnBox = ({formik, id , header, defaultValue, defaultFilter , columnFilterModeOptions ,onSelectFilter}) => {
|
|
|
|
const [anchorEl, setAnchorEl] = useState(null);
|
|
const [open, setOpen] = useState(false);
|
|
|
|
useEffect(() => {
|
|
formik.setFieldValue(id, defaultValue || '');
|
|
}, []);
|
|
|
|
const handleClick = (event) => {
|
|
setOpen((prevOpen) => !prevOpen);
|
|
setAnchorEl(anchorEl ? null : event.currentTarget);
|
|
};
|
|
|
|
const handleClose = () => {
|
|
setOpen(false);
|
|
setAnchorEl(null);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<TextField
|
|
name={id}
|
|
label={header}
|
|
id={id}
|
|
onChange={formik.handleChange}
|
|
fullWidth
|
|
value={formik.values[id]}
|
|
margin="normal"
|
|
InputProps={{
|
|
endAdornment: (
|
|
<IconButton onClick={handleClick}>
|
|
<ArtTrackIcon />
|
|
</IconButton>
|
|
)
|
|
}}
|
|
sx={{
|
|
position: 'relative'
|
|
}}
|
|
/>
|
|
<FilterBox anchorEl={anchorEl} open={open} handleClose={handleClose} columnFilterModeOptions={columnFilterModeOptions} onSelectFilter={onSelectFilter} defaultFilter={defaultFilter}/>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default TextFieldWithFnBox;
|