<%@ 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 prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="ec" uri="/WEB-INF/tld/ecnet_tld.tld"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<script src="https://t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
<script language=javascript>
$(document).ready(function(){
	$("#exPassword").keydown(function(key) {
		if (key.keyCode == 13) { // 엔터키가 눌렸을 때
			selectInputPwAjax()
		} 
	});
	
	// 기본정보 정보 이메일 주소 선택
	$("#selectEmail").on("change",function(){
		$("#emailAdd").val($(this).val());
	});
	
});

function membershipChangePage(){
	document.updateUserInfoForm.action = '/web/user/membershipChange.do';
	document.updateUserInfoForm.submit();
}

//현재 비밀번호 입력 후 맞는지 조회
function selectInputPwAjax(){
	
	if($("#exPassword").val() == ""){
		alert("비밀번호를 입력해 주세요.");
		return false;
	}
	
	var form = document.selectPasswordCheckForm;
	form.password.value = $("#exPassword").val();
	var data = new FormData(form);
	$.ajax({
		cache : false
		,url : "<c:url value='/web/user/selectPasswordCheckAjax.do'/>"
		,async:false
		,type : 'POST'
		,data : data
		,dataType:'json'
		,processData: false
		,contentType: false
		,success : function(returnData, status){
			if(returnData.result == "success") {
				if(returnData.pwCheck == "1"){
					$("#passwordCheckPage").css("display", "none");
					$("#userInfoPage").css("display", "block");
					
					$("#tr_cert").val(returnData.certVO.tr_cert);
					$("#tr_url").val(returnData.certVO.tr_url);
					$("#tr_add").val(returnData.certVO.tr_add);
					
				}else{
					$(".pass_no").css("display", "block");
					$('#exPassword').val("");
					$('#exPassword').focus();
				}
			} else{ 
				alert(returnData.message);
				return;
			}
		}
		,error : function(request , status, error){
			alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
		}
	});
}

//서류등록 [시작]--------------------------------------------------------------------------------------------
function selectAddFile(id){
	$('#'+id).click();
}

//첨부파일 등록
var _fileIdx = 0;
var _fileForm2 = new Array();

function tempFile(files){
	var fd = new FormData();
	fd.append('file', files[0]);
	var tmpObj = new Object();
	tmpObj.name = "file_" + _fileIdx;
	tmpObj.fileObj = files[0];
	_fileForm2.push(tmpObj);
	tempFileInfo(files[0]);
	_fileIdx++;
}

function tempFileInfo(fileObj){
	$("#fileInfo").val(fileObj.name);
}
//서류등록 [끝]--------------------------------------------------------------------------------------------

//휴대푠 번호 등록 [시작]--------------------------------------------------------------------------------------------
window.name = "kmcis_web_sample";

var KMCIS_window;

 function openKMCISWindow(){ 
 //본인인증시도 로그 
 certAccessLog();
	var UserAgent = navigator.userAgent;
	/* 모바일 접근 체크*/
	// 모바일일 경우 (변동사항 있을경우 추가 필요)
	if (UserAgent.match(/iPhone|iPod|Android|Windows CE|BlackBerry|Symbian|Windows Phone|webOS|Opera Mini|Opera Mobi|POLARIS|IEMobile|lgtelecom|nokia|SonyEricsson/i) != null || UserAgent.match(/LG|SAMSUNG|Samsung/) != null) {
		document.reqKMCISForm.target = 'KMCISWindow';  // 모바일
	} else { // 모바일이 아닐 경우
		KMCIS_window = window.open('', 'KMCISWindow', 'width=425, height=550, resizable=0, scrollbars=no, status=0, titlebar=0, toolbar=0, left=435, top=250' );
	
		if(KMCIS_window == null){
			alert(" ※ 윈도우 XP SP2 또는 인터넷 익스플로러 7 사용자일 경우에는 \n    화면 상단에 있는 팝업 차단 알림줄을 클릭하여 팝업을 허용해 주시기 바랍니다. \n\n※ MSN,야후,구글 팝업 차단 툴바가 설치된 경우 팝업허용을 해주시기 바랍니다.");
		}
	
		document.reqKMCISForm.target = 'KMCISWindow';
	}
	
	document.reqKMCISForm.action = 'https://www.kmcert.com/kmcis/web/kmcisReq.jsp';
	document.reqKMCISForm.submit();
}
//휴대푠 번호 등록 [끝]--------------------------------------------------------------------------------------------


