Files
sake/src/main/webapp/WEB-INF/views/sopmal_m/mbr/PosJoinC.jsp
2025-10-29 17:08:05 +09:00

993 lines
31 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 : PosJoinC.jsp
Description : 회원가입(POS)
Modification Information
수정일 수정자 수정내용
------- -------- ---------------------------
2024-12-23 이대환 최초 생성
--%>
<!DOCTYPE html>
<html lang="ko">
<head>
<%-- 공통 include --%>
<jsp:include page="/WEB-INF/views/comm/mobile/Include.jsp"/>
</head>
<script>
$(document).ready(function() {
fn_set_header_title("회원가입");
fn_set_birthYears();
fn_set_birthMonths();
fn_show_phoneAuth();
fn_check_stplat();
fn_fmt_telno($("#mbtlnb"));
first = 0;
$(".userForm__inputBox__alertText").hide();
fn_alert_hide($("#mbrNm"), $("#mbrNmAlert"));
fn_alert_hide($("#mbtlnb"), $("#mbtlnbAlert"));
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();
$('button').on('click', function(e) {
e.preventDefault();
});
$('#regForm').on('keydown', function(e) {
if (e.keyCode == 13) {
e.preventDefault();
}
});
$('#mbrNm').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#phoneAuthBtn').click();
}
});
$('#mbtlnb').on('keydown', function(e) {
if (e.keyCode == 13) {
$('#phoneAuthBtn').click();
}
});
$('#mbtlCert').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_confim_own();
}
});
$('#mbrId').on('keydown', function(e) {
if (e.keyCode == 13) {
fn_check_mbrid();
}
});
/* ********************************************************
* 모달 배경화면 스크롤 방지
******************************************************** */
MicroModal.init({
disableScroll: true,
awaitCloseAnimation: true,
});
/* ********************************************************
* 풀스크린 팝업 이벤트 리스너
******************************************************** */
$('.fullscreen-trigger').on('click', function (e) {
e.preventDefault();
var modalId = $(this).attr('data-micromodal-trigger');
openModal(modalId);
});
$('.microModal .microModal__close').on('click', function () {
var modalId = $(this).closest('.microModal').attr('id');
closeModal(modalId);
});
window.addEventListener('popstate', function (event) {
var modalId = window.location.hash.replace('#', '');
if (modalId) {
closeModal(modalId);
} else {
$('.microModal').each(function () {
MicroModal.close($(this).attr('id'));
});
}
document.body.style.overflow = '';
});
if (window.location.hash) {
var modalId = window.location.hash.replace('#', '');
openModal(modalId);
}
});
/* ********************************************************
* 약관동의 체크
******************************************************** */
const fn_check_stplat = function() {
if(!$('input[name="sopmalStplatInnb"]').val()){
fn_alert_show('약관 동의 처리에 문제가 발생했습니다. 다시 시도해 주세요.', fn_move_mainPage);
return true;
}
}
/* ********************************************************
* domain 넣기
******************************************************** */
const fn_set_domain = function(_value) {
$('#emailSelectBtn').text(_value);
$('.microModal__close').click();
}
/* ********************************************************
* email 합치기
******************************************************** */
const fn_make_email = function() {
let domain = $('input[name="emailSelect"]:checked').val();
let id = $('#id').val().trim();
$('[name=email]').val(domain == '직접입력' ? id : 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]{10,20}$/;
let mbrPassword = $('#mbrPassword');
let mbrPasswordChk = $('#mbrPasswordChk');
let mbrId = $('#mbrId');
if(!regular.test(mbrPassword.val())){
mbrPassword.focus();
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
return;
}
if(!regular.test(mbrPasswordChk.val())){
mbrPasswordChk.focus();
fn_alert_show('비밀번호는 영문 대소문자/숫자/특수문자 중 2가지 이상 조합한 6~20자로 입력해주세요.');
return;
}
if (mbrPassword.val() !== mbrPasswordChk.val()) {
mbrPassword.focus();
fn_alert_show('비밀번호가 일치하지 않습니다.');
return;
}
if (mbrPassword.val() == mbrId.val()) {
mbrPassword.focus();
fn_alert_show('비밀번호는 아이디와 동일할 수 없습니다.');
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() {
const selectYear = '<c:out value="${resultMap.posMbrInfo.birthYear}"/>'
let date = new Date();
let year = date.getFullYear();
let combo = '';
combo ='<select name="brthYear" id="select-brthYear" title="생년">';
combo +=' <option value="" selected disabled>년</option>';
for (let y = year - 14; y >= year - 101; y--) {
if(!fn_is_empty(selectYear) && parseInt(selectYear) === y){
combo +=' <option selected value="' + y + '">' + y + ' 년' + '</option>';
}else{
combo +=' <option value="' + y + '">' + y + ' 년' + '</option>';
}
}
combo +='</select>';
$('#birthYear').html(combo);
$('#select-brthYear').niceSelect();
}
/* ********************************************************
* 생월 콤보박스
******************************************************** */
const fn_set_birthMonths = function() {
const selectMonth = '<c:out value="${resultMap.posMbrInfo.birthMonth}"/>'
let combo = '';
combo ='<select name="brthMonth" id="select-Month" title="생월">';
combo +=' <option value="" selected disabled>월</option>';
for (let m = 1; m < 13; m++) {
if(!fn_is_empty(selectMonth) && parseInt(selectMonth) === m){
combo +=' <option selected value="' + m + '">' + m + ' 월' + '</option>';
}else{
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_timer();
fn_alert_show('인증번호 유효시간이 만료되었습니다.');
}
}
/* ********************************************************
* 휴대폰 인증 번호 발송
******************************************************** */
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,
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
if (first > 0) {
fn_alert_show('인증번호가 재발송되었습니다.');
} else if (first === 0) {
fn_alert_show('인증번호가 발송되었습니다.');
first++;
} else {
return;
}
$('#sndngInnb').val(result.sndngInnb);
}else {
fn_alert_show('인증번호 발송에 실패했습니다.');
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_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 = 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,
success : function (Data) {
let result = JSON.parse(Data.resBody.result);
if(result.result == "success"){
fn_alert_show('인증되었습니다.');
$('#phoneAuthOkBtn').show();
$('#phoneAuthBtn').hide();
isChkd_own = true;
//TODO : 메서드명 변경 필요 탈퇴회원 → 기존가입여부
fn_check_mbrwithdrawal();
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
}else {
fn_alert_show('인증번호가 일치하지 않습니다.');
return;
}
}
});
}
/* ********************************************************
* 기존 가입 여부 조회
******************************************************** */
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,
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;
var sopmalNm = '<c:out value="${ resultMap.sopmalInfo.sopmalNm }"/>';
// $('#rejoinContainer').show();
for (let i = 0; i < _data.length; i++) {
if (_data[i].extrlIntrlckDv != 'pos' || sopmalNm != _data[i].brand) {
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>';
break;
} else {
$('#rejoinContainer').hide();
fn_alert_show('이미 가입된 정보입니다. 고객센터에 문의해 주세요.');
snsMemberCnt = 0;
isExtMember = false;
// window.location.href = '<c:out value="${issuerUri}"/>/index';
// window.location.href = '/login';
}
}
tbodyClone +='<tr style="display:none;"><td><input type="text" name="extMember" value="'+_data[0].mbrInnb+'"/></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();
}
});
// window.location.href = '<c:out value="${issuerUri}"/>/index';
// window.location.href = '/login';
}
if (isExtMember) {
// fn_alert_show('인증되었습니다. 인증하신 정보로 가입된 계정 정보가 있습니다. 계정정보 연동을 진행합니다.');
// $('#mbrNm').attr("readonly", true);
// $('#mbtlnb').attr("readonly", true);
// $('#phoneAuthOkBtn').show();
// $('#phoneAuthBtn').hide();
// isChkd_own = true;
$('#rejoinContainer').hide();
fn_alert_show('이미 가입된 정보입니다. 고객센터에 문의해 주세요.');
snsMemberCnt = 0;
isExtMember = false;
}
}else {
fn_alert_show('인증되었습니다.');
$('#mbrNm').attr("readonly", true);
$('#mbtlnb').attr("readonly", true);
$('#phoneAuthOkBtn').show();
$('#phoneAuthBtn').hide();
isChkd_own = true;
}
}
/* ********************************************************
* 회원 가입
******************************************************** */
const fn_regist_member = function() {
disableButton('#registBtn');
if(fn_check_stplat()) {
fn_regist_fail();
return;
};
if (!isChkd_own) {
$('#mbtlnb').focus();
fn_alert_show('휴대폰 인증을 해주세요.');
fn_regist_fail();
return;
}
// if (!isChkd_Dup) {
// $('#mbrId').focus();
// fn_alert_show('아이디 중복 확인을 해주세요.');
// fn_regist_fail();
// return;
// }
//
// if(!fn_check_password()) {
// fn_regist_fail();
// return;
// }
// if(!fn_check_email()) {
// $('#id').focus();
// fn_alert_show('올바른 이메일 형식이 아닙니다.');
// fn_regist_fail();
// return;
// }
if ($('#select-brthYear').val() == null || $('#select-Month').val() == null) {
document.getElementById('birthYear').scrollIntoView();
fn_alert_show('생년월을 선택해 주세요.');
$("#brthDeAlert").show();
fn_regist_fail();
return;
}
if ($('input[name="sex"]:checked').val() == null) {
$('#men').focus();
fn_alert_show('성별을 선택해 주세요.');
$("#sexAlert").show();
fn_regist_fail();
return;
}
// if ($('#postcode').val().trim() == '' || $('#address').val().trim() == '') {
// document.getElementById('postcodeBtn').scrollIntoView();
// fn_alert_show('우편번호를 선택해 주세요.');
// $("#postcodeAlert").show();
// fn_regist_fail();
// return;
// }
//
// if ($('#dtlAdres').val().trim() == '') {
// $('#dtlAdres').focus();
// fn_alert_show('상세주소를 입력해 주세요.');
// fn_regist_fail();
// return;
// }
if(!confirm('회원가입을 <spring:message code="confirm.common.predicate"/>')){
fn_regist_fail();
return;
}
fn_make_brthDe();
fn_make_mbtlnb();
let params = $('#regForm').serialize();
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/insertUsrJoinRegist"/>',
data : params,
success : function (result) {
let mbrInnb = JSON.parse(result.resBody.result).mbrInnb;
let marketingAgree = JSON.parse(result.resBody.result).marketingAgree;
if (mbrInnb !== null) {
// fn_alert_show($('#registType').val()+'에 가입되었습니다.');
location.replace('/sopmal/mbr/selectPosJoinCompleteR'
+'?storeCode='+'<c:out value='${resultMap.posStoreInfo.posCdDvVal}${resultMap.posStoreInfo.posCdPassivInputVal}'/>'
+(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])(?=.*\d)[a-zA-Z\d_]{6,20}$/;
let mbrid = $('#mbrId').val().trim();
$('#mbrId').val(mbrid);
if(!regular.test(mbrid)) {
fn_alert_show('아이디는 공백없는 영문, 숫자, 밑줄 포함 6~20자 조합만 사용 가능합니다.');
return
}
if(!isChkd_Dup) {
let params = {
'mbrId' : mbrid
};
$.ajax({
type : 'post',
url : '<c:url value="/sopmal/mbr/selectIdDplctCnfirm"/>',
data : params,
success : function(data) {
if (JSON.parse(data.resBody.result).message === 'impossible'){
fn_alert_show('\"' + mbrid + '\" 은 이용중인 아이디 입니다.');
dupList.push(mbrid);
$("#mbrIdAlert").html('이미 사용중인 아이디입니다.');
$("#mbrIdAlert").show();
}
if (JSON.parse(data.resBody.result).message === 'possible'){
isChkd_Dup = true;
fn_alert_show('\"' + mbrid + '\" 은 사용 가능합니다.');
$("#mbrId").attr("readonly", true);
}
}
});
}
}
/* ********************************************************
* 휴대폰 인증 버튼 클릭시, 휴대폰 인증 박스 노출
******************************************************** */
const fn_show_phoneAuth = function() {
let phoneAuthBtn = $('#phoneAuthBtn');
let phoneAuthContent = $('#phoneAuthContent');
phoneAuthContent.hide();
phoneAuthBtn.click(function () {
if(!$('#mbrNm').val()){
$('#mbrNm').focus();
fn_alert_show('이름을 입력해 주세요.');
return;
}else if(!$('#mbtlnb').val()){
$('#mbtlnb').focus();
fn_alert_show('휴대폰 번호를 입력해 주세요.');
return;
}
// $('#phoneAuthContent').show();
// $('#mbtlCert').focus();
// fn_sending_number();
fn_check_mbrwithdrawal()
});
}
/* ********************************************************
* 메인화면 이동(뒤로 가기))
******************************************************** */
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])(?=.*\d)[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]{10,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;
})
}
/* ********************************************************
* alert모달 세팅
******************************************************** */
const fn_alert_show = function(content, redirectUri) {
$('#modal-alert-content').text(content);
openModal('modal-alert');
if(redirectUri){
$(".microModal__btn").on("click", function() {
if (typeof redirectUri == 'function') {
redirectUri();
} else if (typeof redirectUri == 'string') {
window.location.href = redirectUri;
}
});
}
}
</script>
<style>
.content-wrap {
padding-top: 0px;
}
</style>
<body>
<div class="screen-wrap">
<!-- 헤더 영역 -->
<%-- <header class="header header--sub">--%>
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/Header.jsp"/>--%>
<%-- </header>--%>
<!-- 헤더 영역(POS 간편가입 전용) -->
<header>
<div class="header__wrapper">
<div class="header__controls-wrapper">
<div class="header__controls">
<spring:eval expression="@environment.getProperty('sopmalfo.common.fileupload.cdnurl')" var="cdnurl"/>
<img src="${ cdnurl }${ topBarInfo.topbar.topFilCours }/${ topBarInfo.topbar.topSysFilNm }" alt="<c:out value="${sopmallInfo.shopInfo.sopmalNm}"/>">
<b>${resultMap.posStoreInfo.tentcpnNm}</b>
</div>
</div>
</div>
</header>
<!-- 하단 탭바 -->
<%-- <jsp:include page="/WEB-INF/views/comm/mobile/TabBar.jsp"/>--%>
<!-- 메인 컨텐츠 -->
<div class="content-wrap">
<main class="main">
<c:set var="sopmalInfo" value="${resultMap.sopmalInfo}" />
<c:set var="integrated" value="${sopmalInfo.sopmalTyCd == '01'}" />
<c:set var="posMbrInfo" value="${resultMap.posMbrInfo}" />
<div class="sub-page">
<div class="signUp">
<div class="userForm">
<form id="regForm">
<div class="userForm__inputBox">
<h3 class="section-title section-title--border section-title--sm">회원정보 입력
<span class="userForm__required"><span class="required-asterisk">*</span>필수입력사항</span>
</h3>
<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}'/>"/>
<input type="hidden" name="joinMthCd" value='pos'>
<input type="hidden" name="strInnb" value="<c:out value='${resultMap.posStoreInfo.strInnb}'/>"/>
<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="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">이름<span class="required-asterisk">*</span></div>
<input type="text" class="input-text full" name="mbrNm" id="mbrNm" title="이름" placeholder="이름을 입력해 주세요." value="<c:out value='${posMbrInfo.nm}'/>">
<p class="userForm__inputBox__alertText" id="mbrNmAlert">이름을 입력해 주세요.</p>
</div>
<div class="userForm__inputBox__item">
<div class="userForm__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" value="<c:out value='${posMbrInfo.mbtlnb}'/>" ${empty posMbrInfo.mbtlnb ? '' : 'readonly'}>
<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="userForm__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="userForm__inputBox__alertText" id="mbtlCertAlert">인증번호를 입력해 주세요.</p>
</div>
</div>
</div>
<div class="userForm__inputBox__item" id="rejoinContainer" style="display: none;">
<div class="userForm__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="userForm__inputBox__item">
<div class="userForm__inputBox__itemTitle">생년월<span class="required-asterisk">*</span>
<!--<span class="misc">(등록하시면 생일 쿠폰을 드립니다)</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="userForm__inputBox__alertText" id="brthDeAlert">생년월을 선택해 주세요.</p>
</div>
<div class="userForm__inputBox__item">
<div class="userForm__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" <c:if test="${resultMap.posMbrInfo.sex eq 'M'}"> checked </c:if> >
<label for="men">남자</label>
</div>
<div class="custom-radio is-medium">
<input type="radio" id="women" name="sex" value="F" <c:if test="${resultMap.posMbrInfo.sex eq 'F'}"> checked </c:if> >
<label for="women">여자</label>
</div>
</div>
<p class="userForm__inputBox__alertText" id="sexAlert">성별을 선택해 주세요.</p>
</div>
</div>
<div class="bottomBtnControls">
<button id="registBtn" class="btn lg full theme" onclick="fn_regist_member();">회원가입</button>
</div>
</form>
</div>
</div>
</div>
<!-- Top 버튼 -->
<div class="quick-menu__to-top">
<button><i class="icon icon_quick-to-top"></i>
<span class="visually-hidden">위로 가기</span>
</button>
</div>
</main>
</div>
</div>
<!-- 이메일 선택 바텀시트 -->
<div class="microModal microBottomSheet" id="emailSelectPop" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<button class="microModal__close" aria-label="창 닫기" data-micromodal-close></button>
</div>
<div class="microModal__content">
<div class="modalSelect">
<p class="modalSelect__title">이메일 선택</p>
<div class="modalSelect__list">
<c:forEach var="cgn001" items="${resultMap.cgn001}" varStatus="status">
<label class="modalSelect__item">
<input type="radio" name="emailSelect" value="${cgn001.cd != '99' ? '@' : ''}${cgn001.cdNm}" onchange="fn_set_domain(this.value);" ${f:setChecked(cgn001.cd,'99')}>
<span>${cgn001.cdNm}</span>
</label>
</c:forEach>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<%--alert 팝업--%>
<div class="microModal microAlert" id="modal-alert" aria-hidden="true">
<div class="microModal__overlay" tabindex="-1">
<div class="microModal__container" role="dialog" aria-modal="true">
<div class="microModal__body">
<div class="microModal__top">
<h2 class="microModal__title" id="modal-alert-content">Alert 메시지</h2>
</div>
</div>
<div class="microModal__btnContainer">
<button type="button" class="microModal__btn" onclick="closeModal('modal-alert')">
<spring:message code="button.close"/>
</button>
</div>
</div>
</div>
</div>
</body>
</html>