<%--
  Class Name : RefundDetail.jsp
  Description : Refund 상세 페이지
  Modification Information

      수정일         수정자                   수정내용
    -------    --------    ---------------------------
     2021.06.10    이준호          최초 생성

    author   : 이준호
    since    : 2021.06.10

--%>
<%@ page contentType="text/html; charset=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="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="ec" uri="/WEB-INF/tld/ecnet_tld.tld"%>
<!DOCTYPE html>
<html lang="ko">
<head>
<title>환불요청 상세</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">

<script type="text/javascript" src="<c:url value='/js/web_common.js' />"></script>
	<script type="text/javascript" src="<c:url value='/js/EgovMultiFile.js'/>"></script>
<script type="text/javascript" src="<c:url value='/js/EgovCalPopup.js'/>"></script>
<script type="text/javaScript" language="javascript">
$(document).ready(function(){

	fn_timeInit();
	
    $('#showMask').click(function(e){
        // preventDefault는 href의 링크 기본 행동을 막는 기능입니다.
        e.preventDefault();
        // 화면의 높이와 너비를 변수로 만듭니다.
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        // 마스크의 높이와 너비를 화면의 높이와 너비 변수로 설정합니다.
        $('.mask').css({'width':maskWidth,'height':maskHeight});

        // fade 애니메이션 : 1초 동안 검게 됐다가 80%의 불투명으로 변합니다.
        $('.mask').fadeIn(1000);
        $('.mask').fadeTo("slow",0.8);

        // 레이어 팝업을 가운데로 띄우기 위해 화면의 높이와 너비의 가운데 값과 스크롤 값을 더하여 변수로 만듭니다.
        var left = ( $(window).scrollLeft() + ( $(window).width() - $('.window').width()) / 2 );
        var top = ( $(window).scrollTop() + ( $(window).height() - $('.window').height()) / 2 );

        // css 스타일을 변경합니다.
        $('.window').css({'left':left,'top':top, 'position':'absolute'});

        // 레이어 팝업을 띄웁니다.
        $('.window').show();
    });
    


    // 닫기(close)를 눌렀을 때 작동합니다.
    $('.window .close').click(function (e) {
        e.preventDefault();
        $('.mask, .window').hide();
        $("input[name=emplyrId]").val("");
    });

    
});



function fn_timeInit(){
	
	var today = new Date();   

	// 현재 시-분
	var hours 	= String(today.getHours()); // 시
	var minutes = String(today.getMinutes());  // 분

	if(hours.length === 1) hours = '0' + hours;
	if(minutes.length === 1) minutes = '0' + minutes; 
	
	$('#hourId').val(hours).prop("selected", true);
	$('#minId').val(minutes).prop("selected", true);

	// 현재 년-월-일
	var year = today.getFullYear();
	var month = ('0' + (today.getMonth() + 1)).slice(-2);
	var day = ('0' + today.getDate()).slice(-2);

	var dateString = year + '-' + month  + '-' + day;

	$('#ntceEnddeYYYMMDD').val(dateString);
}

function fn_refundIdChk(){
	
	$.ajax({
		type:"POST",
		url:"<c:url value='/uss/ion/pay/cancelRegistIdChkAjax.do' />",
		data:{
			"checkId": $("#checkIdModal").val()			
		},
		dataType:'json',
		timeout:(1000*30),
		success:function(data){
			
			console.log('data ', data);
			if(data.message != null)
			{
				alert(data.message);
				return false;
			}
			else
			{
				
				fn_timeInit();
				var refundVO = data.refundVO;

				$('#mberIdTxt').text(refundVO.mberId);
				$('#mberId').val(refundVO.mberId);
				
// 				$('#searchKeyword').val(refundVO.mberId);
				$('#mberNmTxt').text(refundVO.mberNm);
				$('#mberPhoneNoTxt').text(refundVO.mberPhoneNo);
				$('#mberMoneyTxt').text(fn_unitChanges(refundVO.mberMoney));
				$('#mberPointTxt').text(fn_unitChanges(refundVO.mberPoint));
				
				$('.mask, .window').hide();
// 				listLoad('1', refundVO.mberId);
				listLoad('1');
			}
			
		},
		error:function(request , status, error){
			console.log(' error ?');
			console.log('request : ', request);
			console.log('status : ', status);
		}
	});
}