//회원정보 변경
function updateUserInfo(){
	//전화번호 양식 체크
	var regExp = /^(01[016789]{1}|02|0[3-9]{1}[0-9]{1})-?[0-9]{3,4}-?[0-9]{4}$/;
	
	if($("#agree1_1").is(":checked")){
		$("#receiveMsg").val("Y");
	}else{
		$("#receiveMsg").val("N");
	}
	
	if($("#agree1_2").is(":checked")){
		$("#receiveKakao").val("Y");
	}else{
		$("#receiveKakao").val("N");
	}
	
	if($("#agree1_3").is(":checked")){
		$("#receivemail").val("Y");
	}else{
		$("#receivemail").val("N");
	}
	
	if($("#emailId").val().trim() == "" || $("#emailAdd").val().trim() == ""){
		alert("이메일은 필수 입력 항목입니다.")
		return false;
	}else {
		var email = $("#emailId").val() + "@" + $("#emailAdd").val();
		var taxExptext =  /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;
		if(taxExptext.test(email)==false){
			alert("이메일주소 형식이 올바르지 않습니다.");
			return false;
		}
		$("#mberEmailAdres").val(email);
	}
	
	if("${userInfo.moblphonNo}" != $("#moblphonNo").val()){
		if($("#moblphonNoChangeYn").val() == 'N'){
			alert("휴대폰 변경은 본인인증 후 가능합니다.");
			return false;
		}
	}
	
	var form = document.updateUserInfoForm;
	var data = new FormData(form);
	_fileForm2.forEach(function(obj, idx) {
		if (obj) data.append("file"+idx, obj.fileObj);
	});
	
	$.ajax({
		type : 'POST'
		, enctype : 'multipart/form-data'
		, url : "<c:url value='/web/user/updateUserInfoAjax.do'/>"
		, data : data
		, dataType:'json'
		, async:false
		, processData: false
		, contentType: false
		, cache : false
		, success : function(returnData, status){
			if(returnData.result == "success") {
				alert("회원정보가  정상적으로 변경되었습니다.");
			} else{ 
				alert(returnData.message);
				return;
			}
		}
		,error : function(request , status, error){
// 			alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
// 			alert("입력한 정보를 다시 확인해 주세요");
		}
	});
}

