design dashboard comments & messages & modals
This commit is contained in:
@@ -0,0 +1,66 @@
|
||||
import CalendarD from '@/components/icons/CalendarD';
|
||||
import CallD from '@/components/icons/CallD';
|
||||
import ClockClinic from '@/components/icons/ClockClinic';
|
||||
import LocationClinic from '@/components/icons/LocationClinic';
|
||||
import RoutingC from '@/components/icons/RoutingC';
|
||||
import TicketD from '@/components/icons/TicketD';
|
||||
import { Button } from '@mui/material';
|
||||
import Image from 'next/image'
|
||||
import React from 'react'
|
||||
|
||||
function Detail({ user }) {
|
||||
|
||||
const data = user.turns[1];
|
||||
|
||||
return (
|
||||
<div className='mt-[18px]'>
|
||||
<div className='flex items-center justify-start gap-[16px]'>
|
||||
<Image
|
||||
height={95}
|
||||
width={95}
|
||||
alt='profile'
|
||||
src={data.image}
|
||||
/>
|
||||
<div className='flex flex-col items-start justify-center gap-[20px]'>
|
||||
<p className='text-[#3B3B3B] text-[20px] font-medium'>{data.name}</p>
|
||||
<p className='text-[#616161] text-[16px] font-medium'>تخصص: {data.expertise}</p>
|
||||
</div>
|
||||
</div>
|
||||
<ul className='flex mt-[32px] mb-[24px] flex-col gap-[24px] items-start justify-start'>
|
||||
<li className='flex items-center justify-start gap-[56px]'>
|
||||
<div className='flex items-center justify-start gap-[4px]'>
|
||||
<CalendarD />
|
||||
<p className='text-[#616161] text-[20px] font-medium'>تاریخ نوبت: <span className='text-[#2F2F2F] text-[20px] font-bold'>{data.date_turn}</span></p>
|
||||
</div>
|
||||
<div className='flex items-center justify-start gap-[4px]'>
|
||||
<ClockClinic />
|
||||
<p className='text-[#616161] text-[20px] font-medium'>زمان نوبت: <span className='text-[#2F2F2F] text-[20px] font-bold'>ساعت {data.time}</span></p>
|
||||
</div>
|
||||
</li>
|
||||
<li className='flex items-center justify-start gap-[32px]'>
|
||||
<div className='flex items-center justify-start gap-[4px]'>
|
||||
<LocationClinic />
|
||||
<p className='text-[#616161] text-[16] font-normal'>آدرس: <span className='text-[#2F2F2F] text-[16] font-normal'>{data.location}</span></p>
|
||||
</div>
|
||||
<Button
|
||||
className='!py-[8px] !px-[12px] !gap-[8px]'
|
||||
variant='text'
|
||||
>
|
||||
<RoutingC />
|
||||
<p className='text-[#5559CE] text-[14px] font-medium'>مسیریابی آدرس</p>
|
||||
</Button>
|
||||
</li>
|
||||
<li className='flex items-center justify-start gap-[4px]'>
|
||||
<CallD />
|
||||
<p className='text-[#616161] text-[16] font-normal'>تلفن: <span className='text-[#2F2F2F] text-[16] font-normal'>{data.phone}</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<div className='py-[18px] pr-[16px] pl-[40px] flex items-center gap-[4px] border border-solid border-[#EFEFEF] rounded-[4px] w-fit'>
|
||||
<TicketD />
|
||||
<p className='text-[#616161] text-[20px] font-medium'>مبلغ پرداخت شده : <span className='text-[#2F2F2F] text-[20px] font-bold'>{data.amount_paid} تومان</span></p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Detail
|
||||
Reference in New Issue
Block a user