사용자 회원가입 수정(1)

This commit is contained in:
김현욱
2025-12-23 18:02:34 +09:00
parent 79d17e3fc2
commit c4bb58c75c
8 changed files with 797 additions and 231 deletions

View File

@@ -28,20 +28,22 @@
$(document).ready(function() {
fn_set_birthYears();
fn_set_birthMonths();
fn_show_phoneAuth();
fn_show_emailAuth();
// fn_show_phoneAuth();
fn_check_stplat();
first = 0;
$(".signUp__inputBox__alertText").hide();
fn_alert_hide($("#mbrNm"), $("#mbrNmAlert"));
fn_alert_hide($("#mbtlnb"), $("#mbtlnbAlert"));
// fn_alert_hide($("#mbtlnb"), $("#mbtlnbAlert"));
fn_alert_hide($("#email"), $("#mbrEmailAlert"));
fn_alert_hide($("#mbtlCert"), $("#mbtlCertAlert"));
fn_alert_hide($("#mbrId"), $("#mbrIdAlert"), 'id');
fn_alert_hide($("#mbrPassword"), $("#mbrPasswordAlert"), 'pw');
fn_alert_hide($("#mbrPasswordChk"), $("#mbrPasswordChkAlert"), 'pw');
fn_alert_hide($("#id"), $("#emailAlert"));
// fn_alert_hide($("#id"), $("#emailAlert"));
fn_alert_hide($('input[name="sex"]'), $("#sexAlert"));
fn_alert_hide($("#dtlAdres"), $("#postcodeAlert"));
// fn_alert_hide($("#dtlAdres"), $("#postcodeAlert"));
fn_alert_hide_selected();
$('#regForm').on('keydown', function(e) {
@@ -51,17 +53,20 @@
});
$('#mbrNm').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#phoneAuthBtn').click();
$('#emailAuthBtn').click();
// $('#phoneAuthBtn').click();
}
});
$('#mbtlnb').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#phoneAuthBtn').click();
$('#emailAuthBtn').click();
// $('#phoneAuthBtn').click();
}
});
$('#mbtlCert').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_confim_own();
fn_confim_own_email();
// fn_confim_own();
}
});
$('#mbrId').on('keydown', function(e) {
@@ -184,12 +189,12 @@
/* ********************************************************
* 우편번호 찾기
******************************************************** */
const fn_set_postcode = function(_data) {
$('#adresDv').val(_data.addressType)
$('#postcode').val(_data.postcode);
$('#address').val(_data.addressType == '01' ? _data.roadAddress : _data.jibunAddress);
}
// const fn_set_postcode = function(_data) {
//
// $('#adresDv').val(_data.addressType)
// $('#postcode').val(_data.postcode);
// $('#address').val(_data.addressType == '01' ? _data.roadAddress : _data.jibunAddress);
// }
/* ********************************************************
* 생년 콤보박스
@@ -251,11 +256,72 @@
seconds--;
} else {
fn_stop_timer();
fn_stop_email_timer();
// fn_stop_timer();
alert('인증번호 유효시간이 만료되었습니다.');
}
}
/* ********************************************************
* 이메일 인증 번호 발송
******************************************************** */
first = 0;
mbtlCert = '';
const fn_email_sending_number = function() {
if(timerRunning){
return;
}
if(mbtlCert === $('#email').val()){
first++;
}else{
first = 0;
}
mbtlCert = $('#email').val();
let mbrNm = $('#mbrNm').val();
let mbrEmail = $('#email').val().trim();
let params = {
'mbrNm' : mbrNm,
'email': mbrEmail
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertEmailAuth"/>',
data : params,
dataType: 'json',
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
if (first > 0) {
alert('인증번호가 재발송되었습니다.');
} else if (first === 0) {
alert('인증번호가 발송되었습니다.');
first++;
} else {
return;
}
$('#sndngInnb').val(result.sndngInnb);
}else {
alert('인증번호 발송에 실패했습니다.');
fn_stop_email_timer();
return;
}
}
});
$('#mbrNm').attr("readonly", true);
$('#email').attr("readonly", true);
clearInterval(countdown);
seconds = 180;
fn_set_timeOut();
countdown = setInterval(fn_set_timeOut, 1000);
timerRunning = true;
}
/* ********************************************************
* 휴대폰 인증 번호 발송
******************************************************** */
@@ -316,6 +382,22 @@
timerRunning = true;
}
/* ********************************************************
* 타이머 정지 함수 (이메일)
******************************************************** */
const fn_stop_email_timer = function() {
if (timerRunning) {
clearInterval(countdown);
$('#timer').text('05:00');
$('#mbtlCert').val('');
$('#emailAuthContent').hide();
$('#mbrNm').attr("readonly", false);
$('#email').attr("readonly", false);
timerRunning = false;
}
}
/* ********************************************************
* 타이머 정지 함수
******************************************************** */
@@ -332,6 +414,52 @@
}
}
/* ********************************************************
* 이메일 인증 확인
******************************************************** */
isChkd_own_email = false;
const fn_confim_own_email = function() {
if (first <= 0) return;
let sndngInnb = $('#sndngInnb').val();
let mbrEmail = $('#email').val().trim();
let crtnb = $('#mbtlCert').val();
fn_stop_email_timer();
let params = {
'sndngInnb': sndngInnb,
'email': mbrEmail,
'crtnb' : crtnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectEmailAuth"/>',
data : params,
dataType: 'json',
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
alert('인증되었습니다.');
$('#emailAuthOkBtn').show();
$('#emailAuthBtn').hide();
isChkd_own_email = true;
//TODO : 메서드명 변경 필요 탈퇴회원 → 기존가입여부
fn_check_mbrwithdrawal_email();
$('#mbrNm').attr("readonly", true);
$('#email').attr("readonly", true);
}else {
alert('인증번호가 일치하지 않습니다.');
return;
}
}
});
}
/* ********************************************************
* 휴대폰 인증 확인
******************************************************** */
@@ -378,6 +506,33 @@
}
/* ********************************************************
* 기존 가입 여부 조회 (이메일)
******************************************************** */
const fn_check_mbrwithdrawal_email = function() {
let mbrNm = $('#mbrNm').val().trim();
$('#mbrNm').val(mbrNm);
let mbrEmail = $('#email').val().trim();
let params = {
'mbrNm' : mbrNm,
'email': mbrEmail
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectMbrwithdrawalSearchEmail"/>',
data : params,
dataType: 'json',
success : function(result) {
let mbrWithDrawalList = JSON.parse(result.resBody.result).mbrWithDrawalList;
fn_make_rejoinInforList(mbrWithDrawalList);
}
});
}
/* ********************************************************
* 기존 가입 여부 조회
******************************************************** */
@@ -470,9 +625,11 @@
return;
};
if (!isChkd_own) {
alert('휴대폰 인증을 해주세요.');
$('#mbtlnb').focus();
if (!isChkd_own_email) {
alert('이메일 인증을 해주세요.');
$('#email').focus();
// alert('휴대폰 인증을 해주세요.');
// $('#mbtlnb').focus();
fn_regist_fail();
return;
}
@@ -489,12 +646,12 @@
return;
}
if(!fn_check_email()) {
alert('올바른 이메일 형식이 아닙니다.');
$('#id').focus();
fn_regist_fail();
return;
}
// if(!fn_check_email()) {
// alert('올바른 이메일 형식이 아닙니다.');
// $('#id').focus();
// fn_regist_fail();
// return;
// }
if ($('#select-brthYear').val() == null || $('#select-Month').val() == null) {
alert('생년월을 선택해 주세요.');
@@ -512,27 +669,27 @@
return;
}
if ($('#postcode').val().trim() == '' || $('#address').val().trim() == '') {
alert('우편번호를 선택해 주세요.');
$("#postcodeAlert").show();
document.getElementById('postcodeBtn').scrollIntoView();
fn_regist_fail();
return;
}
// if ($('#postcode').val().trim() == '' || $('#address').val().trim() == '') {
// alert('우편번호를 선택해 주세요.');
// $("#postcodeAlert").show();
// document.getElementById('postcodeBtn').scrollIntoView();
// fn_regist_fail();
// return;
// }
if ($('#dtlAdres').val().trim() == '') {
alert('상세주소를 입력해 주세요.');
$('#dtlAdres').focus();
fn_regist_fail();
return;
}
// if ($('#dtlAdres').val().trim() == '') {
// alert('상세주소를 입력해 주세요.');
// $('#dtlAdres').focus();
// fn_regist_fail();
// return;
// }
if(!confirm('회원가입을 <spring:message code="confirm.common.predicate"/>')){
fn_regist_fail();
return;
}
fn_make_brthDe();
fn_make_mbtlnb();
// fn_make_mbtlnb();
let params = $('#regForm').serialize();
$.ajax({
@@ -613,6 +770,32 @@
}
}
/* ********************************************************
* 이메일 인증 버튼 클릭시, 이메일 인증 박스 노출
******************************************************** */
const fn_show_emailAuth = function() {
let emailAuthBtn = $('#emailAuthBtn');
let emailAuthContent = $('#emailAuthContent');
emailAuthContent.hide();
emailAuthBtn.click(function () {
if(!$('#mbrNm').val()){
alert('이름을 입력해 주세요.');
$('#mbrNm').focus();
return;
}else if(!$('#email').val()){
alert('이메일 주소를 입력해 주세요.');
$('#email').focus();
return;
}
$('#emailAuthContent').show();
$('#mbtlCert').focus();
fn_email_sending_number();
});
}
/* ********************************************************
* 휴대폰 인증 버튼 클릭시, 휴대폰 인증 박스 노출
******************************************************** */
@@ -714,45 +897,45 @@
* 앱 환경을 검증하고 우편번호 버튼 함수를 변경하는 함수
*******************************************************/
function initPostcodeInterface() {
// 앱 환경에서 사용할 모바일용 함수명 정의
const MOBILE_POSTCODE_FUNCTION = "fn_select_postcode_app";
// 앱 인터페이스 초기화 확인
if (window.app) {
console.log("앱 환경 감지됨, 우편번호 함수 변경");
changePostcodeFunction(MOBILE_POSTCODE_FUNCTION);
} else {
console.log("앱 인터페이스를 기다리는 중...");
let checkCount = 0;
const maxChecks = 10; // 최대 5초(500ms * 10)까지 시도
const checkInterval = setInterval(function() {
checkCount++;
if (window.app) {
clearInterval(checkInterval);
console.log("앱 인터페이스 초기화 완료, 우편번호 함수 변경");
changePostcodeFunction(MOBILE_POSTCODE_FUNCTION);
} else if (checkCount >= maxChecks) {
clearInterval(checkInterval);
console.warn("앱 인터페이스를 찾을 수 없습니다. 최대 시도 횟수 초과.");
}
}, 500);
}
// // 앱 환경에서 사용할 모바일용 함수명 정의
// const MOBILE_POSTCODE_FUNCTION = "fn_select_postcode_app";
//
// // 앱 인터페이스 초기화 확인
// if (window.app) {
// console.log("앱 환경 감지됨, 우편번호 함수 변경");
// changePostcodeFunction(MOBILE_POSTCODE_FUNCTION);
// } else {
// console.log("앱 인터페이스를 기다리는 중...");
// let checkCount = 0;
// const maxChecks = 10; // 최대 5초(500ms * 10)까지 시도
// const checkInterval = setInterval(function() {
// checkCount++;
// if (window.app) {
// clearInterval(checkInterval);
// console.log("앱 인터페이스 초기화 완료, 우편번호 함수 변경");
// changePostcodeFunction(MOBILE_POSTCODE_FUNCTION);
// } else if (checkCount >= maxChecks) {
// clearInterval(checkInterval);
// console.warn("앱 인터페이스를 찾을 수 없습니다. 최대 시도 횟수 초과.");
// }
// }, 500);
// }
}
/*******************************************************
* 우편번호 버튼의 onclick 함수를 변경하는 함수
*******************************************************/
function changePostcodeFunction(newFunctionName) {
console.log("changePostcodeFunction 호출");
console.log("newFunctionName: " + newFunctionName);
const postcodeBtn = document.getElementById('postcodeBtn');
if (postcodeBtn) {
postcodeBtn.setAttribute('onclick', newFunctionName + '(fn_set_postcode);');
console.log('우편번호 버튼 함수가' + newFunctionName + '으로 변경되었습니다.');
} else {
console.warn('우편번호 버튼을 찾을 수 없습니다.');
}
}
// function changePostcodeFunction(newFunctionName) {
// console.log("changePostcodeFunction 호출");
// console.log("newFunctionName: " + newFunctionName);
// const postcodeBtn = document.getElementById('postcodeBtn');
// if (postcodeBtn) {
// postcodeBtn.setAttribute('onclick', newFunctionName + '(fn_set_postcode);');
// console.log('우편번호 버튼 함수가' + newFunctionName + '으로 변경되었습니다.');
// } else {
// console.warn('우편번호 버튼을 찾을 수 없습니다.');
// }
// }
// 페이지 로드 시 함수 실행
document.addEventListener('DOMContentLoaded', initPostcodeInterface);
@@ -801,25 +984,49 @@
<input type="text" class="input-text full" name="mbrNm" id="mbrNm" title="이름" placeholder="이름을 입력해 주세요.">
<p class="signUp__inputBox__alertText" id="mbrNmAlert">이름을 입력해 주세요.</p>
</div>
<%-- <div class="signUp__inputBox__item">--%>
<%-- <div class="signUp__inputBox__itemTitle">휴대전화<span class="required-asterisk">*</span></div>--%>
<%-- <div class="inputWithBtn">--%>
<%-- <input type="text" class="input-text full number" id="mbtlnb" title="휴대폰" placeholder="휴대폰번호 입력 (’-’ 없이)" oninput="fn_set_event(this, 'keyup', fn_fmt_telno)" maxlength="13">--%>
<%-- <input type="hidden" name="mbtlnb">--%>
<%-- <button type="button" class="btn md theme outline" id="phoneAuthBtn"><spring:message code="button.certification"/></button>--%>
<%-- <!-- 인증완료시 버튼 -->--%>
<%-- <button type="button" class="btn md outline" id="phoneAuthOkBtn" style="display:none;"><spring:message code="button.certificationDone"/></button>--%>
<%-- </div>--%>
<%-- <p class="signUp__inputBox__alertText" id="mbtlnbAlert">휴대폰 번호를 입력해 주세요.</p>--%>
<%-- <div class="phoneAuth" id="phoneAuthContent">--%>
<%-- <input type="hidden" id="sndngInnb">--%>
<%-- <div>--%>
<%-- <div class="inputWithBtn">--%>
<%-- <div class="inputTimer">--%>
<%-- <input type="text" class="input-text full number" id="mbtlCert" title="인증번호" placeholder="인증번호 입력" maxlength="6">--%>
<%-- <span class="inputTimer__time" id="timer">03:00</span>--%>
<%-- </div>--%>
<%-- <button type="button" class="btn md gray" onclick="fn_confim_own();"><spring:message code="button.ok"/></button>--%>
<%-- </div>--%>
<%-- <p class="signUp__inputBox__alertText" id="mbtlCertAlert">인증번호를 입력해 주세요.</p>--%>
<%-- </div>--%>
<%-- </div>--%>
<%-- </div>--%>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">휴대전화<span class="required-asterisk">*</span></div>
<div class="signUp__inputBox__itemTitle">이메일<span class="required-asterisk">*</span></div>
<div class="inputWithBtn">
<input type="text" class="input-text full number" id="mbtlnb" title="휴대폰" placeholder="휴대폰번호 입력 (’-’ 없이)" oninput="fn_set_event(this, 'keyup', fn_fmt_telno)" maxlength="13">
<input type="hidden" name="mbtlnb">
<button type="button" class="btn md theme outline" id="phoneAuthBtn"><spring:message code="button.certification"/></button>
<input type="text" class="input-text full certInp" id="email" title="이메일" placeholder="이메일을 입력해주세요" maxlength="190">
<input type="hidden" name="email">
<button type="button" class="btn md theme outline" id="emailAuthBtn"><spring:message code="button.certificationEmail"/></button>
<!-- 인증완료시 버튼 -->
<button type="button" class="btn md outline" id="phoneAuthOkBtn" style="display:none;"><spring:message code="button.certificationDone"/></button>
<button type="button" class="btn md outline" id="emailAuthOkBtn" style="display:none;"><spring:message code="button.certificationDone"/></button>
</div>
<p class="signUp__inputBox__alertText" id="mbtlnbAlert">휴대폰 번호를 입력해 주세요.</p>
<div class="phoneAuth" id="phoneAuthContent">
<p class="signUp__inputBox__alertText" id="mbrEmailAlert">이메일을 입력해 주세요.</p>
<div class="emailAuth" id="emailAuthContent">
<input type="hidden" id="sndngInnb">
<div>
<div class="inputWithBtn">
<div class="inputTimer">
<input type="text" class="input-text full number" id="mbtlCert" title="인증번호" placeholder="인증번호 입력" maxlength="6">
<span class="inputTimer__time" id="timer">03:00</span>
<span class="inputTimer__time" id="timer">05:00</span>
</div>
<button type="button" class="btn md gray" onclick="fn_confim_own();"><spring:message code="button.ok"/></button>
<button type="button" class="btn md gray" onclick="fn_confim_own_email();"><spring:message code="button.ok"/></button>
</div>
<p class="signUp__inputBox__alertText" id="mbtlCertAlert">인증번호를 입력해 주세요.</p>
</div>
@@ -868,24 +1075,24 @@
<input type="password" class="input-text full" name="mbrPasswordChk" id="mbrPasswordChk" title="비밀번호 확인" placeholder="비밀번호를 한번 더 입력해주세요." maxlength="20">
<p class="signUp__inputBox__alertText" id="mbrPasswordChkAlert">비밀번호를 입력해 주세요.</p>
</div>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">이메일<span class="required-asterisk">*</span>
<input type="hidden" name="email" value=""/>
</div>
<div class="inputEmail">
<input class="input-text full" type="email" id="id" title="이메일 id" placeholder="이메일" maxlength="25">
<span class="inputEmail__at">@</span>
<input class="input-text full" type="text" id="domain" title="이메일 domain" maxlength="25">
<div class="select-box">
<select name="domain" title="이메일 자동발송 발신주소" onchange="fn_set_domain(this.value);">
<c:forEach var="cgn001" items="${resultMap.cgn001}" varStatus="status">
<option value="${cgn001.cdNm}" ${f:setSelected(cgn001.cd, '99')}><c:out value="${cgn001.cdNm}"/></option>
</c:forEach>
</select>
</div>
</div>
<p class="signUp__inputBox__alertText" id="emailAlert">이메일을 입력해 주세요.</p>
</div>
<%-- <div class="signUp__inputBox__item">--%>
<%-- <div class="signUp__inputBox__itemTitle">이메일<span class="required-asterisk">*</span>--%>
<%-- <input type="hidden" name="email" value=""/>--%>
<%-- </div>--%>
<%-- <div class="inputEmail">--%>
<%-- <input class="input-text full" type="email" id="id" title="이메일 id" placeholder="이메일" maxlength="25">--%>
<%-- <span class="inputEmail__at">@</span>--%>
<%-- <input class="input-text full" type="text" id="domain" title="이메일 domain" maxlength="25">--%>
<%-- <div class="select-box">--%>
<%-- <select name="domain" title="이메일 자동발송 발신주소" onchange="fn_set_domain(this.value);">--%>
<%-- <c:forEach var="cgn001" items="${resultMap.cgn001}" varStatus="status">--%>
<%-- <option value="${cgn001.cdNm}" ${f:setSelected(cgn001.cd, '99')}><c:out value="${cgn001.cdNm}"/></option>--%>
<%-- </c:forEach>--%>
<%-- </select>--%>
<%-- </div>--%>
<%-- </div>--%>
<%-- <p class="signUp__inputBox__alertText" id="emailAlert">이메일을 입력해 주세요.</p>--%>
<%-- </div>--%>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">생년월<span class="required-asterisk">*</span></div>
<div class="inputHalf">
@@ -909,19 +1116,19 @@
</div>
<p class="signUp__inputBox__alertText" id="sexAlert">성별을 선택해 주세요.</p>
</div>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">주소<span class="required-asterisk">*</span></div>
<div class="inputAddress">
<div class="inputAddress__postalCode">
<input type="text" class="input-text" id="postcode" name="zip" title="우편번호" placeholder="우편번호" readonly>
<button type="button" id="postcodeBtn" class="btn md theme outline" onclick="fn_select_postcode(fn_set_postcode);"><spring:message code="button.zipcode"/></button>
</div>
<input type="text" class="input-text full" id="address" name="lnbAdres" title="주소" placeholder="주소" readonly>
<input type="text" class="input-text full" id="dtlAdres" name="dtlAdres" title="상세주소" placeholder="나머지 주소를 입력해 주세요.">
<input type="hidden" id="adresDv" name="adresDv">
</div>
<p class="signUp__inputBox__alertText" id="postcodeAlert">주소를 입력해 주세요.</p>
</div>
<%-- <div class="signUp__inputBox__item">--%>
<%-- <div class="signUp__inputBox__itemTitle">주소<span class="required-asterisk">*</span></div>--%>
<%-- <div class="inputAddress">--%>
<%-- <div class="inputAddress__postalCode">--%>
<%-- <input type="text" class="input-text" id="postcode" name="zip" title="우편번호" placeholder="우편번호" readonly>--%>
<%-- <button type="button" id="postcodeBtn" class="btn md theme outline" onclick="fn_select_postcode(fn_set_postcode);"><spring:message code="button.zipcode"/></button>--%>
<%-- </div>--%>
<%-- <input type="text" class="input-text full" id="address" name="lnbAdres" title="주소" placeholder="주소" readonly>--%>
<%-- <input type="text" class="input-text full" id="dtlAdres" name="dtlAdres" title="상세주소" placeholder="나머지 주소를 입력해 주세요.">--%>
<%-- <input type="hidden" id="adresDv" name="adresDv">--%>
<%-- </div>--%>
<%-- <p class="signUp__inputBox__alertText" id="postcodeAlert">주소를 입력해 주세요.</p>--%>
<%-- </div>--%>
</div>
<div class="signUp__btnContainer-half">
<button type="button" class="btn xl full outline signUp__signUpBtn" onclick="fn_move_mainPage();"><spring:message code="button.cancel"/></button>