function fn_unitChanges(data){
	return data.toString()
	  .replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
}


function linkPage(pageNo){
	listLoad(pageNo)
}

function listLoad(pageNo){
	document.ajaxForm.pageIndex.value = pageNo;
// 	document.ajaxForm.mberId.value = mberId;
	var sendData = $(document.ajaxForm).serializeArray();
	var listAjaxUrl = "/uss/ion/pay/refundDetailPayListAjax.do";
	$("#PayListLoad").load(listAjaxUrl, sendData ,function(response, status, xhr){
	});
}

function fn_insertPayCan(){


	var canDate = $('#ntceEnddeYYYMMDD').val() + ' ' +$('#hourId').val()+ ':' +$('#minId').val()	
	
	document.insertForm.payCanReqDate.value = canDate;
	document.insertForm.mberId.value = $('#mberIdTxt').text();
	document.insertForm.mberNm.value = $('#mberNmTxt').text();
	document.insertForm.refundReasonEtc.value = $('#canTextId').val();
	
	var data = new FormData(document.insertForm);
	
	$.ajax({
        type: "POST"
		, url:"<c:url value='/uss/ion/pay/insertPayCanAjax.do' />"
        , data: data
        , dataType:'json'
        , async: false
        , processData: false
        , contentType: false
        , cache: false
        , success: function (data) {
        	console.log('data : ', data);
    		if(confirm("저장 되었습니다. \n작성한 글의 상세페이지로 이동하시겠습니까?"))
    			fn_goDetail(data.message);
    		else
    			fn_goList();
        	
        	
		}
        ,error: function (e) { 
        	alert("저장에 실패하였습니다."); 
        	console.log("ERROR : ", e); 
        }
    });
	
}

function fn_goList(){
	
	var form = document.writeForm ;
	form.action = "<c:url value='/uss/ion/pay/RefundList.do' />";
	form.submit();
	
}

function fn_goDetail(refundId){
	
	var form = document.writeForm;
	form.refundId.value = refundId;
	form.action = "/uss/ion/pay/cancelDetail.do";
	form.submit();
	
}


</script>

<style>
.calBtn {
    border: none;
    background-color: transparent !important;
    background-image: url(/pb/img/common/calendarIcon.png);
    background-repeat: no-repeat;
    width: 25px;
    height: 25px !important;
    vertical-align: middle;
    margin-left: -38px !important;
    margin-top: -2px !important;
    cursor: pointer;
}
</style>
</head>
<body>
<form name="writeForm" method="post">
	
	<input type="hidden" name="refundId" value=""/>
	<input type="hidden" name="searchCondition" value="<c:out value='${refundVO.searchCondition }'/>"/>
	<input type="hidden" name="searchCondition2" value="<c:out value='${refundVO.searchCondition2 }'/>"/>
	<input type="hidden" name="pageIndex" value="<c:out value='${refundVO.pageIndex}'/>"/>
	<input type="hidden" name="searchSortCnd" value="<c:out value="${refundVO.searchSortCnd}" />" />
	<input type="hidden" name="searchSortOrd" value="<c:out value="${refundVO.searchSortOrd}" />" />
	<input type="hidden" name="searchKeyword" value="<c:out value="${refundVO.searchKeyword}" />" />
	<div class="contWrap">
		<div class="pageTitle">
			<div class="pageIcon"><img src="/pb/img/pageTitIcon4.png" alt=""></div>
			<h2 class="titType1 c_222222 fwBold">결제취소 등록</h2>
			<p class="tType6 c_999999">결제취소 등록 페이지 입니다.</p>
		</div>
		<div class="pageCont">
			<table class="tbType2">
				<colgroup>
					<col style="width: 20%">
					<col style="width: 80%">
				</colgroup>
				<tbody>
					<tr>
						<th>
							<span>회원 아이디
<!-- 								<div class="btnWrap"> -->
										<input type="button" id="showMask" class="btnType1 bg_456ded" value="조회" style="float: right;" />
