change name office-info && change name img uploaded && change theme selector && set default tab in appo page && clean code

app/component/Tabs.js

@@ -28,11 +28,11 @@ function Tabs({ value, handleChange, listTab, inactives, isSm, style }) {
             {...a11yProps(idx)}
             sx={{
               "&.MuiButtonBase-root": {
-                width: !isSm && "fit-content !important",
+                width: !isSm ? "fit-content !important" : undefined, // Fix: Replace `false` with `undefined`
-                minWidth: !isSm && "fit-content !important",
+                minWidth: !isSm ? "fit-content !important" : undefined,
               },
               "&.MuiButtonBase-root:first-child": {
-                marginLeft: !isSm && "9px !important",
+                marginLeft: !isSm ? "9px !important" : undefined,
               },
             }}
             className={`

app/component/date/dateTime/index.js

@@ -3,16 +3,14 @@
 import { useEffect, useState } from "react";
 import Hours from "./hours";
 import Tabs from "../../Tabs";
-import { Button } from "@mui/material";
-import ArrowLeftB from "@/components/icons/ArrowLeftB";
 import { request } from "@/services/response";
-import { useParams, useSearchParams } from "next/navigation";
+import { useParams } from "next/navigation";
 import SendAppo from "./SendAppo";
 
 const listTab = ["صبح", "بعد از ظهر"];
 const nameHours = ["hours_morning", "hours_afternoon"];
 
-function DateTime({ date, doctor, setStep, setIsError, locateVisit }) {
+function DateTime({ date, doctor }) {
   const params = useParams();
   const doctorId = params.doctorId;
   const [value, setValue] = useState(0);
@@ -32,6 +30,9 @@ function DateTime({ date, doctor, setStep, setIsError, locateVisit }) {
         .getAppointment(doctorId, date)
         .then((res) => {
           setAppo(res);
+          if (res.morning?.length && res.evening?.length) setValue(0);
+          else if (res.morning?.length && value !== 0) setValue(0);
+          else if (res.evening?.length && value !== 1) setValue(1);
         })
         .catch((err) => {
           setAppo("در حال حاضر، نوبتی برای ساعت‌های صبح موجود نمی‌باشد.");

app/component/selectors/GroupedSelect.js

@@ -1,7 +1,6 @@
 import MenuItem from "@mui/material/MenuItem";
 import ListSubheader from "@mui/material/ListSubheader";
 import Select from "@mui/material/Select";
-import { useState } from "react";
 import { styleTextSelectRight } from "@/mui";
 import IconMultipleSelect from "@/components/icons/IconMultipleSelect";
 

app/component/uploadFile/Crop.js

@@ -8,9 +8,10 @@ function Crop({ data, uploadImg, handleClose }) {
   const [zoom, setZoom] = useState(1);
   const [croppedAreaPixels, setCroppedAreaPixels] = useState(null);
 
-  const onComplete = async (imagePromise) => {
+  const onComplete = async (imagePromise, name) => {
     const dataUrl = await imagePromise;
-    const file = dataURLtoFile(dataUrl, "cropped-image.jpg");
+
+    const file = dataURLtoFile(dataUrl, name);
 
     uploadImg({ blob: dataUrl, file });
   };
@@ -22,7 +23,7 @@ function Crop({ data, uploadImg, handleClose }) {
           <Cropper
             crop={crop}
             zoom={zoom}
-            aspect={4 / 3}
+            aspect={1}
             image={data.blob}
             onCropChange={setCrop}
             onCropComplete={(_, croppedAreaPixels) =>
@@ -42,7 +43,9 @@ function Crop({ data, uploadImg, handleClose }) {
         </Button>
         <Button
           variant="contained"
-          onClick={() => onComplete(cropImage(data.blob, croppedAreaPixels))}
+          onClick={() =>
+            onComplete(cropImage(data.blob, croppedAreaPixels), data.file?.name)
+          }
           className="!text-[16px] !max-w-[calc(50%_-_8px)] !font-medium !shadow-none !py-[5px] md:!py-[7px] lg:!py-[9px]"
         >
           ذخیره

app/globals.css

@@ -714,6 +714,10 @@ html {
   color: #fafafa;
 }
 
+.MuiPaper-root .MuiList-root .MuiListSubheader-root {
+  background: #5559ce;
+}
+
 .panel-jalaali {
   width: 464px !important;
 }

components/appointment/index.js

@@ -5,7 +5,6 @@ import { useState } from "react";
 import Content from "./Content";
 import Layout from "@/components/layout";
 import doctors from "@/data/doctors.json";
-import Date from "@/components/appointment/date";
 import RegisterPage from "@/components/register";
 import Paying from "@/components/appointment/paying";
 import Detail from "@/components/appointment/detail";
@@ -13,6 +12,7 @@ import FailedPay from "@/components/appointment/failedPay";
 import LogInPage from "@/components/register/LogInPage";
 import SuccessPay from "@/components/appointment/successPay";
 import VerificationPage from "@/components/register/verificationPage";
+import Date from "./date";
 
 function AppointmentPage({ slug, matchedCity }) {
   const doctor = doctors.find((item) => item.id === +slug);

components/clinics/head/modal/index.js

@@ -52,8 +52,6 @@ function ModalSearchCity() {
           <SettingD />
         </div>
         <p className="text-[#616161] text-[11px] sm:text-[13px] md:text-[15px] lg:text-[16px] font-medium mx-2">
-          {/* {selected.first && selected.second ?
-                        `${selected.first} | ${selected.second}` : 'فیلترها'} */}
           فیلترها
         </p>
         <div className="w-[16px] h-[16px] md:w-[20px] md:h-[20px] lg:w-[24px] lg:h-[24px]">

components/panel/addDoctor/form/Fields.js

@@ -1,4 +1,5 @@
 import Selector from "./fields/Selector";
+import ContentText from "@/app/component/ContentText";
 import EditField from "@/app/component/fields/EditField";
 import GroupedSelect from "@/app/component/selectors/GroupedSelect";
 import MultipleSelect from "@/app/component/selectors/MultipleSelect";
@@ -6,7 +7,6 @@ import MultipleSelect from "@/app/component/selectors/MultipleSelect";
 // Data
 import specialties from "@/data/specialties.json";
 import education from "@/data/education.json";
-import ContentText from "@/app/component/ContentText";
 
 const validate_medical_number = {
   min: 1,

components/panel/addDoctor/form/index.js

@@ -51,8 +51,8 @@ function Form({ image, data, setData, resetData }) {
         <Fields
           data={data}
           services={services}
-          changeData={changeData}
           updateNum={updateNum}
+          changeData={changeData}
         />
         <div className="flex flex-col gap-y-[24px]">
           <FieldDate changeListData={changeData} data={data?.time_work} />

components/panel/addDoctor/form/sendReq/index.js

@@ -1,9 +1,10 @@
 import ArrowLeftPA from "@/components/icons/ArrowLeftPA";
-import { checkAllValues } from "@/helper";
+import { alert, checkAllValues } from "@/helper";
 import { request } from "@/services/response";
 import { Button } from "@mui/material";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { transformData } from "./function";
+import { toast, ToastContainer } from "react-toastify";
 
 function SendReq({ img, data, resetData }) {
   const [loading, setLoading] = useState(false);
@@ -17,12 +18,16 @@ function SendReq({ img, data, resetData }) {
 
     request
       .postDoctor(transformed)
-      .then(() => {
+      .then((res) => {
-        resetData();
+        if (res.id) {
-        setLoading(false);
+          alert("success", "پزشک جدید با موفقیت اضافه شد!");
+          resetData();
+          setLoading(false);
+        }
       })
       .catch(() => {
         setLoading(false);
+        alert("error", "خطا در ثبت پزشک! لطفاً دوباره تلاش کنید.");
       });
   };
 

services/response.js

@@ -64,7 +64,7 @@ export const request = {
     api.post("file/upload/clinic_pro/doctor/field_image", data, {
       headers: {
         "Content-Type": "application/octet-stream",
-        "Content-Disposition": 'file; filename="filename.jpg"',
+        "Content-Disposition": `file; filename="${data.name}"`,
         "X-CSRF-Token": "",
       },
     }),