박정하 박정하 2023-12-22
231222 박정하 회원가입 수정
@fb0a047cc1154e0aeb102877f504ed0f7404a173
client/views/pages/join/Join.jsx
--- client/views/pages/join/Join.jsx
+++ client/views/pages/join/Join.jsx
@@ -8,28 +8,28 @@
 export default function Join() {
   const navigate = useNavigate();
   const location = useLocation();
-  const state = useSelector((state) => {return state});
+  const state = useSelector((state) => {
+    return state;
+  });
 
   let defaultAuthority = null;
   let defaultAgencyId = null;
   let defaultGovernmentId = null;
-  console.log('location.state : ', location.state);
-  console.log('state.loginUser : ', state.loginUser);
+  console.log("location.state : ", location.state);
+  console.log("state.loginUser : ", state.loginUser);
   if (CommonUtil.isEmpty(location.state) == false) {
-    defaultAuthority = location.state['authority'];
-    defaultAgencyId = location.state['agency_id'];
-    defaultGovernmentId = location.state['government_id'];
+    defaultAuthority = location.state["authority"];
+    defaultAgencyId = location.state["agency_id"];
+    defaultGovernmentId = location.state["government_id"];
   } else if (CommonUtil.isEmpty(state.loginUser) == false) {
-    defaultAuthority = state.loginUser['authority'];
-    defaultAgencyId = state.loginUser['agency_id'];
-    defaultGovernmentId = state.loginUser['government_id'];
+    defaultAuthority = state.loginUser["authority"];
+    defaultAgencyId = state.loginUser["agency_id"];
+    defaultGovernmentId = state.loginUser["government_id"];
   } else {
     defaultAuthority = null;
     defaultAgencyId = null;
     defaultGovernmentId = null;
   }
-
-
 
   /**** 기본 조회 데이터 (시작) ****/
   //권한 타입 종류
@@ -39,49 +39,69 @@
     fetch("/common/systemCode/authoritiesSelect.json", {
       method: "POST",
       headers: {
-        'Content-Type': 'application/json; charset=UTF-8'
+        "Content-Type": "application/json; charset=UTF-8",
       },
       body: JSON.stringify({}),
-    }).then((response) => response.json()).then((data) => {
-      console.log("권한 타입 종류 목록 조회 : ", data);
-      setAuthorities(data);
-    }).catch((error) => {
-      console.log('authoritiesSelect() /common/systemCode/authoritiesSelect.json error : ', error);
-    });
+    })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("권한 타입 종류 목록 조회 : ", data);
+        setAuthorities(data);
+      })
+      .catch((error) => {
+        console.log(
+          "authoritiesSelect() /common/systemCode/authoritiesSelect.json error : ",
+          error
+        );
+      });
   };
   //기관 계층 구조 목록
   const [orgListOfHierarchy, setOrgListOfHierarchy] = React.useState([]);
   //기관(관리, 시행) 계층 구조 목록 조회
   const orgSelectListOfHierarchy = () => {
     const param = {
-      'government_id': defaultGovernmentId,
-      'agency_id': defaultAgencyId
+      government_id: defaultGovernmentId,
+      agency_id: defaultAgencyId,
     };
-    if (CommonUtil.isEmpty(state.loginUser) == false && state.loginUser['authority'] == 'ROLE_ADMIN') {
-      param['government_id'] = null;
-      param['agency_id'] = null;
+    if (
+      CommonUtil.isEmpty(state.loginUser) == false &&
+      state.loginUser["authority"] == "ROLE_ADMIN"
+    ) {
+      param["government_id"] = null;
+      param["agency_id"] = null;
     }
     fetch("/org/orgSelectListOfHierarchy.json", {
       method: "POST",
       headers: {
-        'Content-Type': 'application/json; charset=UTF-8'
+        "Content-Type": "application/json; charset=UTF-8",
       },
       body: JSON.stringify(param),
-    }).then((response) => response.json()).then((data) => {
-      console.log("기관(관리, 시행) 계층 구조 목록 조회 : ", data);
-      setOrgListOfHierarchy(data);
-    }).catch((error) => {
-      console.log('orgSelectListOfHierarchy() /org/orgSelectListOfHierarchy.json error : ', error);
-    });
+    })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("기관(관리, 시행) 계층 구조 목록 조회 : ", data);
+        setOrgListOfHierarchy(data);
+      })
+      .catch((error) => {
+        console.log(
+          "orgSelectListOfHierarchy() /org/orgSelectListOfHierarchy.json error : ",
+          error
+        );
+      });
   };
   const getAgencyList = () => {
-    const government = orgListOfHierarchy.find(item => item['government_id'] == user['government_id']);
-    if (CommonUtil.isEmpty(government) || CommonUtil.isEmpty(government['agencyList'])) {
+    const government = orgListOfHierarchy.find(
+      (item) => item["government_id"] == user["government_id"]
+    );
+    if (
+      CommonUtil.isEmpty(government) ||
+      CommonUtil.isEmpty(government["agencyList"])
+    ) {
       return [];
     } else {
-      return government['agencyList'];
+      return government["agencyList"];
     }
-  }
+  };
   /**** 기본 조회 데이터 (종료) ****/
 
   //아이디 중복 확인
