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,62 @@
+'use client'
+
+import { useState } from "react";
+
+// Tabs
+import Turns from "./tabs/turns";
+import DetailUser from "./tabs/detailUser";
+import Comments from "./tabs/comments";
+import Messages from "./tabs/messages";
+import Tabs from "@/app/component/Tabs";
+import Transactions from "./tabs/transactions";
+
+const listTab = ['حساب کاربری', 'نوبت های من', 'تراکنش های من', 'نظرات من', 'پیام ها'];
+
+function ContentTabs({ user }) {
+
+    const [value, setValue] = useState(0);
+    const handleChange = (event, newValue) => setValue(newValue);
+    const components = [
+        <DetailUser user={user} />,
+        <Turns user={user} />,
+        <Transactions user={user} />,
+        <Comments user={user} />,
+        <Messages />
+    ]
+
+    return (
+        <div className="mt-[24px] pt-[12px] pb-[24px] w-full bg-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)] rounded-[8px] bg-[#FFF]">
+            <Tabs
+                style={{
+                    '.MuiTabs-indicator': {
+                        height: '2px',
+                        borderRadius: '16px',
+                        background: '#5559CE',
+                    },
+                    '& .MuiTabs-scroller': {
+                        borderBottom: '1px solid #EFEFEF',
+                    },
+                    '& .MuiTabs-flexContainer': {
+                        paddingRight: '15px',
+                        paddingLeft: '15px',
+                    },
+                    '& .mui-11pdt05-MuiButtonBase-root-MuiTab-root.Mui-selected': {
+                        color: '#5559CE !important'
+                    },
+                    '& .MuiButtonBase-root.Mui-selected': {
+                        color: '#5559CE !important'
+                    }
+                }}
+                value={value}
+                color='#5559CE'
+                listTab={listTab}
+                handleChange={handleChange}
+            />
+            <div className="mt-[36px] px-[24px]">
+                {components[value]}
+            </div>
+        </div>
+    )
+}
+
+export default ContentTabs