This commit is contained in:
AmirHossein Mahmoodi
2024-01-20 14:40:51 +03:30
3 changed files with 22 additions and 12 deletions

View File

@@ -24,22 +24,21 @@ const ProvinceFilter = ({formik, multiple, setFilteredText}) => {
const t = useTranslations();
const provinceChange = (event) => {
const {target: {value}} = event;
formik.handleChange(event);
formik.setFieldValue('province_id', value);
if (Array.isArray(value)) {
const province_names = []
const province_names = [];
value.map((item) => {
province_names.push(provinceList.find(province => province.id === item).name)
})
setFilteredText(prevState => ({
...prevState,
province: province_names.length !== 0 ? `| ${t("filters.provinces")}: ${province_names.join(' , ')}` : ""
province: province_names.length !== 0 ? `${t("filters.provinces")}: ${province_names.join(' , ')}` : ""
}));
} else {
const selectedProvince = provinceList.find(province => province.id === value);
setFilteredText(prevState => ({
...prevState,
province: `| ${t("filters.province")}: ${selectedProvince.name}`
province: `${t("filters.province")}: ${selectedProvince.name}`
}));
}
};
@@ -78,10 +77,10 @@ const ProvinceFilter = ({formik, multiple, setFilteredText}) => {
!needAdorment ?
<InputAdornment position="end" sx={{mr: 2}}>
<IconButton
onClick={() => multiple
? formik.setFieldValue('province_id', [])
: formik.setFieldValue('province_id', "")
}
onClick={() => {
multiple ? formik.setFieldValue('province_id', []) : formik.setFieldValue('province_id', "")
setFilteredText(prevState => ({...prevState, province: t("filters.all_provinces")}))
}}
size="small">
<ClearIcon/>
</IconButton>

View File

@@ -25,8 +25,12 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
const t = useTranslations();
const filter_by_province = filterItem.find((item) => item.type === "province");
const filter_by_year = filterItem.find((item) => item.type === "year");
const [expanded, setExpanded] = useState(false);
const [filteredText, setFilteredText] = useState({province: "", year: ""});
const [expanded, setExpanded] = useState(true);
const [filteredText, setFilteredText] = useState({
...(filter_by_province ? {province: t("filters.all_provinces")} : {}),
...(filter_by_year ? {year: ""} : {})
});
const [textFilter, setTextFilter] = useState()
const [stepValue, setStepValue] = useState({
...(filter_by_year && {
date: filter_by_year.multiple ? [] : `${moment().format('jYYYY')}`
@@ -55,10 +59,15 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
: []
),
].filter(Boolean);
setFilterOption(fields)
setFilterOption(fields);
textMaker();
},
});
const textMaker = (() => {
setTextFilter(`| ${Object.values(filteredText).join(", ")}`)
});
useEffect(() => {
const province = formik.values.province_id;
const fields = [
@@ -73,6 +82,7 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
: []
),
].filter(Boolean);
setTextFilter(`| ${Object.values(filteredText).join(", ")}`)
}, []);
return (
@@ -89,7 +99,7 @@ const Filter = ({title, filterItem, setFilterOption, isLoadingReportList, mutate
<EqualizerIcon sx={{color: "primary.main"}}/>
<Typography sx={{fontWeight: 500, color: "primary.main"}}>{title}</Typography>
<Typography variant="caption" sx={{fontWeight: 500}} color="error">
{filteredText.province} {filteredText.year}
{textFilter}
</Typography>
</Box>
<Box>