From dee99d726b91b957d5d8d7a142c105744d9d1cd2 Mon Sep 17 00:00:00 2001
From: AminGhasempoor <aminghasempoor79@gmail.com>
Date: Sun, 12 Nov 2023 13:32:58 +0330
Subject: [PATCH] LFFE-22 landing page demo

---
 package.json                   |   1 +
 public/locales/fa/app.json     |   6 ++
 src/components/first/index.jsx | 167 ++++++++++++++++++++++++---------
 3 files changed, 132 insertions(+), 42 deletions(-)

diff --git a/package.json b/package.json
index 9dc4a67..5305c99 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "@emotion/server": "^11.10.0",
     "@emotion/styled": "^11.10.6",
     "@mui/icons-material": "^5.11.16",
+    "@mui/lab": "^5.0.0-alpha.152",
     "@mui/material": "^5.12.0",
     "axios": "^1.4.0",
     "colord": "^2.9.3",
diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json
index 75aa877..accb590 100644
--- a/public/locales/fa/app.json
+++ b/public/locales/fa/app.json
@@ -23,6 +23,12 @@
     "change_password": "تغییر رمز عبور",
     "logout": "خروج"
   },
+  "firstPage" : {
+    "login_description" : "برای استفاده از تصحیلات ابتدا می بایست وارد شوید",
+    "login_button": "ورود به سامانه تسهیلات",
+    "register_description" : "برای استفاده از تصحیلات ابتدا می بایست ثبت نام کنید",
+    "register_button": "اگر تازه وارد هستید ثبت نام کنید"
+  },
   "notifications": {
     "error_static_text": "عملیات با خطا مواجه شد",
     "success_static_text": "عملیات با موفقیت انجام شد",
diff --git a/src/components/first/index.jsx b/src/components/first/index.jsx
index c949fac..2e36f07 100644
--- a/src/components/first/index.jsx
+++ b/src/components/first/index.jsx
@@ -1,53 +1,136 @@
-import {NextLinkComposed} from "@/core/components/LinkRouting";
-import CenterLayout from "@/layouts/CenterLayout";
 import FullPageLayout from "@/layouts/FullPageLayout";
 import useUser from "@/lib/app/hooks/useUser";
-import {Button, Stack, Typography} from "@mui/material";
+import {Box, Chip, Container, Divider, Grid, Stack, Typography} from "@mui/material";
 import {useTranslations} from "next-intl";
-import SvgDashboard from "@/core/components/svgs/SvgDashboard";
+import LinkRouting from "@/core/components/LinkRouting";
+import {
+    Timeline,
+    TimelineConnector,
+    TimelineContent,
+    TimelineDot,
+    TimelineItem,
+    TimelineSeparator
+} from "@mui/lab";
 
 const FirstComponent = () => {
     const t = useTranslations();
-    const {isAuth} = useUser();
 
     return (
-        <FullPageLayout sx={{p: 1}}>
-            <CenterLayout spacing={3}>
-                <SvgDashboard width={300} height={200}/>
-                <Typography variant="h5" sx={{textAlign: "center"}}>
-                    {t("app_name")}
-                </Typography>
-                {isAuth ? (
-                    <Button
-                        variant="contained"
-                        component={NextLinkComposed}
-                        to={{
-                            pathname: "/dashboard",
-                        }}
-                    >
-                        {t("dashboard")}
-                    </Button>
-                ) : (
-                    <Button
-                        sx={{whiteSpace: "nowrap"}}
-                        variant="contained"
-                        size="large"
-                        component={NextLinkComposed}
-                        to={{
-                            pathname: "/login",
-                        }}
-                    >
-                        {t("login_user_panel")}
-                    </Button>
-                )}
-            </CenterLayout>
-            <Stack direction="row" alignItems="center" justifyContent="center">
-                <Typography variant={"caption"}
-                            sx={{
-                                color: 'primary.main',
-                                fontFamily: 'Arial',
-                                fontWeight: 'bold'
-                            }}>v{process.env.NEXT_PUBLIC_API_VERSION}</Typography>
+        <FullPageLayout>
+            <Stack>
+                <Box sx={{backgroundColor : "primary.light"}}>
+                    <Container sx={{padding : 3, color : "white"}} maxWidth="xl">
+                        <Typography sx={{my : 3}} textAlign={'center'} variant={'h3'}>
+                            {t("app_name")}
+                        </Typography>
+                        <Stack sx={{color : "white"}}>
+                            <Grid sx={{py : 4}} container spacing={4}>
+                                <Grid item xs={6}>
+                                    <Box>
+                                        <Typography>
+                                            برای استفاده از تسحیلات این سامانه و دریافت وام می بایست ابتدا وارد سامانه شوید و یا اگر ثبت نام نکرده اید ثبت نام کنید
+                                        </Typography>
+                                    </Box>
+                                </Grid>
+                                <Grid item xs={6}>
+                                    <Stack spacing={3} alignItems={'center'} justifyContent={'center'}>
+                                        <Container maxWidth={'xs'} sx={{backgroundColor : "primary.main", textAlign : "center", borderRadius : 2, padding : 1}}>
+                                            <LinkRouting underline="none" color="inherit" href={'/login'}>
+                                                <Typography variant="h6">
+                                                    {t("firstPage.login_button")}
+                                                </Typography>
+                                            </LinkRouting>
+                                        </Container>
+                                        <Container maxWidth={'xs'}  sx={{backgroundColor : "primary.main", textAlign : "center", borderRadius : 2 ,padding : 1}}>
+                                            <LinkRouting underline="none" color="inherit" href={'/register'}>
+                                                <Typography variant="h6">
+                                                    {t("firstPage.register_button")}
+                                                </Typography>
+                                            </LinkRouting>
+                                        </Container>
+                                    </Stack>
+                                </Grid>
+                            </Grid>
+                        </Stack>
+                    </Container>
+                </Box>
+                <Box>
+                    <Container sx={{py : 3}} maxWidth="xl">
+                        <Typography sx={{my : 3}} variant={'h3'}>
+                            توضیحات دریافت وام
+                        </Typography>
+                        <Grid sx={{py : 2}} container spacing={2}>
+                            <Grid item xs={8}>
+                                <Typography>
+                                    وام خرید کالای مهر ایران یا کالا کارت با هدف خرید مایحتاج خانه و کالاهای ضروری زندگی داده می‌شود. سقف کالا کارت ۱۵۰ میلیون تومان و سود آن ۴ درصد است.
+                                    با دریافت کالا کارت می‌توانید وسایل موردنیازتان را از فروشگاه‌های طرف قرارداد با بانک خریداری کنید.
+                                    این فروشگاه‌ها با نام گلدیران در شهرهای تهران، شیراز، اهواز، نور، اصفهان، تبریز، ساری و رشت فعالیت می‌کنند.
+                                    طبق قوانین جدید و در راستای حمایت از طرح افزایش جمیعت، مبلغ آن برای زوجینی که مرد زیر ۲۵ سال و زن زیر ۲۳ سال داشته باشد، ۴۴۰ میلیون یا ۲۲۰ میلیون به ازای هر نفر است. در این قانون هریک از زوجین که شرایط آن‌ها در این قانون نگنجد، مبلغ تغییر کرده و به زوج ۴۰۰ میلیون وام تعلق خواهد گرفت.
+                                    حداکثر زمان بازپرداخت وام خرید کالا ۲۴ ماه است و برای گرفتن آن به یک ضامن رسمی احتیاج دارید.
+                                </Typography>
+                            </Grid>
+                            <Grid item xs={4}>
+                                <Box>
+                                    <Timeline position={'right'}>
+                                        <TimelineItem>
+                                            <TimelineSeparator>
+                                                <TimelineDot />
+                                                <TimelineConnector />
+                                            </TimelineSeparator>
+                                            <TimelineContent>مهمان نباشد و دارای ترم آموزشی باشد.</TimelineContent>
+                                        </TimelineItem>
+                                        <TimelineItem>
+                                            <TimelineSeparator>
+                                                <TimelineDot />
+                                                <TimelineConnector />
+                                            </TimelineSeparator>
+                                            <TimelineContent>دانشجوی حضوری و در سنوات مجاز تحصیلی</TimelineContent>
+                                        </TimelineItem>
+                                        <TimelineItem>
+                                            <TimelineSeparator>
+                                                <TimelineDot />
+                                            </TimelineSeparator>
+                                            <TimelineContent>هریه پرداز و دارای بدهی به سیستم مالی دانشگاه</TimelineContent>
+                                        </TimelineItem>
+                                    </Timeline>
+                                </Box>
+                            </Grid>
+                        </Grid>
+                    </Container>
+                </Box>
+                <Box>
+                    <Container sx={{py : 3}} maxWidth="xl">
+                        <Typography sx={{my : 3}} variant={'h3'}>
+                            تخصیص وام
+                        </Typography>
+                        <Grid container spacing={2} sx={{py : 2}}>
+                            <Grid item={10}>
+                                <Typography variant={'h5'}>
+                                    قوانین دریافت وام
+                                </Typography>
+                                <ul>
+                                    <li>
+                                        فقط به زوجین ایرانی تعلق می‌گیرد.
+                                    </li>
+                                    <li>
+                                         به زوجین ایرانی تعلق می‌گیرد.
+                                    </li>
+                                    <li>
+                                        فقط به زوجین ایرانی تعلق می‌گیرد.
+                                    </li>
+                                    <li>
+                                        فقط به زوجین ایرانی تعلق می‌گیرد.
+                                    </li>
+                                </ul>
+                            </Grid>
+                            <Grid item={2}>
+                                <Typography>
+                                    فایل ضمیمه
+                                </Typography>
+                            </Grid>
+                        </Grid>
+                    </Container>
+                </Box>
             </Stack>
         </FullPageLayout>
     );