<!-- 								</div> -->
							</span>
						</th>
						<td id="mberIdTxt">
						</td>
					</tr>
					<tr>
						<th><span >회원 이름</span></th>
						<td id="mberNmTxt">
						</td>
					</tr>
					<tr>
						<th><span >회원 전화번호</span></th>
						<td id="mberPhoneNoTxt">
						</td>
					</tr>
					<tr>
						<th><span >결제취소요청 일시</span></th>
						<td>
							<input type="hidden" name="cal_url" id="cal_url" value="/sym/cmm/EgovNormalCalPopup.do">
							<a href="#" onclick="javascript:fn_egov_NormalCalendar(document.forms.writeForm, document.forms.writeForm.ntceEnddeYYYMMDD);">
								<input style="width:auto;min-width: 83px;margin-right: 43px;" type="text" class="date_format" 
									name="ntceEnddeYYYMMDD" id="ntceEnddeYYYMMDD" size="4" maxlength="4" readonly="" value="">
								<input type="button" class="calBtn" style="margin-right: 20px;">
				    		</a>
				    		<select id="hourId" name="hourNm" style="width: 61px;">
								<c:forEach var="item" varStatus="i" begin="0" end="23" step="1">
									<option value="<c:if test="${item < 10}">0</c:if>${item}">
										<c:if test="${item < 10}">0</c:if><c:out value="${item}" />시
									</option>
								</c:forEach>
							</select>
							<select id="minId" name="minNm" style="width: 61px;">
								<c:forEach var="item" varStatus="i" begin="0" end="59" step="1">
									<option value="<c:if test="${item < 10}">0</c:if>${item}">
										<c:if test="${item < 10}">0</c:if><c:out value="${item}" />분
									</option>
								</c:forEach>
							</select>
						</td>
					</tr>
					<tr>
						<th><span >결제취소 사유</span></th>
						<td>
							<input id="canTextId" value="" />
						</td>
					</tr>
					<tr>
						<th><span >결제취소 상태</span></th>
						<td>
							결제취소 요청
						</td>
					</tr>
					<tr>
						<th><span >회원 보유 금액</span></th>
						<td id="mberMoneyTxt">
						</td>
					</tr>
					<tr>
						<th><span >회원 보유 포인트</span></th>
						<td id="mberPointTxt">
						</td>
					</tr>
				</tbody>
			</table>
			
			
			<div class="btnWrap">
				<input type="button" class="btnType1 bg_888888" value="목록" onclick="fn_goList(); return false;">
					<input type="button" class="btnType1 bg_888888" value="저장" onclick="fn_insertPayCan(); return false;"/>
			</div>
			
			<span id="PayListLoad"/>
	 	</div>
	</div>
</form>



<form name="ajaxForm" id="ajaxForm" method="post">
	<input type="hideen" name="mberId" id="mberId" value=""/>
	<input type="hideen" name="returnUrl" value="RefundDetailPayListAjax"/>
	<input type="hidden" name="pageIndex" value=""/>
</form>

<form name="insertForm" id="insertForm" method="post">
	<input type="hideen" name="mberId" id="mberId" value=""/> <!-- 회원 ID -->
	<input type="hideen" name="mberNm" id="mberNm" value=""/> <!-- 회원 이름 -->
	<input type="hideen" name="payCanReqDate" id="payCanReqDate" value=""/> <!-- 환불 요청 사유 -->
	<input type="hideen" name="refundReasonEtc" id="refundReasonEtc" value=""/> <!-- 환불 요청 사유 --> 
</form>


<form name="listForm" id="listForm" method="post">
	<input type="hideen" name="mberId" id="mberId" value=""/>
	<input type="hidden" name="pageIndex" value=""/>
</form>


<div class="setDiv">
	<div class="mask"></div>
	<div class="window">
		<div class="id_check1">
			<input type="button" href="#" class="close">
			<span>회원 아이디 검색</span>
		</div>
		<div class="id_check2">
		<span>검색할 아이디</span><input type="text" id="checkIdModal">
		</div>
		<div class="id_check3">
			<span>아이디를 검색하세요</span><button onclick="fn_refundIdChk(); return false;">검색</button>
		</div>
	</div>
</div>	
	
</body>
</html>
