loan/user-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

designing box of showing loan request

Browse Source
This commit is contained in:
Mohammad Jalali
2023-07-13 13:57:44 +03:30
parent b866b56576
commit 4c5b042a6b
1 changed files with 163 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

165
src/components/dashboard/loan-follow-up/index.jsx
View File

@@ -1,16 +1,177 @@
import CenterLayout from "@/layouts/CenterLayout";
import DashboardLayouts from "@/layouts/dashboardLayouts";
import useUser from "@/lib/app/hooks/useUser";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import {
Avatar,
Box,
Card,
CardActions,
CardContent,
CardHeader,
Collapse,
Grid,
IconButton,
Stack,
Typography,
} from "@mui/material";
import { styled } from "@mui/material/styles";
import { useTranslations } from "next-intl";
import React from "react";
import { useState } from "react";
const ExpandMore = styled((props) => {
const { expand, ...other } = props;
return <IconButton {...other} />;
})(({ theme, expand }) => ({
transform: !expand ? "rotate(0deg)" : "rotate(180deg)",
marginLeft: "auto",
transition: theme.transitions.create("transform", {
duration: theme.transitions.duration.shortest,
}),
}));
const DashboardLoanFollowUpComponent = () => {
const t = useTranslations();
const { token } = useUser();
const [expanded, setExpanded] = useState(false);
const handleExpandClick = () => {
setExpanded(!expanded);
};
return (
<DashboardLayouts>
<CenterLayout>
<p>چه کشکی چه پشمی</p>
<Stack
spacing={2}
sx={{
p: 4,
width: "100%",
}}
>
<Grid
container
columnSpacing={2}
rowSpacing={2}
sx={{ alignItems: "center", justifyContent: "center" }}
>
<Grid item xs={12} md={6} lg={4}>
<Card sx={{ width: "100%" }}>
<CardHeader
avatar={
<Avatar
sx={{ bgcolor: "primary.main" }}
aria-label="recipe"
></Avatar>
}
title="اسم اقاهه"
subheader="تاریخ اگه خواستیم"
/>
<CardContent>
<Typography variant="body2" color="text.secondary">
متن تست
</Typography>
</CardContent>
<CardActions disableSpacing>
<ExpandMore
expand={expanded}
onClick={handleExpandClick}
aria-expanded={expanded}
aria-label="show more"
>
<ExpandMoreIcon />
</ExpandMore>
</CardActions>
<Collapse in={expanded} timeout="auto" unmountOnExit>
<CardContent>
<Typography paragraph>اطلاعات تکمیلی:</Typography>
<Typography paragraph>پارت دوم متن تست</Typography>
<Typography paragraph>پارت سه همون قبلی</Typography>
<Typography paragraph>در ادامه باید بگم که...</Typography>
<Typography>درپایان همینه که هست</Typography>
</CardContent>
</Collapse>
</Card>
</Grid>
<Grid item xs={12} md={6} lg={4}>
<Card sx={{ width: "100%" }}>
<CardHeader
avatar={
<Avatar
sx={{ bgcolor: "primary.main" }}
aria-label="recipe"
></Avatar>
}
title="اسم اقاهه"
subheader="تاریخ اگه خواستیم"
/>
<CardContent>
<Typography variant="body2" color="text.secondary">
متن تست
</Typography>
</CardContent>
<CardActions disableSpacing>
<ExpandMore
expand={expanded}
onClick={handleExpandClick}
aria-expanded={expanded}
aria-label="show more"
>
<ExpandMoreIcon />
</ExpandMore>
</CardActions>
<Collapse in={expanded} timeout="auto" unmountOnExit>
<CardContent>
<Typography paragraph>اطلاعات تکمیلی:</Typography>
<Typography paragraph>پارت دوم متن تست</Typography>
<Typography paragraph>پارت سه همون قبلی</Typography>
<Typography paragraph>در ادامه باید بگم که...</Typography>
<Typography>درپایان همینه که هست</Typography>
</CardContent>
</Collapse>
</Card>
</Grid>
<Grid item xs={12} md={6} lg={4}>
<Card sx={{ width: "100%" }}>
<CardHeader
avatar={
<Avatar
sx={{ bgcolor: "primary.main" }}
aria-label="recipe"
></Avatar>
}
title="اسم اقاهه"
subheader="تاریخ اگه خواستیم"
/>
<CardContent>
<Typography variant="body2" color="text.secondary">
متن تست
</Typography>
</CardContent>
<CardActions disableSpacing>
<ExpandMore
expand={expanded}
onClick={handleExpandClick}
aria-expanded={expanded}
aria-label="show more"
>
<ExpandMoreIcon />
</ExpandMore>
</CardActions>
<Collapse in={expanded} timeout="auto" unmountOnExit>
<CardContent>
<Typography paragraph>اطلاعات تکمیلی:</Typography>
<Typography paragraph>پارت دوم متن تست</Typography>
<Typography paragraph>پارت سه همون قبلی</Typography>
<Typography paragraph>در ادامه باید بگم که...</Typography>
<Typography>درپایان همینه که هست</Typography>
</CardContent>
</Collapse>
</Card>
</Grid>
</Grid>
</Stack>
</CenterLayout>
</DashboardLayouts>
);