83 lines
2.3 KiB
JavaScript
83 lines
2.3 KiB
JavaScript
import { Button } from "@mui/material";
|
|
|
|
// Icon
|
|
import CloseModalD from "@/components/icons/CloseModalD";
|
|
import AutoCompleteSelect from "@/app/component/element/AutoCompleteSelect";
|
|
import ArrowLeftM from "@/components/icons/ArrowLeftM";
|
|
|
|
function Content({
|
|
state,
|
|
states,
|
|
selected,
|
|
updateData,
|
|
handleClose,
|
|
filteredCities,
|
|
handleSearch,
|
|
}) {
|
|
const citySelected = selected.city;
|
|
const listboxProps = {
|
|
style: {
|
|
maxHeight: 200,
|
|
overflow: "auto",
|
|
},
|
|
};
|
|
|
|
const handleFilter = () => {
|
|
handleSearch && handleSearch("");
|
|
handleClose();
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<div className="flex justify-end w-full">
|
|
<div className="cursor-pointer" onClick={handleClose}>
|
|
<CloseModalD />
|
|
</div>
|
|
</div>
|
|
<div className="md:p-[24px] pt-0">
|
|
<p className="text-[#525252] mt-[38px] md:mt-4 text-[16px] font-medium text-center">
|
|
شهر یا استان مورد نظر را انتخاب نمایید:
|
|
</p>
|
|
<div className="flex md:min-w-[344px] flex-col mt-[52px] md:mt-[44px] mb-14 justify-center items-center gap-10">
|
|
<AutoCompleteSelect
|
|
value={selected.province}
|
|
disabled={state}
|
|
listboxProps={listboxProps}
|
|
updateData={updateData}
|
|
list={states}
|
|
label="استان"
|
|
name="province"
|
|
/>
|
|
<AutoCompleteSelect
|
|
updateData={updateData}
|
|
listboxProps={listboxProps}
|
|
value={
|
|
selected &&
|
|
citySelected &&
|
|
filteredCities.find((item) => item.name === citySelected) &&
|
|
citySelected
|
|
}
|
|
list={filteredCities}
|
|
name="city"
|
|
label="شهر"
|
|
disabled={!selected.province}
|
|
/>
|
|
</div>
|
|
<div className="w-full flex justify-end">
|
|
<Button
|
|
className="!w-full md:!w-fit !flex !px-3 items-center justify-center gap-1 mr-auto"
|
|
onClick={handleFilter}
|
|
variant="contained"
|
|
color="primary"
|
|
disabled={!selected.city || !selected.province}
|
|
>
|
|
تایید و ادامه
|
|
<ArrowLeftM />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Content; |