feat: dashboard 적용
parent
f0181e84ea
commit
befc5e479f
@ -1,39 +1,19 @@
|
|||||||
// // third-party
|
// ==============================|| DASHBOARD MENU ITEMS ||============================== //
|
||||||
// import { FormattedMessage } from 'react-intl';
|
|
||||||
//
|
import { FormattedMessage } from 'react-intl';
|
||||||
// // assets
|
|
||||||
// import { IconDashboard, IconDeviceAnalytics } from '@tabler/icons';
|
const dashboard = {
|
||||||
//
|
id: 'dashboard',
|
||||||
// // constant
|
// title: <FormattedMessage id="admin" />,
|
||||||
// const icons = {
|
type: 'group',
|
||||||
// IconDashboard,
|
children: [
|
||||||
// IconDeviceAnalytics
|
{
|
||||||
// };
|
id: 'dashboard',
|
||||||
//
|
title: <FormattedMessage id="dashboard" />,
|
||||||
// // ==============================|| DASHBOARD MENU ITEMS ||============================== //
|
type: 'item',
|
||||||
//
|
url: '/dashboard'
|
||||||
// const dashboard = {
|
// breadcrumbs: true
|
||||||
// id: 'dashboard',
|
}
|
||||||
// title: <FormattedMessage id="dashboard" />,
|
]
|
||||||
// type: 'group',
|
};
|
||||||
// children: [
|
export default dashboard;
|
||||||
// {
|
|
||||||
// id: 'default',
|
|
||||||
// title: <FormattedMessage id="default" />,
|
|
||||||
// type: 'item',
|
|
||||||
// url: '/dashboard/default',
|
|
||||||
// icon: icons.IconDashboard,
|
|
||||||
// breadcrumbs: false
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// id: 'analytics',
|
|
||||||
// title: <FormattedMessage id="analytics" />,
|
|
||||||
// type: 'item',
|
|
||||||
// url: '/dashboard/analytics',
|
|
||||||
// icon: icons.IconDeviceAnalytics,
|
|
||||||
// breadcrumbs: false
|
|
||||||
// }
|
|
||||||
// ]
|
|
||||||
// };
|
|
||||||
//
|
|
||||||
// export default dashboard;
|
|
||||||
|
|||||||
@ -1,309 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
|
||||||
|
|
||||||
// material-ui
|
|
||||||
import { useTheme } from '@mui/material/styles';
|
|
||||||
import { Avatar, Button, CardActions, CardContent, Divider, Grid, Menu, MenuItem, Typography } from '@mui/material';
|
|
||||||
|
|
||||||
// project imports
|
|
||||||
import BajajAreaChartCard from './BajajAreaChartCard';
|
|
||||||
import MainCard from 'ui-component/cards/MainCard';
|
|
||||||
import SkeletonPopularCard from 'ui-component/cards/Skeleton/PopularCard';
|
|
||||||
import { gridSpacing } from 'store/constant';
|
|
||||||
|
|
||||||
// assets
|
|
||||||
import ChevronRightOutlinedIcon from '@mui/icons-material/ChevronRightOutlined';
|
|
||||||
import MoreHorizOutlinedIcon from '@mui/icons-material/MoreHorizOutlined';
|
|
||||||
import KeyboardArrowUpOutlinedIcon from '@mui/icons-material/KeyboardArrowUpOutlined';
|
|
||||||
import KeyboardArrowDownOutlinedIcon from '@mui/icons-material/KeyboardArrowDownOutlined';
|
|
||||||
|
|
||||||
// ==============================|| DASHBOARD DEFAULT - POPULAR CARD ||============================== //
|
|
||||||
|
|
||||||
const PopularCard = ({ isLoading }) => {
|
|
||||||
const theme = useTheme();
|
|
||||||
|
|
||||||
const [anchorEl, setAnchorEl] = React.useState(null);
|
|
||||||
|
|
||||||
const handleClick = (event) => {
|
|
||||||
setAnchorEl(event.currentTarget);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleClose = () => {
|
|
||||||
setAnchorEl(null);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{isLoading ? (
|
|
||||||
<SkeletonPopularCard />
|
|
||||||
) : (
|
|
||||||
<MainCard content={false}>
|
|
||||||
<CardContent>
|
|
||||||
<Grid container spacing={gridSpacing}>
|
|
||||||
<Grid item xs={12}>
|
|
||||||
<Grid container alignContent="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="h4">Popular Stocks</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<MoreHorizOutlinedIcon
|
|
||||||
fontSize="small"
|
|
||||||
sx={{
|
|
||||||
color: theme.palette.primary[200],
|
|
||||||
cursor: 'pointer'
|
|
||||||
}}
|
|
||||||
aria-controls="menu-popular-card"
|
|
||||||
aria-haspopup="true"
|
|
||||||
onClick={handleClick}
|
|
||||||
/>
|
|
||||||
<Menu
|
|
||||||
id="menu-popular-card"
|
|
||||||
anchorEl={anchorEl}
|
|
||||||
keepMounted
|
|
||||||
open={Boolean(anchorEl)}
|
|
||||||
onClose={handleClose}
|
|
||||||
variant="selectedMenu"
|
|
||||||
anchorOrigin={{
|
|
||||||
vertical: 'bottom',
|
|
||||||
horizontal: 'right'
|
|
||||||
}}
|
|
||||||
transformOrigin={{
|
|
||||||
vertical: 'top',
|
|
||||||
horizontal: 'right'
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<MenuItem onClick={handleClose}> Today</MenuItem>
|
|
||||||
<MenuItem onClick={handleClose}> This Month</MenuItem>
|
|
||||||
<MenuItem onClick={handleClose}> This Year </MenuItem>
|
|
||||||
</Menu>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={12} sx={{ pt: '16px !important' }}>
|
|
||||||
<BajajAreaChartCard />
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={12}>
|
|
||||||
<Grid container direction="column">
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
Bajaj Finery
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
$1839.00
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Avatar
|
|
||||||
variant="rounded"
|
|
||||||
sx={{
|
|
||||||
width: 16,
|
|
||||||
height: 16,
|
|
||||||
borderRadius: '5px',
|
|
||||||
backgroundColor: theme.palette.success.light,
|
|
||||||
color: theme.palette.success.dark,
|
|
||||||
ml: 2
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<KeyboardArrowUpOutlinedIcon fontSize="small" color="inherit" />
|
|
||||||
</Avatar>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle2" sx={{ color: 'success.dark' }}>
|
|
||||||
10% Profit
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Divider sx={{ my: 1.5 }} />
|
|
||||||
<Grid container direction="column">
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
TTML
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
$100.00
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Avatar
|
|
||||||
variant="rounded"
|
|
||||||
sx={{
|
|
||||||
width: 16,
|
|
||||||
height: 16,
|
|
||||||
borderRadius: '5px',
|
|
||||||
backgroundColor: theme.palette.orange.light,
|
|
||||||
color: theme.palette.orange.dark,
|
|
||||||
marginLeft: 1.875
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<KeyboardArrowDownOutlinedIcon fontSize="small" color="inherit" />
|
|
||||||
</Avatar>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle2" sx={{ color: theme.palette.orange.dark }}>
|
|
||||||
10% loss
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Divider sx={{ my: 1.5 }} />
|
|
||||||
<Grid container direction="column">
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
Reliance
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
$200.00
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Avatar
|
|
||||||
variant="rounded"
|
|
||||||
sx={{
|
|
||||||
width: 16,
|
|
||||||
height: 16,
|
|
||||||
borderRadius: '5px',
|
|
||||||
backgroundColor: theme.palette.success.light,
|
|
||||||
color: theme.palette.success.dark,
|
|
||||||
ml: 2
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<KeyboardArrowUpOutlinedIcon fontSize="small" color="inherit" />
|
|
||||||
</Avatar>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle2" sx={{ color: theme.palette.success.dark }}>
|
|
||||||
10% Profit
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Divider sx={{ my: 1.5 }} />
|
|
||||||
<Grid container direction="column">
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
TTML
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
$189.00
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Avatar
|
|
||||||
variant="rounded"
|
|
||||||
sx={{
|
|
||||||
width: 16,
|
|
||||||
height: 16,
|
|
||||||
borderRadius: '5px',
|
|
||||||
backgroundColor: theme.palette.orange.light,
|
|
||||||
color: theme.palette.orange.dark,
|
|
||||||
ml: 2
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<KeyboardArrowDownOutlinedIcon fontSize="small" color="inherit" />
|
|
||||||
</Avatar>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle2" sx={{ color: theme.palette.orange.dark }}>
|
|
||||||
10% loss
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Divider sx={{ my: 1.5 }} />
|
|
||||||
<Grid container direction="column">
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
Stolon
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle1" color="inherit">
|
|
||||||
$189.00
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Avatar
|
|
||||||
variant="rounded"
|
|
||||||
sx={{
|
|
||||||
width: 16,
|
|
||||||
height: 16,
|
|
||||||
borderRadius: '5px',
|
|
||||||
backgroundColor: theme.palette.orange.light,
|
|
||||||
color: theme.palette.orange.dark,
|
|
||||||
ml: 2
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<KeyboardArrowDownOutlinedIcon fontSize="small" color="inherit" />
|
|
||||||
</Avatar>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle2" sx={{ color: theme.palette.orange.dark }}>
|
|
||||||
10% loss
|
|
||||||
</Typography>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</CardContent>
|
|
||||||
<CardActions sx={{ p: 1.25, pt: 0, justifyContent: 'center' }}>
|
|
||||||
<Button size="small" disableElevation>
|
|
||||||
View All
|
|
||||||
<ChevronRightOutlinedIcon />
|
|
||||||
</Button>
|
|
||||||
</CardActions>
|
|
||||||
</MainCard>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
PopularCard.propTypes = {
|
|
||||||
isLoading: PropTypes.bool
|
|
||||||
};
|
|
||||||
|
|
||||||
export default PopularCard;
|
|
||||||
@ -1,134 +0,0 @@
|
|||||||
import PropTypes from 'prop-types';
|
|
||||||
import React from 'react';
|
|
||||||
|
|
||||||
// material-ui
|
|
||||||
import { useTheme } from '@mui/material/styles';
|
|
||||||
import { Grid, MenuItem, TextField, Typography } from '@mui/material';
|
|
||||||
|
|
||||||
// third-party
|
|
||||||
import ApexCharts from 'apexcharts';
|
|
||||||
import Chart from 'react-apexcharts';
|
|
||||||
|
|
||||||
// project imports
|
|
||||||
import useConfig from 'hooks/useConfig';
|
|
||||||
import SkeletonTotalGrowthBarChart from 'ui-component/cards/Skeleton/TotalGrowthBarChart';
|
|
||||||
import MainCard from 'ui-component/cards/MainCard';
|
|
||||||
import { gridSpacing } from 'store/constant';
|
|
||||||
|
|
||||||
// chart data
|
|
||||||
import chartData from './chart-data/total-growth-bar-chart';
|
|
||||||
|
|
||||||
const status = [
|
|
||||||
{
|
|
||||||
value: 'today',
|
|
||||||
label: 'Today'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: 'month',
|
|
||||||
label: 'This Month'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: 'year',
|
|
||||||
label: 'This Year'
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
// ==============================|| DASHBOARD DEFAULT - TOTAL GROWTH BAR CHART ||============================== //
|
|
||||||
|
|
||||||
const TotalGrowthBarChart = ({ isLoading }) => {
|
|
||||||
const [value, setValue] = React.useState('today');
|
|
||||||
const theme = useTheme();
|
|
||||||
const { navType } = useConfig();
|
|
||||||
|
|
||||||
const { primary } = theme.palette.text;
|
|
||||||
const darkLight = theme.palette.dark.light;
|
|
||||||
const grey200 = theme.palette.grey[200];
|
|
||||||
const grey500 = theme.palette.grey[500];
|
|
||||||
|
|
||||||
const primary200 = theme.palette.primary[200];
|
|
||||||
const primaryDark = theme.palette.primary.dark;
|
|
||||||
const secondaryMain = theme.palette.secondary.main;
|
|
||||||
const secondaryLight = theme.palette.secondary.light;
|
|
||||||
|
|
||||||
React.useEffect(() => {
|
|
||||||
const newChartData = {
|
|
||||||
...chartData.options,
|
|
||||||
colors: [primary200, primaryDark, secondaryMain, secondaryLight],
|
|
||||||
xaxis: {
|
|
||||||
labels: {
|
|
||||||
style: {
|
|
||||||
colors: [primary, primary, primary, primary, primary, primary, primary, primary, primary, primary, primary, primary]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
yaxis: {
|
|
||||||
labels: {
|
|
||||||
style: {
|
|
||||||
colors: [primary]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
grid: {
|
|
||||||
borderColor: navType === 'dark' ? darkLight + 20 : grey200
|
|
||||||
},
|
|
||||||
tooltip: {
|
|
||||||
theme: navType === 'dark' ? 'dark' : 'light'
|
|
||||||
},
|
|
||||||
legend: {
|
|
||||||
labels: {
|
|
||||||
colors: grey500
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// do not load chart when loading
|
|
||||||
if (!isLoading) {
|
|
||||||
ApexCharts.exec(`bar-chart`, 'updateOptions', newChartData);
|
|
||||||
}
|
|
||||||
}, [navType, primary200, primaryDark, secondaryMain, secondaryLight, primary, darkLight, grey200, isLoading, grey500]);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{isLoading ? (
|
|
||||||
<SkeletonTotalGrowthBarChart />
|
|
||||||
) : (
|
|
||||||
<MainCard>
|
|
||||||
<Grid container spacing={gridSpacing}>
|
|
||||||
<Grid item xs={12}>
|
|
||||||
<Grid container alignItems="center" justifyContent="space-between">
|
|
||||||
<Grid item>
|
|
||||||
<Grid container direction="column" spacing={1}>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="subtitle2">Total Growth</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<Typography variant="h3">$2,324.00</Typography>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item>
|
|
||||||
<TextField id="standard-select-currency" select value={value} onChange={(e) => setValue(e.target.value)}>
|
|
||||||
{status.map((option) => (
|
|
||||||
<MenuItem key={option.value} value={option.value}>
|
|
||||||
{option.label}
|
|
||||||
</MenuItem>
|
|
||||||
))}
|
|
||||||
</TextField>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={12}>
|
|
||||||
<Chart {...chartData} />
|
|
||||||
</Grid>
|
|
||||||
</Grid>
|
|
||||||
</MainCard>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
TotalGrowthBarChart.propTypes = {
|
|
||||||
isLoading: PropTypes.bool
|
|
||||||
};
|
|
||||||
|
|
||||||
export default TotalGrowthBarChart;
|
|
||||||
@ -0,0 +1,93 @@
|
|||||||
|
import { useEffect, useState, useCallback } from 'react';
|
||||||
|
|
||||||
|
// material-ui
|
||||||
|
import { Grid, Link, Typography } from '@mui/material';
|
||||||
|
|
||||||
|
// project imports
|
||||||
|
import { gridSpacing } from 'store/constant';
|
||||||
|
import { findDashboard } from 'apis/judge';
|
||||||
|
import MuiDataGrid from 'views/cmm/mui-grid/MuiDataGrid';
|
||||||
|
import { IconFileText } from '@tabler/icons';
|
||||||
|
|
||||||
|
// ==============================|| DEFAULT DASHBOARD ||============================== //
|
||||||
|
|
||||||
|
const Dashboard = () => {
|
||||||
|
const [isLoading, setLoading] = useState(true);
|
||||||
|
const [totalCount, setTotalCount] = useState(0);
|
||||||
|
const [rowsState, setRowsState] = useState({
|
||||||
|
page: 0,
|
||||||
|
pageSize: 6,
|
||||||
|
rows: []
|
||||||
|
// loading: false
|
||||||
|
});
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ headerName: 'No.', headerAlign: 'center', field: 'rowId', align: 'center', width: 80 },
|
||||||
|
{
|
||||||
|
headerName: '업무구분',
|
||||||
|
headerAlign: 'center',
|
||||||
|
field: 'inDept',
|
||||||
|
align: 'center',
|
||||||
|
width: 120
|
||||||
|
},
|
||||||
|
{
|
||||||
|
headerName: '제목',
|
||||||
|
headerAlign: 'center',
|
||||||
|
field: 'inTitle',
|
||||||
|
width: 400,
|
||||||
|
renderCell: (params) => (
|
||||||
|
<Link underline="hover" href="#">
|
||||||
|
{params.value}
|
||||||
|
</Link>
|
||||||
|
)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
headerName: '첨부파일',
|
||||||
|
headerAlign: 'center',
|
||||||
|
field: 'inFile',
|
||||||
|
align: 'center',
|
||||||
|
width: 100,
|
||||||
|
renderCell: (params) => (
|
||||||
|
// console.log(params.row.inFilename);
|
||||||
|
<>{params.row.inFilename ? <IconFileText stroke={1.5} size="1rem" /> : ''}</>
|
||||||
|
)
|
||||||
|
},
|
||||||
|
{ headerName: '작성일자', headerAlign: 'center', field: 'inNalja', align: 'center', width: 130 },
|
||||||
|
{ headerName: '조회수', headerAlign: 'center', field: 'inHit', align: 'right', width: 100 }
|
||||||
|
];
|
||||||
|
|
||||||
|
const search = useCallback(() => {
|
||||||
|
// const params = {
|
||||||
|
// page: rowsState.page,
|
||||||
|
// size: rowsState.pageSize
|
||||||
|
// };
|
||||||
|
|
||||||
|
findDashboard().then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
if (res && res.data) {
|
||||||
|
const rows = res.data?.pBoardList.content.map((d, idx) => ({ ...d, rowId: idx + 1 }));
|
||||||
|
setTotalCount(rows.count);
|
||||||
|
setRowsState((prevState) => ({ ...prevState, rows }));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setLoading(false);
|
||||||
|
search();
|
||||||
|
}, [search]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Grid container spacing={gridSpacing}>
|
||||||
|
<Grid item xs={12}>
|
||||||
|
<Typography variant="h3">공지사항</Typography>
|
||||||
|
<MuiDataGrid columns={columns} rowsState={rowsState} totalCount={totalCount || 0} setRowsState={setRowsState} gridHeight={300} />
|
||||||
|
</Grid>
|
||||||
|
<Grid item xs={12}>
|
||||||
|
<Typography variant="h3">심사자현황</Typography>
|
||||||
|
</Grid>
|
||||||
|
</Grid>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Dashboard;
|
||||||
Loading…
Reference in New Issue