feat: 주정차의견진술 자료 등록 반영

src/views/biz/resident/SaveResidentDataForm.jsx

@@ -1,23 +1,15 @@
 import { useCallback, useEffect, useState } from 'react';
 
 import NumberFormat from 'react-number-format';
-import format from 'date-fns/format';
-import getHours from 'date-fns/getHours';
-import koLocale from 'date-fns/locale/ko';
 
 import { Grid, TextField, MenuItem, Select, FormControl, InputLabel, IconButton, InputAdornment } from '@mui/material';
-import DateAdapter from '@mui/lab/AdapterDateFns';
-import LocalizationProvider from '@mui/lab/LocalizationProvider';
-import { DatePicker, TimePicker } from '@mui/lab';
 import Button from '@mui/material/Button';
 import PropTypes from 'prop-types';
-import { IconFileExport } from '@tabler/icons';
+import { IconFileExport, IconSearch } from '@tabler/icons';
 import { getComboCodeList } from 'apis/common';
-import combo from '../../../commons/combo_data';
-import { FileDownload, FileUpload } from '@mui/icons-material';
 import { useAlert } from 'react-alert';
-import FileInputForm from '../../form/FileInputForm';
 import FileInputForms from '../../form/FileInputForms';
+import * as React from 'react';
 
 const toDate = new Date();
 
@@ -38,13 +30,22 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
   const [scCdate, setScCdate] = useState();
   const [scJbtime, setScJbtime] = useState();
 
