change data clinics & page clinics tab about & contact & doctors
This commit is contained in:
Ehsan
@@ -1,9 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
function Contact() {
|
||||
return (
|
||||
<div>Contact</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Contact
|
||||
@@ -1,9 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
function Doctors() {
|
||||
return (
|
||||
<div>Doctors</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Doctors
|
||||
@@ -2,7 +2,7 @@ import Image from 'next/image'
|
||||
|
||||
function ListBime({ data }) {
|
||||
return (
|
||||
<ul className='flex items-center justify-center gap-[24px]'>
|
||||
<ul className='flex mt-[8px] items-center justify-center gap-[24px]'>
|
||||
{data.list_bime.map((item, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
import TickCircleOrange from '@/components/icons/TickCircleOrange';
|
||||
|
||||
function Services({ data }) {
|
||||
return (
|
||||
<ul className='mt-[8px] w-full p-[22px] gap-x-[64px] gap-y-[40px] rounded-[8px] bg-[#FFF] grid grid-cols-4'>
|
||||
{data.specialties.map((item, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
className='flex items-center justify-start gap-2'
|
||||
>
|
||||
<TickCircleOrange />
|
||||
<p
|
||||
className={`
|
||||
text-[16px] font-normal
|
||||
${idx === 0 ? 'text-[#F17732]' : 'text-[#525252]'}
|
||||
`}
|
||||
>{item}</p>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
export default Services
|
||||
@@ -0,0 +1,24 @@
|
||||
import TickCircleOrange from '@/components/icons/TickCircleOrange';
|
||||
|
||||
function Specialties({ data }) {
|
||||
return (
|
||||
<ul className='mt-[8px] w-full p-[22px] gap-x-[64px] gap-y-[40px] rounded-[8px] bg-[#FFF] grid grid-cols-4'>
|
||||
{data.specialties.map((item, idx) => (
|
||||
<li
|
||||
key={idx}
|
||||
className='flex items-center justify-start gap-2'
|
||||
>
|
||||
<TickCircleOrange />
|
||||
<p
|
||||
className={`
|
||||
text-[16px] font-normal
|
||||
${idx === 0 ? 'text-[#F17732]' : 'text-[#525252]'}
|
||||
`}
|
||||
>{item}</p>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
export default Specialties
|
||||
@@ -2,10 +2,12 @@ import Image from "next/image"
|
||||
import Images from "./Images"
|
||||
import ContentDetail from "./ContentDetail"
|
||||
import ListBime from "./ListBime"
|
||||
import Specialties from "./Specialties"
|
||||
import Services from "./Services"
|
||||
|
||||
function About({ data }) {
|
||||
return (
|
||||
<div>
|
||||
<div className="opacity-page transition-all duration-500">
|
||||
<Images data={data} />
|
||||
<ContentDetail head='کلینیک تخصصی و فوق تخصصی نیکان'>
|
||||
<p
|
||||
@@ -16,6 +18,12 @@ function About({ data }) {
|
||||
<ContentDetail head='بیمه های طرف قرارداد'>
|
||||
<ListBime data={data} />
|
||||
</ContentDetail>
|
||||
<ContentDetail head='تخصص ها'>
|
||||
<Specialties data={data} />
|
||||
</ContentDetail>
|
||||
<ContentDetail head='خدمات'>
|
||||
<Services data={data} />
|
||||
</ContentDetail>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
function ContentDetail({ head, detail }) {
|
||||
return (
|
||||
<li className="flex flex-col items-start justify-center gap-4">
|
||||
<p className="text-[#525252] text-[20px] font-bold">{head}</p>
|
||||
<p>{detail}</p>
|
||||
</li>
|
||||
)
|
||||
}
|
||||
|
||||
export default ContentDetail;
|
||||
@@ -0,0 +1,26 @@
|
||||
import ContentDetail from "./ContentDetail"
|
||||
|
||||
function Detail({ data }) {
|
||||
return (
|
||||
<ul className="flex flex-col items-start justify-start gap-[16px]">
|
||||
<ContentDetail
|
||||
head='روزهای کاری: '
|
||||
detail={`ساعت کاری: ${data.hours_of_work}`}
|
||||
/>
|
||||
<ContentDetail
|
||||
head='تلفن: '
|
||||
detail={`${data.phone_number_1} ${data.phone_number_2}`}
|
||||
/>
|
||||
<ContentDetail
|
||||
head='ایمیل:'
|
||||
detail={data.email}
|
||||
/>
|
||||
<ContentDetail
|
||||
head='آدرس: '
|
||||
detail={data.location}
|
||||
/>
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
|
||||
export default Detail
|
||||
@@ -0,0 +1,29 @@
|
||||
import { Button } from "@mui/material"
|
||||
import Detail from "./Detail"
|
||||
import RoutingC from "@/components/icons/RoutingC"
|
||||
|
||||
function Contact({ data }) {
|
||||
return (
|
||||
<div className="opacity-page py-[32px] px-[64px] border border-[#EFEFEF] rounded-[16px]">
|
||||
<div className="flex items-end justify-between">
|
||||
<Detail data={data} />
|
||||
<Button
|
||||
className="!gap-[8px] !py-[8px] !px-[12px]"
|
||||
variant="outlined"
|
||||
>
|
||||
<RoutingC />
|
||||
مسیریابی
|
||||
</Button>
|
||||
</div>
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d83998.96777841153!2d2.264635095144491!3d48.85882549249809!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47e66e1f06e2b70f%3A0x40b82c3688c9460!2sParis%2C%20France!5e0!3m2!1sen!2snl!4v1723498499341!5m2!1sen!2snl"
|
||||
className='w-full h-[460px] rounded-lg mt-[24px]'
|
||||
referrerPolicy="no-referrer-when-downgrade"
|
||||
allowFullScreen=""
|
||||
loading="lazy"
|
||||
></iframe>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Contact
|
||||
@@ -0,0 +1,22 @@
|
||||
import ItemDoctor from '@/app/component/ItemDoctor';
|
||||
import Pagination from '@/app/component/Pagination';
|
||||
|
||||
function List({ doctors }) {
|
||||
return (
|
||||
<>
|
||||
<ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 mt-[40px] gap-[24px]">
|
||||
{doctors.map(doctor => (
|
||||
<ItemDoctor
|
||||
key={doctor.id}
|
||||
doctor={doctor}
|
||||
/>
|
||||
))}
|
||||
</ul>
|
||||
<div className='mt-[56px] flex justify-center'>
|
||||
<Pagination />
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default List
|
||||
@@ -0,0 +1,13 @@
|
||||
import SmSearch from '@/components/searchHead/SmSearch';
|
||||
|
||||
function SearchBar() {
|
||||
return (
|
||||
<div className="flex justify-center">
|
||||
<SmSearch
|
||||
placeholder='جستجوی پزشک یا تخصص'
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SearchBar
|
||||
@@ -0,0 +1,16 @@
|
||||
import ItemDoctor from "@/app/component/ItemDoctor"
|
||||
import Pagination from "@/app/component/Pagination"
|
||||
import SmSearch from "@/components/searchHead/SmSearch"
|
||||
import List from "./List"
|
||||
import SearchBar from "./SearchBar"
|
||||
|
||||
function Doctors({ doctors }) {
|
||||
return (
|
||||
<div className="opacity-page">
|
||||
<SearchBar />
|
||||
<List doctors={doctors} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Doctors
|
||||
@@ -3,11 +3,11 @@ import { useState } from 'react';
|
||||
|
||||
import Tabs from "./Tabs";
|
||||
import About from './components/about';
|
||||
import Contact from './components/Contact';
|
||||
import Doctors from './components/Doctors';
|
||||
import Contact from './components/contact';
|
||||
import Doctors from './components/doctors';
|
||||
|
||||
|
||||
function ClinicPage({ data }) {
|
||||
function ClinicPage({ data, doctors }) {
|
||||
|
||||
const [value, setValue] = useState(0);
|
||||
const handleChange = (event, newValue) => setValue(newValue);
|
||||
@@ -15,7 +15,7 @@ function ClinicPage({ data }) {
|
||||
const Components = [
|
||||
<About data={data} />,
|
||||
<Contact data={data} />,
|
||||
<Doctors data={data} />
|
||||
<Doctors doctors={doctors} />
|
||||
];
|
||||
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user