@@ -89,23 +109,29 @@
 
   //등록할 사용자 정보
   const [user, setUser] = React.useState({
-    'user_id': null,
-    'user_name': null,
-    'user_password': null,
-    'user_password_check': null,
-    'user_phonenumber': null,
-    'user_birth': null,
-    'user_gender': null,
-    'user_address': null,
-    'user_email': null,
-    'authority': CommonUtil.isEmpty(defaultAuthority) ? state.loginUser['authority'] : defaultAuthority,
-    'agency_id': CommonUtil.isEmpty(defaultAgencyId) ? state.loginUser['agency_id'] : defaultAgencyId,
-    'government_id': CommonUtil.isEmpty(defaultGovernmentId) ? state.loginUser['government_id'] : defaultGovernmentId,
+    user_id: null,
+    user_name: null,
+    user_password: null,
+    user_password_check: null,
+    user_phonenumber: null,
+    user_birth: null,
+    user_gender: null,
+    user_address: null,
+    user_email: null,
+    authority: CommonUtil.isEmpty(defaultAuthority)
+      ? state.loginUser["authority"]
+      : defaultAuthority,
+    agency_id: CommonUtil.isEmpty(defaultAgencyId)
+      ? state.loginUser["agency_id"]
+      : defaultAgencyId,
+    government_id: CommonUtil.isEmpty(defaultGovernmentId)
+      ? state.loginUser["government_id"]
+      : defaultGovernmentId,
   });
   //각 데이터별로 Dom 정보 담을 Ref 생성
   const userRefInit = JSON.parse(JSON.stringify(user));
-  userRefInit['user_gender'] = {};
-  userRefInit['user_id_check_button'] = null;
+  userRefInit["user_gender"] = {};
+  userRefInit["user_id_check_button"] = null;
   const userRef = React.useRef(userRefInit);
 
   //등록할 사용자 정보 변경
@@ -113,89 +139,106 @@
     let newUser = JSON.parse(JSON.stringify(user));
     newUser[targetKey] = value;
     setUser(newUser);
