Merge pull request #100 from Kim-Jaemin420/develop

문서 L1 수정
kosco-project · May 19, 2021 · e014007 · e014007
2 parents b9c0d66 + 6d26fa0
commit e014007
Show file tree

Hide file tree

Showing 4 changed files with 81 additions and 48 deletions.
diff --git a/src/components/doc/L1/L1Info.jsx b/src/components/doc/L1/L1Info.jsx
@@ -1,3 +1,4 @@
+import moment from 'moment';
 import React from 'react';
 import styled from 'styled-components';
 
@@ -48,13 +49,13 @@ const L1Info = () => {
       </p>
       <div className='info-box'>
         <p>
-          <span>Ship's Name :</span>
+          <span>Ship's Name :</span> { JSON.parse(localStorage.getItem('shipNm')) }
         </p>
         <p>
-          <span>Certificate No :</span>
+          <span>Certificate No :</span> { JSON.parse(localStorage.getItem('certNo')) }
         </p>
         <p>
-          <span>Inspection Date :</span>
+          <span>Inspection Date :</span> { moment().format('YYYY-MM-DD') }
         </p>
       </div>
       <p className='description'>

diff --git a/src/components/doc/L1/L1Top.jsx b/src/components/doc/L1/L1Top.jsx
@@ -57,7 +57,8 @@ const TableBox = styled.div`
 `;
 
 const L1Top = ({ onWorkingSystem, state, onchangeDatePicker }) => {
-  console.log(state.D2[2].Value1);
+  const { D2 } = state;
+
   return (
     <TableBox>
       <p className='title'>* FOAM LIQUID FOR PORTABLE FOAM APPLICATOR *</p>
@@ -89,81 +90,81 @@ const L1Top = ({ onWorkingSystem, state, onchangeDatePicker }) => {
         <div className='line'>
           <div className='first-value'>• Location</div>
           <div className='content-value'>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value1"/>
+            <input type='text' value={D2[0].Value1} onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value1"/>
           </div>
           <div className='content-value'>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value2"/>
+            <input type='text' value={D2[0].Value2} onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value2"/>
           </div>
           <div className='content-value'>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value3"/>
+            <input type='text' value={D2[0].Value3} onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value3"/>
           </div>
           <div className='content-value'>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value4"/>
+            <input type='text' value={D2[0].Value4} onChange={onWorkingSystem} data-form="D2" data-name="0" data-key="Value4"/>
           </div>
         </div>
 
         <div className='line'>
           <div className='first-value'>• Capacity / Quantity</div>
           <div className='content-value'>
             <p>20 Ltr X</p>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value1"/>
+            <input type='text' value={D2[1].Value1} onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value1"/>
           </div>
           <div className='content-value'>
             <p>20 Ltr X</p>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value2"/>
+            <input type='text' value={D2[1].Value2} onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value2"/>
           </div>
           <div className='content-value'>
             <p>20 Ltr X</p>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value3"/>
+            <input type='text' value={D2[1].Value3} onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value3"/>
           </div>
           <div className='content-value'>
             <p>20 Ltr X</p>
-            <input type='text' onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value4"/>
+            <input type='text' value={D2[1].Value4} onChange={onWorkingSystem} data-form="D2" data-name="1" data-key="Value4"/>
           </div>
         </div>
 
         <div className='line'>
           <div className='first-value'>• Expiry Date</div>
           <div className='content-value'>
             <DatePicker
-              selected={state.D2[2].Value1}
-              dateFormat="MMM.yyyy"
-              onChange={value => onchangeDatePicker({ target: { form:"D2", name: "2",key:"Value1", value } })}
+              selected={new Date(D2[2].Value1)}
+              dateFormat="yyyy-MM"
+              onChange={value => onchangeDatePicker({ target: { form:"D2", name: "2", key:"Value1", value } })}
               showMonthYearPicker
             />          
           </div>
           <div className='content-value'>
             <DatePicker
-              selected={state.D2[2].Value2}
+              selected={new Date(D2[2].Value2)}
               name="Value2"
               data-form="D2"
               data-name="2"
               data-key="Value1"
-              dateFormat="MMM.yyyy"
+              dateFormat="yyyy-MM"
               onChange={value => onchangeDatePicker({ target: { form:"D2", name: "2",key:"Value2", value } })}
               showMonthYearPicker
             />          
           </div>
           <div className='content-value'>
             <DatePicker
-              selected={state.D2[2].Value3}
+              selected={new Date(D2[2].Value3)}
               name="Value3"
               data-form="D2"
               data-name="2"
               data-key="Value1"
-              dateFormat="MMM.yyyy"
+              dateFormat="yyyy-MM"
               onChange={value => onchangeDatePicker({ target: { form:"D2", name: "2",key:"Value3", value } })}
               showMonthYearPicker
             />          
           </div>
           <div className='content-value'>
             <DatePicker
-              selected={state.D2[2].Value4}
+              selected={new Date(D2[2].Value4)}
               name="Value4"
               data-form="D2"
               data-name="2"
               data-key="Value1"
-              dateFormat="MMM.yyyy"
+              dateFormat="yyyy-MM"
               onChange={value => onchangeDatePicker({ target: { form:"D2", name: "2",key:"Value4", value } })}
               showMonthYearPicker
             />          

diff --git a/src/containers/doc/L1Container.js b/src/containers/doc/L1Container.js
@@ -1,45 +1,75 @@
+import { useEffect } from 'react';
+import moment from 'moment';
 import L1Form from '../../components/doc/L1/L1Form';
-import useStorage from "../../hooks/useStorage";
+import useStorage from '../../hooks/useStorage';
 import SaveModal from '../../components/common/SaveModal';
 import CompleteModal from '../../components/common/CompleteModal';
+import getItemData from '../../components/common/getItemData';
 
 const L1Container = () => {
-  const { onWorkingSystem, state, onStorage, onchangeDatePicker, visible, showModal, commVisible, showCommModal, hideModal } = useStorage({
+  const {
+    onWorkingSystem,
+    state,
+    setState,
+    onStorage,
+    onchangeDatePicker,
+    visible,
+    showModal,
+    commVisible,
+    showCommModal,
+    hideModal,
+  } = useStorage({
     H: {
-      RCVNO: "",
-      VESSELNM: "",
+      RCVNO: JSON.parse(localStorage.getItem('rcvNo')),
+      VESSELNM: JSON.parse(localStorage.getItem('shipNm')),
+      CERTNO: JSON.parse(localStorage.getItem('certNo')),
     },
     D2: {
       0: {
-        DESCT: "Location",
-        Value1: "",
-        Value2: "",
-        Value3: "",
-        Value4: "",
+        DESCT: 'Location',
+        Value1: '',
+        Value2: '',
+        Value3: '',
+        Value4: '',
       },
       1: {
-        DESCT: "Capacity / Quantity",
-        Value1: "",
-        Value2: "",
-        Value3: "",
-        Value4: "",
+        DESCT: 'Capacity / Quantity',
+        Value1: '',
+        Value2: '',
+        Value3: '',
+        Value4: '',
       },
       2: {
-        DESCT: "Expiry Date",
-        Value1: new Date(),
-        Value2: new Date(),
-        Value3: new Date(),
-        Value4: new Date(),
+        DESCT: 'Expiry Date',
+        Value1: moment().format('yyyy-MM'),
+        Value2: moment().format('yyyy-MM'),
+        Value3: moment().format('yyyy-MM'),
+        Value4: moment().format('yyyy-MM'),
       },
-    }
-  })
+    },
+  });
+
+  useEffect(() => {
+    getItemData(setState);
+  }, [setState]);
+
   return (
     <>
       {visible && (
-        <SaveModal form="L1" path="save" onStorage={onStorage} hideModal={hideModal}/>
+        <SaveModal
+          form='L1'
+          path='save'
+          onStorage={onStorage}
+          hideModal={hideModal}
+        />
       )}
       {commVisible && (
-        <CompleteModal form="L1" path="complete" onStorage={onStorage} hideModal={hideModal}/>
+        <CompleteModal
+          form='L1'
+          path='complete'
+          onStorage={onStorage}
+          hideModal={hideModal}
+        />
       )}
       <L1Form
         state={state}
@@ -49,7 +79,7 @@ const L1Container = () => {
         showCommModal={showCommModal}
       />
     </>
-  )
-}
+  );
+};
 
-export default L1Container;
+export default L1Container;
diff --git a/src/hooks/useStorage.js b/src/hooks/useStorage.js
@@ -1,4 +1,5 @@
 import axios from 'axios';
+import moment from 'moment';
 import { useState } from 'react';
 import { useHistory } from 'react-router-dom';
 
@@ -51,7 +52,7 @@ const useStorage = initialState => {
         ...state[form],
         [name]: {
           ...state[form][name],
-          [key]: value,
+          [key]: moment(value).format('yyyy-MM'),
         },
       },
     });