현성필
93 lines
4.6 KiB
HTML
93 lines
4.6 KiB
HTML
<!doctype html>
|
|
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
|
|
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{/layout/default_layout}">
|
|
|
|
|
|
<body>
|
|
|
|
<section layout:fragment="contentFragment">
|
|
<div class="container-fluid">
|
|
<div class="card mt-2">
|
|
<div class="card-header">
|
|
<h3>비밀 번호 변경 </h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<form name="passwordChangeRequest" id="passwordChangeRequest" class="form-horizontal form-horizontal_l" method="post" th:action="@{/update_password.do}"
|
|
th:object="${passwordChangeRequest}">
|
|
<!-- 기존 비밀번호 -->
|
|
<div class="form-floating">
|
|
<input class="form-control mb-3" th:classappend="${#fields.hasErrors('oldPassword')}? 'is-invalid'" name="oldPassword" id="oldPassword" th:field="*{oldPassword}" type="password"
|
|
size="20" value="" maxlength="100" required>
|
|
<label for="oldPassword" class="must" th:text="#{comUssUmt.userManagePasswordUpdt.oldPass}"></label>
|
|
<th:block th:each="err : ${#fields.errors('oldPassword')}">
|
|
<div th:text="${err}" class="invalid-feedback"></div>
|
|
</th:block>
|
|
</div>
|
|
<div class="form-floating">
|
|
<input class="form-control mb-3" th:classappend="${#fields.hasErrors('newPassword')}? 'is-invalid'" name="newPassword" id="newPassword" th:field="*{newPassword}" type="password"
|
|
size="20" value="" maxlength="100" required>
|
|
<label for="newPassword" class="must" th:text="#{comUssUmt.userManagePasswordUpdt.pass}"></label>
|
|
<th:block th:each="err : ${#fields.errors('newPassword')}">
|
|
<div th:text="${err}" class="invalid-feedback"></div>
|
|
</th:block>
|
|
</div>
|
|
<!-- 비밀번호확인 -->
|
|
<div class="form-floating">
|
|
<input class="form-control mb-3" th:classappend="${#fields.hasErrors('newPassword2')}? 'is-invalid'" name="newPassword2" id="newPassword2" th:field="*{newPassword2}"
|
|
type="password" size="20" value="" maxlength="100" required>
|
|
<label for="newPassword2" class="must" th:text="#{comUssUmt.userManagePasswordUpdt.passConfirm}"></label>
|
|
<th:block th:each="err : ${#fields.errors('newPassword2')}">
|
|
<div th:text="${err}" class="invalid-feedback"></div>
|
|
</th:block>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="toast" role="alert" aria-live="assertive" aria-atomic="true" style="position: absolute; top: 0; right: 0;">
|
|
<div class="toast-header">
|
|
<strong class="mr-auto">알림</strong>
|
|
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
|
|
</div>
|
|
<div class="toast-body">
|
|
</div>
|
|
</div>
|
|
<div class="card-footer">
|
|
<button type="button" class="btn btn-primary btn_update"><i class="fa-sharp fa-solid fa-floppy-disk"></i> 저장</button>
|
|
<a th:href="@{/}" class="btn btn-primary" th:title="#{button.cancel}"><i class="fa-sharp fa-solid fa-cancel"></i> [[#{button.cancel}]]</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</body>
|
|
|
|
|
|
<th:block layout:fragment="contentScript">
|
|
<script>
|
|
$(function () {
|
|
document.getElementById("passwordChangeRequest").oldPassword.focus();
|
|
let btnUpdate = document.querySelector(".btn_update");
|
|
btnUpdate.addEventListener("click", function (event) {
|
|
let form = document.getElementById("passwordChangeRequest");
|
|
if (!form.checkValidity()) {
|
|
event.preventDefault()
|
|
event.stopPropagation()
|
|
} else {
|
|
form.submit();
|
|
}
|
|
form.classList.add('was-validated');
|
|
});
|
|
})
|
|
</script>
|
|
<script th:if="${resultMsg != null}">
|
|
$(function () {
|
|
var resultMsg = '[[#{${resultMsg}}]]';
|
|
if (resultMsg !== "") {
|
|
$('.toast-body').text(resultMsg);
|
|
$('.toast').toast('show');
|
|
}
|
|
})
|
|
</script>
|
|
|
|
</th:block>
|
|
|
|
</html>
|