-  }
+    console.log("user: ", user);
+  };
   //등록할 사용자의 권한 구분 변경
   const userAuthorityChange = (value) => {
     let newUser = JSON.parse(JSON.stringify(user));
-    newUser['authority'] = value;
+    newUser["authority"] = value;
     // newUser['government_id'] = null;
     // newUser['agency_id'] = null;
     setUser(newUser);
-  }
+  };
   //등록할 사용자의 관리기관 변경
   const userGovernmentIdChange = (value) => {
     let newUser = JSON.parse(JSON.stringify(user));
     if (CommonUtil.isEmpty(value) == true) {
-      newUser['government_id'] = null;
+      newUser["government_id"] = null;
     } else {
-      newUser['government_id'] = value;
+      newUser["government_id"] = value;
     }
-    newUser['agency_id'] = null;
+    newUser["agency_id"] = null;
     setUser(newUser);
-  }
+  };
   //등록할 사용자의 시행기관 변경
   const userAgencyIdChange = (value) => {
     let newUser = JSON.parse(JSON.stringify(user));
     if (CommonUtil.isEmpty(value) == true) {
-      newUser['agency_id'] = null;
+      newUser["agency_id"] = null;
     } else {
-      newUser['agency_id'] = value;
+      newUser["agency_id"] = value;
     }
     setUser(newUser);
-  }
+  };
   //로그인 아이디 중복 검사
   const userIdCheck = () => {
-    if (CommonUtil.isEmpty(user['user_id']) == true) {
-      userRef.current['user_id'].focus();
+    if (CommonUtil.isEmpty(user["user_id"]) == true) {
+      userRef.current["user_id"].focus();
       alert("아이디를 입력해 주세요.");
       return;
     }
 
-    fetch("/user/userSelectOne.json", {
+    console.log("user!! : ", user);
+
+    fetch("/user/userSelectOneCount.json", {
       method: "POST",
       headers: {
-        'Content-Type': 'application/json; charset=UTF-8'
+        "Content-Type": "application/json; charset=UTF-8",
       },
       body: JSON.stringify(user),
-    }).then((response) => response.json()).then((data) => {
-      console.log("로그인 아이디 중복 검사(아이디를 통한 사용자 조회) : ", data);
-      if (CommonUtil.isEmpty(data) == true) {
-        setIsIdCheck(true);
-        userRef.current['user_password'].focus();
-        alert("사용가능한 아이디 입니다.");
-      } else {
-        setIsIdCheck(false);
-        userRef.current['user_id'].focus();
-        alert("이미 존재하는 아이디 입니다.");
-      }
-    }).catch((error) => {
-      console.log('userIdCheck() /user/userSelectOne.json error : ', error);
-    });
-  }
+    })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log(
+          "로그인 아이디 중복 검사(아이디를 통한 사용자 조회) : ",
+          data
+        );
+        if (data == 0) {
+          setIsIdCheck(true);
+          userRef.current["user_password"].focus();
+          alert("사용가능한 아이디 입니다.");
+        } else {
+          setIsIdCheck(false);
+          userRef.current["user_id"].focus();
+          alert("이미 존재하는 아이디 입니다.");
+        }
+      })
+      .catch((error) => {
+        console.log(
+          "userSelectOneCount() /user/userSelectOneCount.json error : ",
+          error
+        );
+      });
+  };
 
