<%@ 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="ui" uri="http://egovframework.gov/ctl/ui"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<script type="text/javascript">
$(document).ready(function(){
	$(document).keypress(function(e) { //엔터키 막기
		if (e.keyCode == 13)
		e.preventDefault();
	});
	
	//이미 주소록 요청한 계정의 경우 요청 영역 삭제
	if("${spamMemberInfoVO.mberEmailAdres}" != ''){
		$(".pay_cont").css("display", "none");
		$(".btnWrap").css("display", "none");
	}
});

	var time = 300; //기준시간 작성
	var min = ""; //분
	var sec = ""; //초
	
	//인증번호 타이머
	function timer(){
		//setInterval(함수, 시간) : 주기적인 실행
		var x = setInterval(function() {
			//parseInt() : 정수를 반환
			min = parseInt(time/60); 
			sec = time%60; //나머지를 계산
		
			document.getElementById("timer").innerHTML = min + ":" + sec ;
			time--;
		
			//타임아웃 시
			if (time < 0) {
				clearInterval(x); //setInterval() 실행을 끝냄
				document.getElementById("timer").innerHTML = "시간초과";
			}
			
		}, 1000);
		
		 if(time != 300){
			time = 300;
			clearInterval(x);
		}
	}

	//인증번호 발송 1분마다 한번씩 보내기
	function sendMsgYn(){
		
		if ($('#moblphonNo').val()==''){
			alert("휴대폰 번호를 입력해주세요.");
			return;
		}
		
		document.spamMberInfoVO.receive.value = $('#moblphonNo').val();
		

		
		var spamMberInfoVO = $("form[name=spamMberInfoVO]").serialize() ;
		$.ajax({
	        url : "<c:url value='/web/user/sendSysMsgSelectAjax.do' />", 
	        type : 'POST', 
	        data : spamMberInfoVO,
	        dataType:'json',
	        success : function(returnData, status){
	        	if(status == "success") {
	        		if(returnData.compare){
	        			sendMsg();
	        		}else{
	        			alert("인증번호 발송은 1분마다 가능합니다.");
	        			return;
	        		}
	          	}else{ alert("실패");return;} 
	        },
	 
	        error : function(request , status, error){
	        	alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
	        }
	    });
	}
	
	//아이디/휴대폰 번호 체크
	function sendMsg(){
		
		document.spamMberInfoVO.callTo.value = $('#moblphonNo').val();
		
		if ($('#moblphonNo').val()==''){
			alert("휴대폰 번호를 입력해주세요.");
			return;
		}
		
		var spamMberInfoVO = $("form[name=spamMberInfoVO]").serialize() ;
		$.ajax({
	        url : "<c:url value='/web/user/sendAddrRequestMsgDataAjax.do' />", 
	        type : 'POST', 
	        data : spamMberInfoVO,
	        dataType:'json',
	        success : function(returnData, status){
	        	if(status == "success") {
	        		alert(returnData.message);
	        		var certCode = returnData.certCode;
	    			if (certCode != "") {
	    				$("#certCode").val(certCode);
	    			}
	        		if(returnData.result == "success") {
	        			timer(); 
	            		$("#requestBtn").html('재전송');
	        		}
	        		
	          	}else{ alert("실패");return;} 
	        },
	 
	        error : function(request , status, error){
	        	alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
	        }
	    });
	}
	
	//인증번호 확인
	function showEmail(){
		//문자인증
		var certCode = $("#certCode").val(); //본인인증으로 전송받은 코드
		var checkNo = $('#checkNo').val(); //입력한 코드
		var moblphonNo= $('#moblphonNo').val(); //핸드폰번호
		
		if(moblphonNo== ''){
			alert("번호를 입력해주세요.");
			return;
		}
		if(checkNo == ''){
			alert("인증번호를 입력해주세요.");
			return;
		}

		if (time < 0) {
			alert("입력시간이 초과되었습니다.");
			return false;
		}
		
		if(certCode == checkNo && checkNo != ""){
			showEmailFrom();
    		$("#baseButtonDiv").css("display", "none");
    		$("#emailButtonDiv").css("display", "");			
		}else{
			alert("인증번호가 일치하지 않습니다.");
		}
		
	}
	
	//인증 후 이메일 입력란 표시
	function showEmailFrom(){
		$("#emailForm").css("display", "");
		$("#smsForm").css("display", "none");
	}
	
	function emailChange(email){
		var emailTxt =  $("input[name=emailAdd]");
		
		if(email.value == '1'){
			$("input[name=emailAdd]").attr('readonly', false);
			emailTxt.val('');
		}else{
			emailTxt.val(email.value);
			$("input[name=emailAdd]").attr('readonly', true);
		}
		
	}
	
	//주소록 요청
	function sendRequest(){
		
		var frm = document.spamMberInfoVO; 
		var email = frm.emailId.value + "@" + frm.emailAdd.value;
		if(email != ''){
			//var exptext = /^[A-Za-z0-9_\.\-]+@[A-Za-z0-9\-]+\.[A-Za-z0-9\-]+/;
			var exptext = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;
			if(exptext.test(email)==false){
				alert("이메일주소 형식이 올바르지 않습니다.");
				return false;
			}	
		}else{
			alert("이메일 주소를 입력해주세요.");
			return false;
		}
		
		frm.mberEmailAdres.value = email;
		
		var param = $("form[name=spamMberInfoVO]").serialize();
		$.ajax({
	        url : "<c:url value='/web/user/login/updateReqeustAddrAjax.do' />", 
	        type : 'POST', 
	        data : param,
	        dataType:'json',
	        success : function(returnData, status){
	        		if(returnData.result == "success") {
	        			alert(returnData.message);
	        			location.href='/'
	        		}else{
	        			alert(returnData.message)
	        		}
	        },
	 
	        error : function(request , status, error){
	        	alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
	        }
	    });
		
	}
