
File name
Commit message
Commit date
2023-04-18
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import React from "react";
import Button from "../../component/Button.jsx";
import { useNavigate, useLocation } from "react-router";
import { useSelector } from "react-redux";
import CommonUtil from "../../../resources/js/CommonUtil.js";
export default function PasswordChange() {
const navigate = useNavigate();
const location = useLocation();
const state = useSelector((state) => { return state });
//아이디 중복 확인
const [isIdCheck, setIsIdCheck] = React.useState(false);
//등록할 사용자 정보
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,
});
//각 데이터별로 Dom 정보 담을 Ref 생성
const userRefInit = JSON.parse(JSON.stringify(user));
userRefInit['user_gender'] = {};
userRefInit['user_id_check_button'] = null;
const userRef = React.useRef(userRefInit);
//등록할 사용자 정보 변경
const userValueChange = (targetKey, value) => {
let newUser = JSON.parse(JSON.stringify(user));
newUser[targetKey] = value;
setUser(newUser);
}
//사용자 등록 유효성 검사
const userInsertValidation = () => {
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();
alert("비밀번호가 일치하지 않습니다.");
return false;
}
return true;
}
//사용자 등록
const userUpdate = () => {
if (userInsertValidation() == false) {
return;
}
fetch("/user/userUpdate.json", {
method: "POST",
headers: {
'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('userUpdate() /user/userInsert.json error : ', error);
});
}
//로그아웃
const logout = () => {
fetch("/user/logout.json", {
method: "POST",
headers: {
'Content-Type': 'application/json; charset=UTF-8'
},
/* body: JSON.stringify({}), */
}).then((response) => response.json()).then((data) => {
console.log("로그아웃 결과 : ", data);
if (data == true) {
navigate('/');
} else {
alert('로그아웃 실패, 관리자에게 문의바랍니다.');
}
}).catch((error) => {
console.log('logout() /user/logout.json error : ', error);
});
};
//Mounted
React.useEffect(() => {
//authoritiesSelect();
//orgSelectListOfHierarchy();
}, []);
return (
<div className="row login-wrap">
<h1>시니어 스마트 케어 모니터링 플랫폼</h1>
<div className="container row flex-center join-login">
<div className="join-group">
<h3>최초 로그인</h3>
<div className="join-inner">
<div>
<div className="margin-bottom2">
<p className="margin-bottom">
시니어 스마트 케어 모니터링 플랫폼에 최초로 로그인 하셨습니다.
</p>
<p>
최초 로그인 시, 임시 비밀번호 변경 후 이용하실 수 있습니다.
</p>
</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>
<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={logout}>취소</button>
<button className={"red-btn btn-large"} onClick={userUpdate}>수정</button>
</div>
</div>
</div>
</div>
</div >
);
}