feat: dashboard 적용

src/views/dashboard/index.js

@@ -12,11 +12,37 @@ 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,
+    pageSize: 100,
+    rows: []
+    // loading: false
+  });
+
+  const [msEdate1, setMsEdate1] = useState();
+  const [totalCount1, setTotalCount1] = useState(0);
+  const [rowsState1, setRowsState1] = useState({
+    page: 0,
+    pageSize: 100,
+    rows: []
+    // loading: false
+  });
+
+  const [msEdate2, setMsEdate2] = useState();
+  const [totalCount2, setTotalCount2] = useState(0);
+  const [rowsState2, setRowsState2] = useState({
+    page: 0,
+    pageSize: 100,
+    rows: []
+    // loading: false
+  });
+
+  const [msEdate3, setMsEdate3] = useState();
+  const [totalCount3, setTotalCount3] = useState(0);
+  const [rowsState3, setRowsState3] = useState({
+    page: 0,
+    pageSize: 100,
     rows: []
     // loading: false
   });
@@ -56,6 +82,41 @@ const Dashboard = () => {
     { headerName: '조회수', headerAlign: 'center', field: 'inHit', align: 'right', width: 100 }
   ];
 
+  const judgeColumns = [
+    { headerName: 'No.', headerAlign: 'center', field: 'rowId', align: 'center', width: 50 },
+    {
+      headerName: '팀',
+      headerAlign: 'center',
+      field: 'msuTeam',
+      width: 65,
+      align: 'center',
+      valueFormatter: (params) => {
+        const teamCode = params.value;
+        if (teamCode && teamCode.length === 3) {
+          if (teamCode === '000') return '관리팀';
+          if (teamCode === '999') return '';
+          return `${teamCode.substring(2)}팀`;
+        }
+        return '';
+      }
+    },
+    {
+      headerName: '심사자',
+      headerAlign: 'center',
+      field: 'name',
+      align: 'center',
+      width: 100
+    },
+    {
+      headerName: '완료 / 전체',
+      headerAlign: 'center',
+      field: 'judge',
+      align: 'center',
+      width: 100,
+      valueGetter: (params) => `${params.row.jcnt} / ${params.row.tcnt}`
+    }
+  ];
+
   const search = useCallback(() => {
     // const params = {
     //   page: rowsState.page,
@@ -68,23 +129,68 @@ const Dashboard = () => {
         const rows = res.data?.pBoardList.content.map((d, idx) => ({ ...d, rowId: idx + 1 }));
         setTotalCount(rows.count);
         setRowsState((prevState) => ({ ...prevState, rows }));
+
+        const parkRows = res.data.parkJudgeList.map((d, idx) => ({ ...d, rowId: idx + 1 }));
+        setMsEdate1(parkRows[0].msEdate);
+        setTotalCount1(parkRows.count);
+        setRowsState1((prevState) => ({ ...prevState, rows: parkRows }));
+
+        const residentRows = res.data.residentJudgeList.map((d, idx) => ({ ...d, rowId: idx + 1 }));
+        setMsEdate2(residentRows[0].msEdate);
+        setTotalCount2(residentRows.count);
+        setRowsState2((prevState) => ({ ...prevState, rows: parkRows }));
+
+        const disabledRows = res.data.disabledJudgeList.map((d, idx) => ({ ...d, rowId: idx + 1 }));
+        setMsEdate3(residentRows[0].msEdate);
+        setTotalCount3(disabledRows.count);
+        setRowsState3((prevState) => ({ ...prevState, rows: disabledRows }));
       }
     });
   }, []);
 
   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} />
+        <Typography variant="h4">공지사항</Typography>
+        <MuiDataGrid columns={columns} rowsState={rowsState} totalCount={totalCount || 0} setRowsState={setRowsState} gridHeight={250} />
       </Grid>
       <Grid item xs={12}>
-        <Typography variant="h3">심사자현황</Typography>
+        <Grid container spacing={gridSpacing}>
+          <Grid item xs={4}>
+            <Typography variant="h4">주정차심사자현황 (심사종료일 : {msEdate1})</Typography>
+            <MuiDataGrid
+              columns={judgeColumns}
+              rowsState={rowsState1}
+              totalCount={totalCount1 || 0}
+              setRowsState={() => {}}
+              gridHeight={300}
+            />
+          </Grid>
+          <Grid item xs={4}>
+            <Typography variant="h4">거주자심사자현황 (심사종료일 : {msEdate2})</Typography>
+            <MuiDataGrid
+              columns={judgeColumns}
+              rowsState={rowsState2}
+              totalCount={totalCount2 || 0}
+              setRowsState={() => {}}
+              gridHeight={300}
+            />
+          </Grid>
+          <Grid item xs={4}>
+            <Typography variant="h4">장애인심사자현황 (심사종료일 : {msEdate3})</Typography>
+            <MuiDataGrid
+              columns={judgeColumns}
+              rowsState={rowsState3}
+              totalCount={totalCount3 || 0}
+              setRowsState={() => {}}
+              gridHeight={300}
+            />
+          </Grid>
+        </Grid>
       </Grid>
     </Grid>
   );