</script>
<style type="text/css">
.skip_menu, .quickMenu, .header, .footer {display:none !important;}
#container {padding-top:50px;}
#container .inner {padding-bottom:50px;}
.restriction {width:845px;margin:0 auto;}
.restriction .info {padding:142px 0 28px;letter-spacing:-0.025em;text-align:center;border:3px solid #ddd;background:url(/publish/images/content/icon_restricition.png) no-repeat center 33px;border-radius:10px;}
.restriction .info h2 {font-size:22px;font-weight:500;color:#222;}
.restriction .info p {margin:16px 0 0;font-size:18px;line-height:26px;}
.restriction .info p strong {font-weight:700;color:#e40000;}
.restriction .info a {display:inline-block;width:200px;height:40px;margin:22px 0 0;font-size:17px;line-height:38px;text-align:center;color:#002c9d;border:1px solid #002c9d;background:#fff;border-radius:5px;}

.input_list .input_list_item {padding:15px 35px;border-radius:5px 5px 0 0;}
.input_list .input_list_item .input_left {width:100%;}
.input_list .input_list_item .input_left:after {display:none;}
.input_list .input_list_item .input_left strong {font-weight:500;color:#e40000;}
.input_list.listType2 .input_list_item2.number .input_right_id {width:240px;}
.input_list.listType2 .input_list_item2.content {display:block;height:auto;}
.input_list.listType2 .input_list_item2.content .input_right {margin:0 0 25px;padding:12px 26px 11px;line-height:26px;background:#f2f2f2;border-radius:5px;}
.input_list.listType2 .invoice {padding:0 35px 35px 35px;}
.input_list.listType2 .invoice_wrap .noti {margin:23px 0 0;font-size:18px;text-align:center;}
.input_list.listType2 .invoice_wrap .noti strong {font-weight:500;color:#e40000;}

.tType1_title {height:auto;}
.tType1_title span {display:block;margin:12px 0;font-size:16px;font-weight:300;}
.mypage_content .tType1 tbody > tr > th {height:55px;padding-top:0;}
.mypage_content .tType1 tbody > tr > td .btnType {width:130px;height:40px;margin:0 0 0 5px;font-size:16px;text-align:center;color:#222;border:1px solid #b1c6ee;background:#e8f0ff;border-radius:5px;}
.mypage_content .tType1 tbody > tr > td .certified {overflow:hidden;}
.mypage_content .tType1 tbody > tr > td .certified input {float:left;width:180px;padding-right:60px;}
.mypage_content .tType1 tbody > tr > td .certified .time {float:left;margin:0 0 0 -70px;font-size:16px;font-weight:300;line-height:38px;color:#a6a6a6;}
.mypage_content .tType1 tbody > tr > td .certified .text {float:left;margin:0 0 0 16px;font-size:14px;font-weight:300;line-height:20px;color:#666;}
.mypage_content .tType1 tbody > tr > td .email_wrap {background-color: transparent; padding: 0; position: relative;}
.mypage_content .tType1 tbody > tr > td .email_wrap>div {width: calc(100% - 195px); padding:0 30px 2px 26px; border-radius: 5px; background-color: #f2f3f4; display: flex; box-sizing: border-box;}
.mypage_content .tType1 tbody > tr > td .email_wrap input[type="text"].list_inputType1 {background-color: transparent; width: 100%; padding: 0 10px; font-weight: 300; font-size: 18px; text-align: left;}
.mypage_content .tType1 tbody > tr > td .email_wrap input[type="text"].list_inputType1:nth-child(2) {padding: 0;}
.mypage_content .tType1 tbody > tr > td .email_wrap input[type="text"].list_inputType1::placeholder {color: #222;}
.mypage_content .tType1 tbody > tr > td .email_wrap .email {display: flex;}
.mypage_content .tType1 tbody > tr > td .email_wrap .email > span {margin:0 10px;line-height:40px;}
.mypage_content .tType1 tbody > tr > td .email_wrap .email_select {position: absolute; right: 0; top: 0; background-color: #f2f3f4; width: 185px; height: 40px; border-radius: 5px;padding:0;}
.mypage_content .tType1 tbody > tr > td .email_wrap .email_select select {width: 100%; height: 100%; background-position: right 25px top 50%;}
.mypage_content .tType1 tbody > tr > td .noti {margin:5px 0 0;font-size:14px;font-weight:300;color:#666;}

.center_btn_wrap .btnType {width:auto;padding:0 39px;}
</style>
<div class="inner">
	<!-- send top -->
	<div class="send_top">
		<form id="spamMberInfoVO" name="spamMberInfoVO" action="/web/user/login/loginRestrictionUse.do" method="post" >
		<input type="hidden" name="receive" id="receive" value=""/>
		<input type="hidden" name="callTo" id="callTo" value=""/>
		<input type="hidden" name="certCode" id="certCode" value=""/>
		<input type="hidden" name="mberId" value="${spamMemberInfoVO.mberId}"/>
		<input type="hidden" name="smiId" value="${spamMemberInfoVO.smiId}"/>
		<input type="hidden" name="mberEmailAdres" value=""/>
			<div class="mypage_content current">
				<div class="restriction">
					<div class="info">
						<h2>회원님의 아이디는 이용이 제한 되었습니다.</h2>
						<p>정보통신망법 제 50조 위반하는 <strong>스팸(게임, 대출, 유흥, 성인 등)</strong> 관련문자 발송내역이<br>확인되어 서비스 이용약관 제2장 제9조에 의거 <strong>회원님의 아이디 이용이 정지</strong>되었음을 알려드립니다.</p>
						<a href="https://law.go.kr/LSW/lsSc.do?section=&menuId=1&subMenuId=15&tabMenuId=81&eventGubun=060101&query=%EC%A0%95%EB%B3%B4%ED%86%B5%EC%8B%A0%EB%A7%9D%EB%B2%95#undefined
						" target="_blank">관련법령보기</a>
					</div>
					
					<!-- 관리자가 문자 상세에서 이용정지 처리 시 내용(문자 내용 안내) -->
					<c:if test="${not empty spamMemberInfoVO.msgGroupId}">
					<div class="input_list listType2">
						<div class="input_list_item">
							<div class="input_left">회원님의 아이디로 발송된 <strong>정보통신망법 제50조 위반</strong> 문자내용</div>
						</div>
						<div class="invoice">
							<div class="invoice_wrap">
								<div class="input_list_item2 number">
									<div class="input_left">아이디</div>
									<div class="input_right input_right_id">${spamMemberInfoVO.mberId }</div>
									<div class="input_left">발송일시</div>
									<div class="input_right">${spamMemberInfoVO.reqDate }</div>
								</div>
								<div class="input_list_item2 number">
									<div class="input_left">발송건수</div>
									<div class="input_right">${spamMemberInfoVO.msgGroupCnt}건</div>
								</div>
								<div class="input_list_item2 content">
									<div class="input_left">발송내용</div>
									<div class="input_right">${spamMemberInfoVO.smsTxt}
										<c:if test="${spamMemberInfoVO.fileCnt != '0'}">
											<c:if test="${not empty spamMemberInfoVO.filePath1}">
											<li>
												<center>
													<img src="<c:url value='/cmm/fms/getImage2.do'/>?atchFileId=<c:out value="${atchFileId1}"/>&fileSn=<c:out value="${fileSn1}"/>" alt="발송된 그림문자 미리보기" >
												</center>
											</li>
											</c:if>
											<c:if test="${not empty spamMemberInfoVO.filePath2}">
											<li>
												<center>
													<img src="<c:url value='/cmm/fms/getImage2.do'/>?atchFileId=<c:out value="${atchFileId2}"/>&fileSn=<c:out value="${fileSn2}"/>" alt="발송된 그림문자 미리보기" >
												</center>
											</li>
											</c:if>
											<c:if test="${not empty spamMemberInfoVO.filePath3}">
											<li>
												<center>
													<img src="<c:url value='/cmm/fms/getImage2.do'/>?atchFileId=<c:out value="${atchFileId3}"/>&fileSn=<c:out value="${fileSn3}"/>" alt="발송된 그림문자 미리보기">
												</center>
											</li>
											</c:if>
										</c:if>	
									</div>

								</div>
								<div class="noti">회원가입 시 동의하신 <strong>스팸 관련 규약 사항에 따라 잔액은 환불이 불가</strong>합니다.</div>
							</div>
						</div>
					</div>
					</c:if>
					
					<!-- 관리자가 사용자 상세에서 이용정지 처리 시 내용(관리자가 작성한 사유 안내) -->
					<c:if test="${not empty spamMemberInfoVO.smiMemo}">
					<div class="input_list listType2">
						<div class="input_list_item">
						</div>
						<div class="invoice">
							<div class="invoice_wrap">
								<div class="input_list_item2 number">
									<div class="input_left">아이디</div>
									<div class="input_right input_right_id">${spamMemberInfoVO.mberId }</div>
								</div>
								<div class="input_list_item2 number" style="height:auto;min-height:60px;">
									<div class="input_left">사유</div>
									<div class="input_right input_right_id" style="padding:14px 0;align-items:center;line-height:30px;word-break:break-all; width:100%">${spamMemberInfoVO.smiMemo}</div>
								</div>
								<div class="noti">회원가입 시 동의하신 <strong>스팸 관련 규약 사항에 따라 잔액은 환불이 불가</strong>합니다.</div>
							</div>
						</div>
					</div>
					</c:if>
					
					<div class="pay_cont current">
						<div id="smsForm">
							<p class="tType1_title">아이디에 등록된 주소록 요청<span>주수록 요청 시 개인정보보호를 위해 휴대폰 인증을 진행해 주시기 바랍니다.</span></p>
							<table class="tType1">
								<caption>휴대폰번호 인증을 위한 표</caption>
								<colgroup>
									<col style="width: 160px;">
									<col style="width: auto;">
								</colgroup>
								<tbody>
									<tr>
										<th scope="row">휴대폰번호</th>
										<td><input type="text" name="moblphonNo" id="moblphonNo" placeholder="숫자만 입력해주세요" maxlength="12" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');"/><button type="button" id="requestBtn" class="btnType" onclick="sendMsgYn()">인증번호 요청</button></td>
									</tr>
									<tr>
										<th scope="row">인증번호</th>
										<td>
											<div class="certified">
												<input type="text" name="checkNo" id="checkNo" maxlength="5" />
												<span class="time" id="timer"></span>
												<span class="text">* 입력시간 내 인증번호(5자리)를 입력해 주세요.<br>* 인증번호가 도착하지 않을 경우 인증번호 재전송을 눌러주세요.</span>
											</div>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
						<div id="emailForm" style="display:none;">
							<p class="tType1_title">아이디에 등록된 주소록 요청<span>주소록을 받으실 이메일 주소를 입력해주세요.</span></p>
							<table class="tType1">
								<caption>이메일 주소 입력을 위한 표</caption>
								<colgroup>
									<col style="width: 160px;">
									<col style="width: auto;">
								</colgroup>
								<tbody>
									<tr>
										<th scope="row">이메일 주소</th>
										<td>
											<div class="email_wrap">
												<div class="email">
													<label for="" class="label">이메일 주소 앞자리</label>
													<input type="text" class="list_inputType1" id="emailId" name="emailId" value="" maxlength="50">
													<span>@</span>
													<label for="" class="label">이메일 주소 뒷자리</label>
													<input type="text" class="list_inputType1" id="emailAdd" name="emailAdd" value="">
												</div>
												<div class="email_select">
													<label for="selectEmail" class="label">이메일 선택</label>
													<select class="list_selType1" id="selectEmail" onchange="emailChange(this)">
														<option value="1">직접입력</option>
														<option value="naver.com">네이버</option>
														<option value="nate.com">네이트</option>
														<option value="daum.net">다음</option>
														<option value="hanmail.net">한메일</option>
														<option value="gmail.com">지메일</option>
													</select>
												</div>
											</div>
											<div class="noti">* 회원 ID에 등록된 주소록 전달은 영업일 기준 1~3일 소요됩니다.</div>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="btnWrap center_btn_wrap">
						<div id="baseButtonDiv">
							<button type="button" class="btnType btnType16" onclick="showEmail(); return false;">인증</button>
							<button type="button" class="btnType btnType17" onclick="location.href='/'">취소</button>
						</div>
						<div id="emailButtonDiv" style="display:none;">
						<button ty	pe="button" class="btnType btnType16" onclick="sendRequest(); return false;">등록된 주소록 요청</button>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
	<!--// send top --> 
</div>