식별장치 수정 기능 추가

src/components/basis/dron/BasisIdntform.js

@@ -17,6 +17,7 @@ import { X } from 'react-feather';
 import Repeater from '@components/repeater';
 
 export const BasisIdntfForm = props => {
+  console.log(props.data);
   return (
     <Row>
       <Col>
@@ -81,7 +82,11 @@ export const BasisIdntfForm = props => {
                                     name={`idntfNum`}
                                     onChange={e => props.handlerInput(e, i)}
                                     value={props.data[i].idntfNum}
-                                    readOnly={props.data[i].isSave}
+                                    readOnly={
+                                      props.mode === 'create'
+                                        ? props.data[i].isSave
+                                        : true
+                                    }
                                     bsSize='sm'
                                   ></Input>
                                 </FormGroup>
@@ -145,7 +150,7 @@ export const BasisIdntfForm = props => {
                                   ></Input>
                                 </FormGroup>
                               </Col>
-                              <Col xs={2} md={2} className='count-del-btn'>
+                              <Col xs={1} md={1} className='count-del-btn'>
                                 <Button.Ripple
                                   color='danger'
                                   className='text-nowrap px-1'
@@ -166,6 +171,25 @@ export const BasisIdntfForm = props => {
                                   <span>삭제</span>
                                 </Button.Ripple>
                               </Col>
+                              <Col xs={1} md={1} className='count-del-btn'>
+                                {props.data[i].isSave && (
+                                  <Button.Ripple
+                                    color='primary'
+                                    className='text-nowrap px-1'
+                                    onClick={() => {
+                                      props.modifyData();
+                                    }}
+                                    outline
+                                    {...(props.data[i].disabled === undefined
+                                      ? { disabled: false }
+                                      : props.data[i].disabled
+                                      ? { disabled: true }
+                                      : { disabled: false })}
+                                  >
+                                    <span>수정</span>
+                                  </Button.Ripple>
+                                )}
+                              </Col>
                             </Row>
                           </Form>
                         )}

src/containers/basis/dron/BasisIdntfContainer.js

@@ -7,6 +7,8 @@ import { ErrorModal } from '../../../components/modal/ErrorModal';
 export const BasisIdntfContainer = props => {
   const dispatch = useDispatch();
 
+  // 추가하고 저장인지, 수정하고 저장인지 판단 useState
+  const [mode, setMode] = useState('create');
   // 식별장치 목록 (저장 이전 데이터 포함)
   const [idntDataList, setIdntfDataList] = useState([]);
 
@@ -14,7 +16,7 @@ export const BasisIdntfContainer = props => {
   const { listIdntf, detail, isRefreshIdntf } = useSelector(
     state => state.dronState
   );
-  console.log(listIdntf);
+
   // 유저 정보
   const { user } = useSelector(state => state.authState);
 
@@ -157,6 +159,7 @@ export const BasisIdntfContainer = props => {
       saveArr;
       dispatch(
         Actions.IDNTF_CREATE.request({
+          mode,
           arcrftSno: detail?.arcrftSno,
           data: saveArr.map(i => ({
             ...i,
@@ -174,8 +177,22 @@ export const BasisIdntfContainer = props => {
     }
   };
 
+  const modifyData = () => {
+    setMode('update');
+    setIdntfDataList([
+      {
+        ...idntfData,
+        id: Math.random(),
+        idntfNum: idntDataList[0].idntfNum,
+        ownerNm: idntDataList[0].ownerNm,
+        hpno: idntDataList[0].hpno
+      }
+    ]);
+  };
+
   // 식별장치 추가 버튼 클릭 시
   const addData = () => {
+    setMode('create');
     setIdntfDataList([...idntDataList, { ...idntfData, id: Math.random() }]);
   };
 
@@ -219,9 +236,11 @@ export const BasisIdntfContainer = props => {
           count={idntDataList?.length}
           handlerInput={handlerInput}
           addData={addData}
+          modifyData={modifyData}
           deletaData={deletaData}
           handlerSave={handlerCreate}
           isMyGroup={props.isMyGroup}
+          mode={mode}
         />
         <ErrorModal modal={modal} setModal={setModal} />
       </Col>

src/modules/basis/dron/actions/basisDronAction.ts

@@ -57,7 +57,7 @@ const SELECT_GROUP = 'basis/dron/SELECT_GROUP';
 
 export const LIST = createAsyncAction(LIST_REQUEST, LIST_SUCCESS, LIST_FAILURE)<
   DronState,
-  { data: DronData[]; count: number,total: number },
+  { data: DronData[]; count: number; total: number },
   AxiosError
 >();
 
@@ -79,7 +79,7 @@ export const IDNTF_CREATE = createAsyncAction(
   IDNTF_CREATE_REQUEST,
   IDNTF_CREATE_SUCCESS,
   IDNTF_CREATE_FAILURE
-)<IdntfData[], string, AxiosError>();
+)<{ mode: string; data: IdntfData[]; arcrftSno: number }, string, AxiosError>();
 
 export const CREATE = createAsyncAction(
   CREATE_REQUEST,

src/modules/basis/dron/apis/basisDronApi.ts

@@ -15,6 +15,13 @@ export const dronAPI = {
   idntfList: async (id: number) => {
     return await axios.get(`api/bas/dron/idntf/list/${id}`);
   },
+  idntfUpdate: async (item: { id: number; data: any[] }) => {
+    return await axios.put(`/api/bas/dron/idntf/update/${item.id}`, {
+      idntfNum: item.data[0].idntfNum,
+      ownerNm: item.data[0].ownerNm,
+      hpno: item.data[0].hpno
+    });
+  },
 
   detail: async (id: number) => {
     return await axios.get(`api/bas/dron/detail/${id}`);
@@ -28,8 +35,8 @@ export const dronAPI = {
 
     return res;
   },
-  idntfCreate: async (data: IdntfData[]) => {
-    const res = await axios.post('api/bas/dron/idntf/create', data);
+  idntfCreate: async (item: { data: any[]; arcrftSno: number }) => {
+    const res = await axios.post('api/bas/dron/idntf/create', item);
 
     return res;
   },

src/modules/basis/dron/sagas/basisDronSaga.ts

@@ -148,8 +148,19 @@ function* createIdntfSaga(
 ) {
   try {
     const detail = action.payload;
+    let res;
+    if (detail.mode === 'update') {
+      res = yield call(Apis.dronAPI.idntfUpdate, {
+        data: detail.data,
+        id: detail.arcrftSno
+      });
+    } else {
+      res = yield call(Apis.dronAPI.idntfCreate, {
+        data: detail.data,
+        arcrftSno: detail.arcrftSno
+      });
+    }
 
-    const res = yield call(Apis.dronAPI.idntfCreate, detail);
     const { data } = res;
 
     if (data.result) {