<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : OrderDeliveryAddrInfoWeb.html
 * @desc    : 배송정보 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.02.01   jsh77b     최초 작성
 *******************************************************************************
 -->

<!-- 배송지정보 -->
<input type="hidden" name="recipNm" 		th:value="${deliveryAddrInfo.recipNm}"/>
<input type="hidden" name="recipPhnno" 		th:value="${deliveryAddrInfo.recipPhnno}"/>
<input type="hidden" name="recipZipcode" 	th:value="${deliveryAddrInfo.recipZipcode}"/>
<input type="hidden" name="recipBaseAddr" 	th:value="${deliveryAddrInfo.recipBaseAddr}"/>
<input type="hidden" name="recipDtlAddr" 	th:value="${deliveryAddrInfo.recipDtlAddr}"/>
<input type="hidden" name="delvMemo" 		th:value="${deliveryAddrInfo.delvMemo}"/>
<input type="hidden" name="foreignBuyYn" 	th:value="${order.foreignBuyYn}"/>
<input type="hidden" name="orderMadeYn" 	th:value="${order.orderMadeYn}"/>

<div class="fold_head">
	<a href="javascript:void(0)">
		<div>
			<div class="fold_tit"><span>배송지 정보</span></div>
			<th:block th:if="${deliveryAddrInfo.recipZipcode} == '00000'">
				<div class="data" id="recipAddr">배송지 정보를 등록해 주세요.</div>
			</th:block>
			<th:block th:if="${deliveryAddrInfo.recipZipcode} != '00000'">
				<div class="data" id="recipAddr" th:text="${deliveryAddrInfo.recipBaseAddr} + '   ' + ${deliveryAddrInfo.recipDtlAddr}"></div>
			</th:block>
		</div>
	</a>