-
-   //사용자 등록 유효성 검사
-   const userInsertValidation = () => {
-    if ((user['authority'] == 'ROLE_GOVERNMENT' || user['authority'] == 'ROLE_AGENCY')
-        && CommonUtil.isEmpty(user['government_id']) == true) {
-      userRef.current['government_id'].focus();
+  //사용자 등록 유효성 검사
+  const userInsertValidation = () => {
+    if (
+      (user["authority"] == "ROLE_GOVERNMENT" ||
+        user["authority"] == "ROLE_AGENCY") &&
+      CommonUtil.isEmpty(user["government_id"]) == true
+    ) {
+      userRef.current["government_id"].focus();
       alert("관리기관을 선택해 주세요.");
       return false;
     }
 
-    if (user['authority'] == 'ROLE_AGENCY' && CommonUtil.isEmpty(user['agency_id']) == true) {
-      userRef.current['agency_id'].focus();
+    if (
+      user["authority"] == "ROLE_AGENCY" &&
+      CommonUtil.isEmpty(user["agency_id"]) == true
+    ) {
+      userRef.current["agency_id"].focus();
       alert("시행기관을 선택해 주세요.");
       return false;
     }
 
-    if (CommonUtil.isEmpty(user['user_name']) == true) {
-      userRef.current['user_name'].focus();
+    if (CommonUtil.isEmpty(user["user_name"]) == true) {
+      userRef.current["user_name"].focus();
       alert("이름을 입력해 주세요.");
       return false;
     }
-    if (CommonUtil.isEmpty(user['user_id']) == true) {
-      userRef.current['user_id'].focus();
+    if (CommonUtil.isEmpty(user["user_id"]) == true) {
+      userRef.current["user_id"].focus();
       alert("아이디를 입력해 주세요.");
       return false;
     }
@@ -203,18 +246,18 @@
       alert("아이디 중복확인을 해주세요.");
       return false;
     }
-    if (CommonUtil.isEmpty(user['user_password']) == true) {
-      userRef.current['user_password'].focus();
+    if (CommonUtil.isEmpty(user["user_password"]) == true) {
+      userRef.current["user_password"].focus();
       alert("비밀번호를 입력해 주세요.");
       return false;
     }
-    if (user['user_password'] != user['user_password_check']) {
-      userRef.current['user_password_check'].focus();
+    if (user["user_password"] != user["user_password_check"]) {
+      userRef.current["user_password_check"].focus();
       alert("비밀번호가 일치하지 않습니다.");
       return false;
     }
-    if (CommonUtil.isEmpty(user['user_phonenumber']) == true) {
-      userRef.current['user_phonenumber'].focus();
+    if (CommonUtil.isEmpty(user["user_phonenumber"]) == true) {
+      userRef.current["user_phonenumber"].focus();
       alert("연락처를 입력해 주세요.");
       return false;
     }
@@ -226,7 +269,7 @@
     } */
 
     return true;
-  }
+  };
 
   //사용자 등록
   const userInsert = () => {
@@ -237,21 +280,24 @@
     fetch("/user/userInsert.json", {
       method: "POST",
       headers: {
-        'Content-Type': 'application/json; charset=UTF-8'
+        "Content-Type": "application/json; charset=UTF-8",
       },
       body: JSON.stringify(user),
-    }).then((response) => response.json()).then((data) => {
-      console.log("사용자 등록 결과(건수) : ", data);
-      if (data > 0) {
-        alert("계정생성완료");
-        navigate(-1);
-      } else {
-        alert("계정생성에 실패하였습니다. 관리자에게 문의바랍니다.");
-      }
-    }).catch((error) => {
-      console.log('userInsert() /user/userInsert.json error : ', error);
-    });
-  }
+    })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("사용자 등록 결과(건수) : ", data);
+        if (data > 0) {
+          alert("계정생성완료");
+          navigate(-1);
+        } else {
+          alert("계정생성에 실패하였습니다. 관리자에게 문의바랍니다.");
+        }
+      })
+      .catch((error) => {
+        console.log("userInsert() /user/userInsert.json error : ", error);
+      });
+  };
 
   //생활보호사 등록
   const agentInsert = () => {
@@ -262,184 +308,297 @@
     fetch("/user/agentInsert.json", {
       method: "POST",
       headers: {
-        'Content-Type': 'application/json; charset=UTF-8'
+        "Content-Type": "application/json; charset=UTF-8",
       },
       body: JSON.stringify(user),
-    }).then((response) => response.json()).then((data) => {
-      console.log("생활보호사 등록 결과(건수) : ", data);
-      if (data > 0) {
-        alert("계정생성완료");
-        navigate(-1);
-      } else {
-        alert("계정생성에 실패하였습니다. 관리자에게 문의바랍니다.");
-      }
-    }).catch((error) => {
-      console.log('agentInsert() /user/agentInsert.json error : ', error);
-    });
-  }
-  
+    })
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("생활보호사 등록 결과(건수) : ", data);
+        if (data > 0) {
+          alert("계정생성완료");
+          navigate(-1);
+        } else {
+          alert("계정생성에 실패하였습니다. 관리자에게 문의바랍니다.");
+        }
+      })
+      .catch((error) => {
+        console.log("agentInsert() /user/agentInsert.json error : ", error);
+      });
+  };
+
   //Mounted
   React.useEffect(() => {
     authoritiesSelect();
     orgSelectListOfHierarchy();
   }, []);
