<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="web/common/layout/MypageLayoutWeb">
<!--
 *******************************************************************************
 * @source  : RestockForm.html
 * @desc    : 마이페이지 > 재입고알림내역 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2021 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.04.13   csh9191     최초 작성
 *******************************************************************************
 -->
<body>

<th:block layout:fragment="content">
	<div class="content restock">
		<div class="cont_body">
			<!-- CONT-BODY -->
			<div class="lnb">
				<div class="lnb_tit">
					<h2>마이페이지</h2>
				</div>
				<div class="lnb_list">
					<ul id="mypageLnbList"></ul>
				</div>
			</div>
			<div class="cont">
				<div class="sec_head">
					<h3 class="subH1">재입고 알림내역</h3>
				</div>
				<div class="sec_body">
					<div class="com_info_txt">
						<p class="tit">재입고 알림 안내</p>
						<ul>
							<li>재입고 알림을 신청한 내역을 확인 하실 수 있습니다.</li>
							<li>알림을 요청한 날로 부터 15일 안에 입고 시 알림을 SMS, 알림톡으로 보내드립니다.</li>
							<li>알림 요청이 완료 또는 경과된 알림은 완료 시점부터 15일후 삭제됩니다.</li>
						</ul>
					</div>
					<div class="area_list" id="restockGoods" style="display: none;">
						<!-- 주문번호 기준 상품 내역 -->
<!--					<div class="part_goods" > -->
<!-- 							<div class="goods_cont"> -->
<!-- 								<div class="goods_info"> -->
<!-- 									<div class="order_desc"> -->
<!-- 										<div class="goods_box"> -->
<!-- 											<div class="gd_item"> -->
<!-- 												<a href=""> -->
<!-- 													<span class="thumb"> -->
<!-- 														<img src="/images/pc/thumb/tmp_pdClickother1.jpg" width="100%" alt=""/> -->
<!-- 													</span> -->
<!-- 													<p> -->
<!-- 														<span class="brand">Mollimelli 몰리멜리</span> -->
<!-- 													</p> -->
<!-- 													<p> -->
<!-- 														<span class="name">남성 세미오버핏 이중지 심플 기본 와이넥 컬러가디건</span> -->
<!-- 													</p> -->
<!-- 												</a> -->
<!-- 											</div> -->
<!-- 											<div class="gd_opt"> -->
<!-- 												<div class="option_wrap"> -->
<!-- 													<span class="title sr-only">주문 옵션</span> -->
<!-- 													<span class="option">BLACK&nbsp;/&nbsp;XXL</span> -->
<!-- 												</div> -->
<!-- 											</div> -->
<!-- 										</div> -->
<!-- 										<div class="status_box"> -->
<!-- 											<p> -->
<!-- 												<span class="restock_ready"><em>2021.03.07</em> 알림</span> -->
<!-- 												<span class="restock_remain"><em>15</em>일 남음</span> -->
<!-- 												<span class="restock_past">알림요청일 경과</span> -->
<!-- 											</p> -->
<!-- 										</div> -->
<!-- 										<div class="button_box"> -->
<!-- 											<p><button type="button" class="btn btn_primary btn_sm"><span>바로구매</span></button></p> -->
<!-- 											<p><button type="button" id="btn_restock_push" class="btn btn_default btn_sm"><span>알림 연장</span></button></p> -->
<!-- 										</div> -->
<!-- 									</div> -->
<!-- 								</div> -->
<!-- 							</div> -->
<!--					</div> -->
						<!-- //주문번호 기준 상품 내역 -->
						<!-- 데이터 없을 시 -->
						<div class="nodata" id="restockNodata" style="display: none;">
							<div class="txt_box">
								<p>재입고 알림 내역이 없습니다.</p>
							</div>
						</div>
						<!-- 데이터 없을 시 -->
					</div>
				</div>
			</div>
			<!-- // CONT-BODY -->
		</div>
	</div>
	