</div>
<div class="fold_cont" style="display: none;">
	<div class="area_receiveinfo exist">
		<dl>
			<div>
				<dt><span class="sr-only">배송지명</span></dt>
				<dd>
					<th:block th:text="${deliveryAddrInfo.recipNm}"></th:block>
					<span class="icon_tag"> 
						<th:block th:if="${deliveryAddrInfo.defaultYn} == 'Y'">
							<em class="tag">기본 배송지</em>
						</th:block> 
						<em class="tag primary_line shotDelv" style="display:none;">총알배송</em>
					</span>
				</dd>
			</div>
			<div>
				<dt><span class="sr-only">휴대폰 번호</span></dt>
				<th:block th:if="${deliveryAddrInfo.recipZipcode} == '00000'">
					<dd>휴대폰 번호를 등록해 주세요.</dd>
				</th:block>
				<th:block th:if="${deliveryAddrInfo.recipZipcode} != '00000'">
					<dd th:text="${deliveryAddrInfo.recipPhnno}"></dd>
				</th:block>
			</div>
			<div>
				<dt><span class="sr-only">배송주소</span></dt>
				<dd>
					<th:block th:if="${deliveryAddrInfo.recipZipcode} == '00000'">
						배송지를 등록해 주세요.
					</th:block>
					<th:block th:if="${deliveryAddrInfo.recipZipcode} != '00000'">
						<th:block th:text="${deliveryAddrInfo.recipBaseAddr} + '    ' + ${deliveryAddrInfo.recipDtlAddr}"></th:block>
					</th:block>
					<button type="button" class="btn btn_default btn_sm btn_adrsChange_pop">
						<span>배송지 변경</span>
					</button>
				</dd>
			</div>
			<div>
				<dt>배송요청 사항</dt>
				<dd>
					<span th:text="${deliveryAddrInfo.delvMemo}" id="delvMemo"></span>
					<button type="button" class="btn_underline" id="btn_rqstModify_pop">
						<span>변경하기</span>
					</button>
				</dd>
			</div>
		</dl>
	</div>
	
	<!-- 배송지정보가 없을때 노출 -->
	<div class="area_receiveinfo none" style="display:none">
		<dl>
			<div>
				<dt><span class="sr-only">배송지를 등록해 주세요.</span></dt>
				<dd>
					배송지 정보를 등록해 주세요.
					<button type="button" class="btn btn_default btn_sm btn_adrsChange_pop"><span>배송지 변경</span></button>
				</dd>
			</div>
		</dl>
	</div>
	<!-- 배송지정보가 있을때 노출 -->
	
	<!-- 해외배송상품일 경우 노출 -->
	<th:block th:if="${order.foreignBuyYn} == 'Y'">
		<div class="area_overseas">
			<dl>
				<div>
					<dt>개인통관고유부호</dt>
					<dd>
						<div class="form_field">
							<div>
								<input type="radio" name="rdi-overseas" id="rdi-overs1" value="Y" checked> 
								<label for="rdi-overs1"><span>받는사람 개인통관고유부호</span></label>
							</div>
							<div>
								<input type="radio" name="rdi-overseas" id="rdi-overs2" value="N"> 
								<label for="rdi-overs2"><span>입력 안 함</span></label>
							</div>
							<div class="info_box overs1">
								<div class="input_wrap">
									<input type="text" name="entryNo" class="form_control" maxlength="13" placeholder="P로 시작하는 13자리" th:value=${entryNo}>
									<!-- 유효하지 않은 개인통관고유부호 일때 class명 'err' 추가 -->
								</div>
								<div class="t_err" style="display:none;">개인통관고유부호가 유효하지 않습니다.</div>
								<!-- 유효하지 않은 개인통관고유부호 일때 노출 -->
								<div class="agree_overs">
									<input id="chk-overs-agr" type="checkbox">
									<label for="chk-overs-agr">
										<span>위 정보는 원활한 통관을 위해 수집 및 판매자에게 제공하며,계속 사용하도록 안전하게 STYLE24에서 저장 / 관리 합니다.&nbsp;&nbsp;<em class="tmark_required">(필수)</em></span>
									</label>
								</div>
							</div>
							<div class="info_box overs2" style="display: none;">
								<p>개인통관고유부호를 입력하지 않아도 관세사무소에서 개인정보 확인을 위해 별도 연락을 드릴 예정입니다.</p>
							</div>
						</div>
						<div class="info_txt">
							<ul>
								<li>물품가액이 $150초과할 경우 관/부과세가 발생 할 수 있습니다.</li>
								<li>물품 종류와 해외공급자 관계없이 같은 날 입항하게 되면 합산과세 대상이 됩니다.</li>
							</ul>
						</div>
					</dd>
				</div>
			</dl>
		</div>
	</th:block>
	<!-- //해외배송상품일 경우 노출 -->
	
	<!-- 주문제작상품일 경우 노출 -->
	<th:block th:if="${order.orderMadeYn} == 'Y'">
		<div class="area_customitem">
			<div class="form_field">
				<div class="agree_custom">
					<input id="chk-custom-agr1" type="checkbox">
					<label for="chk-custom-agr1">
						<span>고객님께서 주문하신 상품에는 주문제작상품이 포함되어 있습니다.<br>주문제작상품에 대한 안내를 확인하였으며 배송에 동의합니다.&nbsp;&nbsp;
							<em class="tmark_required">(필수)</em>
						</span>
					</label>
				</div>
			</div>
			<div class="info_txt">
				<ul>
					<li>주문 제작 상품은 주문 후 제작이 진행되며, 제작 완료 후 배송이 시작됩니다.</li>
					<li>주문 제작 상품의 특성상 주문 완료 후 취소/교환이 불가능합니다. (상품 하자에 한해 가능)</li>
				</ul>
			</div>
		</div>
	</th:block>
	<!-- //주문제작상품일 경우 노출 -->
</div> <!-- //배송지정보 -->


<script th:inline="javascript">
var dispYn = [[${order.dispYn}]]; // 노출여부

//화면노출
var deliveryAddrInfoDispYn = function(temp) {
	if (temp == "Y") {
		$("#deliveryAddrInfo .fold_head").addClass("on");
		$("#deliveryAddrInfo .fold_cont").show();
	} else {
		$("#deliveryAddrInfo .fold_head").removeClass("on");
		$("#deliveryAddrInfo .fold_cont").hide();
	}
}

//컨텐츠 호출
$(document).ready( function() {
	// 화면펼침
	deliveryAddrInfoDispYn("Y");
});

// 개인통관부호 유효성체크
$("#orderForm input[name=entryNo]").on("change", function(){
	if ($(this).val().length > 0 && $(this).val().length < 13) {
		$(this).parent().parent().find(".t_err").show();
		$(this).addClass("err");
	} else if ($("#orderForm input[name=entryNo]").val().substr(0,1) != "P") {
		$(this).parent().parent().find(".t_err").show();
		$(this).addClass("err");
	} else {
		$(this).parent().parent().find(".t_err").hide();
		$(this).removeClass("err");
	}
});
</script>

</html>