hamed/nobat724_front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

responsive page user-account & add-doctor & turns & add loading to all page panel & change design page dashboard

Browse Source
This commit is contained in:
Ehsan
2024-09-14 02:41:38 +03:30
parent d1f289bdca
commit 9d1c4aa299
60 changed files with 459 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/panel/dashboard/list/ColTable.js
-53
View File
@@ -1,53 +0,0 @@
import CircularLoading from "@/app/component/loading/Circular"
import TextLoading from "@/app/component/loading/Text"
import Image from "next/image"
function ColTable({ data }) {
return (
<ul className="flex md:hidden flex-col gap-[16px]">
{data.list_of_doctors_appointments.map((item, idx) => (
<li
key={idx}
className="bg-[#FFF] p-[12px] rounded-[8px] shadow-[0px_1px_24.8px_0px_rgba(204,204,204,0.18)]"
>
<div className="flex items-center justify-between">
<div className='flex items-center justify-start gap-[8px] !text-nowrap'>
<CircularLoading width={32} height={32} loading={false}>
<Image
src={item.image}
alt='doctor'
height={32}
width={32}
/>
</CircularLoading>
<TextLoading width={40} height={18} loading={false}>
{item.name}
</TextLoading>
</div>
<p className="px-[8px] py-[4px] text-[#F17732] text-[14px] font-medium bg-[rgba(255,216,197,0.50)] rounded-[4px]">
تعداد نوبت: {item.number_of_turns}
</p>
</div>
<div className="flex flex-col mt-[16px]">
<div className="flex items-center justify-between">
<p className="text-[#7E7E7E] text-[14px] font-normal">تخصص:</p>
<p className="text-[#616161] text-[14px] font-medium">{item.expertise}</p>
</div>
<span className="block h-px w-full bg-[#EFEFEF] my-[12px]"></span>
<div className="flex items-center justify-between">
<p className="text-[#7E7E7E] text-[14px] font-normal">تاریخ نوبت:</p>
<p className="text-[#616161] text-[14px] font-medium">{item.date}</p>
</div>
<span className="block h-px w-full bg-[#EFEFEF] my-[12px]"></span>
<div className="flex items-center justify-between">
<p className="text-[#7E7E7E] text-[14px] font-normal">ساعت نوبت:</p>
<p className="text-[#616161] text-[14px] font-medium">{item.hour}</p>
</div>
</div>
</li>
))}
</ul>
)
}
export default ColTable
components/panel/dashboard/list/Table.js
+8 -8
View File
@@ -4,7 +4,7 @@ import TextLoading from "@/app/component/loading/Text"
import { TableCell, TableRow } from "@mui/material"
import Image from "next/image"
function Table({ data }) {
function Table({ data, loading }) {
const tableHead = ['ردیف', 'نام پزشک', 'تخصص', 'تاریخ', 'ساعت', 'تعدد نوبت'];
const centerTable = [0, 4];
@@ -22,13 +22,13 @@ function Table({ data }) {
className='!border-0 !border-b !border-[#DBDBDB]'
>
<TableCell className='!pr-[18px] !text-[#616161] !text-[16px] !font-medium !text-nowrap' align="center">
<TextLoading width={15} height={18} loading={false}>
<TextLoading width={15} height={18} loading={loading}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className='!pr-[18px] !text-[#616161] !text-[16px] !font-medium !text-nowrap' component="th" scope="row">
<div className='flex items-center justify-start gap-[8px] !text-nowrap'>
<CircularLoading width={32} height={32} loading={false}>
<CircularLoading width={32} height={32} loading={loading}>
<Image
src={row.image}
alt='doctor'
@@ -36,28 +36,28 @@ function Table({ data }) {
width={32}
/>
</CircularLoading>
<TextLoading width={40} height={18} loading={false}>
<TextLoading width={40} height={18} loading={loading}>
{row.name}
</TextLoading>
</div>
</TableCell>
<TableCell className='!text-start !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap' align="right">
<TextLoading width={30} height={18} loading={false}>
<TextLoading width={30} height={18} loading={loading}>
{row.expertise}
</TextLoading>
</TableCell>
<TableCell className='!text-start !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap' align="right">
<TextLoading width={50} height={18} loading={false}>
<TextLoading width={50} height={18} loading={loading}>
{row.date}
</TextLoading>
</TableCell>
<TableCell className='!text-center !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap' align="right">
<TextLoading width={50} height={18} loading={false}>
<TextLoading width={50} height={18} loading={loading}>
{row.hour}
</TextLoading>
</TableCell>
<TableCell className='!text-right !text-[#616161] !text-[16px] !font-medium !pr-[18px] !text-nowrap' align="right">
<TextLoading width={50} height={18} loading={false}>
<TextLoading width={50} height={18} loading={loading}>
{row.number_of_turns}
</TextLoading>
</TableCell>
components/panel/dashboard/list/index.js
+4 -4
View File
@@ -1,9 +1,9 @@
import { Button } from "@mui/material"
import ArrowLeftP from "../../../icons/ArrowLeftP"
import Table from "./Table"
import ColTable from "./ColTable"
import ColTable from "../../ColTable"
function List({ data }) {
function List({ data, loading }) {
return (
<div className="rounded-[8px] border overflow-hidden border-solid w-full border-transparent md:border-[#EFEFEF] bg-transparent md:bg-[#FFF]">
<div className="flex items-center justify-between p-[16px]">
@@ -17,8 +17,8 @@ function List({ data }) {
</Button>
</div>
<div className="w-full overflow-auto">
<Table data={data} />
<ColTable data={data} />
<Table data={data} loading={loading} />
<ColTable data={data.list_of_doctors_appointments} loading={loading} />
</div>
</div>
)