<script th:inline="javascript">
	$(document).ready(function() {
		// 마이페이지 LNB 설정
		fnSetMypageLnbList(3);
		
		// 마이페이지 location 설정
		fnSetMypageLocation('재입고 알림 내역', '_PAGE_MYPAGE_RESTOCK');
		
		fnGetList();
	});
	
	var fnGetList = function() {
		$.getJSON('/mypage/restock/list', function (result, status) {
			if (status == 'success') {
				if (result.length > 0) {
					$('#restockGoods').html('');
					
					$.each(result, function (idx, item) {
						
						let tag = '<div class="part_goods">\n';
						tag += '	<div class="goods_cont" >\n';
						tag += '	<div class="goods_info">\n';
						tag += '		<div class="order_desc">\n';
						tag += '			<div class="goods_box">\n';
						tag += '				<div class="gd_item">\n';
						tag += '					<a href="javascript:void(0);"  onclick="cfnGoToGoodsDetail(\''+item.goodsCd+'\',\''+item.optCd1+'\',\'IN23_01\')">\n';
						tag += '						<span class="thumb">\n';
						tag += '							<img src="' + _uploadGoodsUrl + '/' + item.sysImgNm + '" width="100%" alt="">\n';
						tag += '						</span>\n';
						tag += '						<p><span class="brand">' + item.brandEnm + '</span></p>\n';
						tag += '						<p><span class="name">' + item.goodsNm + '</span></p>\n';
						tag += '					</a>\n';
						tag += '				</div>\n';
						tag += '				<div class="gd_opt">\n';
						tag += '					<div class="option_wrap">\n';
						tag += '						<span class="title sr-only">주문 옵션</span>\n';
						tag += '						<span class="option">' + item.optCd1 + '&nbsp;/&nbsp;' + item.optCd2 + '</span>\n';
						tag += '					</div>\n';
						tag += '				</div>\n';
						tag += '			</div>\n';
						tag += '			<div class="status_box">\n';
						
						if (!gagajf.isNull(item.informDt)) {
							tag += '				<p><span class="restock_ready"><em>' + item.informDt + '</em> 알림</span></p>\n';
						} else {
							if (item.pastDays > 15) {
								tag += '				<p><span class="restock_past">알림 요청일 경과</span></p>\n';
							} else {
								tag += '				<p><span class="restock_remain"><em>' + (15 - Number(item.pastDays)) + '</em>일 남음</span></p>\n';
							}
						}
						
						tag += '			</div>\n';
						tag += '			<div class="button_box">\n';
						
						if (!gagajf.isNull(item.informDt)) {
							tag += '				<p><button type="button" class="btn btn_primary btn_sm" onclick="cfnGoToGoodsDetail(\'' + item.goodsCd + '\');"><span>바로구매</span></button></p>\n';
						} else {
							tag += '				<p><button type="button" class="btn btn_default btn_sm" onclick="fnUpdateRestockContinue(' + item.rinbdInfoSq + ');"><span>알림 연장</span></button></p>\n';
						}
						
						tag += '			</div>\n';
						tag += '		</div>\n';
						tag += '	</div>\n';
						tag += '</div>\n';
						tag += '</div>\n';
						
						$('#restockGoods').append(tag);
						$('#restockGoods').show();
						$('#restockNodata').hide();
					});
				} else {
					// 데이터 없을 시
					$('#restockGoods').hide();
					$('#restockNodata').show();
				}
			}
		});
	}
	
	// 알림 연장
	let fnUpdateRestockContinue = function(rinbdInfoSq) {
		mcxDialog.confirm("알림을 연장하시겠습니까?", {
			cancelBtnText: "취소",
			sureBtnText: "확인",
			sureBtnClick: function() {
				let params = new Object();
				params.rinbdInfoSq = rinbdInfoSq;
				
				var jsonData = JSON.stringify(params);
				gagajf.ajaxJsonSubmit('/mypage/restock/continue/update'
						, jsonData
						, function() {
							fnGetList();
						});
			}
		});
	}
</script>
</th:block>

</body>
</html>
