change component folders && add multipleselector && send img of doctor page && send skills to create doctor item

components/panel/addDoctor/form/fields/FieldDate.js

@@ -1,7 +1,7 @@
 import { useState } from "react";
 
 import { convertToJalali } from "@/helper";
-import EditField from "@/app/component/EditField";
+import EditField from "@/app/component/fields/EditField";
 import ButtonDate from "@/app/component/ButtonDate";
 import CalendarPD from "@/components/icons/CalendarPD";
 import ContentText from "@/app/component/ContentText";

components/panel/addDoctor/form/fields/Selector.js

@@ -9,7 +9,7 @@ function Selector({ updateData, nameKey, label, name, list }) {
       options={list}
       getOptionLabel={(option) => option[nameKey] || ""}
       isOptionEqualToValue={(option, value) => option.id === value.id}
-      className="!w-full !rounded-lg auto-complete-selector "
+      className="!w-full !rounded-lg auto-complete-selector"
       onChange={(e, newValue) => {
         if (newValue) {
           updateData && updateData(newValue.id, "value", name);

components/panel/addDoctor/form/index.js

@@ -1,15 +1,18 @@
+import { useEffect, useState } from "react";
 import FieldDate from "./fields/FieldDate";
 import RadioGender from "./fields/RadioGender";
 import SendReq from "./sendReq";
 import Selector from "./fields/Selector";
 
 // Components
-import EditField from "@/app/component/EditField";
+import EditField from "@/app/component/fields/EditField";
 import ContentText from "@/app/component/ContentText";
 
 // Data
 import specialties from "@/data/specialties.json";
 import education from "@/data/education.json";
+import MultipleSelect from "@/app/component/selectors/MultipleSelect";
+import { request } from "@/services/response";
 
 const validate_medical_number = {
   min: 1,
@@ -17,6 +20,8 @@ const validate_medical_number = {
 };
 
 function Form({ image, data, setData, resetData }) {
+  const [services, setServices] = useState([]);
+
   const changeData = (value, type, name) => {
     type !== "isEdit" &&
       setData((prev) => {
@@ -38,6 +43,18 @@ function Form({ image, data, setData, resetData }) {
   };
   const filteredSpe = specialties.filter((item) => item.parent);
 
+  useEffect(() => {
+    request
+      .getDoctorServices()
+      .then((res) => {
+        setServices(res.data);
+      })
+      .catch((err) => {
+        console.log(err);
+      });
+  }, []);
+  console.log(services);
+
   return (
     <>
       <div className="mt-[24px] sm-modal scroll-mui md:mt-[26px] lg:mt-[28px] grid grid-cols-1 md:grid-cols-2 gap-x-[48px] gap-y-[24px]">
@@ -86,29 +103,14 @@ function Form({ image, data, setData, resetData }) {
             nameKey="label"
           />
         </ContentText>
-        <ContentText text="توضیحات">
-          <EditField
-            multiline={5}
-            placeholder="درباره سوابق خود توضیحاتی بنویسید..."
-            isTransparent={true}
-            iconGray={true}
-            changeData={changeData}
-            data={data?.description}
-            name="description"
-          />
-        </ContentText>
         <ContentText text="مهارت ها">
-          <EditField
-            multiline={5}
-            placeholder="مهارت های خود را بنویسید..."
-            isTransparent={true}
-            iconGray={true}
-            changeData={changeData}
-            data={data?.skills}
+          <MultipleSelect
             name="skills"
+            list={services}
+            updateData={changeData}
+            value={data?.skills.value}
           />
         </ContentText>
-
         <ContentText text="شماره موبایل">
           <EditField
             isTransparent={true}
@@ -124,6 +126,17 @@ function Form({ image, data, setData, resetData }) {
         <ContentText text="جنسیت">
           <RadioGender changeData={changeData} name="gender" />
         </ContentText>
+        <ContentText text="توضیحات">
+          <EditField
+            multiline={5}
+            placeholder="درباره سوابق خود توضیحاتی بنویسید..."
+            isTransparent={true}
+            iconGray={true}
+            changeData={changeData}
+            data={data?.description}
+            name="description"
+          />
+        </ContentText>
       </div>
       <SendReq img={image} data={data} resetData={resetData} />
     </>

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

@@ -4,7 +4,6 @@ import { request } from "@/services/response";
 import { Button } from "@mui/material";
 import { useState } from "react";
 import { transformData } from "./function";
-import { defaultState } from "../../defaultState";
 
 function SendReq({ img, data, resetData }) {
   const [loading, setLoading] = useState(false);