63 lines
1.9 KiB
JavaScript
63 lines
1.9 KiB
JavaScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
|
|
import About from "./components/about";
|
|
import Contact from "./components/contact";
|
|
import Doctors from "./components/doctors";
|
|
import Tabs from "@/app/component/Tabs";
|
|
import Pageguide from "@/app/component/Pageguide";
|
|
|
|
const listTab = ["درباره کلینیک", "اطلاعات تماس", "پزشک ها"];
|
|
|
|
function ClinicPage({ data, doctors, slug, pages, origin }) {
|
|
const [value, setValue] = useState(0);
|
|
const handleChange = (_, newValue) => setValue(newValue);
|
|
|
|
|
|
const Components = [
|
|
<About data={data} />,
|
|
<Contact data={data} />,
|
|
<Doctors data={data} doctors={doctors} slug={slug} pages={pages} />,
|
|
];
|
|
|
|
return (
|
|
<div className="pt-[40px] sm:pt-[70px] md:pt-[100px] lg:pt-[136px] mt-[40px] padding-responsive">
|
|
<div className="mb-[20px]">
|
|
<Pageguide
|
|
origin={origin}
|
|
list={[
|
|
{ name: "خانه", href: "/" },
|
|
{ name: "کلینیک ها", href: "/clinics" },
|
|
// href صفحهٔ جاری لازم است تا `item` در BreadcrumbList خالی نماند
|
|
{ name: data?.title, href: slug ? `/clinic/${slug}` : "/clinics" },
|
|
]}
|
|
/>
|
|
</div>
|
|
<Tabs
|
|
style={{
|
|
".MuiTabs-indicator": {
|
|
height: "2px",
|
|
borderRadius: "10px",
|
|
background: "#F17732",
|
|
},
|
|
"& .mui-11pdt05-MuiButtonBase-root-MuiTab-root.Mui-selected": {
|
|
color: "#F17732 !important",
|
|
},
|
|
"& .MuiButtonBase-root.Mui-selected": {
|
|
color: "#F17732 !important",
|
|
},
|
|
}}
|
|
value={value}
|
|
listTab={listTab}
|
|
handleChange={handleChange}
|
|
/>
|
|
<div className="mt-[24px] sm:mt-[27px] md:mt-[30px] lg:mt-[32px]">
|
|
{Components[value]}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default ClinicPage;
|