djb-eapim/eapim-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

내 정보 관리 - 스타일 적용

Browse Source
This commit is contained in:
현성필
2025-12-01 16:48:20 +09:00
parent f3f313a105
commit b4f9555cb8
21 changed files with 1152 additions and 1304 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/templates/views/apps/mypage/components/commonUserInfo.html
+41 -41
View File
@@ -2,63 +2,63 @@
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<body>
<th:block th:fragment="commonUserInfo">
<div class="org-form-group">
<label class="org-form-label">
<span>이메일 아이디</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:value="${loginId}" name="loginId" class="org-form-input input-readonly"
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">이메일 아이디</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:value="${loginId}" name="loginId" class="form-input input-readonly"
placeholder="이메일" disabled="disabled">
<input type="hidden" th:value="${loginId}" name="loginId">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span class="required">성명</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:value="${userName}" id="userName" name="userName" class="org-form-input"
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text required">성명</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:value="${userName}" id="userName" name="userName" class="form-input"
placeholder="성명">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span class="required">휴대폰 번호</span>
</label>
<div class="org-form-input-wrapper" th:with="parts=${#strings.arraySplit(mobileNumber, '-')}">
<div class="org-compound-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text required">휴대폰 번호</span>
</div>
<div class="form-field-wrapper input-with-button" th:with="parts=${#strings.arraySplit(mobileNumber, '-')}">
<div class="compound-input">
<input type="text"
th:value="${parts != null and parts.length > 0 ? parts[0] : ''}"
name="mobilePrefix"
class="org-form-input input-readonly"
class="form-input input-readonly"
maxlength="3"
disabled="disabled">
<span class="separator">-</span>
<input type="text"
th:value="${parts != null and parts.length > 1 ? parts[1] : ''}"
name="mobileMiddle"
class="org-form-input input-readonly"
class="form-input input-readonly"
maxlength="4"
disabled="disabled">
<span class="separator">-</span>
<input type="text"
th:value="${parts != null and parts.length > 2 ? parts[2] : ''}"
name="mobileLast"
class="org-form-input input-readonly"
class="form-input input-readonly"
maxlength="4"
disabled="disabled">
</div>
<button type="button" class="btn btn-secondary change_mobile_phone" id="changePhoneBtn">변경</button>
<button type="button" class="btn-input-action btn-change change_mobile_phone" id="changePhoneBtn">변경</button>
</div>
</div>
<div class="org-form-group" id="newPhoneNumberContainer" style="display: none;">
<label class="org-form-label">
<span class="required">새 휴대폰 번호</span>
</label>
<div class="org-form-input-wrapper">
<div class="org-compound-input">
<select class="org-form-select phone-number" id="phoneMobile" name="newMobilePrefix">
<div class="form-row" id="newPhoneNumberContainer" style="display: none;">
<div class="form-label-wrapper label-offset">
<span class="form-label-text required">새 휴대폰 번호</span>
</div>
<div class="form-field-wrapper input-with-button">
<div class="compound-input">
<select class="form-select phone-number" id="phoneMobile" name="newMobilePrefix">
<option value="">선택</option>
<option value="010">010</option>
<option value="011">011</option>
@@ -68,30 +68,30 @@
<option value="019">019</option>
</select>
<span class="separator">-</span>
<input type="text" id="newMobileMiddle" name="newMobileMiddle" class="org-form-input phone-number"
<input type="text" id="newMobileMiddle" name="newMobileMiddle" class="form-input phone-number"
maxlength="4" pattern="\d*" inputmode="numeric" placeholder="앞자리"/>
<span class="separator">-</span>
<input type="text" id="newMobileLast" name="newMobileLast" class="org-form-input phone-number"
<input type="text" id="newMobileLast" name="newMobileLast" class="form-input phone-number"
maxlength="4" pattern="\d*" inputmode="numeric" placeholder="뒷자리"/>
<input type="hidden" value="" name="mobileNumber" id="mobileNumber">
</div>
<button type="button" class="btn btn-primary btn_auth">
<button type="button" class="btn-input-action btn-auth btn_auth">
인증번호 받기
</button>
</div>
</div>
<div class="org-form-group" id="authNumberContainer" style="display: none;">
<label class="org-form-label">
<span class="required">인증번호 입력</span>
</label>
<div class="org-form-input-wrapper">
<div class="org-auth-input-group">
<div class="form-row" id="authNumberContainer" style="display: none;">
<div class="form-label-wrapper label-offset">
<span class="form-label-text required">인증번호 입력</span>
</div>
<div class="form-field-wrapper input-with-button">
<div class="auth-input-group">
<input type="text" id="authNumber" name="authNumber" maxlength="6" pattern="[0-9]*"
inputmode="numeric" class="org-form-input"
inputmode="numeric" class="form-input"
placeholder="SMS 인증번호 6자리">
<span class="org-timer" id="certify_time">03:00</span>
<span class="auth-timer" id="certify_time">03:00</span>
</div>
<button type="button" class="btn btn-primary btn_verify_auth">
<button type="button" class="btn-input-action btn-auth btn_verify_auth">
인증번호 확인
</button>
</div>
src/main/resources/templates/views/apps/mypage/updateCorporateManager.html
+100 -100
View File
@@ -4,121 +4,123 @@
<body>
<section layout:fragment="title">
<div class="page-title-banner">
<img th:src="@{/img/user_register_title.png}" class="title-image">
<img th:src="@{/img/img_title_bg.png}" class="title-image">
<h1>내 정보 관리</h1>
</div>
</section>
<section layout:fragment="contentFragment">
<div class="org-register-container">
<form id="updateForm" method="post" th:action="@{/mypage/update}" th:object="${user}">
<div class="common-title-bar">
<h2 class="common-title">법인 기본 정보</h2>
</div>
<div class="register-form-container">
<form id="updateForm" method="post" th:action="@{/mypage/update}" th:object="${user}">
<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/>
<!-- 법인 기본 정보 -->
<div class="org-section-header org-section-header--agreement">
<h3>법인 기본 정보</h3>
</div>
<div class="org-form-container">
<div class="org-form-group">
<label class="org-form-label">
<span>제휴기관 ID</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" name="organizationId" class="org-form-input input-readonly"
<div class="register-form">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">제휴기관 ID</span>
</div>
<div class="form-field-wrapper">
<input type="text" name="organizationId" class="form-input input-readonly info-value-box"
th:value="${user.portalOrg.orgCode}"
placeholder="XXXXXX-01"
disabled="disabled">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>사업자등록정보</span>
</label>
<div class="org-form-input-wrapper">
<div class="org-compound-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">사업자등록정보</span>
</div>
<div class="form-field-wrapper">
<div class="compound-input">
<input type="text" th:field="*{portalOrg.compRegNo}" id="compRegNo"
class="org-form-input"
class="form-input"
style="display:none;">
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#strings.substring(user.portalOrg.compRegNo,0,3)}"
name="compRegNo1" class="org-form-input" maxlength="3">
name="compRegNo1" class="form-input" maxlength="3">
<span class="separator">-</span>
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#strings.substring(user.portalOrg.compRegNo,3,5)}"
name="compRegNo2" class="org-form-input" maxlength="2">
name="compRegNo2" class="form-input" maxlength="2">
<span class="separator">-</span>
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#strings.substring(user.portalOrg.compRegNo,5,10)}"
name="compRegNo3" class="org-form-input" maxlength="5">
name="compRegNo3" class="form-input" maxlength="5">
</div>
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>법인등록번호</span>
</label>
<div class="org-form-input-wrapper">
<div class="org-compound-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">법인등록번호</span>
</div>
<div class="form-field-wrapper">
<div class="compound-input">
<input type="text" th:field="*{portalOrg.corpRegNo}" id="corpRegNo"
class="org-form-input"
class="form-input"
style="display:none;">
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#strings.substring(user.portalOrg.corpRegNo,0,6)}"
name="corpRegNo1" class="org-form-input" maxlength="6">
name="corpRegNo1" class="form-input" maxlength="6">
<span class="separator">-</span>
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#strings.substring(user.portalOrg.corpRegNo,6,13)}"
name="corpRegNo2" class="org-form-input" maxlength="7">
name="corpRegNo2" class="form-input" maxlength="7">
</div>
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>법인명</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:field="*{portalOrg.orgName}" class="org-form-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">법인명</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:field="*{portalOrg.orgName}" class="form-input">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>대표자 성명</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:field="*{portalOrg.ceoName}" class="org-form-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">대표자 성명</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:field="*{portalOrg.ceoName}" class="form-input">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>사업장 소재지</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:field="*{portalOrg.orgAddr}" class="org-form-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">사업장 소재지</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:field="*{portalOrg.orgAddr}" class="form-input">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>업태</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:field="*{portalOrg.orgSectors}" class="org-form-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">업태</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:field="*{portalOrg.orgSectors}" class="form-input">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>업종</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:field="*{portalOrg.orgIndustryType}" class="org-form-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">업종</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:field="*{portalOrg.orgIndustryType}" class="form-input">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>회사 전화번호</span>
</label>
<div class="org-form-input-wrapper" th:with="orgPhoneParts=${user.portalOrg.orgPhoneNumber != null ? user.portalOrg.orgPhoneNumber.split('-') : {}}">
<div class="org-compound-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">회사 전화번호</span>
</div>
<div class="form-field-wrapper" th:with="orgPhoneParts=${user.portalOrg.orgPhoneNumber != null ? user.portalOrg.orgPhoneNumber.split('-') : {}}">
<div class="compound-input">
<input type="text" th:field="*{portalOrg.orgPhoneNumber}" id="orgPhoneNumber"
class="org-form-input" style="display:none;">
<select class="org-form-select phone-number" id="orgPhonePrefix">
class="form-input" style="display:none;">
<select class="form-select phone-number" id="orgPhonePrefix">
<option value="">선택</option>
<option value="02" th:selected="${#lists.size(orgPhoneParts) > 0 && orgPhoneParts[0] == '02'}">02</option>
<option value="031" th:selected="${#lists.size(orgPhoneParts) > 0 && orgPhoneParts[0] == '031'}">031</option>
@@ -143,32 +145,32 @@
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#lists.size(orgPhoneParts) > 1 ? orgPhoneParts[1] : ''}"
name="orgPhone1"
class="org-form-input phone-number" maxlength="4">
class="form-input phone-number" maxlength="4">
<span class="separator">-</span>
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#lists.size(orgPhoneParts) > 2 ? orgPhoneParts[2] : ''}"
name="orgPhone2"
class="org-form-input phone-number" maxlength="4">
class="form-input phone-number" maxlength="4">
</div>
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>서비스명</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:field="*{portalOrg.serviceName}" class="org-form-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">서비스명</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:field="*{portalOrg.serviceName}" class="form-input">
</div>
</div>
<div class="org-form-group">
<label class="org-form-label">
<span>고객센터 전화번호</span>
</label>
<div class="org-form-input-wrapper" th:with="scPhoneParts=${user.portalOrg.scPhoneNumber != null ? user.portalOrg.scPhoneNumber.split('-') : {}}">
<div class="org-compound-input">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">고객센터 전화번호</span>
</div>
<div class="form-field-wrapper" th:with="scPhoneParts=${user.portalOrg.scPhoneNumber != null ? user.portalOrg.scPhoneNumber.split('-') : {}}">
<div class="compound-input">
<input type="text" th:field="*{portalOrg.scPhoneNumber}" id="scPhoneNumber"
class="org-form-input" style="display:none;">
<select class="org-form-select phone-number" id="scPhonePrefix">
class="form-input" style="display:none;">
<select class="form-select phone-number" id="scPhonePrefix">
<option value="">선택</option>
<option value="02" th:selected="${#lists.size(scPhoneParts) > 0 && scPhoneParts[0] == '02'}">02</option>
<option value="031" th:selected="${#lists.size(scPhoneParts) > 0 && scPhoneParts[0] == '031'}">031</option>
@@ -193,35 +195,33 @@
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#lists.size(scPhoneParts) > 1 ? scPhoneParts[1] : ''}"
name="scPhone1"
class="org-form-input phone-number" maxlength="4">
class="form-input phone-number" maxlength="4">
<span class="separator">-</span>
<input type="text" pattern="\d*" inputmode="numeric"
th:value="${#lists.size(scPhoneParts) > 2 ? scPhoneParts[2] : ''}"
name="scPhone2"
class="org-form-input phone-number" maxlength="4">
class="form-input phone-number" maxlength="4">
</div>
</div>
</div>
</div>
<!-- 법인 관리자 정보 -->
<div class="org-section-header org-section-header--agreement" style="margin-top: 48px;">
<h3>법인 관리자 정보</h3>
<span class="required-badge">필수 입력</span>
<div class="register-title-bar" style="padding-left: 0px;">
<h2 class="register-title">법인 관리자 정보</h2>
</div>
<div class="org-form-container">
<div class="register-form">
<th:block th:replace="~{apps/mypage/components/commonUserInfo :: commonUserInfo}"></th:block>
</div>
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-primary">수정 적용</button>
</div>
<!-- Action Buttons -->
</form>
</div>
<div class="form-actions">
<button type="button" class="btn btn-submit btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-submit btn-primary">수정 적용</button>
</div>
<!-- Withdrawal Button -->
<div class="withdrawal" style="margin-top: 32px; text-align: center;">
<a style="color: #64748B; text-decoration: underline; cursor: pointer;">회원탈퇴</a>
<div class="withdrawal-section">
<a class="withdrawal-link">회원탈퇴</a>
</div>
</div>
</section>
src/main/resources/templates/views/apps/mypage/updateCorporateUser.html
+30 -28
View File
@@ -4,40 +4,42 @@
<body>
<section layout:fragment="title">
<div class="page-title-banner">
<img th:src="@{/img/user_register_title.png}" class="title-image">
<img th:src="@{/img/img_title_bg.png}" class="title-image">
<h1>내 정보 관리</h1>
</div>
</section>
<section layout:fragment="contentFragment" class="content">
<section layout:fragment="contentFragment">
<div class="org-register-container">
<form id="updateForm" method="post" th:action="@{/mypage/update}">
<div class="org-section-header">
<h3>기본 정보</h3>
<span class="required-badge">필수 입력</span>
</div>
<div class="org-form-container">
<div class="org-form-group">
<label class="org-form-label">
<span>소속기관</span>
</label>
<div class="org-form-input-wrapper">
<input type="text" th:value="${user.portalOrg.orgName}" name="organization"
class="org-form-input input-readonly" placeholder="소속기관" disabled="disabled">
</div>
</div>
<th:block th:replace="~{apps/mypage/components/commonUserInfo :: commonUserInfo}"></th:block>
</div>
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-primary submit-btn">수정 적용</button>
</div>
</form>
<div class="common-title-bar">
<h2 class="common-title">기본 정보</h2>
</div>
<div class="register-form-container">
<form id="updateForm" method="post" th:action="@{/mypage/update}">
<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/>
<div class="register-form">
<div class="form-row">
<div class="form-label-wrapper label-offset">
<span class="form-label-text">소속기관</span>
</div>
<div class="form-field-wrapper">
<input type="text" th:value="${user.portalOrg.orgName}" name="organization"
class="form-input input-readonly info-value-box" placeholder="소속기관" disabled="disabled">
</div>
</div>
<th:block th:replace="~{apps/mypage/components/commonUserInfo :: commonUserInfo}"></th:block>
</div>
</form>
</div>
<!-- Action Buttons -->
<div class="form-actions">
<button type="button" class="btn btn-submit btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-submit btn-primary submit-btn">수정 적용</button>
</div>
<!-- Withdrawal Button -->
<div class="withdrawal" style="margin-top: 32px; text-align: center;">
<a style="color: #64748B; text-decoration: underline; cursor: pointer;">회원탈퇴</a>
<div class="withdrawal-section">
<a class="withdrawal-link">회원탈퇴</a>
</div>
</div>
</section>
@@ -145,7 +147,7 @@
}
// 회원탈퇴 버튼 이벤트
const withdrawalBtn = document.querySelector('.withdrawal a');
const withdrawalBtn = document.querySelector('.withdrawal-link');
if (withdrawalBtn) {
withdrawalBtn.addEventListener('click', (e) => {
e.preventDefault();
src/main/resources/templates/views/apps/mypage/updatePersonalUser.html
+27 -26
View File
@@ -4,41 +4,42 @@
<body>
<section layout:fragment="title">
<div class="page-title-banner">
<img th:src="@{/img/user_register_title.png}" class="title-image">
<img th:src="@{/img/img_title_bg.png}" class="title-image">
<h1>내 정보 관리</h1>
</div>
</section>
<section layout:fragment="contentFragment" class="content">
<section layout:fragment="contentFragment">
<div class="org-register-container">
<form id="updateForm" method="post" th:action="@{/mypage/update}" th:object="${user}">
<div class="org-section-header">
<h3>기본 정보</h3>
<span class="required-badge">필수 입력</span>
</div>
<div class="org-form-container">
<th:block th:replace="~{apps/mypage/components/commonUserInfo :: commonUserInfo}"></th:block>
</div>
<div class="common-title-bar">
<h2 class="common-title">기본 정보</h2>
</div>
<div class="register-form-container">
<form id="updateForm" method="post" th:action="@{/mypage/update}" th:object="${user}">
<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/>
<div class="register-form">
<th:block th:replace="~{apps/mypage/components/commonUserInfo :: commonUserInfo}"></th:block>
</div>
<!-- Corporate Transfer Button -->
<div class="org-info-notice" style="margin-top: 32px;">
<button type="button" class="btn btn-secondary btn_business" style="width: 100%;">
법인회원 전환
</button>
</div>
<!-- Action Buttons -->
<div class="org-action-buttons">
<button type="button" class="btn btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-primary submit-btn">수정</button>
</div>
</form>
<!-- Corporate Transfer Button -->
<div class="corporate-transfer-section">
<button type="button" class="btn btn-secondary btn_business btn-block">
법인회원 전환
</button>
</div>
</form>
</div>
<!-- Action Buttons -->
<div class="form-actions">
<button type="button" class="btn btn-submit btn-secondary" th:onclick="|location.href='@{/}'|">취소</button>
<button type="button" class="btn btn-submit btn-primary submit-btn">수정</button>
</div>
<input type="hidden" name="finalMobileNumber"/>
<!-- Withdrawal Button -->
<div class="withdrawal" style="margin-top: 32px; text-align: center;">
<a style="color: #64748B; text-decoration: underline; cursor: pointer;">회원탈퇴</a>
<div class="withdrawal-section">
<a class="withdrawal-link">회원탈퇴</a>
</div>
</div>
</section>
@@ -163,7 +164,7 @@
}
// 회원탈퇴 버튼 이벤트
const withdrawalBtn = document.querySelector('.withdrawal a');
const withdrawalBtn = document.querySelector('.withdrawal-link');
if (withdrawalBtn) {
withdrawalBtn.addEventListener('click', (e) => {
e.preventDefault();