handle change data in doctor model, set previous data when user close modal, update list doctor after update data and change key name in url

2025-09-05 23:05:02 +03:30
parent ebfe47468c
commit dc40129034
13 changed files with 175 additions and 56 deletions
@@ -0,0 +1,94 @@
+import { Button } from "@mui/material";
+import specialties from "@/data/specialties.json";
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+import { request } from "@/services/response";
+
+function ButtonApply({
+  data,
+  setConfirmedData,
+  matchedCity,
+  matchedState,
+  setOpen,
+  setDoctors,
+}) {
+  const router = useRouter();
+  const [loading, setLoading] = useState(false);
+
+  const sendReq = () => {
+    setLoading(true);
+
+    const params = new URLSearchParams(window.location.search);
+    const field = params.get("field");
+    const gender = params.get("gender");
+    const degree = params.get("degree");
+    const turn = params.get("turn");
+
+    const requestData = {
+      field: field === "null" ? null : field,
+      gender,
+      degree,
+      turn,
+      city: matchedCity?.id || null,
+      state: matchedState?.id || null,
+    };
+
+    request
+      .getDoctors(requestData)
+      .then((res) => {
+        if (res && res.data) setDoctors(res.data);
+      })
+      .catch((err) => {})
+      .finally(() => {
+        setOpen(false);
+        setLoading(false);
+      });
+  };
+
+  const applyFilters = () => {
+    const current = new URLSearchParams();
+
+    const mappings = [
+      {
+        key: "field",
+        getValue: () => {
+          if (data.category) {
+            const children = specialties.filter(
+              (item) => item.parent === data.category.id
+            );
+            return children.length > 0 ? children[0].id : data.category.id;
+          }
+          return null;
+        },
+      },
+      { key: "gender", getValue: () => data.gender || null },
+      { key: "degree", getValue: () => data.degree || null },
+      { key: "turn", getValue: () => data.turn },
+    ];
+
+    mappings.forEach(({ key, getValue }) => {
+      const value = getValue();
+      current.set(key, value);
+    });
+
+    const queryString = current.toString();
+    setConfirmedData(data);
+    sendReq();
+    router.push(`/doctors?${queryString}`);
+  };
+
+  return (
+    <div className="flex justify-end w-full">
+      <Button
+        loading={loading}
+        variant="contained"
+        onClick={applyFilters}
+        className="!px-3 !py-2 !text-[16px] !font-medium"
+      >
+        اعمال تغییرات
+      </Button>
+    </div>
+  );
+}
+
+export default ButtonApply;