handle filter list city by url

2025-05-03 16:13:25 +03:30
parent 6a805bc627
commit 4c49090a5b
4 changed files with 100 additions and 52 deletions
@@ -0,0 +1,74 @@
+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({
+  states,
+  selected,
+  updateData,
+  handleClose,
+  filteredCities,
+  provinceSelected,
+  isProvinceInclude,
+}) {
+  const citySelected = selected.city;
+
+  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
+            updateData={updateData}
+            value={selected && provinceSelected}
+            disabled={isProvinceInclude}
+            list={states}
+            label="استان"
+            name="province"
+          />
+          <AutoCompleteSelect
+            updateData={updateData}
+            value={
+              selected &&
+              citySelected &&
+              filteredCities.find((item) => item.label === citySelected) &&
+              citySelected
+            }
+            list={filteredCities}
+            name="city"
+            label="شهر"
+            disabled={
+              !isProvinceInclude ||
+              !provinceSelected ||
+              filteredCities.length === 0
+            }
+          />
+        </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={handleClose}
+            variant="contained"
+            color="primary"
+            disabled={!provinceSelected || !citySelected}
+          >
+            تایید و ادامه
+            <ArrowLeftM />
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default Content;