Files
sake/src/main/webapp/WEB-INF/views/sopmal/mbr/JoinC.jsp

1164 lines
38 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui"%>
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld"%>
<%--
Class Name : JoinC.jsp
Description : 회원가입
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-02-05 최범식 최초 생성
2024-08-19 이대환 독립몰/통합몰 구분
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/Include.jsp"/>
</head>
<script type="text/javascript">
$(document).ready(function() {
fn_set_birthYears();
fn_set_birthMonths();
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($("#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($('input[name="sex"]'), $("#sexAlert"));
// fn_alert_hide($("#dtlAdres"), $("#postcodeAlert"));
fn_alert_hide_selected();
$('#regForm').on('keydown', function(e) {
if (e.keyCode == 13) {
e.preventDefault();
}
});
$('#mbrNm').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#emailAuthBtn').click();
// $('#phoneAuthBtn').click();
}
});
$('#mbtlnb').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#emailAuthBtn').click();
// $('#phoneAuthBtn').click();
}
});
$('#mbtlCert').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_confim_own_email();
// fn_confim_own();
}
});
$('#mbrId').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_check_mbrid();
}
});
});
/* ********************************************************
* 약관동의 체크
******************************************************** */
const fn_check_stplat = function() {
if(!$('input[name="sopmalStplatInnb"]').val()){
alert('약관 동의 처리에 문제가 발생했습니다. 다시 시도해 주세요.');
window.location.href = '/sopmal/mbr/selectJoinAgreeTermsForm';
return true;
}
}
/* ********************************************************
* domain 넣기
******************************************************** */
const fn_set_domain = function(_value) {
if (_value === '직접입력') {
$('#domain').attr('readonly', false);
$('#domain').val('');
} else {
$('#domain').attr('readonly', true);
$('#domain').val(_value);
}
}
/* ********************************************************
* email 합치기
******************************************************** */
const fn_make_email = function() {
let domain = $('#domain').val();
let id = $('#id').val().trim();
$('[name=email]').val(id + '@' + domain);
return $('[name=email]').val();
}
/* ********************************************************
* 생년월일 합치기
******************************************************** */
const fn_make_brthDe = function() {
var year = $('#select-brthYear').val();
var month = ($('#select-Month').val()< 10 ? '0' : '') + $('#select-Month').val();
$('[name=brthDe]').val(year + month + '01');
}
/* ********************************************************
* 전화번호 하이픈 제거
******************************************************** */
const fn_make_mbtlnb = function() {
var mbtlnb = $('#mbtlnb').val();
$('[name=mbtlnb]').val(mbtlnb.trim().replace(/-/g, ''));
}
/* ********************************************************
* password check
******************************************************** */
const fn_check_password = function() {
var regular = /^((?=.*[a-zA-Z])(?=.*\d|.*\W)|(?=.*\d)(?=.*\W))[a-zA-Z\d\W]{6,20}$/;
let mbrPassword = $('#mbrPassword');
let mbrPasswordChk = $('#mbrPasswordChk');
let mbrId = $('#mbrId');
if(!regular.test(mbrPassword.val())){
alert('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
mbrPassword.focus();
return;
}
if(!regular.test(mbrPasswordChk.val())){
alert('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
mbrPasswordChk.focus();
return;
}
if (mbrPassword.val() !== mbrPasswordChk.val()) {
alert('비밀번호가 일치하지 않습니다.');
mbrPassword.focus();
return;
}
if (mbrPassword.val() == mbrId.val()) {
mbrPassword.focus();
alert('비밀번호는 아이디와 동일할 수 없습니다.');
return;
}
return true;
}
/**********************************************
* 이메일 형식 유효성 체크 (올바른 이메일 형식일 때 True)
***********************************************/
const fn_check_email = function() {
let mbrEmail = fn_make_email();
var regular = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i;
if(regular.test(mbrEmail)){
return true;
}else{
return false;
}
}
/* ********************************************************
* 우편번호 찾기
******************************************************** */
// 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_birthYears = function() {
let date = new Date();
let year = date.getFullYear();
let combo = '';
combo ='<select class="md" name="brthYear" id="select-brthYear" title="생년">';
combo +=' <option value="" selected disabled>년</option>';
for (let y = year - 14; y >= year - 101; y--) {
combo +=' <option value="' + y + '">' + y + ' 년' + '</option>';
}
combo +='</select>';
$('#birthYear').html(combo);
$('#select-brthYear').niceSelect();
}
/* ********************************************************
* 생월 콤보박스
******************************************************** */
const fn_set_birthMonths = function() {
let combo = '';
combo ='<select class="md" name="brthMonth" id="select-Month" title="생월">';
combo +=' <option value="" selected disabled>월</option>';
for (let m = 1; m < 13; m++) {
combo +=' <option value="' + m + '">' + m + ' 월' + '</option>';
}
combo +='</select>';
$('#birthMonth').html(combo);
$('#select-Month').niceSelect();
}
/* ********************************************************
* 휴대폰 인증 카운터
******************************************************** */
let seconds;
let countdown;
let timerRunning = false;
const fn_set_timeOut = function() {
if (seconds >= 0) {
const minutes = Math.floor(seconds / 60).toString().padStart(2, '0');
const remainingSeconds = (seconds % 60).toString().padStart(2, '0');
$('#timer').text(minutes+":"+remainingSeconds);
seconds--;
} else {
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 = 300;
// seconds = 180;
fn_set_timeOut();
countdown = setInterval(fn_set_timeOut, 1000);
timerRunning = true;
}
/* ********************************************************
* 휴대폰 인증 번호 발송
******************************************************** */
first = 0;
mbtlCert = '';
const fn_sending_number = function() {
if(timerRunning){
return;
}
if(mbtlCert === $('#mbtlnb').val()){
first++;
}else{
first = 0;
}
mbtlCert = $('#mbtlnb').val();
let mbrNm = $('#mbrNm').val();
let mbtlnb = $('#mbtlnb').val().trim().replace(/-/g, '');
let params = {
'mbrNm' : mbrNm,
'mbtlnb': mbtlnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertPhoneAuth"/>',
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_timer();
return;
}
}
});
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
clearInterval(countdown);
seconds = 180;
fn_set_timeOut();
countdown = setInterval(fn_set_timeOut, 1000);
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;
}
}
/* ********************************************************
* 타이머 정지 함수
******************************************************** */
const fn_stop_timer = function() {
if (timerRunning) {
clearInterval(countdown);
$('#timer').text('03:00');
$('#mbtlCert').val('');
$('#phoneAuthContent').hide();
$('#mbrNm').attr("readonly", false);
$('#mbtlnb').attr("readonly", false);
timerRunning = false;
}
}
/* ********************************************************
* 이메일 인증 확인
******************************************************** */
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;
}
}
});
}
/* ********************************************************
* 휴대폰 인증 확인
******************************************************** */
isChkd_own = false;
const fn_confim_own = function() {
if (first <= 0) return;
let sndngInnb = $('#sndngInnb').val();
let mbtlnb = $('#mbtlnb').val().trim().replace(/-/g, '');
let crtnb = $('#mbtlCert').val();
fn_stop_timer();
let params = {
'sndngInnb': sndngInnb,
'mbtlnb': mbtlnb,
'crtnb' : crtnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectPhoneAuth"/>',
data : params,
dataType: 'json',
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
alert('인증되었습니다.');
$('#phoneAuthOkBtn').show();
$('#phoneAuthBtn').hide();
isChkd_own = true;
//TODO : 메서드명 변경 필요 탈퇴회원 → 기존가입여부
fn_check_mbrwithdrawal();
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
}else {
alert('인증번호가 일치하지 않습니다.');
return;
}
}
});
}
/* ********************************************************
* 기존 가입 여부 조회 (이메일)
******************************************************** */
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);
}
});
}
/* ********************************************************
* 기존 가입 여부 조회
******************************************************** */
const fn_check_mbrwithdrawal = function() {
let mbrNm = $('#mbrNm').val().trim();
$('#mbrNm').val(mbrNm);
let mbtlnb = $('#mbtlnb').val().trim().replace(/-/g, '');
let params = {
'mbrNm' : mbrNm,
'mbtlnb': mbtlnb
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectMbrwithdrawalSearch"/>',
data : params,
dataType: 'json',
success : function(result) {
let mbrWithDrawalList = JSON.parse(result.resBody.result).mbrWithDrawalList;
fn_make_rejoinInforList(mbrWithDrawalList);
}
});
}
/* ********************************************************
* 기존 가입 내역
******************************************************** */
const fn_make_rejoinInforList = function(_data) {
let tbodyClone;
let isExtMember = false;
let snsMemberCnt = 0;
if (_data.length > 0) {
let extMember = _data[0].mbrInnb;
$('#rejoinContainer').show();
for (let i = 0; i < _data.length; i++) {
if (_data[i].dev >= 3) {
snsMemberCnt++;
isExtMember = true;
tbodyClone +='<tr>';
tbodyClone +=' <td style="display : none;">' + _data[i].mbrInnb + '</td>';
tbodyClone +=' <td>' + _data[i].brand + '</td>';
tbodyClone +=' <td>' + _data[i].extrlIntrlckDv + '</td>';
tbodyClone +=' <td>' + _data[i].emailAdres + '</td>';
tbodyClone +='</tr>';
} else {
$('#rejoinContainer').hide();
alert('이미 가입된 정보입니다. 로그인해 주세요.');
snsMemberCnt = 0;
isExtMember = false;
// window.location.href = '<c:out value="${issuerUri}"/>/index';
window.location.href = '/sopmal/login';
break;
}
}
tbodyClone +='<tr style="display:none;"><td><input type="text" name="extMember" value="'+extMember+'"/></td></tr>';
$('#rejoinSelect').html(tbodyClone);
if(snsMemberCnt > 1){
$('#rejoinSelect tr').each(function() {
if (!($(this).find('input[name="extMember"]').length) && $(this).find('td').eq(0).text().trim() !== String(extMember)) {
$(this).remove();
}
});
}
if (isExtMember) {
alert('인증되었습니다. 인증하신 정보로 가입된 계정 정보가 있습니다. 계정정보 연동을 진행합니다.');
}
}
}
/* ********************************************************
* 회원 가입
******************************************************** */
const fn_regist_member = function() {
disableButton('#registBtn');
if(fn_check_stplat()) {
fn_regist_fail();
return;
};
if (!isChkd_own_email) {
alert('이메일 인증을 해주세요.');
$('#email').focus();
// alert('휴대폰 인증을 해주세요.');
// $('#mbtlnb').focus();
fn_regist_fail();
return;
}
// console.log("mbtlnb : ",$('#mbtlnb').val());
if ($('#mbtlnb').val() === null || $('#mbtlnb').val() === '') {
alert('휴대폰 번호를 입력해주세요.');
$('#mbtlnb').focus();
fn_regist_fail();
return;
}
if (!isChkd_Dup) {
alert('아이디 중복 확인을 해주세요.');
$('#mbrId').focus();
fn_regist_fail();
return;
}
if(!fn_check_password()) {
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('생년월을 선택해 주세요.');
$("#brthDeAlert").show();
document.getElementById('birthYear').scrollIntoView();
fn_regist_fail();
return;
}
if ($('input[name="sex"]:checked').val() == null) {
alert('성별을 선택해 주세요.');
$("#sexAlert").show();
$('#men').focus();
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(!confirm('회원가입을 <spring:message code="confirm.common.predicate"/>')){
fn_regist_fail();
return;
}
fn_make_brthDe();
fn_make_mbtlnb();
var email = $('#email').val();
$('[name=email]').val(email.trim());
let params = $('#regForm').serialize();
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertUsrJoinRegist"/>',
data : params,
dataType: 'json',
success : function (result) {
const response = JSON.parse(result.resBody.result);
const errStatus = response.status;
if(errStatus === 500){
alert('회원가입에 실패하였습니다. 회원가입 안내 화면으로 돌아갑니다.');
location.replace('/sopmal/mbr/selectJoinGuidance');
fn_regist_fail();
return;
}
const mbrInnb = response.mbrInnb;
const marketingAgree = response.marketingAgree;
if (mbrInnb !== null) {
// alert($('#registType').val()+'에 가입되었습니다.');
location.replace('/sopmal/mbr/selectJoinCompleteR'+(marketingAgree=='Y'?'?stplatDvCdAts=Y':''));
}
}
});
}
/* ********************************************************
* 회원 가입 실패
******************************************************** */
const fn_regist_fail = function() {
enableButton('#registBtn');
}
/* ********************************************************
* 아이디 중복 확인
******************************************************** */
dupList = [];
isChkd_Dup = false;
const fn_check_mbrid = function() {
var regular = /^(?=.*[a-zA-Z])[a-zA-Z\d_]{6,20}$/;
let mbrid = $('#mbrId').val().trim();
$('#mbrId').val(mbrid);
if(!regular.test(mbrid)) {
alert('아이디는 영문 소문자, 숫자, 밑줄만 사용 가능하며, 6~20자 이내로 입력해주세요.');
return
}
if(!isChkd_Dup) {
let params = {
'mbrId' : mbrid
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectIdDplctCnfirm"/>',
data : params,
dataType: 'json',
success : function(Data) {
if (JSON.parse(Data.resBody.result).message === 'impossible'){
alert('\"' + mbrid + '\" 은 이용중인 아이디 입니다.');
dupList.push(mbrid);
$("#mbrIdAlert").html('이미 사용중인 아이디입니다.');
$("#mbrIdAlert").show();
}
if (JSON.parse(Data.resBody.result).message === 'possible'){
isChkd_Dup = true;
alert('\"' + mbrid + '\" 은 사용 가능합니다.');
}
}
});
}
}
/* ********************************************************
* 이메일 인증 버튼 클릭시, 이메일 인증 박스 노출
******************************************************** */
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();
});
}
/* ********************************************************
* 휴대폰 인증 버튼 클릭시, 휴대폰 인증 박스 노출
******************************************************** */
const fn_show_phoneAuth = function() {
let phoneAuthBtn = $('#phoneAuthBtn');
let phoneAuthContent = $('#phoneAuthContent');
phoneAuthContent.hide();
phoneAuthBtn.click(function () {
if(!$('#mbrNm').val()){
alert('이름을 입력해 주세요.');
$('#mbrNm').focus();
return;
}else if(!$('#mbtlnb').val()){
alert('휴대폰 번호를 입력해 주세요.');
$('#mbtlnb').focus();
return;
}
$('#phoneAuthContent').show();
$('#mbtlCert').focus();
fn_sending_number();
});
}
/* ********************************************************
* 메인화면 이동(뒤로 가기))
******************************************************** */
const fn_move_mainPage = function() {
history.back();
if(history.length <= 1){
window.close();
}
}
/* ********************************************************
* 사용자 입력값이 입력될 때 alertText 숨기기
******************************************************** */
const fn_alert_hide = (inputId, alertId, type) => {
inputId.on('input', function () {
switch(type){
case 'id':
var regular = /^(?=.*[a-zA-Z])[a-zA-Z\d_]{6,20}$/;
if (!$(this).val()) {
alertId.html('아이디를 입력해 주세요.');
}else if(dupList.includes(inputId.val())){
alertId.html('이미 사용중인 아이디입니다.');
alertId.show();
return;
}else if(!regular.test(inputId.val())){
alertId.html('아이디는 영문 소문자, 숫자, 밑줄만 사용 가능하며, 6~20자 이내로 입력해주세요.');
alertId.show();
return;
}
break;
case 'pw':
var regular = /^((?=.*[a-zA-Z])(?=.*\d|.*\W)|(?=.*\d)(?=.*\W))[a-zA-Z\d\W]{6,20}$/;
if (!$(this).val()) {
alertId.html('비밀번호를 입력해 주세요.');
}else if(!regular.test(inputId.val())){
alertId.html('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
alertId.show();
return;
}
break;
default:
break;
}
alertId.hide();
if (!$(this).val()) {
alertId.show();
}
})
};
/* ********************************************************
* 사용자 입력값이 입력될 때 alertText 숨기기
******************************************************** */
const fn_alert_hide_selected = () => {
let birthSelected = false;
$("#birthYear").on('change', function() {
if(birthSelected){
$("#brthDeAlert").hide();
}
birthSelected = true;
})
$("#birthMonth").on('change', function() {
if(birthSelected){
$("#brthDeAlert").hide();
}
birthSelected = true;
})
}
/*******************************************************
* 앱 환경을 검증하고 우편번호 버튼 함수를 변경하는 함수
*******************************************************/
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);
// }
}
/*******************************************************
* 우편번호 버튼의 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('우편번호 버튼을 찾을 수 없습니다.');
// }
// }
// 페이지 로드 시 함수 실행
document.addEventListener('DOMContentLoaded', initPostcodeInterface);
</script>
<body>
<%-- 공통 Header --%>
<jsp:include page="/WEB-INF/views/comm/Header.jsp"/>
<!-- 메인 컨텐츠 영역 -->
<main>
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<div class="sub-wrapper">
<div class="sub-content">
<div class="page-title center">
<c:choose>
<c:when test="${integrated}">
<h2 class="page-title__title">GC ONE(통합회원) 가입</h2>
</c:when>
<c:otherwise>
<h2 class="page-title__title">회원가입</h2>
</c:otherwise>
</c:choose>
<div class="ck-content">
<c:out value='${sopmalInfo.joinGuidanceSj}' escapeXml="false"/>
</div>
</div>
<div class="signUp">
<div class="signUp__required"><span class="required-asterisk">*</span> 필수입력사항</div>
<form id="regForm">
<input type="hidden" name="sopmalStplatInnb" value="<c:out value='${resultMap.sopmalStplatInnb}'/>"/>
<input type="hidden" name="stplatDvCds" value="<c:out value='${resultMap.stplatDvCds}'/>"/>
<input type="hidden" name="stplatDvCdAts" value="<c:out value='${resultMap.stplatDvCdAts}'/>"/>
<c:choose>
<c:when test="${integrated}">
<input type="hidden" id="registType" value='GC ONE(통합회원)'>
</c:when>
<c:otherwise>
<input type="hidden" id="registType" value='<c:out value="${sopmalInfo.sopmalNm}"/>'>
</c:otherwise>
</c:choose>
<div class="signUp__inputBox">
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">이름<span class="required-asterisk">*</span></div>
<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="inputWithBtn">
<input type="text" class="input-text full certInp" id="email" title="이메일" placeholder="이메일을 입력해주세요" maxlength="190">
<input type="hidden" name="email" value="">
<button type="button" class="btn md theme outline" id="emailAuthBtn"><spring:message code="button.certificationEmail"/></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="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">05:00</span>
</div>
<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>
</div>
</div>
<div class="signUp__inputBox__item" id="rejoinContainer" style="display: none;">
<div class="signUp__inputBox__itemTitle">가입 계정 정보<span
class="required-asterisk">*</span>
</div>
<p class="textInfo"><i class="icon icon_textInfo--sm"></i> 인증하신 정보로 가입된 계정 정보입니다. 해당
정보로 연동되어 간편 가입이 진행됩니다.
</p>
<table class="table vertical tight">
<caption>해당 테이블에 대한 설명</caption>
<!-- 각 열 width 설정 -->
<colgroup>
<col style="width: 30%;">
<col style="width: auto;">
</colgroup>
<thead>
<tr>
<th style="display:none;">회원 고유번호</th>
<th>가입사이트</th>
<th>가입방식</th>
<th>이메일</th>
</tr>
</thead>
<tbody id="rejoinSelect"></tbody>
</table>
</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">
</div>
</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" name="mbrId" id="mbrId" title="아이디" placeholder="영문 소문자, 숫자, 밑줄(만) 사용 가능, 6~20자" oninput="this.value = this.value.toLowerCase();" onchange="isChkd_Dup = false;" maxlength="20">
<button type="button" class="btn md outline" onclick="fn_check_mbrid();">중복 확인</button>
</div>
<p class="signUp__inputBox__alertText" id="mbrIdAlert">아이디를 입력해 주세요.</p>
</div>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">비밀번호<span class="required-asterisk">*</span></div>
<input type="password" class="input-text full" name="mbrPassword" id="mbrPassword" title="비밀번호" placeholder="영문 대소문자/숫자/특수문자 중 2가지 이상 포함 6~20자" maxlength="20">
<p class="signUp__inputBox__alertText" id="mbrPasswordAlert">비밀번호를 입력해 주세요.</p>
</div>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">비밀번호 확인<span class="required-asterisk">*</span></div>
<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></div>
<div class="inputHalf">
<input type="hidden" name="brthDe">
<div class="select-box" id="birthYear"></div>
<div class="select-box" id="birthMonth"></div>
</div>
<p class="signUp__inputBox__alertText" id="brthDeAlert">생년월을 선택해 주세요.</p>
</div>
<div class="signUp__inputBox__item">
<div class="signUp__inputBox__itemTitle">성별<span class="required-asterisk">*</span></div>
<div class="custom-radio-container">
<div class="custom-radio is-medium">
<input type="radio" id="men" name="sex" value="M">
<label for="men">남자</label>
</div>
<div class="custom-radio is-medium">
<input type="radio" id="women" name="sex" value="F">
<label for="women">여자</label>
</div>
</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>
<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>
<button type="button" id="registBtn" class="btn xl full theme signUp__signUpBtn" onclick="fn_regist_member();"><spring:message code="button.insert"/></button>
</div>
</form>
</div>
</div>
</div>
</main>
<%-- 공통 Footer --%>
<jsp:include page="/WEB-INF/views/comm/Footer.jsp"/>
</body>
</html>