From d75e3c82b7992c6b8ccdfd59435c0978a44abaf5 Mon Sep 17 00:00:00 2001 From: Ehsan Date: Wed, 11 Sep 2024 04:17:39 +0330 Subject: [PATCH] design page general and office information & head panel --- app/component/EditField.js | 14 ++- app/panel/(layout)/add-doctor/page.js | 9 ++ app/panel/(layout)/layout.js | 7 +- components/icons/AddLocationP.js | 6 +- components/icons/ArrowBottomHD.js | 9 ++ components/icons/ArrowLeftButtonP.js | 4 +- components/icons/ArrowLeftPA.js | 10 ++ components/icons/ArrowLeftPU.js | 2 +- components/icons/CalendarPD.js | 18 ++++ components/icons/CardDA.js | 12 +++ components/icons/LogoutP.js | 11 ++ components/icons/ProfileP.js | 4 +- components/icons/ProfilePA.js | 10 ++ components/icons/SettingPA.js | 10 ++ components/layoutPanel/header/MenuProfile.js | 100 ++++++++++++++++++ components/layoutPanel/header/index.js | 10 +- components/layoutPanel/sidebar/Links.js | 3 +- .../form/Content.js => ContentText.js} | 4 +- components/panel/addDoctor/index.js | 43 ++++++++ .../tabsHead/generalInformation/Head.js | 22 ++++ .../tabsHead/generalInformation/form/Form.js | 81 ++++++++++++++ .../generalInformation/form/RadioGender.js | 21 ++++ .../generalInformation/form/listSelector.js | 6 ++ .../tabsHead/generalInformation/index.js | 13 +++ components/panel/addDoctor/tabsHead/index.js | 37 +++++++ .../tabsHead/officeInformation/Form.js | 68 ++++++++++++ .../tabsHead/officeInformation/index.js | 22 ++++ .../officeInformation/listSelector.js | 13 +++ .../addDoctor/tabsHead/specialDays/index.js | 7 ++ .../panel/addDoctor/tabsHead/turns/index.js | 7 ++ .../addDoctor/tabsHead/workingDays/index.js | 7 ++ components/panel/userAccount/form/index.js | 34 +++--- data/information.json | 1 + 33 files changed, 588 insertions(+), 37 deletions(-) create mode 100644 app/panel/(layout)/add-doctor/page.js create mode 100644 components/icons/ArrowBottomHD.js create mode 100644 components/icons/ArrowLeftPA.js create mode 100644 components/icons/CalendarPD.js create mode 100644 components/icons/CardDA.js create mode 100644 components/icons/LogoutP.js create mode 100644 components/icons/ProfilePA.js create mode 100644 components/icons/SettingPA.js create mode 100644 components/layoutPanel/header/MenuProfile.js rename components/panel/{userAccount/form/Content.js => ContentText.js} (75%) create mode 100644 components/panel/addDoctor/index.js create mode 100644 components/panel/addDoctor/tabsHead/generalInformation/Head.js create mode 100644 components/panel/addDoctor/tabsHead/generalInformation/form/Form.js create mode 100644 components/panel/addDoctor/tabsHead/generalInformation/form/RadioGender.js create mode 100644 components/panel/addDoctor/tabsHead/generalInformation/form/listSelector.js create mode 100644 components/panel/addDoctor/tabsHead/generalInformation/index.js create mode 100644 components/panel/addDoctor/tabsHead/index.js create mode 100644 components/panel/addDoctor/tabsHead/officeInformation/Form.js create mode 100644 components/panel/addDoctor/tabsHead/officeInformation/index.js create mode 100644 components/panel/addDoctor/tabsHead/officeInformation/listSelector.js create mode 100644 components/panel/addDoctor/tabsHead/specialDays/index.js create mode 100644 components/panel/addDoctor/tabsHead/turns/index.js create mode 100644 components/panel/addDoctor/tabsHead/workingDays/index.js diff --git a/app/component/EditField.js b/app/component/EditField.js index 6d19499..3a69320 100644 --- a/app/component/EditField.js +++ b/app/component/EditField.js @@ -2,11 +2,13 @@ import EditGrayA from "@/components/icons/EditGrayA" import EditOrangeA from "@/components/icons/EditOrangeA" import { Button, TextField } from "@mui/material" -function EditField({ changeData, icon, placeholder, data, name, iconGray, isTransparent }) { +function EditField({ changeData, multiline, icon, placeholder, data, name, iconGray, isTransparent }) { return (
+ +
+ + + + +
+ + + ) +} + +export default MenuProfile \ No newline at end of file diff --git a/components/layoutPanel/header/index.js b/components/layoutPanel/header/index.js index fc2b0e0..53c3d08 100644 --- a/components/layoutPanel/header/index.js +++ b/components/layoutPanel/header/index.js @@ -1,7 +1,8 @@ import Icons from "./Icons" +import MenuProfile from "./MenuProfile" import Search from "./Search" -function Header() { +function Header({ disableProfile, data }) { return (
- +
+ + {!disableProfile && ( + + )} +
) } diff --git a/components/layoutPanel/sidebar/Links.js b/components/layoutPanel/sidebar/Links.js index 431cf2f..54141a0 100644 --- a/components/layoutPanel/sidebar/Links.js +++ b/components/layoutPanel/sidebar/Links.js @@ -13,7 +13,7 @@ function Links() { const list = [ { name: 'دشبورد', src: '/panel/dashboard', icon: }, { name: 'حساب کاربری', src: '/panel/user-account', icon: }, - { name: 'اضافه کردن پزشک', src: '/', icon: }, + { name: 'اضافه کردن پزشک', src: '/panel/add-doctor', icon: }, { name: 'نوبت ها', src: '/', icon: } ]; @@ -24,7 +24,6 @@ function Links() { {list.map((item, idx) => (
  • +
    • + ) +} + +export default Head \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/generalInformation/form/Form.js b/components/panel/addDoctor/tabsHead/generalInformation/form/Form.js new file mode 100644 index 0000000..c40c308 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/generalInformation/form/Form.js @@ -0,0 +1,81 @@ +import { useState } from "react"; +import ContentText from "@/components/panel/ContentText"; +import EditField from "@/app/component/EditField"; +import AutoCompleteSelect from "@/app/component/element/AutoCompleteSelect"; +import { degree } from "./listSelector"; +import CalendarPD from "@/components/icons/CalendarPD"; +import RadioGender from "./RadioGender"; +import { Button } from "@mui/material"; +import ArrowLeftPA from "@/components/icons/ArrowLeftPA"; + +function Form() { + + const [data, setData] = useState({ + name: { value: 'احسان احمدی', isEdit: false }, + medical_system_number: { value: 1741025645, isEdit: false }, + expertise: { value: 'دندان پزشکی', isEdit: false }, + description: { value: '', isEdit: false }, + skills: { value: '', isEdit: false }, + time_work: { value: '', isEdit: false }, + }); + const [selected, setSelected] = useState({ + degree: '', + }); + const updateSelect = (event, name) => setSelected({ ...selected, [name]: event.target.innerText }) + + const changeData = (value, type, name) => + setData({ + ...data, + [name]: { + ...data[name], + [type]: value + } + }); + + return ( +
    +
    + + + + + + + + + + + + + + + + + + + + + + + } isTransparent={true} placeholder='انتخاب کنید...' iconGray={true} changeData={changeData} data={data?.time_work} name='time_work' /> + +
    +
    + +
    +
    + ) +} + +export default Form \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/generalInformation/form/RadioGender.js b/components/panel/addDoctor/tabsHead/generalInformation/form/RadioGender.js new file mode 100644 index 0000000..96e5496 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/generalInformation/form/RadioGender.js @@ -0,0 +1,21 @@ +import { FormControlLabel, Radio, RadioGroup } from "@mui/material" + +function RadioGender() { + return ( + + } label="مرد" /> + } label="زن" /> + + ) +} + +export default RadioGender \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/generalInformation/form/listSelector.js b/components/panel/addDoctor/tabsHead/generalInformation/form/listSelector.js new file mode 100644 index 0000000..2ff0fe6 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/generalInformation/form/listSelector.js @@ -0,0 +1,6 @@ +export const degree = [ + { label: 'مدرک 1', id: 10 }, + { label: 'مدرک 2', id: 20 }, + { label: 'مدرک 3', id: 30 }, + { label: 'مدرک 4', id: 40 } +]; \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/generalInformation/index.js b/components/panel/addDoctor/tabsHead/generalInformation/index.js new file mode 100644 index 0000000..1fdafe6 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/generalInformation/index.js @@ -0,0 +1,13 @@ +import Form from "./form/Form"; +import Head from "./Head"; + +function GeneralInformation() { + return ( +
    + +
    +
    + ) +} + +export default GeneralInformation \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/index.js b/components/panel/addDoctor/tabsHead/index.js new file mode 100644 index 0000000..e3217b4 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/index.js @@ -0,0 +1,37 @@ +import Tabs from "@/app/component/Tabs"; + +const listTab = ['اطلاعات عمومی', 'اطلاعات مطب', 'نوبت ها', 'روزهای کاری', 'روزهای خاص']; + +function TabsHead({ value, handleChange }) { + return ( + + ) +} + +export default TabsHead; \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/officeInformation/Form.js b/components/panel/addDoctor/tabsHead/officeInformation/Form.js new file mode 100644 index 0000000..5fbd346 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/officeInformation/Form.js @@ -0,0 +1,68 @@ +'use client'; + +import { useState } from "react"; + +import { city, state } from "./listSelector"; +import EditField from "@/app/component/EditField"; +import ContentText from "@/components/panel/ContentText"; +import AddLocationP from "@/components/icons/AddLocationP"; +import AutoCompleteSelect from "@/app/component/element/AutoCompleteSelect"; + +function Form() { + + const [data, setData] = useState({ + address: { value: '', isEdit: false }, + phone: { value: 1741025645, isEdit: false }, + office_number1: { value: '', isEdit: false }, + office_number2: { value: '', isEdit: false }, + }); + const [selected, setSelected] = useState({ + state: '', + city: '', + }); + const updateSelect = (event, name) => setSelected({ ...selected, [name]: event.target.innerText }) + + const changeData = (value, type, name) => + setData({ + ...data, + [name]: { + ...data[name], + [type]: value + } + }); + + return ( +
    + + + + + + + + } isTransparent={true} placeholder='از روی نقشه انتخاب کنید...' iconGray={true} changeData={changeData} data={data?.address} name='address' /> + + + + + + + + + + +
    + ) +} + +export default Form \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/officeInformation/index.js b/components/panel/addDoctor/tabsHead/officeInformation/index.js new file mode 100644 index 0000000..75cfba9 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/officeInformation/index.js @@ -0,0 +1,22 @@ +import ArrowLeftPA from "@/components/icons/ArrowLeftPA"; +import { Button } from "@mui/material"; +import Form from "./Form"; + +function OfficeInformation() { + return ( +
    + +
    + +
    +
    + ) +} + +export default OfficeInformation \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/officeInformation/listSelector.js b/components/panel/addDoctor/tabsHead/officeInformation/listSelector.js new file mode 100644 index 0000000..6ec7f7d --- /dev/null +++ b/components/panel/addDoctor/tabsHead/officeInformation/listSelector.js @@ -0,0 +1,13 @@ +export const state = [ + { label: 'استان 1', id: 10 }, + { label: 'استان 2', id: 20 }, + { label: 'استان 3', id: 30 }, + { label: 'استان 4', id: 40 } +]; + +export const city = [ + { label: 'شهر 1', id: 10 }, + { label: 'شهر 2', id: 20 }, + { label: 'شهر 3', id: 30 }, + { label: 'شهر 4', id: 40 } +]; \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/specialDays/index.js b/components/panel/addDoctor/tabsHead/specialDays/index.js new file mode 100644 index 0000000..d82270f --- /dev/null +++ b/components/panel/addDoctor/tabsHead/specialDays/index.js @@ -0,0 +1,7 @@ +function SpecialDays() { + return ( +
    SpecialDays
    + ) +} + +export default SpecialDays \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/turns/index.js b/components/panel/addDoctor/tabsHead/turns/index.js new file mode 100644 index 0000000..bb5d4a3 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/turns/index.js @@ -0,0 +1,7 @@ +function Turns() { + return ( +
    Turns
    + ) +} + +export default Turns \ No newline at end of file diff --git a/components/panel/addDoctor/tabsHead/workingDays/index.js b/components/panel/addDoctor/tabsHead/workingDays/index.js new file mode 100644 index 0000000..7d813b2 --- /dev/null +++ b/components/panel/addDoctor/tabsHead/workingDays/index.js @@ -0,0 +1,7 @@ +function WorkingDays() { + return ( +
    WorkingDays
    + ) +} + +export default WorkingDays \ No newline at end of file diff --git a/components/panel/userAccount/form/index.js b/components/panel/userAccount/form/index.js index 3b82285..e5aaef3 100644 --- a/components/panel/userAccount/form/index.js +++ b/components/panel/userAccount/form/index.js @@ -2,7 +2,7 @@ import { useState } from "react"; -import Content from "./Content"; +import ContentText from "../../ContentText"; import EditField from "@/app/component/EditField"; import AutoCompleteSelect from "@/app/component/element/AutoCompleteSelect"; import { bank, city, state } from "./listSelector"; @@ -38,45 +38,45 @@ function Form() { return (
      - + - - + + - - + + - - + + - - + + } isTransparent={true} placeholder='از روی نقشه انتخاب کنید...' iconGray={true} changeData={changeData} data={data?.address} name='address' /> - - + + - - + + - - + + - +