feat: 관리자 - 환경설정 - 위원회 코드관리 수정 구현 건

egovframe-template-simple-react-contribution/src/components/alert/FormDialog.jsx

@@ -13,8 +13,12 @@ export default function FormDialog( {open, setOpen, title, contentText, children
     setOpen(true);
   };
 
-  const handleClose = () => {
+  const handleClose = (event, reason) => {
-    setOpen(false);
+      // background를 click해도 dialog가 사라지지 않도록 한다.
+      if(reason !== 'backdropClick' && reason !== 'escapeKeyDown') {
+          // Set 'open' to false, however you would do that with your particular code.
+          setOpen(false);
+      }    
   };
 
   return (

egovframe-template-simple-react-contribution/src/components/list/ListCreateUpdateDelete.jsx

@@ -15,7 +15,8 @@ import AddIcon from '@mui/icons-material/Add';
 
 import styledComponent from "styled-components";
 
-import * as EgovNet from 'api/egovFetch';
+
+import CODE from 'constants/code';
 
 
 const StyledDiv = styledComponent.div`
@@ -67,20 +68,41 @@ const Item = styled(Paper)(({ theme }) => ({
 
 function ListCreateUpdateDelete(props) {
 
-    const handleClickOpen = () => {
+    const handleClickCreate = (e) => {
+ 
+        const mode = CODE.MODE_CREATE;
+
+        let paramOrgId = props.itemIndex[props.depthSelectedArrayIndex-1];
         if( props.depthSelectedArrayIndex === 0 ) {
-            props.setCreateCondition({...props.createCondition, paramCodeLevel : props.paramCodeLevel, paramOrgId : "00"});        
+            paramOrgId = "00";
-        } else {
+        }
-            if( props.itemIndex[props.depthSelectedArrayIndex-1] === undefined ) {
+        if( props.depthSelectedArrayIndex !== 0 && props.itemIndex[props.depthSelectedArrayIndex-1] === undefined ) {
-                alert('상위 코드를 선택해주세요.');
+            alert('상위 코드를 선택해주세요.');
-                props.setIsPopupOpen(false);
+            props.setIsPopupOpen(false);
-                return false;
+            return false;
-            }
+        }
-            props.setCreateCondition({...props.createCondition, paramCodeLevel : props.paramCodeLevel, paramOrgId : props.itemIndex[props.depthSelectedArrayIndex-1]});        
+
-        }        
+        props.setCreateOrModifyCondition({mode, paramCodeLevel : props.paramCodeLevel, paramOrgId});
         props.setIsPopupOpen(true);
     };
 
+    const handleClickModify = (e) => {
+
+        const mode = CODE.MODE_MODIFY;
+
+        let paramOrgId = props.itemIndex[props.depthSelectedArrayIndex-1];
+        if( props.depthSelectedArrayIndex === 0 ) {
+            paramOrgId = "00";
+        }        
+
+        const dataKey = e.currentTarget.parentNode.parentNode.parentNode.getAttribute('data-key');
+        const target = props.items[dataKey];
+
+        props.setCreateOrModifyCondition({mode, paramCodeLevel : props.paramCodeLevel, paramOrgId, target });
+        props.setIsPopupOpen(true);
+
+    };
+
     const onClickItem = (e, index) => {
         index = Number(index);
         // 기존 active를 모두 해제 한다.
@@ -107,7 +129,7 @@ function ListCreateUpdateDelete(props) {
                     </Grid>
                     <Grid item xs={0} md={2} sx={{ pl: 0, '&': {backgroundColor: 'transparent' }}}>
                         <Item sx={{ p: 0, '&': { boxShadow: 'none', backgroundColor: '#169bd5', borderRadius: '0px'} }}>
-                            <IconButton aria-label="add" sx={{ px: 0, borderRadius: '0px', width: '100%', height: '56px'}} onClick={handleClickOpen}>                               
+                            <IconButton aria-label="add" sx={{ px: 0, borderRadius: '0px', width: '100%', height: '56px'}} onClick={handleClickCreate}>                               
                                 <AddIcon sx={{ px: 0, '&': {color: '#ffffff', width: '30px', height: '30px' }}} />
                             </IconButton>
                         </Item>
@@ -121,9 +143,7 @@ function ListCreateUpdateDelete(props) {
                         <ListItem
                         secondaryAction={
                             <div>                                                
-                                <IconButton sx={{ mx: 0 }} edge="start" aria-label="edit" onClick={(e)=> {
+                                <IconButton sx={{ mx: 0 }} edge="start" aria-label="edit" onClick={handleClickModify}>                                                
-                                    props.setIsPopupOpen(true);
-                                }}>                                                
                                     <EditIcon />
                                 </IconButton>
                                 <IconButton edge="end" aria-label="delete" onClick={(e)=> {

egovframe-template-simple-react-contribution/src/pages/admin/config/CommitteeCodeMgt.jsx

@@ -18,7 +18,7 @@ import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
 function CommitteeCodeMgt(props) {
 
     const [searchCondition, setSearchCondition] = useState({ paramCodeGroup: null, paramCodeLevel: 'LV_01' });
-    const [createCondition, setCreateCondition] = useState();
+    const [createOrModifyCondition, setCreateOrModifyCondition] = useState();
 
     const [depth01List, setDepth01List] = useState({});
     const [depth02List, setDepth02List] = useState({});
@@ -30,7 +30,6 @@ function CommitteeCodeMgt(props) {
 
     const [confirm, setConfirm] = React.useState();
 
-    const [editCreateMode, setEditCreateMode] = React.useState(); // 생성 or 수정 여부
     
 
     
@@ -90,15 +89,7 @@ function CommitteeCodeMgt(props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [searchCondition]);
     
-
+   
-
-    useEffect(function () {
-        if( typeof createCondition !== 'undefined' ) {
-            console.log('%o', createCondition);
-        }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [createCondition]);
-    
 
     const requestOptions = {
         method: "GET",
@@ -182,7 +173,7 @@ function CommitteeCodeMgt(props) {
                     if( Number(depthSelectedIndex[depthSelectedArrayIndex]) === Number(deleteItem.orgId) ) {                 
 
                         for( let i = depthSelectedArrayIndex + 1; i<4; i++ ) {
-                            //setSearchCondition({...searchCondition, paramCodeLevel : createCondition.paramCodeLevel});
+                            //setSearchCondition({...searchCondition, paramCodeLevel : createOrModifyCondition.paramCodeLevel});
                             depthSelectedIndex[i] = undefined;
                         }
                         let forChangeObject = [...depthSelectedIndex];
@@ -199,11 +190,6 @@ function CommitteeCodeMgt(props) {
                             case 2:
                                 setDepth04List({});
                         }
-                        
-                        
-                        
-
-
                     }
                     
 
@@ -243,16 +229,18 @@ function CommitteeCodeMgt(props) {
 
                     <div className="contents " id="contents">
                         {/* <!-- 본문 --> */}
+
                         <div className="top_tit">
                             <h1 className="tit_1">위원회 코드 관리</h1>
                         </div>
+
                         <Box
                             sx={{
                                 display: 'flex',
                                 flexWrap: 'wrap',
                                 justifyContent: 'space-between',
                                 '& > :not(style)': {
-                                mt: 4,
+                                mt: 0,
                                 width: 245,
                                 },
                             }}
@@ -264,8 +252,8 @@ function CommitteeCodeMgt(props) {
                                 itemIndex={depthSelectedIndex}
                                 setItemIndex={setDepthSelectedIndex}
                                 depthSelectedArrayIndex={0}
-                                createCondition={createCondition}
+                                createOrModifyCondition={createOrModifyCondition}
-                                setCreateCondition={setCreateCondition}
+                                setCreateOrModifyCondition={setCreateOrModifyCondition}
                                 paramCodeLevel="LV_01"
                                 upParamOrgId="00"
                                 nameKey="orgNm"
@@ -280,8 +268,8 @@ function CommitteeCodeMgt(props) {
                                 itemIndex={depthSelectedIndex}
                                 setItemIndex={setDepthSelectedIndex}
                                 depthSelectedArrayIndex={1}
-                                createCondition={createCondition}
+                                createOrModifyCondition={createOrModifyCondition}
-                                setCreateCondition={setCreateCondition}
+                                setCreateOrModifyCondition={setCreateOrModifyCondition}
                                 searchCondition={searchCondition}
                                 setSearchCondition={setSearchCondition}
                                 paramCodeLevel="LV_02"
@@ -297,8 +285,8 @@ function CommitteeCodeMgt(props) {
                                 itemIndex={depthSelectedIndex}
                                 setItemIndex={setDepthSelectedIndex}
                                 depthSelectedArrayIndex={2}
-                                createCondition={createCondition}
+                                createOrModifyCondition={createOrModifyCondition}
-                                setCreateCondition={setCreateCondition}
+                                setCreateOrModifyCondition={setCreateOrModifyCondition}
                                 searchCondition={searchCondition}
                                 setSearchCondition={setSearchCondition}
                                 paramCodeLevel="LV_03"
@@ -314,8 +302,8 @@ function CommitteeCodeMgt(props) {
                                 itemIndex={depthSelectedIndex}
                                 setItemIndex={setDepthSelectedIndex}
                                 depthSelectedArrayIndex={3}
-                                createCondition={createCondition}
+                                createOrModifyCondition={createOrModifyCondition}
-                                setCreateCondition={setCreateCondition}
+                                setCreateOrModifyCondition={setCreateOrModifyCondition}
                                 searchCondition={searchCondition}
                                 setSearchCondition={setSearchCondition}
                                 paramCodeLevel="LV_04"
@@ -345,8 +333,7 @@ function CommitteeCodeMgt(props) {
                         <CommitteeCodeRegistrationPopup
                             open={isCommitteeCodeRegistrationPopupOpen}
                             setOpen={setIsCommitteeCodeRegistrationPopupOpen}
-                            createCondition={createCondition}
+                            createOrModifyCondition={createOrModifyCondition}
-                            setCreateCondition={setCreateCondition}
                             searchCondition={searchCondition}
                             setSearchCondition={setSearchCondition}
                         />

egovframe-template-simple-react-contribution/src/pages/admin/config/CommitteeCodeMgt/CommitteeCodeRegistrationPopup.jsx

@@ -1,53 +1,125 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import TextField from '@mui/material/TextField';
 
 import * as EgovNet from 'api/egovFetch';
+
+import CODE from 'constants/code';
+
 import FormDialog from '../../../../components/alert/FormDialog';
 
 function CommitteeCodeRegistrationPopup(props) {
 
+    const [inputValues, setInputValues]       = useState({});
 
-    const handleClickCreateCommitteeCodeManagement = (createCondition) => {  
+    const [mode, setMode] = useState("등록");
+
+    useEffect(function () {
+
+        if( typeof props.createOrModifyCondition === "undefined" ) {
+            return;
+        }
+
+        if( typeof props.createOrModifyCondition.mode === "undefined" ) {
+            return;
+        }
         
-        if( createCondition.paramOrgId === undefined ) {
+        //모드가 변경 되면 값을 초기화 한다.
+        setInputValues({});
+
+        if( props.createOrModifyCondition.mode === CODE.MODE_MODIFY ) {
+            setMode("수정");
+        } else if( props.createOrModifyCondition.mode === CODE.MODE_CREATE ) {
+            setMode("등록");
+        }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.createOrModifyCondition && props.createOrModifyCondition.mode]);
+
+    useEffect(function () {
+
+        if( typeof props.createOrModifyCondition === "undefined" ) {
+            return;
+        }
+
+        if( typeof props.createOrModifyCondition.mode === "undefined" ) {
+            return;
+        }
+
+        if( props.createOrModifyCondition.mode === CODE.MODE_CREATE ) {            
+            return;
+        }
+
+        if( typeof props.createOrModifyCondition.target === "undefined" ) {
+            return;
+        }
+
+        
+
+        setInputValues({
+            ...inputValues,
+            paramOrgNm : props.createOrModifyCondition.target.orgNm,
+            paramOrgDesc : props.createOrModifyCondition.target.orgDesc,
+        });
+        
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.createOrModifyCondition && props.createOrModifyCondition.target]);
+
+    
+
+
+    const handleClickCreateCommitteeCodeManagement = (createOrModifyCondition) => {  
+        
+        if( createOrModifyCondition.paramOrgId === undefined ) {
             alert('상위 코드를 선택해주세요.');
             props.setOpen(false);
             return false;
         }
         const formData = new FormData();
         
-        for (let key in createCondition) {
+        for (let key in createOrModifyCondition) {
-            formData.append(key, createCondition[key]);
+            formData.append(key, createOrModifyCondition[key]);
         }
+        
+        Object.keys(inputValues).forEach(function(key){
+            formData.append(key, inputValues[key]);
+        });
+
 
         const requestOptions = {
-            method: "POST",
+            method: props.createOrModifyCondition.mode === CODE.MODE_CREATE ? "POST" : props.createOrModifyCondition.mode === CODE.MODE_MODIFY ? "PUT" : "",
             body: formData,
         };
 
-        EgovNet.requestFetch(`/admin/config/committee-code-management`,
+        let appendRequestURL = "";
+        if( props.createOrModifyCondition.mode === CODE.MODE_MODIFY ) {
+            appendRequestURL = `/${props.createOrModifyCondition.target.orgId}`;
+        }
+        const requestURL = "/admin/config/committee-code-management" +  appendRequestURL;
+        EgovNet.requestFetch(requestURL,
             requestOptions,
             function (resp) {
-                //방금 추가한 것만 새로 읽어 드린다.
+                //새로 읽어 드린다.
-                let paramCodeGroup = props.createCondition.paramOrgId;
+                let paramCodeGroup = props.createOrModifyCondition.paramOrgId;
                 if( paramCodeGroup === "00" ) {
                     paramCodeGroup = null;
                 }
-                props.setSearchCondition({...props.searchCondition, paramCodeGroup, paramCodeLevel : props.createCondition.paramCodeLevel});
+                props.setSearchCondition({...props.searchCondition, paramCodeGroup, paramCodeLevel : props.createOrModifyCondition.paramCodeLevel});
 
                 props.setOpen(false);
             }
         );
     }
 
-    const handleTextFieldChange = (event) => {
+    const handleTextFieldChange = (e) => {
-        const elName    = event.target.getAttribute('name');
+        setInputValues({
-        const elValue   = event.target.value;        
+            ...inputValues,
-        props.setCreateCondition({...props.createCondition,  [elName]:elValue});
+            [e.target.name]: e.target.value,
+        });
     };
 
-    return (
+    return (// handleClickCreateCommitteeCodeManagement create or modiofy 로 분기처리해야 한다. thkim 20240305 1500
-        <FormDialog open={props.open} setOpen={props.setOpen} title="위원회 코드 등록" contentText="위원회 코드 항목을 입력해주세요." handleOk={(e) => {handleClickCreateCommitteeCodeManagement(props.createCondition);}} >
+        <FormDialog open={props.open} setOpen={props.setOpen} title={`위원회 코드 ${mode}`} contentText="위원회 코드 항목을 입력해주세요." handleOk={(e) => {handleClickCreateCommitteeCodeManagement(props.createOrModifyCondition);}} >
             <TextField
                 autoFocus
                 required
@@ -58,6 +130,7 @@ function CommitteeCodeRegistrationPopup(props) {
                 type="text"
                 fullWidth
                 variant="standard"
+                value={inputValues.paramOrgNm ? inputValues.paramOrgNm : "" }
                 onChange={handleTextFieldChange}
             />
             <TextField
@@ -69,6 +142,7 @@ function CommitteeCodeRegistrationPopup(props) {
                 type="text"
                 fullWidth
                 variant="standard"
+                value={inputValues.paramOrgDesc ? inputValues.paramOrgDesc : ""}
                 onChange={handleTextFieldChange}
             />
         </FormDialog>

kcsc-back-end/src/main/java/com/dbnt/kcscbackend/admin/config/model/SetCommitteeCodeManagementVO.java

@@ -0,0 +1,34 @@
+package com.dbnt.kcscbackend.admin.config.model;
+
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.Getter;
+import lombok.RequiredArgsConstructor;
+import lombok.Setter;
+import lombok.ToString;
+
+import java.io.Serializable;
+
+@ApiModel(value = "CreateCommitteeCodeManagementVO", description =
+        "관리자 단에서 '환경설정' > '위원회코드 관리' 페이지에서 +(추가) 버튼으로 항목 추가하는 API에 사용된다." + ""
+)
+@RequiredArgsConstructor
+@Getter
+@Setter
+@ToString
+public class CreateCommitteeCodeManagementVO implements Serializable {
+    private static final long serialVersionUID = -603047540959527181L;
+
+    @ApiModelProperty(value = "현재 등록하고 있는 항목의 level이 들어간다. '중앙건설기술심의'인 경우, LV_01이다. '총괄위원회'인 경우, LV_02이다. 이런 식으로 값이 들어간다.")
+    private String	paramCodeLevel;
+
+    @ApiModelProperty(value = "현재 등록하고 있는 항목의 상위 코드 값이 들어간다. '중앙건설기술심의'인 경우, 값이 00이다. 하지만 tn_cmt_org table에 cmt_seq 값이 00인 레코드는 존재하지 않는다.")
+    private String	paramOrgId;
+
+    @ApiModelProperty(value = "명칭")
+    private String	paramOrgNm;
+
+    @ApiModelProperty(value = "위원회 설명")
+    private String	paramOrgDesc;
+
+}