-  
 
   return (
-      <div className="container row flex-center join-login">
-        <div className="join-group">
-          <h3>계정생성</h3>
-          <div className="join-inner">
+    <div className="container row flex-center join-login">
+      <div className="join-group">
+        <h3>계정생성</h3>
+        <div className="join-inner">
+          <div>
+            <div className="flex-start margin-bottom2">
+              <label className="flex25">
+                <span style={{ color: "red" }}>*</span>사용자구분
+              </label>
+              <select
+                name="division"
+                id="section"
+                disabled={
+                  CommonUtil.isEmpty(state.loginUser) == false &&
+                  state.loginUser["authority"] != "ROLE_ADMIN" &&
+                  state.loginUser["authority"] != "ROLE_GOVERNMENT" &&
+                  state.loginUser["authority"] != "ROLE_AGENCYADMIN"
+                }
+                onChange={(e) => {
+                  userAuthorityChange(e.target.value);
+                }}
+              >
+                {CommonUtil.isEmpty(state.loginUser) == false &&
+                state.loginUser["authority"] == "ROLE_ADMIN" ? (
+                  <option
+                    value="ROLE_ADMIN"
+                    selected={user["authority"] == "ROLE_ADMIN"}
+                  >
+                    시스템 관리자
+                  </option>
+                ) : null}
+                {CommonUtil.isEmpty(state.loginUser) == false &&
+                (state.loginUser["authority"] == "ROLE_ADMIN" ||
+                  state.loginUser["authority"] == "ROLE_GOVERNMENT") ? (
+                  <option
+                    value="ROLE_GOVERNMENT"
+                    selected={user["authority"] == "ROLE_GOVERNMENT"}
+                  >
+                    기관 관리자
+                  </option>
+                ) : null}
+                {CommonUtil.isEmpty(state.loginUser) == false &&
+                (state.loginUser["authority"] == "ROLE_ADMIN" ||
+                  state.loginUser["authority"] == "ROLE_GOVERNMENT" ||
+                  state.loginUser["authority"] == "ROLE_AGENCYADMIN") ? (
+                  <option
+                    value="ROLE_AGENCYADMIN"
+                    selected={user["authority"] == "ROLE_AGENCYADMIN"}
+                  >
+                    센터 관리자
+                  </option>
+                ) : null}
+                <option
+                  value="ROLE_AGENCY"
+                  selected={user["authority"] == "ROLE_AGENCY"}
+                >
+                  {state.loginUser["title_name"]}
+                </option>
+              </select>
+            </div>
+          </div>
+
+          {user["authority"] == "ROLE_GOVERNMENT" ||
+          user["authority"] == "ROLE_AGENCYADMIN" ||
+          user["authority"] == "ROLE_AGENCY" ? (
             <div>
               <div className="flex-start margin-bottom2">
-                <label className="flex25"><span style={{color : "red"}}>*</span>사용자구분</label>
-                <select name="division" id="section"
+                <label className="flex25" htmlFor="name">
+                  <span style={{ color: "red" }}>*</span>관리기관
+                </label>
+                <select
                   disabled={
-                    CommonUtil.isEmpty(state.loginUser) == false
-                    && state.loginUser['authority'] != 'ROLE_ADMIN'
-                    && state.loginUser['authority'] != 'ROLE_GOVERNMENT'
-                    && state.loginUser['authority'] != 'ROLE_AGENCYADMIN'
+                    CommonUtil.isEmpty(state.loginUser) == false &&
+                    state.loginUser["authority"] != "ROLE_ADMIN" &&
+                    state.loginUser["authority"] != "ROLE_GOVERNMENT"
                   }
-                  onChange={(e) => {userAuthorityChange(e.target.value)}}>
-                    {CommonUtil.isEmpty(state.loginUser) == false && state.loginUser['authority'] == 'ROLE_ADMIN' ?
-                      <option value="ROLE_ADMIN" selected={user['authority'] == "ROLE_ADMIN"}>시스템 관리자</option>
-                    : null}
-                    {CommonUtil.isEmpty(state.loginUser) == false && (state.loginUser['authority'] == 'ROLE_ADMIN' || state.loginUser['authority'] == 'ROLE_GOVERNMENT') ?
-                      <option value="ROLE_GOVERNMENT" selected={user['authority'] == "ROLE_GOVERNMENT"}>기관 관리자</option>
-                    : null}
-                    {CommonUtil.isEmpty(state.loginUser) == false && (state.loginUser['authority'] == 'ROLE_ADMIN' || state.loginUser['authority'] == 'ROLE_GOVERNMENT' || state.loginUser['authority'] == 'ROLE_AGENCYADMIN') ?
-                      <option value="ROLE_AGENCYADMIN" selected={user['authority'] == "ROLE_AGENCYADMIN"}>센터 관리자</option>
-                    : null}
-                    <option value="ROLE_AGENCY" selected={user['authority'] == "ROLE_AGENCY"}>{state.loginUser['title_name']}</option>
+                  onChange={(e) => {
+                    userGovernmentIdChange(e.target.value);
+                  }}
+                  ref={(el) => (userRef.current["government_id"] = el)}
+                >
+                  <option value={""} selected={user["government_id"] == null}>
+                    관리기관선택
+                  </option>
+                  {orgListOfHierarchy.map((item, idx) => {
+                    return (
+                      <option
+                        key={idx}
+                        value={item["government_id"]}
+                        selected={
+                          user["government_id"] == item["government_id"]
+                        }
+                      >
+                        {item["government_name"]}
+                      </option>
+                    );
+                  })}
                 </select>
               </div>
             </div>
+          ) : null}
 
-            {user['authority'] == 'ROLE_GOVERNMENT' || user['authority'] == 'ROLE_AGENCYADMIN' || user['authority'] == 'ROLE_AGENCY' ?
-              <div>
-                <div className="flex-start margin-bottom2">
-                  <label className="flex25" htmlFor="name"><span style={{color : "red"}}>*</span>관리기관</label>
-                  <select
-                    disabled={
-                      CommonUtil.isEmpty(state.loginUser) == false
-                      && state.loginUser['authority'] != 'ROLE_ADMIN'
-                      && state.loginUser['authority'] != 'ROLE_GOVERNMENT'
-                    }
-                    onChange={(e) => {userGovernmentIdChange(e.target.value)}}
-                    ref={el => userRef.current['government_id'] = el}>
-                    <option value={''} selected={user['government_id'] == null}>관리기관선택</option>
-                    {orgListOfHierarchy.map((item, idx) => { return (
-                      <option key={idx} value={item['government_id']} selected={user['government_id'] == item['government_id']}>
-                        {item['government_name']}
+          {user["authority"] == "ROLE_AGENCYADMIN" ||
+          user["authority"] == "ROLE_AGENCY" ? (
+            <div>
+              <div className="flex-start margin-bottom2">
+                <label className="flex25" htmlFor="name">
+                  <span style={{ color: "red" }}>*</span>시행기관
+                </label>
+                <select
+                  disabled={
+                    CommonUtil.isEmpty(state.loginUser["authority"]) == false &&
+                    state.loginUser["authority"] != "ROLE_ADMIN" &&
+                    state.loginUser["authority"] != "ROLE_GOVERNMENT"
+                  }
+                  onChange={(e) => {
+                    userAgencyIdChange(e.target.value);
+                  }}
+                  ref={(el) => (userRef.current["agency_id"] = el)}
+                >
+                  <option value={""} selected={user["agency_id"] == null}>
+                    시행기관선택
+                  </option>
+                  {getAgencyList().map((item, idx) => {
+                    return (
+                      <option
+                        key={idx}
+                        value={item["agency_id"]}
+                        selected={user["agency_id"] == item["agency_id"]}
+                      >
+                        {item["agency_name"]}
                       </option>
-                    )})}
-                  </select>
-                </div>
-              </div>
-            : null}
-
-            { user['authority'] == 'ROLE_AGENCYADMIN' || user['authority'] == 'ROLE_AGENCY' ?
-              <div>
-                <div className="flex-start margin-bottom2">
-                  <label className="flex25" htmlFor="name"><span style={{color : "red"}}>*</span>시행기관</label>
-                  <select
-                    disabled={
-                      CommonUtil.isEmpty(state.loginUser['authority']) == false
-                      && state.loginUser['authority'] != 'ROLE_ADMIN'
-                      && state.loginUser['authority'] != 'ROLE_GOVERNMENT'
-                    }
-                    onChange={(e) => {userAgencyIdChange(e.target.value)}}
-                    ref={el => userRef.current['agency_id'] = el}>
-                    <option value={''} selected={user['agency_id'] == null}>시행기관선택</option>
-                    {getAgencyList().map((item, idx) => { return (
-                      <option key={idx} value={item['agency_id']} selected={user['agency_id'] == item['agency_id']}>
-                        {item['agency_name']}
-                      </option>
-                    )})}
-                  </select>
-                </div>
-              </div>
-            : null}
-
-            <div>
-              <div className="flex-start margin-bottom2">
-                <label className="flex25" htmlFor="name"><span style={{color : "red"}}>*</span>이름</label>
-                <input type="text"
-                  value={user['user_name']}
-                  onChange={(e) => {userValueChange('user_name', e.target.value)}}
-                  ref={el => userRef.current['user_name'] = el}
-                />
+                    );
+                  })}
+                </select>
               </div>
             </div>
+          ) : null}
 
-            <div className="id">
-              <div className="flex-start margin-bottom2">
-                <label className="flex25" htmlFor="id"><span style={{color : "red"}}>*</span>아이디</label>
-                <input type="text"
-                  value={user['user_id']}
-                  onChange={(e) => {userValueChange('user_id', e.target.value); setIsIdCheck(false)}}
-                  ref={el => userRef.current['user_id'] = el}
-                />
-                <button className={"red-btn btn-large"} onClick={userIdCheck}
-                  ref={el => userRef.current['user_id_check_button'] = el}>
-                  중복확인
-                </button>
-              </div>
+          <div>
+            <div className="flex-start margin-bottom2">
+              <label className="flex25" htmlFor="name">
+                <span style={{ color: "red" }}>*</span>이름
+              </label>
+              <input
+                type="text"
+                value={user["user_name"]}
+                onChange={(e) => {
+                  userValueChange("user_name", e.target.value);
+                }}
+                ref={(el) => (userRef.current["user_name"] = el)}
+              />
             </div>
+          </div>
 
-            <div>
-              <div className="flex-start margin-bottom2">
-                <label className="flex25" htmlFor="password"><span style={{color : "red"}}>*</span>비밀번호</label>
-                <input type="password"
-                  value={user['user_password']}
-                  onChange={(e) => {userValueChange('user_password', e.target.value)}}
-                  ref={el => userRef.current['user_password'] = el}
-                />
-              </div>
+          <div className="id">
+            <div className="flex-start margin-bottom2">
+              <label className="flex25" htmlFor="id">
+                <span style={{ color: "red" }}>*</span>아이디
+              </label>
+              <input
+                type="text"
+                value={user["user_id"]}
+                onChange={(e) => {
+                  userValueChange("user_id", e.target.value);
+                  setIsIdCheck(false);
+                }}
+                ref={(el) => (userRef.current["user_id"] = el)}
+              />
+              <button
+                className={"red-btn btn-large"}
+                onClick={userIdCheck}
+                ref={(el) => (userRef.current["user_id_check_button"] = el)}
+              >
+                중복확인
+              </button>
             </div>
-            <div>
-              <div className="flex-start margin-bottom2">
-                <label className="flex25" htmlFor="password_check"><span style={{color : "red"}}>*</span>비밀번호 확인</label>
-                <input type="password"
-                  value={user['user_password_check']}
-                  onChange={(e) => {userValueChange('user_password_check', e.target.value)}}
-                  ref={el => userRef.current['user_password_check'] = el}
-                />
-              </div>
-            </div>
+          </div>
 
-            <div>
-              <div className="flex margin-bottom2">
-                <label className="flex25" htmlFor="phone_number"><span style={{color : "red"}}>*</span>전화번호</label>
-                <input type="number" maxLength="11"
-                  value={user['user_phonenumber']}
-                  onChange={(e) => {userValueChange('user_phonenumber', e.target.value)}}
-                  ref={el => userRef.current['user_phonenumber'] = el}
-                />
-              </div>
+          <div>
+            <div className="flex-start margin-bottom2">
+              <label className="flex25" htmlFor="password">
+                <span style={{ color: "red" }}>*</span>비밀번호
+              </label>
+              <input
+                type="password"
+                value={user["user_password"]}
+                onChange={(e) => {
+                  userValueChange("user_password", e.target.value);
+                }}
+                ref={(el) => (userRef.current["user_password"] = el)}
+              />
             </div>
-
-            <div>
-              <div className="flex-start margin-bottom2">
-                <label className="flex25" htmlFor="password_check">이메일</label>
-                <input type="text"
-                  value={user['user_email']}
-                  onChange={(e) => {userValueChange('user_email', e.target.value)}}
-                  ref={el => userRef.current['user_email'] = el}
-                />
-              </div>
+          </div>
+          <div>
+            <div className="flex-start margin-bottom2">
+              <label className="flex25" htmlFor="password_check">
+                <span style={{ color: "red" }}>*</span>비밀번호 확인
+              </label>
+              <input
+                type="password"
+                value={user["user_password_check"]}
+                onChange={(e) => {
+                  userValueChange("user_password_check", e.target.value);
+                }}
+                ref={(el) => (userRef.current["user_password_check"] = el)}
+              />
             </div>
+          </div>
 
-            <div className="btn-wrap">
-              <button className={"gray-btn btn-large"} onClick={() => {navigate(-1)}}>취소</button>
-              {user['authority'] == "ROLE_AGENCYADMIN" || user['authority'] == "ROLE_AGENCY"
-                ? <button className={"red-btn btn-large"} onClick={agentInsert}>등록</button>
-                : <button className={"red-btn btn-large"} onClick={userInsert}>등록</button>
-              }
+          <div>
+            <div className="flex margin-bottom2">
+              <label className="flex25" htmlFor="phone_number">
+                <span style={{ color: "red" }}>*</span>전화번호
+              </label>
+              <input
+                type="number"
+                maxLength="11"
+                value={user["user_phonenumber"]}
+                onChange={(e) => {
+                  userValueChange("user_phonenumber", e.target.value);
+                }}
+                ref={(el) => (userRef.current["user_phonenumber"] = el)}
+              />
             </div>
+          </div>
 
+          <div>
+            <div className="flex-start margin-bottom2">
+              <label className="flex25" htmlFor="password_check">
+                이메일
+              </label>
+              <input
+                type="text"
+                value={user["user_email"]}
+                onChange={(e) => {
+                  userValueChange("user_email", e.target.value);
+                }}
+                ref={(el) => (userRef.current["user_email"] = el)}
+              />
+            </div>
+          </div>
+
+          <div className="btn-wrap">
+            <button
+              className={"gray-btn btn-large"}
+              onClick={() => {
+                navigate(-1);
+              }}
+            >
+              취소
+            </button>
+            {user["authority"] == "ROLE_AGENCYADMIN" ||
+            user["authority"] == "ROLE_AGENCY" ? (
+              <button className={"red-btn btn-large"} onClick={agentInsert}>
+                등록
+              </button>
+            ) : (
+              <button className={"red-btn btn-large"} onClick={userInsert}>
+                등록
+              </button>
+            )}
           </div>
         </div>
       </div>
+    </div>
   );
 }
Add a comment
List