feat: 심사자 심의 진행

README.md

@@ -134,3 +134,14 @@ docker run --rm -d --name opst-fo-local -p 3000:80 opst-fo-local:latest
 docker build -t opst-fo .
 docker run --rm -d --name opst-fo -p 80:80 opst-fo:latest
 ```
+
+### Array.from usage
+```js
+<Grid container spacing={{ xs: 2, md: 3 }} columns={{ xs: 4, sm: 8, md: 12 }}>
+  {Array.from(Array(6)).map((_, index) => (
+    <Grid item xs={2} sm={4} md={4} key={index}>
+      <Item>xs=2</Item>
+    </Grid>
+  ))}
+</Grid>
+```

src/apis/judge.js

@@ -177,12 +177,10 @@ async function judgeImgList(res, scCode, fieldCnt, fieldName, dataGb, methodName
     if (res?.data[`${fieldName}${idx}`]) {
       // eslint-disable-next-line no-await-in-loop
       await judgeImgDownload({ scDatagb: dataGb, scCode, methodName: `${methodName}${idx}` }, alert).then((r) => {
-        console.log(r);
         if (r.size > 0) arrRtn.push(URL.createObjectURL(r));
       }); // .then((r) => {
     }
   }
-  console.log(arrRtn);
   return arrRtn;
 }
 

src/views/biz/judge/JudgeByUserReview.jsx

@@ -56,12 +56,19 @@ const JudgeByUserReview = ({ msDatagb, menuName }) => {
     });
   }, [msDatagb]);
 
-  const processJudge = (row) => () => {
+  const onJudge = () => {
-    setTitle(`${menuName} 심의 - ${row.msSeq}`);
+    setRowDatas(rowsState?.rows);
-    setRowDatas([row]);
     setOpen(true);
   };
 
+  const processJudge = useCallback(
+    (row) => () => {
+      setRowDatas([row]);
+      setOpen(true);
+    },
+    []
+  );
+
   const columns = [
     // { headerName: 'rowId', field: 'rowId' },
     {
@@ -152,16 +159,10 @@ const JudgeByUserReview = ({ msDatagb, menuName }) => {
 
   const handleSearch = async (event) => {
     if (event.type === 'keydown' && event.key === 'Enter') {
-      const newString = event?.target.value;
       search();
     }
   };
 
-  const onJudge = useCallback(() => {
-    setTitle(`${menuName} 심의`);
-    setRowDatas(rowsState?.rows);
-    setOpen(true);
-  }, []);
   useEffect(() => {
     search();
     // }, [rowsState.page, rowsState.pageSize, selectedYear, searchTxt]);
@@ -227,7 +228,7 @@ const JudgeByUserReview = ({ msDatagb, menuName }) => {
         // selectionModel={selectionModel}
       />
       <CmmModal isBackdrop title={title} open={open} setOpen={setOpen}>
-        <ProcessJudge rowDatas={rowDatas} showAlert={showAlert} />
+        <ProcessJudge setTitle={setTitle} rowDatas={rowDatas} showAlert={showAlert} />
       </CmmModal>
     </MainCard>
   );

src/views/biz/judge/ProcessJudge.jsx

@@ -1,10 +1,15 @@
-import React, { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
-import { CardMedia, Grid } from '@mui/material';
+import PropTypes from 'prop-types';
-import { findImages } from '../../../apis/judge';
+
-import _ from 'lodash';
+import { Button, CardMedia, Divider, Grid } from '@mui/material';
+import { findImages } from 'apis/judge';
+import { SkipNext, SkipPrevious, Save } from '@mui/icons-material';
 
 const ProcessJudge = (props) => {
-  const { rowDatas, showAlert } = props;
+  const { setTitle, rowDatas, showAlert } = props;
+  const title = rowDatas[0].msDatagb === '1' ? '거주자 심의' : '장애인 심의';
+  const pageRef = useRef(0);
+  const totalPageRef = useRef(0);
   const [picadImgs, setPicadImgs] = useState([]);
   const [frecadImgs, setFrecadImgs] = useState([]);
   const [contadImgs, setContadImgs] = useState([]);
@@ -13,20 +18,36 @@ const ProcessJudge = (props) => {
     findImages(row, showAlert).then((res) => {
       const { arrPicadImg, arrFrecadImg, arrContadImg } = res;
       console.log(res);
-      // console.log(arrPicadImg, arrFrecadImg, arrContadImg);
       setPicadImgs(arrPicadImg);
       setFrecadImgs(arrFrecadImg);
       setContadImgs(arrContadImg);
     });
   };
 
+  const onPrev = () => {
+    pageRef.current -= 1;
+    setTitle(`${title} [ 접수번호 : ${rowDatas[pageRef.current].msSeq}]`);
+    getImgList(rowDatas[pageRef.current]);
+    console.log(pageRef.current, rowDatas[pageRef.current]);
+  };
+  const onNext = () => {
+    pageRef.current += 1;
+    setTitle(`${title} [ 접수번호 : ${rowDatas[pageRef.current].msSeq}]`);
+    getImgList(rowDatas[pageRef.current]);
+    console.log(pageRef.current, rowDatas[pageRef.current]);
+  };
+  const onSave = () => {};
+
   useEffect(() => {
-    getImgList(rowDatas[0]);
+    pageRef.current = 0;
+    totalPageRef.current = rowDatas.length - 1;
+    setTitle(`${title} [ 접수번호 : ${rowDatas[pageRef.current].msSeq}]`);
+    getImgList(rowDatas[pageRef.current]);
   }, []);
 
   return (
     <>
-      <Grid container spacing={1}>
+      <Grid container columnSpacing={{ xs: 1 }}>
         {picadImgs?.map((img, idx) => (
           <Grid item xs={3} key={idx} columnSpacing={1}>
             <CardMedia
@@ -42,6 +63,7 @@ const ProcessJudge = (props) => {
           </Grid>
         ))}
       </Grid>
+      <Grid container item xs={12} m={1} />
       <Grid container spacing={1}>
         {frecadImgs?.map((img, idx) => (
           <Grid item xs={3} key={idx} columnSpacing={1}>
@@ -58,6 +80,7 @@ const ProcessJudge = (props) => {
           </Grid>
         ))}
       </Grid>
+      <Grid container item xs={12} m={1} />
       <Grid container spacing={1}>
         {contadImgs?.map((img, idx) => (
           <Grid item xs={3} key={idx} columnSpacing={1}>
@@ -74,13 +97,42 @@ const ProcessJudge = (props) => {
           </Grid>
         ))}
       </Grid>
+      <Grid container item xs={12} m={1}>
+        <Grid item xs={12}>
+          <Divider />
+        </Grid>
+      </Grid>
+      <Grid item container spacing={0.5} xs={12} mt={1}>
+        <Grid item>
+          <Button disabled={pageRef.current === 0} variant="contained" size="small" startIcon={<SkipPrevious />} onClick={onPrev}>
+            이전
+          </Button>
+        </Grid>
+        <Grid item>
+          <Button
+            disabled={pageRef.current === totalPageRef.current}
+            variant="contained"
+            size="small"
+            endIcon={<SkipNext />}
+            onClick={onNext}
+          >
+            다음
+          </Button>
+        </Grid>
+        <Grid item style={{ marginLeft: 'auto' }}>
+          <Button variant="contained" size="small" startIcon={<Save />} onClick={onSave}>
+            저장
+          </Button>
+        </Grid>
+      </Grid>
     </>
   );
 };
 
-// ProcessJudge.propTypes = {
+ProcessJudge.propTypes = {
-//   rowDatas: PropTypes.object.isRequired,
+  rowDatas: PropTypes.object.isRequired,
-//   showAlert: PropTypes.object
+  showAlert: PropTypes.object,
-// };
+  setTitle: PropTypes.func.isRequired
+};
 
 export default ProcessJudge;