<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : MypageOrderListWeb.html
 * @desc    : 마이페이지 > 주문확인/배송조회 주문리스트 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2021 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.02.18   card007     최초 작성
 * 1.1  2021.03.15   card007     퍼블 수정
 *******************************************************************************
 -->
<div class="area_list" id="orderList">
<th:block th:if="${orderList}" th:each="oneData, status : ${orderList}">
	<div class="part_goods">
		<div class="goods_head">
			<p th:unless="${oneData.giftPackYn == 'Y'}">주문일 <span th:text="${oneData.ordDt}"></span></p>
			<p th:if="${oneData.giftPackYn == 'Y'}">선물일 <span th:text="${oneData.ordDt}"></span></p>
			<a href="javascript:void(0)" class="btn_detail_view" th:attr="ordNo=${oneData.ordNo}" onclick="fnGoToOrderDetail(this)">주문상세보기</a>
		</div>
		<div class="goods_cont">
			<th:block th:if="${oneData.ordDtlList}" th:each="ordDtl, status : ${oneData.ordDtlList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
			<!-- 주문상품 -->
			<div class="goods_info">
				<div class="order_desc">
					<div class="goods_box">
						<div class="gd_item">
							<a href="">
								<span class="thumb">
									<img th:src="${imageUrl + '/' + ordDtl.sysImgNm}" width="100%" alt="">
								</span>
								<p>
									<span class="brand" th:text="${ordDtl.brandNm}"></span>
									<span class="tag primary" th:if="${ordDtl.shotDelvYn == 'Y'}">총알배송</span>
									<span class="tag" th:if="${ordDtl.shotDelvYn == 'N' and ordDtl.selfGoodsYn == 'Y'}">STYLE24 일반배송</span>
									<span class="tag" th:if="${ordDtl.selfGoodsYn == 'N'}">업체직배송</span>
								</p>
								<p>
									<span class="name" th:text="${ordDtl.goodsNm}"></span>
								</p>
							</a>
						</div>
						<div class="gd_opt">
							<div class="option_wrap">
								<span class="title sr-only">주문 옵션</span>
								<span class="option" th:text="|${ordDtl.optCd1} / ${ordDtl.optCd2} / ${ordDtl.reviewSq} / ${ordDtl.ordDtlStat} / ${ordDtl.recipBaseAddr}|"></span>
							</div>
						</div>
						<div class="gd_calc">
							<p>
								<span class="count"><em th:text="${ordDtl.ordQty}"></em>개</span>
							</p>
							<p>
								<span class="price_org"><em th:text="${#numbers.formatInteger(ordDtl.listPrice, 1, 'COMMA')}"></em>원</span>
								<span class="price_sale"><em th:text="${#numbers.formatInteger(ordDtl.ordAmt, 1, 'COMMA')}"></em>원</span>
							</p>
						</div>
					</div>
					<div class="status_box">
						<!-- 주문 -->
						<th:block th:unless="${ordDtl.giftPackYn == 'Y'}">
							<p th:text="${ordDtl.ordDtlStatNm}"></p>
						</th:block>
						
						<!-- 선물 -->
						<th:block th:if="${ordDtl.giftPackYn == 'Y'}">
							<!-- <p th:if="${ordDtl.ordDtlStatNm}">선물 결제</p> -->
							<!-- 주소 입력 대기중 -->
							<p th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">주소 입력 대기중</p>
							<!-- 선물 완료 -->
							<p th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr)}">선물 완료</p>
							<!-- 선물 취소 -->
							<p th:if="${ordDtl.ordDtlStat == 'G013_98' and ordDtl.ordDtlStat == 'G013_99'}">선물 취소</p>
						</th:block>
					</div>
					<div class="button_box">
						<!-- 주문 -->
						<th:block th:unless="${ordDtl.giftPackYn == 'Y'}">
							<!-- 주문취소 버튼(입금대기, 결제완료, 상품준비중, 출고처지정, 배송준비중) -->
							<th:block th:if="${ordDtl.ordDtlStat == 'G013_10' or ordDtl.ordDtlStat == 'G013_20' or ordDtl.ordDtlStat == 'G013_30' or ordDtl.ordDtlStat == 'G013_35' or ordDtl.ordDtlStat == 'G013_40'}">
								<p><button type="button" class="btn btn_default btn_sm"  th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateChange(this, 'cancel');"><span>주문 취소</span></button></p>
							</th:block>
							<!-- 교환신청 버튼(배송중, 출고완료, 배송완료)  -->
							<th:block th:if="${ordDtl.changeableYn == 'Y' and (ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60')}">
								<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateChange(this, 'exchange');"><span>교환 신청</span></button></p>
							</th:block>
							<!-- 반품신청 버튼(배송중, 출고완료, 배송완료)  -->
							<th:block th:if="${ordDtl.returnableYn == 'Y' and (ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60')}">
								<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateChange(this, 'return');"><span>반품 신청</span></button></p>
							</th:block>
							<!-- 배송조회 버튼(배송중) -->
							<th:block th:if="${ordDtl.ordDtlStat == 'G013_50' or ordDtl.ordDtlStat == 'G013_55' or ordDtl.ordDtlStat == 'G013_60'}">
								<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnGoToDelivery(this);"><span>배송 조회</span></button></p>
							</th:block>
							<!-- 구매확정 버튼(배송완료) -->
							<th:block th:if="${ordDtl.ordDtlStat == 'G013_60'}">
								<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnDecideOrder(this);"><span>구매 확정</span></button></p>
							</th:block>
							<!-- 쇼핑백담기 버튼(구매확정) -->
							<th:block th:if="${ordDtl.ordDtlStat == 'G013_70'}">
								<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${ordDtl.ordNo}, ordDtlNo=${ordDtl.ordDtlNo}" onclick="fnCreateCart(this);"><span>쇼핑백 담기</span></button></p>
							</th:block>
							<!-- 리뷰작성 버튼 -->
							<th:block th:if="${ordDtl.ordDtlStat == 'G013_70' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
								<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${oneData.ordNo}" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>
							</th:block>
							<!-- 1:1문의 버튼 -->
							<th:block th:if="${ordDtl.ordDtlStat == 'G013_70' and (ordDtl.reviewableYn == 'N' or ordDtl.reviewSq > 0)}">
								<p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA);"><span>1:1 문의</span></button></p>
							</th:block>
						</th:block>
						
						<!-- 선물 -->
						<th:block th:if="${ordDtl.giftPackYn == 'Y'}">
							<!-- 주소 입력 대기중 -->
							<th:block th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}">
								<p><button type="button" class="btn btn_default btn_sm" th:attr="ordNo=${oneData.ordNo}" onclick="fnReSendSms(this);"><span>SMS 재발송</span></button></p>
							</th:block>
							<!-- 선물 완료 -->
							<th:block th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}">
								<p><button type="button" class="btn btn_primary_line btn_sm" th:attr="ordNo=${oneData.ordNo}" onclick="fnCreateReview(this);"><span>리뷰 쓰기</span></button></p>
							</th:block>
						</th:block>
					</div>
				</div>
				
				<!-- 주문 -->
				<th:block th:unless="${ordDtl.giftPackYn == 'Y'}">
					<!-- 주문접수 -->
					<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_10'}"><p>주문이 완료되어 결제를 기다리고 있습니다.</p></div>
					<!-- 상품준비중 -->
					<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_30' or ordDtl.ordDtlStat == 'G013_40'}"><p>상품 준비가 완료되어 곧 배송될 예정입니다.</p></div>
					<!-- 예약상품 상품준비중 -->
					<!-- <div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_30' or ordDtl.ordDtlStat == 'G013_35' or ordDtl.ordDtlStat == 'G013_40'}"><p>예약판매 상품으로 YYYY.MM.DD 출고 예정입니다.</p></div> -->
					<!-- 배송완료 -->
					<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_60'}"><p>15일 후 자동으로 구매확정됩니다.</p></div>
					<!-- 구매확정 -->
					<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_70' and ordDtl.reviewableYn == 'Y' and ordDtl.reviewSq == null}"><p>리뷰를 작성하면 다른 구매자에게 도움이 될 수 있습니다.</p></div>
				</th:block>

				<!-- 선물 -->
				<th:block th:if="${ordDtl.giftPackYn == 'Y'}">
					<!-- 주소 입력 대기중 -->
					<div class="order_text" th:if="${#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.giftLimitDay >= 0}"><p th:text="|${ordDtl.recipNm}님이 주소를 입력하기 전입니다. (입력기한 ${ordDtl.giftLimitDt})|"></p></div>
					<!-- 선물 완료 -->
					<div class="order_text" th:if="${!#strings.isEmpty(ordDtl.recipBaseAddr) and ordDtl.ordDtlStat != 'G013_98' and ordDtl.ordDtlStat != 'G013_99'}"><p th:text="|${ordDtl.recipNm}님께 선물이 발송되었습니다.|"></p></div>
					<!-- 선물 취소 -->
					<div class="order_text" th:if="${ordDtl.ordDtlStat == 'G013_98' and ordDtl.ordDtlStat == 'G013_99'}"><p>주소 입력 기한이 경과되어 선물이 취소 되었습니다.</p></div>
				</th:block>
			</div>
			<!-- //주문상품 -->
			</th:block>
		</div>
	</div>
</th:block>

<!-- 주문 없을 때 -->
<th:block th:unless="${orderList}">
	
</th:block>
</div>
<input type="hidden" th:value="${orderInfo.pageNo}" id="pageNo"/>

<script th:inline="javascript">
/*<![CDATA[*/
	let orderInfo = [[${orderInfo}]];
	$(document).ready(function() {
		// Initialize a pagination
		gagaPaging.init('searchForm', fnSearchOrderList, 'paging', 5);
		
		gagaPaging.createPagination(orderInfo.paging);
	});
/*]]>*/
</script>

</html>