-  const [scPicad, setScPcad] = useState([]);
-
-  const [selectedImgFile, setSelectedImgFile] = useState('');
-  const [selectedFile, setSelectedFile] = useState('');
+  const [picads, setPicads] = useState([]);
+  const [frecads, setFrecads] = useState([]);
 
   const onSave = () => {
-    handleModalSave({});
+    const scPicadFiles = Object.values(picads);
+    const scFrecadFiles = Object.values(frecads);
+    // for (const [k, v] of Object.entries(scPicad)) {
+    //   scPicadFiles.push(v);
+    // }
+    console.log(scPicadFiles, scFrecadFiles);
+
+    // for(let i=0 of scPicad) {
+    //   console.log(picad);
+    //   return picad;
+    // });
+    // handleModalSave({});
   };
 
   useEffect(() => {
@@ -61,14 +62,38 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
   }, []);
 
   const handleChangeFile = (e) => {
-    // eslint-disable-next-line no-debugger
-    // debugger;
-    // console.log(e);
+    const fileKey = e.target.name;
+    const fileArrKey = fileKey + e.target.dataset.index;
+
+    if (fileKey === 'scPicad') {
+      setPicads((picads) => {
+        const updated = { ...picads };
+        updated[fileArrKey] = e.target.files[0];
+        return updated;
+      });
+    } else if (fileKey === 'scFrecad') {
+      setFrecads((frecads) => {
+        const updated = { ...frecads };
+        updated[fileArrKey] = e.target.files[0];
+        return updated;
+      });
+      // let isNew = true;
+      // scPicad.map((picad) => {
+      //   if (picad.name === fileArrKey) {
+      //     isNew = false;
+      //     return { ...picad, value: 'kk' };
+      //   }
+      //   return { ...picad };
+      // });
+      // if (isNew) {
+      //   setScPicad([...scPicad, { name: fileArrKey, value: '1111' }]);
+      // } else {
+      //   setScPicad([scPicad]);
+      // }
+    }
 
-    const idx = Number(e.target.dataset.index) + 1;
-    setScPcad([...scPicad, e.target.files[0]]);
     // setScPcad([...scPicad, {`[${e.target.name}]${idx}`: e.target.files[0] });
-    console.log(scPicad);
+    console.log(picads);
 
     // console.log(e);
     // setSelectedFile(e.target.files[0].name);
@@ -90,6 +115,7 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
               fullWidth
               value={scCarnum}
               onValueChange={(values) => setScCarnum(values.value)}
+              autoFocus
             />
           </Grid>
           <Grid item sm={3}>
@@ -164,20 +190,37 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
           </Grid>
         </Grid>
         <Grid container spacing={0.5} item xs={12} mb={2}>
-          <Grid item sm={1.5}>
+          <Grid item sm={1.7}>
             <TextField
               size="small"
+              fullWidth
               required
               label="우편번호"
-              fullWidth
               value={zippost1}
-              onValueChange={(values) => setScCarnum(values.value)}
+              onValueChange={(values) => setZippost1(values.value)}
+              InputProps={{
+                display: 'none',
+                readOnly: true,
+                endAdornment: (
+                  <InputAdornment position="end">
+                    <IconSearch stroke={1.5} size="1rem" cursor="pointer" />
+                  </InputAdornment>
+                )
+              }}
             />
           </Grid>
           <Grid item sm={7}>
-            <TextField size="small" required label="주소" fullWidth value={scJuso} onValueChange={(values) => setScJuso(values.value)} />
+            <TextField
+              size="small"
+              required
+              label="주소"
+              fullWidth
+              value={scJuso}
+              onValueChange={(values) => setScJuso(values.value)}
+              InputProps={{ readOnly: true }}
+            />
           </Grid>
-          <Grid item sm={3.5}>
+          <Grid item sm={3.3}>
             <TextField size="small" required label="번지" fullWidth value={scBunji} onValueChange={(values) => setScBunji(values.value)} />
           </Grid>
         </Grid>
@@ -187,9 +230,9 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
             <FileInputForms
               isDisabled={false}
               fieldName="scPicad"
-              index={0}
+              index={1}
               labelName="단속사진1"
-              selectedFile={scPicad[0]?.name}
+              selectedFile={picads.scPicad1?.name}
               handleChangeFile={handleChangeFile}
               alert={alert}
               isOrgFileInfo
@@ -197,11 +240,11 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
           </Grid>
           <Grid item sm={3}>
             <FileInputForms
-              isDisabled={scPicad.length < 1}
+              isDisabled={typeof picads.scPicad1 === 'undefined'}
               fieldName="scPicad"
               labelName="단속사진2"
-              index={1}
-              selectedFile={scPicad[1]?.name}
+              index={2}
+              selectedFile={picads.scPicad2?.name}
               handleChangeFile={handleChangeFile}
               alert={alert}
               isOrgFileInfo
@@ -209,22 +252,70 @@ const SaveResidentDataForm = ({ isDisabled = true, handleModalSave }) => {
           </Grid>
           <Grid item sm={3}>
             <FileInputForms
-              isDisabled={scPicad.length < 2}
+              isDisabled={typeof picads.scPicad2 === 'undefined'}
               fieldName="scPicad"
               labelName="단속사진3"
-              index={1}
-              selectedFile={scPicad[2]?.name}
+              index={3}
+              selectedFile={picads.scPicad3?.name}
               handleChangeFile={handleChangeFile}
               alert={alert}
             />
           </Grid>
           <Grid item sm={3}>
             <FileInputForms
-              isDisabled={scPicad.length < 3}
+              isDisabled={typeof picads.scPicad3 === 'undefined'}
               fieldName="scPicad"
               labelName="단속사진4"
+              index={4}
+              selectedFile={picads.scPicad4?.name}
+              handleChangeFile={handleChangeFile}
+              alert={alert}
+            />
+          </Grid>
+        </Grid>
+        <Grid container spacing={1} item xs={12} mt={1}>
+          <Grid item sm={3}>
+            <FileInputForms
+              isDisabled={false}
+              fieldName="scFrecad"
               index={1}
-              selectedFile={scPicad[3]?.name}
+              labelName="진술서1"
+              selectedFile={frecads.scFrecad1?.name}
+              handleChangeFile={handleChangeFile}
+              alert={alert}
+              isOrgFileInfo
+            />
+          </Grid>
+          <Grid item sm={3}>
+            <FileInputForms
+              isDisabled={typeof frecads.scFrecad1 === 'undefined'}
+              fieldName="scFrecad"
+              labelName="진술서2"
+              index={2}
+              selectedFile={frecads.scFrecad2?.name}
+              handleChangeFile={handleChangeFile}
+              alert={alert}
+              isOrgFileInfo
+            />
+          </Grid>
+          <Grid item sm={3}>
+            <FileInputForms
+              isDisabled={typeof frecads.scFrecad2 === 'undefined'}
+              fieldName="scFrecad"
+              labelName="진술서3"
+              index={3}
+              selectedFile={frecads.scFrecad3?.name}
+              handleChangeFile={handleChangeFile}
+              alert={alert}
+            />
+          </Grid>
+          <Grid item sm={3}>
+            <FileInputForms
+              isDisabled={typeof frecads.scFrecad3 === 'undefined'}
+              fieldName="scFrecad"
+              labelName="진술서4"
+              index={4}
+              selectedFile={frecads.scFrecad4?.name}
               handleChangeFile={handleChangeFile}
               alert={alert}
             />

src/views/form/FileInputForm.jsx

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Button, Grid, TextField } from '@mui/material';
 import { FileUpload } from '@mui/icons-material';