</script>
<div class="inner">
	<!-- send top -->
	<div class="send_top">
		<!-- tab button -->
		<%@include file="/WEB-INF/jsp/web/user/mypageHeader.jsp" %>
		<!--// tab button -->
		<!-- 마이페이지 - 비밀번호 확인 -->
		<form id="selectPasswordCheckForm" name="selectPasswordCheckForm" method="post">
			<input type="hidden" name="password" id="password">
			<input type="hidden" name="userTy" id="userTy" value="userInfoCh">
		</form>
		
		<!-- phone 본인인증 Form -->
		<form name="reqKMCISForm" method="post" action="#">
			<input type="hidden" name="tr_cert" id="tr_cert" value="">
			<input type="hidden" name="tr_url"   id="tr_url" value="">
			<input type="hidden" name="tr_add"  id="tr_add" value="">
			<input type="hidden" name="tr_ver"      value = "V2">
		</form>
		
		<!-- 마이페이지 - 회원정보 변경 -->
		<form id="updateUserInfoForm" name="updateUserInfoForm" method="post">
			<input type="hidden" name="dept" id="dept" value="<c:out value="${userInfo.dept}"/>">
			<input type="hidden" name="mberId" id="mberId" value="<c:out value="${userInfo.mberId}"/>">
			<input type="hidden" name="moblphonNoChangeYn" id="moblphonNoChangeYn" value="N">
			<input type="hidden" name="mblDn" id="mblDn" value="">
			<input type="hidden" name="mberEmailAdres" id="mberEmailAdres">
			
			<input type="hidden" name="receiveMsg" id="receiveMsg">		<!-- 마케팅 수신동의 - 휴대폰 -->
			<input type="hidden" name="receiveKakao" id="receiveKakao">	<!-- 마케팅 수신동의 - 카카오 -->
			<input type="hidden" name="receivemail" id="receivemail">	<!-- 마케팅 수신동의 - 이메일 -->
			
			<input type="hidden" name="atchFileId" id="atchFileId" />
			
			<input type="hidden" name="taxMngEmail" id="taxMngEmail" />
			
			<!-- 마이페이지 - 회원정보 변경 -->
			<div class="mypage_content current" id="tab5_1">
			
			
				<div id="passwordCheckPage" style="display: block;">
					<!-- 비밀번호 확인 -->
					<div class="heading">
						<h2>비밀번호 확인</h2>
					</div>
					<div class="mem_cont_in widthS">
						<div class="input_list">
							<p class="list_title2">비밀번호 확인 후 이용 가능한 페이지 입니다.</p>
							<div class="input_list_item colorW">
								<div class="input_left">아이디</div>
								<div class="input_right">
									<label for="" class="label">아이디</label>
									<input type="text" class="list_inputType1" value='<c:out value="${userInfo.mberId}"/>' readonly>
								</div>
							</div>
							<div class="input_list_item">
								<div class="input_left">비밀번호</div>
								<div class="input_right">
									<label for="" class="label">비밀번호 입력</label>
									<input type="password" class="list_inputType1" id="exPassword" name="exPassword">
								</div>
								<div class="list_alert pass_no" style="display: none;">
									<i></i> <span>비밀번호가 일치하지 않습니다.</span>
								</div>
							</div>
							<div class="mem_btnWrap2">
								<button type="button" class="mem_btn3" onclick="selectInputPwAjax()">확인</button>
							</div>
							<p class="reqTxt4">
								- 외부로부터 고객님의 정보를 안전하게 보호하기 위해 비밀번호를 다시 확인하고 있습니다.<br> -
								비밀번호는 5회 이상 틀릴 경우 자동 로그아웃 됩니다.(영문, 숫자, 특수기호 조합 8자 이상)
							</p>
						</div>
						<!--// 기본정보 -->
					</div>
					<!--// 비밀번호 확인 -->
				</div>
				
				
				<div id="userInfoPage" style="display: none;">
					<!-- 회원정보 변경 -->
					<div class="heading">
						<h2>회원정보 변경</h2>
					</div>
					<div class="mem_cont_in">
						<div class="text_top">
							<p>
								회원님의 정보를 <span>확인</span> 및 <span>변경</span>하실 수 있습니다.
							</p>
						</div>
						<div class="input_wrap">
							<!-- 기본정보 -->
							<div class="input_list">
								<p class="list_title">기본정보</p>
								<div class="input_list_item colorW">
									<div class="input_left">아이디</div>
									<div class="input_right">
										<label for="" class="label">아이디</label>
										<input type="text" class="list_inputType1" value="<c:out value="${userInfo.mberId}"/>" readonly>
									</div>
								</div>
								<div class="input_list_item colorW">
									<div class="input_left">이름</div>
									<div class="input_right">
										<label for="" class="label">이름</label>
										<input type="text" class="list_inputType1" name="mberNm" id="mberNm" value="<c:out value="${userInfo.mberNm}"/>" value="<c:out value="${userInfo.mberNm}"/>" readonly>
									</div>
								</div>
								<div class="input_list_item colorW input_list_phone">
									<div class="input_left">휴대폰번호</div>
									<div class="input_right">
										<label for="" class="label">휴대폰번호</label>
										<input type="text" class="list_inputType1" name="moblphonNo" id="moblphonNo" value="<c:out value="${userInfo.moblphonNo}"/>" readonly>
										<div class="list_btn_wrap">
											<span><span class="vMiddle">*</span>본인 명의 휴대폰으로만 변경 가능</span>
											<button type="button" onclick="openKMCISWindow()">휴대폰 변경</button>
										</div>
									</div>
								</div>
								<div class="input_list_item emailWrap">
									<div>
										<div class="input_left">이메일</div>
										<div class="input_right">
											<div class="email">
												<label for="" class="label">이메일 주소 앞자리</label>
												<input type="text" class="list_inputType1" maxlength="30" id="emailId" value="${fn:substringBefore(userInfo.mberEmailAdres, '@') }" maxlength="50">
												<span>@</span>
												<label for="" class="label">이메일 주소 뒷자리</label>
												<input type="text" class="list_inputType1" maxlength="15" id="emailAdd" value="${fn:substringAfter(userInfo.mberEmailAdres, '@') }">
											</div>
											<div class="email_select">
												<label for="selectEmail" class="label">이메일 선택</label>
												<select class="list_selType1" id="selectEmail" >
													<c:forEach var="result" items="${emailCode}" varStatus="status">
														<c:if test="${status.index eq 0 }">
															<option value="1">${result.codeNm}</option>
														</c:if>
														<c:if test="${status.index ne 0 }">
															<option value="${result.codeDc}">${result.codeNm}</option>
														</c:if>
													</c:forEach>
												</select>
											</div>
										</div>
									</div>
								</div>
								<div class="input_list_item send_agree">
									<div class="input_left">마케팅 수신 동의</div>
									<div class="input_right">
										<div>
											<div class="checkbox_wrap">
												<input type="checkbox" id="agree1_1" title="회원가입 전체약관에 동의" class="joinCheckbox type3" <c:if test="${userInfo.receiveMsg eq 'Y'}">checked="checked"</c:if>>
												<label for="agree1_1">휴대폰</label>
											</div>
										</div>
										<div>
											<div class="checkbox_wrap">
												<input type="checkbox" id="agree1_2" title="회원가입 전체약관에 동의" class="joinCheckbox type3" <c:if test="${userInfo.receiveKakao eq 'Y'}">checked="checked"</c:if>>
												<label for="agree1_2">카카오</label>
											</div>
										</div>
										<div>
											<div class="checkbox_wrap">
												<input type="checkbox" id="agree1_3" title="회원가입 전체약관에 동의" class="joinCheckbox type3"  <c:if test="${userInfo.receivemail eq 'Y'}">checked="checked"</c:if>>
												<label for="agree1_3">이메일</label>
											</div>
										</div>
										<div class="list_alert reqest_text">
											<span style="line-height:1.2;">수신동의 시 각종 혜택 및</br> 이벤트 정보를 받아보실 수 있습니다.</span>
										</div>
									</div>
								</div>
								<p class="poe_noti">이메일 및 마케팅 수신 동의 변경은 심사 없이 바로 적용 가능합니다.</p>
								<div class="mem_btnWrap2">
									<button type="button" class="mem_btn4"onclick="membershipChangePage()" >기업회원 전환</button>
									<button type="button" class="mem_btn3" onclick="updateUserInfo()" >변경</button>  <!-- 개인회원은 바로 변경 -->
								</div>
							</div>
							<!--// 기본정보 -->
						</div>
						<!--// 회원정보 변경 -->
					</div>
				</div>
			</div>
			<!--// 마이페이지 - 회원정보 변경 -->
		</form>
	</div>
	<!--// send top -->
</div>
<!--// content 영역 -->
