handle limit page dashboard & change header profile user & get data from api in page clinics & clinic item and doctor item

This commit is contained in:
Ehsan
2025-06-01 01:08:25 +03:30
parent 80c74361eb
commit e292176a61
45 changed files with 223 additions and 258 deletions
+13 -5
View File
@@ -1,10 +1,18 @@
import ClinicPage from "@/components/clinic";
import Layout from "@/components/layout/StLayout";
import clinics from "@/data/clinics.json";
import doctors from "@/data/doctors.json";
import axios from "axios";
function Blog({ params: { slug } }) {
const clinic = clinics.find((item) => item.id === +slug);
async function Clinic({ params: { slug } }) {
const reqClinics = await axios.get(
`https://back-dev.clinic-pro.ir/api/v1/clinic/${slug}`
);
const reqDoctors = await axios.get(
"https://back-dev.clinic-pro.ir/api/v1/doctors"
);
const clinic = reqClinics.data;
const doctors = reqDoctors.data.$data;
return (
<Layout>
@@ -13,4 +21,4 @@ function Blog({ params: { slug } }) {
);
}
export default Blog;
export default Clinic;
+6 -6
View File
@@ -68,24 +68,24 @@ function ItemDoctor({ doctor, loading }) {
<p
className={`text-[12px] font-medium rounded w-fit p-1.5 ml-[52px]
${
doctor.free_turn
Number(doctor.active)
? "bg-[rgba(5,_186,_88,_0.04)] text-[#05BA58]"
: "bg-[rgba(211,_47,_47,_0.04)] text-[#D32F2F]"
}`}
>
{doctor.free_turn
? `اولین نوبت آزاد: ${doctor.free_turn}`
{Number(doctor.active)
? `اولین نوبت آزاد: ${Number(doctor.active)}`
: "نوبت ندارد"}
</p>
</CustomLoading>
{/* Arrow */}
<Link href={`/doctor/${doctor.id}`}>
<Link href={`/doctor/${doctor.uuid}`}>
<Button
variant="contained"
className={`!p-[14px] !absolute !left-4 !bottom-4 !rounded-full !w-fit
${!doctor.free_turn || (loading && "!bg-[#D7D7D7]")}
${!Number(doctor.active) || (loading && "!bg-[#D7D7D7]")}
`}
disabled={!doctor.free_turn || loading}
disabled={!Number(doctor.active) || loading}
>
<ArrowLeftD />
</Button>
+3 -3
View File
@@ -3,7 +3,7 @@ import { useState } from "react";
import ItemUser from "./ItemUser";
function Comment({ data, loading }) {
const [list, setList] = useState(data.comments);
const [list, setList] = useState(data?.comments);
const [update, setUpdate] = useState(false);
return (
@@ -13,8 +13,8 @@ function Comment({ data, loading }) {
}`}
>
{data &&
!!data.comments.length &&
data.comments.map((item, idx) => (
!!data?.comments?.length &&
data?.comments.map((item, idx) => (
<ItemUser
key={idx}
list={list}
+8 -6
View File
@@ -2,23 +2,25 @@ import Content from "@/components/dashboard/Content";
import { defineAbilitiesFor } from "@/lib/ability";
import { getUser } from "@/lib/auth";
import { getStateInfo } from "@/lib/getStateInfo";
import axios from "axios";
import { cookies } from "next/headers";
import { redirect } from "next/navigation";
export default async function Dashboard() {
const { matchedCity } = getStateInfo();
const user = await getUser();
const ability = defineAbilitiesFor(user);
const cookieStore = cookies();
const token = cookieStore.get("access_token");
const response = await axios.get(
"https://back-dev.clinic-pro.ir/api/v1/user-profile/e4fd81b4-31bc-4f9a-b300-da23026f9d79"
);
// const response = await axios.get(
// "https://back-dev.clinic-pro.ir/api/v1/user-profile/e4fd81b4-31bc-4f9a-b300-da23026f9d79"
// );
console.log(response);
// console.log(response);
if (!ability.can("access", "Dashboard")) {
return redirect("/");
}
return <Content matchedCity={matchedCity} />;
return <Content matchedCity={matchedCity} logged={token} />;
}
+6 -3
View File
@@ -1,9 +1,12 @@
import DoctorPage from "@/components/doctor";
import Layout from "@/components/layout/StLayout";
import doctors from "@/data/doctors.json";
import axios from "axios";
function Doctor({ params: { slug } }) {
const doctor = doctors.find((item) => item.id === +slug);
async function Doctor({ params: { slug } }) {
const response = await axios.get(
`https://back-dev.clinic-pro.ir/api/v1/doctor/${slug}`
);
const doctor = response.data;
return (
<Layout>
+9 -1
View File
@@ -1,13 +1,21 @@
import DoctorsPage from "@/components/doctors";
import Layout from "@/components/layout/StLayout";
import { getStateInfo } from "@/lib/getStateInfo";
import axios from "axios";
function Doctors({ searchParams }) {
async function Doctors({ searchParams }) {
const { matchedCity, matchedState } = getStateInfo();
const response = await axios.get(
"https://back-dev.clinic-pro.ir/api/v1/doctors"
);
const doctors = response.data.$data;
return (
<Layout>
<DoctorsPage
list={doctors}
params={searchParams}
matchedCity={matchedCity}
matchedState={matchedState}
@@ -27,7 +27,7 @@ function ListBime({ data, loading }) {
ref={list}
className="flex overflow-auto hidden-scroll mt-[8px] items-center justify-start xl:justify-center gap-[8px] sm:gap-[13px] md:gap-[19px] lg:gap-[24px]"
>
{data.list_bime.map((item, idx) => (
{data?.list_bime?.map((item, idx) => (
<CustomLoading width={156} height={110} loading={loading}>
<li
key={idx}
@@ -9,7 +9,7 @@ function Services({ data, loading }) {
gap-x-[40px] sm:gap-x-[48px] md:gap-x-[56px] lg:gap-x-[64px]
gap-y-[24px] sm:gap-y-[30px] md:gap-y-[35px] lg:gap-y-[40px]"
>
{data.specialties.map((item, idx) => (
{data?.specialties?.map((item, idx) => (
<li key={idx} className="flex items-start justify-start gap-2">
<div className="min-w-[24px] min-h-[24px]">
<TickCircleOrange />
@@ -9,7 +9,7 @@ function Specialties({ data, loading }) {
gap-x-[40px] sm:gap-x-[48px] md:gap-x-[56px] lg:gap-x-[64px]
gap-y-[24px] sm:gap-y-[30px] md:gap-y-[35px] lg:gap-y-[40px]"
>
{data.specialties.map((item, idx) => (
{data?.specialties?.map((item, idx) => (
<li key={idx} className="flex items-start justify-start gap-2">
<div className="min-w-[24px] min-h-[24px]">
<TickCircleOrange />
@@ -15,7 +15,7 @@ function Images({ data, loading }) {
<CustomLoading loading={loading} width={600} height={400}>
<Image
className="rounded-[8px] overflow-hidden"
src={data.images_clinic[0]}
src={data?.images_clinic && !!data?.images_clinic.length && data?.images_clinic[0] || ""}
alt="img clinic"
height={432}
width={600}
@@ -8,7 +8,12 @@ function List({ data, loading }) {
<CustomLoading loading={loading} width="full" height={190}>
<Image
className="rounded-[8px] overflow-hidden"
src={data.images_clinic[1]}
src={
(data?.images_clinic &&
!!data?.images_clinic.length &&
data?.images_clinic[1]) ||
""
}
alt="img clinic"
height={204}
width={288}
@@ -19,7 +24,12 @@ function List({ data, loading }) {
<CustomLoading loading={loading} width="full" height={190}>
<Image
className="rounded-[8px] overflow-hidden"
src={data.images_clinic[2]}
src={
(data?.images_clinic &&
!!data?.images_clinic.length &&
data?.images_clinic[2]) ||
""
}
alt="img clinic"
height={204}
width={288}
@@ -30,7 +40,12 @@ function List({ data, loading }) {
<CustomLoading loading={loading} width="full" height={190}>
<Image
className="rounded-[8px] overflow-hidden"
src={data.images_clinic[3]}
src={
(data?.images_clinic &&
!!data?.images_clinic.length &&
data?.images_clinic[3]) ||
""
}
alt="img clinic"
height={204}
width={288}
@@ -41,7 +56,12 @@ function List({ data, loading }) {
<CustomLoading loading={loading} width="full" height={190}>
<Image
className="rounded-[8px] overflow-hidden"
src={data.images_clinic[4]}
src={
(data?.images_clinic &&
!!data?.images_clinic.length &&
data?.images_clinic[4]) ||
""
}
alt="img clinic"
height={204}
width={288}
@@ -4,20 +4,22 @@ import Image from "next/image";
function Slider({ data, loading }) {
return (
<ul className="flex md:hidden gap-2 w-full justify-start items-center overflow-auto hidden-scroll">
{[...data.images_clinic, ...data.images_clinic].map((item, idx) =>
idx !== 0 ? (
<CustomLoading width={90} height={90} loading={loading}>
<Image
key={idx}
src={item}
width={90}
height={90}
alt="image clinic"
className="min-w-[90px] min-h-[90px] object-cover rounded-[8px] overflow-hidden"
/>
</CustomLoading>
) : undefined,
)}
{data &&
data.images_clinic &&
[...data?.images_clinic, ...data?.images_clinic]?.map((item, idx) =>
idx !== 0 ? (
<CustomLoading width={90} height={90} loading={loading}>
<Image
key={idx}
src={item}
width={90}
height={90}
alt="image clinic"
className="min-w-[90px] min-h-[90px] object-cover rounded-[8px] overflow-hidden"
/>
</CustomLoading>
) : undefined
)}
</ul>
);
}
+1 -1
View File
@@ -33,7 +33,7 @@ function About({ data, loading }) {
: "after:bg-[linear-gradient(transparent,#FAFAFA)] max-h-[200px]"
}
`}
dangerouslySetInnerHTML={{ __html: data.caption }}
dangerouslySetInnerHTML={{ __html: data?.caption }}
></p>
</MultilineLoading>
<Button
+1 -1
View File
@@ -52,7 +52,7 @@ function ItemClinic({ data }) {
</div>
{/* Arrow */}
<Link href={`/clinic/${data.id}`}>
<Link href={`/clinic/${data.uuid}`}>
<Button className="!bg-[#5559CE] !p-[14px] !absolute !left-4 !bottom-4 !rounded-full !w-fit">
<ArrowLeftD />
</Button>
+3 -2
View File
@@ -6,7 +6,7 @@ import userData from "@/data/userData.json";
import DashboardPage from "@/components/dashboard";
import UserAccountPage from "./userAccount";
function Content({ matchedCity }) {
function Content({ matchedCity, logged }) {
const [value, setValue] = useState(0);
const [isOpenSide, setIsOpenSide] = useState(false);
const [isTurnsDetails, setIsTurnsDetails] = useState(false);
@@ -14,8 +14,9 @@ function Content({ matchedCity }) {
return (
<DashboardPage
value={value}
logged={logged}
setValue={setValue}
user={userData.data}
user={userData.data}
isOpenSide={isOpenSide}
matchedCity={matchedCity}
setIsOpenSide={setIsOpenSide}
+2
View File
@@ -10,11 +10,13 @@ function DashboardPage({
isOpenSide,
setIsOpenSide,
matchedCity,
logged,
}) {
return (
<Layout
user={user}
value={value}
logged={logged}
title="داشبورد"
name="dashboard"
isSidebar={true}
@@ -1,7 +1,7 @@
function Head({ text, children }) {
return (
<div className="w-full flex mb-[40px] items-center justify-between">
<p className="text-[#525252] dark:text-[#A1A1A1] text-[20px] font-bold">
<div className="w-full flex mb-[40px] flex-col sm:flex-row items-start sm:items-center justify-between gap-2">
<p className="text-[#525252] dark:text-[#A1A1A1] text-[16px] md:text-[18px] lg:text-[20px] font-bold">
{text}
</p>
<div className="flex items-center justify-end gap-4">{children}</div>
@@ -5,7 +5,8 @@ function UpdateBtn() {
return (
<Button
variant="outlined"
className="!border-[#5559CE] !border-[2px] !flex !items-center !justify-center !gap-2 !text-[14px] md:!text-[14px] !font-medium"
className="!border-[#5559CE] !border-[2px] !flex !items-center !justify-center !gap-2 !text-[14px] !font-medium
!py-[6px] md:!py-2 lg:!py-[9px] !px-[16px] sm:!px-[23px] md:!px-[29px] lg:!px-[36px] !mr-0 md:!mr-4"
>
<UpdateList />
آپدیت کردن
@@ -47,7 +47,7 @@ function HeadTab({
handleChange={handleChange}
/>
</div>
<div className="mt-[22px] px-0 md:px-[24px]">{components[tab]}</div>
<div className="my-[22px] px-0 md:px-[24px]">{components[tab]}</div>
</>
)}
</div>
@@ -1,134 +0,0 @@
"use client";
import { useEffect, useState } from "react";
import profileData from "@/data/profile_other.json";
import ArrowRightD from "@/components/icons/ArrowRightD";
import { Button } from "@mui/material";
import DownloadD from "@/components/icons/DownloadD";
import Disease from "../detailUser/disease";
import Allergies from "../detailUser/allergies";
import Medications from "../detailUser/medications";
import Surgeries from "../detailUser/surgeries";
import FamilyHistory from "../detailUser/familyHistory";
import Relatives from "../detailUser/relatives";
import HeadTab from "./HeadTab";
import DetailUser from "../detailUser/information";
import Turns from "../sidebars/turns";
import Transactions from "../sidebars/transactions";
import Comments from "../sidebars/comments";
import Messages from "../sidebars/messages";
import NotfoundDashboard from "../NotfoundDashboard";
const listTab = [
"بیماری‌ها",
"آلرژی‌ها",
"داروهای مصرفی",
"جراحی‌ها",
"سابقه خانوادگی بیماری",
"بستگان",
];
function ContentTabs({
user,
value,
isTurnsDetails,
setIsTurnsDetails,
setValue,
setIsOpenSide,
}) {
const [tab, setTab] = useState(0);
const [data, setData] = useState(profileData[0]);
const handleChange = (_, newValue) => setTab(newValue);
const changeData = (action, name, id, payload) => {
const newData = {
...data,
[name]: [...data[name]],
};
switch (action) {
case "update":
newData[name][id] = payload;
break;
case "add":
newData[name].push(payload);
break;
case "delete":
newData[name].splice(id, 1);
break;
default:
console.warn(`Unknown action: ${action}`);
return;
}
setData(newData);
};
const components = [
// <Disease data={data} changeData={changeData} />,
// <Allergies data={data} changeData={changeData} />,
// <Medications data={data} changeData={changeData} />,
// <Surgeries data={data} changeData={changeData} />,
// <FamilyHistory data={data} changeData={changeData} />,
// <Relatives data={data} changeData={changeData} />,
<DetailUser
user={user}
isTurnsDetails={isTurnsDetails}
setIsTurnsDetails={setIsTurnsDetails}
/>,
<Turns user={user} loading={false} setIsTurnsDetails={setIsTurnsDetails} />,
<Transactions user={user} loading={false} />,
<Comments user={user} loading={false} />,
<Messages user={user} loading={false} />,
<NotfoundDashboard />,
];
return (
<div
className="md:mt-[12px] lg:mt-[24px] md:pt-[12px] pb-[24px] w-full rounded-[8px]
shadow-none md:shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]
bg-transparent md:bg-[#FFF]"
>
<div className="w-full flex items-center justify-between">
<Button
className="!flex !p-1 md:!hidden !items-center !justify-start !gap-[8px]"
onClick={() =>
isTurnsDetails ? setIsTurnsDetails(false) : setIsOpenSide(true)
}
variant="text"
>
<ArrowRightD />
<p className="text-[#525252] text-[14px] font-bold">
{isTurnsDetails ? "جزئیات نوبت " : listTab[value]}
</p>
</Button>
{value === 1 && isTurnsDetails ? (
<Button
className="!flex md:!hidden !py-[8px] !px-[12px] !text-[#616161] !text-[14px] !font-medium !justify-center !items-center !gap-[4px]"
variant="text"
>
<DownloadD />
دانلود اطلاعات نوبت
</Button>
) : undefined}
</div>
<div className="mt-[22px] px-0 md:px-[24px]">{components[value]}</div>
{/* <HeadTab
tab={tab}
user={user}
listTab={listTab}
components={components}
handleChange={handleChange}
isTurnsDetails={isTurnsDetails}
setIsTurnsDetails={setIsTurnsDetails}
/> */}
</div>
);
}
export default ContentTabs;
@@ -4,6 +4,7 @@ import UpdateBtn from "@/components/dashboard/userAccount/components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import Content from "./Content";
import { useState } from "react";
import CloseModalD from "@/components/icons/CloseModalD";
function ModalAddAlergie({ open, setOpen, changeData }) {
const contentItem = {
@@ -45,6 +46,9 @@ function ModalAddAlergie({ open, setOpen, changeData }) {
<p className="text-[#3B3B3B] text-[20px] font-bold">
اضافه کردن آلرژی
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<Content setData={setNewItem} />
</div>
@@ -4,6 +4,7 @@ import UpdateBtn from "@/components/dashboard/userAccount/components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import Content from "./Content";
import { useState } from "react";
import CloseModalD from "@/components/icons/CloseModalD";
function ModalAddHistory({ open, setOpen, changeData }) {
const contentItem = {
@@ -39,6 +40,9 @@ function ModalAddHistory({ open, setOpen, changeData }) {
<p className="text-[#3B3B3B] text-[20px] font-bold">
اضافه کردن سابقه خانوادگی بیماری
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<Content setData={setNewItem} />
</div>
@@ -4,6 +4,7 @@ import UpdateBtn from "@/components/dashboard/userAccount/components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import { useState } from "react";
import Content from "./Content";
import CloseModalD from "@/components/icons/CloseModalD";
function ModalAddMedications({ open, setOpen, changeData }) {
const contentItem = {
@@ -41,6 +42,9 @@ function ModalAddMedications({ open, setOpen, changeData }) {
<p className="text-[#3B3B3B] text-[20px] font-bold">
اضافه کردن دارو های مصرفی
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<Content setData={setNewItem} />
</div>
@@ -4,6 +4,7 @@ import UpdateBtn from "@/components/dashboard/userAccount/components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import Content from "./Content";
import { useState } from "react";
import CloseModalD from "@/components/icons/CloseModalD";
function ModalAddRelatives({ open, setOpen, changeData }) {
const contentItem = {
@@ -51,6 +52,9 @@ function ModalAddRelatives({ open, setOpen, changeData }) {
<p className="text-[#3B3B3B] text-[20px] font-bold">
اضافه کردن بستگان
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<Content setData={setNewItem} />
</div>
@@ -4,6 +4,7 @@ import UpdateBtn from "@/components/dashboard/userAccount/components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import Content from "./Content";
import { useState } from "react";
import CloseModalD from "@/components/icons/CloseModalD";
function ModalAddSurgeries({ open, setOpen, changeData }) {
const contentItem = {
@@ -41,6 +42,9 @@ function ModalAddSurgeries({ open, setOpen, changeData }) {
<p className="text-[#3B3B3B] text-[20px] font-bold">
اضافه کردن جراحی
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<Content setData={setNewItem} />
</div>
+35
View File
@@ -1,3 +1,4 @@
import { Button } from "@mui/material";
import DetailUser from "./detailUser";
import Head from "./Head";
import NotfoundDashboard from "./NotfoundDashboard";
@@ -7,6 +8,17 @@ import Comments from "./sidebars/comments";
import Messages from "./sidebars/messages";
import Transactions from "./sidebars/transactions";
import Turns from "./sidebars/turns";
import DownloadD from "@/components/icons/DownloadD";
import ArrowRightD from "@/components/icons/ArrowRightD";
const listTab = [
"حساب کاربری",
"نوبت های من",
"تراکنش های من",
"نظرات من",
"پیام ها",
"خروج",
];
function UserAccountPage({
user,
@@ -37,6 +49,29 @@ function UserAccountPage({
) : (
<>
<Head user={user} />
<div className="w-full flex items-center justify-between">
<Button
className="!flex !p-1 md:!hidden !items-center !justify-start !gap-[8px]"
onClick={() =>
isTurnsDetails ? setIsTurnsDetails(false) : setIsOpenSide(true)
}
variant="text"
>
<ArrowRightD />
<p className="text-[#525252] text-[14px] font-bold">
{isTurnsDetails ? "جزئیات نوبت " : listTab[value]}
</p>
</Button>
{value === 1 && isTurnsDetails ? (
<Button
className="!flex md:!hidden !py-[8px] !px-[12px] !text-[#616161] !text-[14px] !font-medium !justify-center !items-center !gap-[4px]"
variant="text"
>
<DownloadD />
دانلود اطلاعات نوبت
</Button>
) : undefined}
</div>
<div className=" mt-[24px] sm:mt-[26px] md:mt-[28px] lg:mt-[30px]">
{sidebars[value]}
</div>
@@ -17,17 +17,17 @@ function ItemAppointment({ turn, doctor, loading }) {
<span className="block w-full h-px bg-[#EFEFEF] my-4"></span>
<div className="flex items-center justify-start gap-3">
<CircularLoading width={56} height={56} loading={loading}>
<Image src={doctor.img} width={56} height={56} alt="doctor" />
<Image src={doctor?.img} width={56} height={56} alt="doctor" />
</CircularLoading>
<div className="flex flex-col items-start justify-center gap-2">
<TextLoading width={60} height={15} loading={loading}>
<p className="text-[#3B3B3B] text-[14px] font-bold">
{doctor.name}
{doctor?.name}
</p>
</TextLoading>
<TextLoading width={65} height={15} loading={loading}>
<p className="text-[#525252] text-[14px] font-medium">
تخصص: {doctor.expertise}
تخصص: {doctor?.expertise}
</p>
</TextLoading>
</div>
+7 -7
View File
@@ -15,7 +15,7 @@ function Title({ doctor, loading }) {
w-[40px] sm:w-[81px] md:w-[123px] lg:w-[164px]
h-[40px] sm:h-[81px] md:h-[123px] lg:h-[164px]
"
src={doctor.img}
src={doctor?.img}
alt="img-doctor"
height={164}
width={164}
@@ -24,18 +24,18 @@ function Title({ doctor, loading }) {
<div className="flex flex-col items-center lg:items-start gap-[8px] lg:gap-[16px]">
<TextLoading loading={loading} width={90} height={20}>
<h1 className="text-[#3B3B3B] text-[14px] sm:text-[16px] md:text-[18px] lg:text-[20px] font-bold">
{doctor.name}
{doctor?.title}
</h1>
</TextLoading>
<TextLoading loading={loading} width={100} height={20}>
<h3 className="text-[#525252] text-[14px] md:text-[16px] font-medium">
تخصص: {doctor.expertise}
تخصص: {doctor?.expertise}
</h3>
</TextLoading>
<div className="flex items-center justify-start gap-11">
<TextLoading loading={loading} width={60} height={20}>
<p className="text-[#525252] text-[16px] font-medium">
{doctor.experience} سال تجربه
{doctor?.experience} سال تجربه
</p>
</TextLoading>
<div className="flex items-center gap-1">
@@ -44,7 +44,7 @@ function Title({ doctor, loading }) {
</div>
<TextLoading loading={loading} width={120} height={20}>
<p className="text-[#525252] text-[12px] md:text-[14px] lg:text-[16px] font-medium">
کد نظام پزشکی: {doctor.medical_system_code}
کد نظام پزشکی: {doctor?.medical_system_code}
</p>
</TextLoading>
</div>
@@ -54,13 +54,13 @@ function Title({ doctor, loading }) {
<div className="flex p-1 gap-0.5 items-start justify-center">
<StarDI />
<p className="text-[#616161] text-[12px] md:text-[14px] font-normal">
امتیاز: {doctor.point}
امتیاز: {doctor?.point}
</p>
</div>
<div className="flex p-1 items-start gap-0.5">
<LikeDI />
<p className="text-[#616161] text-[12px] md:text-[14px] font-normal">
{doctor.satisfaction}% رضایت کاربران
{doctor?.satisfaction}% رضایت کاربران
</p>
</div>
</div>
@@ -28,7 +28,7 @@ function AboutDcotor({ doctor, loading }) {
}
`}
>
{doctor.detail}
{doctor?.detail}
</p>
<Button
className="!text-[#F17732] md:!hidden !text-[14px] !font-light !p-2"
@@ -44,7 +44,7 @@ function AboutDcotor({ doctor, loading }) {
تخصص ها
</p>
<ul className="flex flex-col mt-[12px] sm:flex-row gap-y-[16px] items-start sm:items-center justify-start gap-4">
{doctor.specialties.map((item, idx) => (
{doctor?.specialties?.map((item, idx) => (
<li key={idx} className="flex items-center justify-start gap-1">
<span className="w-2 h-2 bg-[#F17732] rounded-full"></span>
<TextLoading loading={loading} width={70} height={18}>
@@ -8,7 +8,7 @@ function ProgressAll({ doctor, loading }) {
<CircularLoading loading={loading} width={120} height={120}>
<CircularProgress
variant="determinate"
value={doctor.total_user_satisfaction}
value={doctor?.total_user_satisfaction}
sx={{
"& .MuiCircularProgress-circle": {
stroke: "#05BA58",
@@ -28,7 +28,7 @@ function ProgressAll({ doctor, loading }) {
رضایت کاربران
</p>
<p className="text-[#3B3B3B]">
{numberToArStyle(doctor.total_user_satisfaction)}%
{numberToArStyle(doctor?.total_user_satisfaction)}%
</p>
</div>
</CircularLoading>
@@ -5,7 +5,6 @@ import LikeDI from "@/components/icons/LikeDI";
import ProgressDetail from "@/app/component/ProfressDetail";
import TextLoading from "@/app/component/loading/Text";
import CustomLoading from "@/app/component/loading/Custom";
import CircularLoading from "@/app/component/loading/Circular";
function Chart({ doctor, loading }) {
return (
@@ -18,10 +17,10 @@ function Chart({ doctor, loading }) {
<TextLoading loading={loading} width={130} height={20}>
<div className="flex items-center justify-start gap-2.5">
<p className="text-[#616161] text-[14px] font-medium">
امتیاز کلی کاربران: {doctor.overall_score} از 5
امتیاز کلی کاربران: {doctor?.overall_score} از 5
</p>
<p className="text-[#7E7E7E] text-[14px] font-normal">
(از مجموع {doctor.comments.length} نظر)
(از مجموع {doctor?.comments?.length} نظر)
</p>
</div>
</TextLoading>
@@ -41,13 +40,13 @@ function Chart({ doctor, loading }) {
<div className="flex p-1 gap-0.5 items-start justify-center">
<StarDI />
<p className="text-[#616161] text-[12px] md:text-[14px] font-normal">
امتیاز: {doctor.point}
امتیاز: {doctor?.point}
</p>
</div>
<div className="flex p-1 items-start gap-0.5">
<LikeDI />
<p className="text-[#616161] text-[12px] md:text-[14px] font-normal">
{doctor.satisfaction}% رضایت کاربران
{doctor?.satisfaction}% رضایت کاربران
</p>
</div>
</CustomLoading>
@@ -58,7 +57,7 @@ function Chart({ doctor, loading }) {
loading ? "lg:w-full" : "lg:w-fit"
}`}
>
{doctor.progress_detail.map((item, idx) => (
{doctor?.progress_detail?.map((item, idx) => (
<TextLoading width="full" key={idx} height={20} loading={loading}>
<ProgressDetail data={item} />
</TextLoading>
@@ -48,7 +48,7 @@ function ModalAnswer({ doctor }) {
}}
/>
<ul className="flex w-full lg:w-fit flex-col items-start justify-start gap-1.5">
{doctor.progress_detail.map((item, idx) => (
{doctor?.progress_detail?.map((item, idx) => (
<ProgressChange data={item} key={idx} />
))}
</ul>
@@ -59,7 +59,7 @@ function ModalAnswer({ doctor }) {
multiline={true}
title="نظر خود را بنویسید..."
/>
<Link href={`/booking/${doctor.id}`} className="!mr-auto">
<Link href={`/booking/${doctor?.id}`} className="!mr-auto">
<Button
variant="contained"
className="!py-2.5 !px-4 gap-1 !text-[14px] !font-medium !mt-[32px] !shadownon"
@@ -8,11 +8,11 @@ function Locations({ doctor, loading }) {
موقعیت مکانی{" "}
</p>
<ul className="flex w-full mt-[24px] flex-col justify-center items-start">
{doctor.locations.map((item, idx) => (
{doctor?.locations?.map((item, idx) => (
<CustomLoading key={idx} loading={loading} width="full" height={40}>
<li className="w-full">
<Item data={item} />
{doctor.locations.length > idx + 1 && (
{doctor?.locations.length > idx + 1 && (
<span className="w-full h-px bg-[#EFEFEF] block my-[12px] md:my-[14px] lg:my-[16px]"></span>
)}
</li>
+5 -16
View File
@@ -1,29 +1,18 @@
"use client";
import { useEffect, useState } from "react";
import AppointmentList from "./appointmentList";
import DetailDoctor from "./detailDoctor";
import Share from "./detailDoctor/Share";
import CustomLoading from "@/app/component/loading/Custom";
function DoctorPage({ doctor }) {
const [loading, setLoading] = useState(true);
useEffect(() => {
setTimeout(() => {
setLoading(false);
}, 2000);
}, []);
return (
<div className="pt-[92px] sm:pt-[120px] mt:pt-[148px] lg:pt-[176px] mt-[px] padding-responsive">
<div className="flex items-center justify-between">
<CustomLoading loading={loading} width={180} height={25}>
<CustomLoading loading={false} width={180} height={25}>
<div className="flex items-center justify-start text-[14px] md:text-[16px] font-normal">
<h2 className="text-[#9B9B9B] text-nowrap">
متخصص {doctor.expertise} {" >"}
متخصص {doctor?.expertise} {" >"}
</h2>
<p className="text-[#525252] text-nowrap mr-1">{doctor.name}</p>
<p className="text-[#525252] text-nowrap mr-1">{doctor?.title}</p>
</div>
</CustomLoading>
<div className="flex lg:hidden">
@@ -31,8 +20,8 @@ function DoctorPage({ doctor }) {
</div>
</div>
<div className="flex items-start justify-center gap-6 mt-[30px]">
<DetailDoctor doctor={doctor} loading={loading} />
<AppointmentList doctor={doctor} loading={loading} />
<DetailDoctor doctor={doctor} loading={false} />
<AppointmentList doctor={doctor} loading={false} />
</div>
</div>
);
+1 -1
View File
@@ -9,7 +9,7 @@ function Services({ data }) {
<p className="text-[#E7EEF6] text-[20px] font-semibold">خدمات:</p>
</div>
<ul className="flex flex-col justify-start items-start gap-[16px] mt-[16px] font-normal ">
{data.specialties.map((item, idx) => (
{data?.specialties?.map((item, idx) => (
<li key={idx} className="flex items-center justify-start gap-[4px]">
<CircleOrangeSm />
<p className="text-[16px] font-normal text-[#E7EEF6]">{item}</p>
+2 -2
View File
@@ -11,7 +11,7 @@ import ModalSearchCity from "@/app/component/modalSearchCity";
// Data
import specialties from "@/data/specialties.json";
function DoctorsPage({ params, matchedCity, matchedState }) {
function DoctorsPage({ params, matchedCity, matchedState, list }) {
const [loading, setLoading] = useState(true);
const [open, setOpen] = useState(false);
const [selected, setSelected] = useState({
@@ -65,7 +65,7 @@ function DoctorsPage({ params, matchedCity, matchedState }) {
<SortList data={data} setData={setData} />
</div>
</div>
<ListDoctors loading={loading} />
<ListDoctors loading={loading} list={list} />
</div>
);
}
+2 -2
View File
@@ -2,11 +2,11 @@ import doctors from "@/data/doctors.json";
import Pagination from "@/app/component/Pagination";
import ItemDoctor from "@/app/component/ItemDoctor";
function ListDoctors({ loading }) {
function ListDoctors({ loading, list }) {
return (
<>
<ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 mt-[24px] sm:mt-[37px] md:mt-[50px] lg:mt-[64px] gap-[24px]">
{doctors.map((doctor) => (
{list.map((doctor) => (
<ItemDoctor key={doctor.id} doctor={doctor} loading={loading} />
))}
</ul>
+4 -1
View File
@@ -1,16 +1,19 @@
import { getStateInfo } from "@/lib/getStateInfo";
import Footer from "./footer";
import Header from "./header";
import { cookies } from "next/headers";
function StLayout({ children, name }) {
const { matchedCity } = getStateInfo();
const cookieStore = cookies();
const token = cookieStore.get("access_token");
return (
<div>
<main className="w-full min-h-screen">
<header className="w-full sticky bg-[#FFF] !z-[70] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] mt-[12px] sm:mt-[21px] md:mt-[30px] lg:mt-[40px] top-0 right-1/2">
<div className="w-full padding-responsive">
<Header matchedCity={matchedCity} name={name} />
<Header matchedCity={matchedCity} name={name} logged={token} />
</div>
</header>
<section className="opacity-page -mt-[calc(48px_+_12px)] sm:-mt-[calc(56px_+_21px)] md:-mt-[calc(64px_+_30px)] lg:-mt-[calc(80px_+_40px)]">
+17 -14
View File
@@ -10,7 +10,7 @@ import BgGray from "./list/col/BgGray";
import UserLogin from "@/components/icons/UserLogin";
import { useState } from "react";
function Content({ matchedCity, name }) {
function Content({ matchedCity, name, logged }) {
const [isActive, setIsActive] = useState(false);
return (
@@ -33,20 +33,23 @@ function Content({ matchedCity, name }) {
</div>
</div>
<Row name={name} />
<Link href="/login">
<Button className="!hidden lg:!flex" variant="outlined" color="primary">
ورود | ثبت نام
</Button>
<Button
className={`!flex lg:!hidden !p-2 !rounded-full transition-all duration-500 !bg-[#EFEFEF]`}
variant="text"
color="primary"
>
<div className="flex lg:hidden">
{logged ? (
<Link href="/dashboard">
<Button
className={`!flex !p-2 !rounded-full transition-all duration-500 !bg-[#EFEFEF]`}
variant="text"
color="primary"
>
<UserLogin />
</div>
</Button>
</Link>
</Button>
</Link>
) : (
<Link href="/login">
<Button variant="outlined" color="primary">
ورود | ثبت نام
</Button>
</Link>
)}
</div>
);
}
+2 -2
View File
@@ -1,9 +1,9 @@
import Content from "./Content";
function Header({ matchedCity, name }) {
function Header({ matchedCity, name, logged }) {
return (
<div className="bg-[#FFF] rounded-lg w-full mx-auto">
<Content matchedCity={matchedCity} name={name} />
<Content matchedCity={matchedCity} name={name} logged={logged} />
</div>
);
}
+2 -1
View File
@@ -14,6 +14,7 @@ function Layout({
user,
value,
setValue,
logged,
matchedCity,
}) {
return (
@@ -24,7 +25,7 @@ function Layout({
>
<header className="w-full sticky bg-[#FFF] !z-[70] shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] mt-[12px] sm:mt-[21px] md:mt-[30px] lg:mt-[40px] top-0 right-1/2">
<div className="w-full padding-responsive">
<Header name={name} matchedCity={matchedCity} />
<Header name={name} matchedCity={matchedCity} logged={logged} />
</div>
</header>
<section
+3 -1
View File
@@ -2,11 +2,13 @@ import { styleDefault } from "@/mui";
import { Box, Button, Modal } from "@mui/material";
import CloseModalD from "@/components/icons/CloseModalD";
import { removeToken } from "@/utils";
import { useRouter } from "next/navigation";
function ModalLogout({ open, handleClose }) {
const router = useRouter();
const logout = () => {
removeToken();
window.location.pathname = "/login";
router.replace("/login");
handleClose();
};
@@ -1,5 +1,4 @@
import { Button } from "@mui/material";
import { useRouter } from "next/navigation";
import { request } from "@/services/response";
import Cookies from "js-cookie";
@@ -12,8 +11,6 @@ function SendReq({
setIsError,
uuid,
}) {
const router = useRouter();
const handleSetCookie = (response) => {
const accessTokenExpires = new Date();
accessTokenExpires.setSeconds(
@@ -50,7 +47,7 @@ function SendReq({
.then((response) => {
setLoading(false);
if (response.access_token) {
router.replace("/");
window.location.pathname = "/";
handleSetCookie(response);
}
})
+1 -1
View File
@@ -2,7 +2,7 @@ import moment from "jalali-moment";
import { toast } from "react-toastify";
import specialties from "@/data/specialties.json";
export const numberToArStyle = (num) => num.toLocaleString("ar-AE");
export const numberToArStyle = (num) => num?.toLocaleString("ar-AE") || "";
export const isActiveURL = (link, name) => link === name;
+4 -1
View File
@@ -1,5 +1,8 @@
import Cookies from "js-cookie";
const removeToken = () => Cookies.remove("token", { path: "/" });
const removeToken = () => {
Cookies.remove("access_token", { path: "/" });
Cookies.remove("refresh_token", { path: "/" });
};
export { removeToken };