check responsive & page dashboard user account & turns & transactions & comments

2024-09-03 03:04:55 +03:30
parent bb154ac63f
commit 13cc7796c3
55 changed files with 1887 additions and 92 deletions
@@ -0,0 +1,57 @@
+import CustomTable from "@/app/component/CustomTable";
+import { TableCell, TableRow } from "@mui/material";
+import Image from "next/image";
+
+function List({ user }) {
+
+    const tableHead = ['ردیف', 'شناسه', 'نام پزشک', 'تاریخ', 'ساعت', 'مبلغ (تومان)', 'وضعیت']
+    const centerTable = [0, 4, 5];
+
+    return (
+        <div className='!mt-[32px]'>
+            <CustomTable
+                tableHead={tableHead}
+                centerTable={centerTable}
+            >
+                {user.turns.map((row, idx) => (
+                    <TableRow
+                        key={idx}
+                        className='!border-0 !border-b !border-[#DBDBDB]'
+                    >
+                        <TableCell className='!pr-[18px] !text-nowrap' align="center">{idx + 1}</TableCell>
+                        <TableCell className='!text-start !pr-[18px] !text-nowrap' align="right">{row.id}</TableCell>
+                        <TableCell className='!pr-[18px] !text-nowrap' component="th" scope="row">
+                            <div className='flex items-center justify-start gap-[8px] !text-nowrap'>
+                                <Image
+                                    src={row.image}
+                                    alt='doctor'
+                                    height={32}
+                                    width={32}
+                                />
+                                {row.name}
+                            </div>
+                        </TableCell>
+                        <TableCell className='!text-start !pr-[18px] !text-nowrap' align="right">{row.date}</TableCell>
+                        <TableCell className='!text-center !pr-[18px] !text-nowrap' align="right">{row.time}</TableCell>
+                        <TableCell className='!text-center !pr-[18px] !text-nowrap' align="right">{row.amount}</TableCell>
+                        <TableCell className='!pr-[18px] !text-nowrap' align="right">
+                            <div
+                                className={`
+                                    w-[124px] py-[4px] px-[4px] rounded-[4px] text-center text-[16px] font-medium cursor-pointer select-none
+                                    ${row.status === 'success' ? 'bg-[#E8FADD] text-[#75E22E]' :
+                                        row.status === 'pending' ? 'bg-[#FFF3DD] text-[#FDBA35]' : 'bg-[#FFE3E2] text-[#FF5450]'}
+                                `}
+                                variant='text'
+                            >
+                                {row.status === 'success' ? 'پرداخت شده' :
+                                    row.status === 'pending' ? 'در انتظار' : 'پرداخت نشده'}
+                            </div>
+                        </TableCell>
+                    </TableRow>
+                ))}
+            </CustomTable>
+        </div>
+    )
+}
+
+export default List
@@ -0,0 +1,12 @@
+import List from "./List";
+
+function Transactions({ user }) {
+    return (
+        <div className="opacity-page">
+            <p className="text-[#3B3B3B] text-[16px] font-bold">تاریخچه تراکنش ها</p>
+            <List user={user} />
+        </div>
+    )
+}
+
+export default Transactions