Files
user-front/src/components/dashboard/first/index.jsx

107 lines
5.0 KiB
JavaScript

import { CenterLayout, FullPageLayout, NextLinkComposed, useUser } from "@witel/webapp-builder";
import { Button, Card, CardActions, CardContent, Stack, Typography } from "@mui/material";
import { useTranslations } from "next-intl";
import VolunteerActivismIcon from "@mui/icons-material/VolunteerActivism";
import DirectionsCarIcon from "@mui/icons-material/DirectionsCar";
const FirstComponent = () => {
const { user } = useUser();
const t = useTranslations();
return (
<FullPageLayout>
<CenterLayout spacing={2}>
{user.permissions.includes("can_request_navgan_loan") ? (
<Stack direction={"row"} spacing={2}>
<Card
sx={{
minWidth: 345,
boxShadow: 3,
transition: "transform 0.3s ease-in-out",
"&:hover": { transform: "scale(1.05)" },
}}
>
<CardContent
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
}}
>
<DirectionsCarIcon sx={{ fontSize: 50, color: "primary.main" }} />
<Typography variant="h6" gutterBottom>
{t("Dashboard.request_navgan_loan")}
</Typography>
<Typography variant="body2" color="text.secondary">
{t("Dashboard.navgan_loan_description")}
</Typography>
</CardContent>
<CardActions>
<Button
component={NextLinkComposed}
to={{ pathname: "/dashboard/navgan/add-request-loan" }}
variant="contained"
size="large"
fullWidth
>
{t("Dashboard.navgan_loan_request_page")}
</Button>
</CardActions>
</Card>
<Card
sx={{
minWidth: 345,
boxShadow: 3,
transition: "transform 0.3s ease-in-out",
"&:hover": { transform: "scale(1.05)" },
}}
>
<CardContent
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
justifyContent: "center",
}}
>
<VolunteerActivismIcon sx={{ fontSize: 50, color: "secondary.main" }} />
<Typography variant="h6" gutterBottom>
{t("Dashboard.request_refahi_loan")}
</Typography>
<Typography variant="body2" color="text.secondary">
{t("Dashboard.refahi_loan_description")}
</Typography>
</CardContent>
<CardActions>
<Button
component={NextLinkComposed}
to={{ pathname: "/dashboard/refahi/add-request-loan" }}
variant="contained"
size="large"
fullWidth
>
{t("Dashboard.refahi_loan_request_page")}
</Button>
</CardActions>
</Card>
</Stack>
) : (
<>
<Typography>{t("Dashboard.go_to_followUp-loan")}</Typography>
<Button
component={NextLinkComposed}
to={{ pathname: "/dashboard/followUp-loan" }}
variant={"contained"}
size={"large"}
>
{t("LoanFollowUp.loan_follow_up_page")}
</Button>
</>
)}
</CenterLayout>
</FullPageLayout>
);
};
export default FirstComponent;