style24
/
style24.front


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399
							<!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/DefaultLayoutWeb">
<!--
 *******************************************************************************
 * @source  : OrderCompleteWeb.html
 * @desc    : 주문완료 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.03.16   jsh77b     최초 작성
 *******************************************************************************
 -->
<body>
<th:block layout:fragment="content">
<!--  container -->
<div id="container" class="container od">
	<div class="wrap">
		<div class="content completed">
			<div class="cont_head">
				<h2>주문완료</h2>
				<div class="oder_steps">
					<ul>
						<li><span>01</span>&nbsp;쇼핑백</li>
						<li><span>02</span>&nbsp;주문/결제</li>
						<li class="on"><span>03</span>&nbsp;주문완료</li>
					</ul>
				</div>
			</div>
			<div class="cont_body">
				<!-- CONT-BODY -->
				<div class="od_cont">
					<div class="sec_head">
						<div class="info_complete">
							<p class="txt_box">감사합니다. <span th:text="${orderInfo.ordNm}"></span> 고객님의 주문이 완료되었습니다.</p>
							<dl class="report_box">
								<div>
									<dt>주문번호</dt>
									<dd><span th:text="${orderInfo.ordNo}"></span></dd>
								</div>
								<!-- 무통장입금 결제시 -->
								<th:block th:if="${orderInfo.payMeans} == 'G014_20'">
									<div>
										<dt>무통장입금정보</dt>
										<dd><span th:text="${orderInfo.cardNm}"></span>(<span th:text="${orderInfo.ordNm}"></span>)&nbsp;/&nbsp;<span th:text="${orderInfo.vaNo}"></span></dd>
									</div>
									<div class="closedate">
										<dt>입금마감</dt>
										<dd><span th:text="|${orderInfo.vaDeadline}"></span>까지</dd>
									</div>
								</th:block>
								<!-- //무통장 입금 결제시 -->
							</dl>
						</div>
					</div>
					<div class="sec_body">
						<div class="area_payinfo">
							<h3>주문자 정보</h3>
							<div class="tbl type1">
								<table>
									<colgroup>
										<col width="210">
										<col width="*">
									</colgroup>   
									<tbody>
										<tr>
											<th>주문 고객</th>
											<td>
												<div class="single_line">
													<ul>
														<li><span th:text="${orderInfo.ordNm}"></span></li>
														<li><span th:text="${orderInfo.ordEmail}"></span></li>
														<li><span th:text="${orderInfo.ordPhnno}"></span></li>
													</ul>
												</div>
											</td>
										</tr>
										<tr>
											<th>배송지 정보</th>
											<td>
												<div class="block_line">
													<ul>
														<li>
															<span id="recipNm" th:text="${orderInfo.recipNm}"></span>
															<!-- 
															<span class="tag">기본배송지</span>
															<span class="tag primary_line">총알배송</span>
															 -->
														</li>
														<li>
															<span id="recipPhnno" th:text="${orderInfo.recipPhnno}"></span>
														</li>
														<li>
															<span id="recipAddr" th:text="${orderInfo.recipBaseAddr} + '    ' + ${orderInfo.recipDtlAddr}"></span>
															<button type="button" id="btn_adrsChange_pop" class="btn btn_default btn_sm"><span>배송지 변경</span></button>
														</li>
														<li>
															배송요청 사항&nbsp;:&nbsp;<span id="delvMemo" th:text="${orderInfo.delvMemo}"></span>
															<button type="button" id="btn_rqstModify_pop" class="btn_underline"><span>변경하기</span></button>
														</li>
													</ul>
												</div>
											</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
						<div class="area_payinfo">
							<h3>결제정보</h3>
							<div class="tbl type6">
								<table>
									<colgroup>
										<col width="50%">
										<col width="50%">
									</colgroup>
									<tr>
										<td>
											<dl>
												<div>
													<dt>상품금액</dt>
													<dd><em th:text="${#numbers.formatInteger(listSumAmt, 1, 'COMMA')}"></em>원</dd>	
												</div>
												<div>
													<dt>배송비</dt>
													<dd><em th:text="${#numbers.formatInteger(delvFeeSumAmt, 1, 'COMMA')}"></em>원</dd>	
												</div>
												<div>
													<dt>상품할인(즉시할인)</dt>
													<th:block th:if="${cpn1DcSumAmt}>0">
														<dd><em th:text="|- ${#numbers.formatInteger(cpn1DcSumAmt, 1, 'COMMA')}|"></em>원</dd>
													</th:block>
													<th:block th:if="${cpn1DcSumAmt}<1">
														<dd><em>0</em>원</dd>
													</th:block>
												</div>
												<!-- 회원인경우노출 -->
												<th:block th:if="${isLogin}">
													<div>
														<dt>다다익선 할인</dt>
														<th:block th:if="${tmtbSumAmt}>0">
															<dd><em th:text="|- ${#numbers.formatInteger(tmtbSumAmt, 1, 'COMMA')}|"></em>원</dd>
														</th:block>
														<th:block th:if="${tmtbSumAmt}<1">
															<dd><em>0</em>원</dd>
														</th:block>
													</div>
													<div>
														<dt>쿠폰할인</dt>
														<th:block th:if="${cpnDcSumAmt}>0">
															<dd><em th:text="|- ${#numbers.formatInteger(cpnDcSumAmt, 1, 'COMMA')}|"></em>원</dd>
														</th:block>
														<th:block th:if="${cpnDcSumAmt}<1">
															<dd><em>0</em>원</dd>
														</th:block>
													</div>
													<div>
														<dt>선포인트 할인</dt>
														<th:block th:if="${prePntDcSumAmt}>0">
															<dd><em th:text="|- ${#numbers.formatInteger(prePntDcSumAmt, 1, 'COMMA')}|"></em>원</dd>
														</th:block>
														<th:block th:if="${prePntDcSumAmt}<1">
															<dd><em>0</em>원</dd>
														</th:block>
													</div>
													<div>
														<dt>포인트 사용</dt>
														<th:block th:if="${pntDcSumAmt}>0">
															<dd><em th:text="|- ${#numbers.formatInteger(pntDcSumAmt, 1, 'COMMA')}|"></em>원</dd>
														</th:block>
														<th:block th:if="${pntDcSumAmt}<1">
															<dd><em>0</em>원</dd>
														</th:block>
													</div>
													<div>
														<dt>상품권 사용</dt>
														<th:block th:if="${gfcdUseSumAmt}>0">
															<dd><em th:text="|- ${#numbers.formatInteger(gfcdUseSumAmt, 1, 'COMMA')}|"></em>원</dd>
														</th:block>
														<th:block th:if="${gfcdUseSumAmt}<1">
															<dd><em>0</em>원</dd>
														</th:block>
													</div>
												</th:block>
												<!-- //회원인경우노출 -->
												<div>
													<dt>마일리지 사용</dt>
													<th:block th:if="${mileageDcAmt}>0">
														<dd><em th:text="|- ${#numbers.formatInteger(mileageDcAmt, 1, 'COMMA')}|"></em>원</dd>
													</th:block>
													<th:block th:if="${mileageDcAmt}<1">
														<dd><em>0</em>원</dd>
													</th:block>
												</div>
												<div>
													<dt>제휴할인</dt>
													<th:block th:if="${allianceDcAmt}>0">
														<dd><em th:text="|- ${#numbers.formatInteger(allianceDcAmt, 1, 'COMMA')}|"></em>원</dd>
													</th:block>
													<th:block th:if="${allianceDcAmt}<1">
														<dd><em>0</em>원</dd>
													</th:block>
												</div>
												
											</dl>
										</td>
										<td>
											<dl>
												<div>
													<dt>결제 금액</dt>
													<dd>
														<div class="price">
															<span class="pay_total_price"><em th:text="${#numbers.formatInteger(realOrdSumAmt, 1, 'COMMA')}"></em>원</span>
														</div>
													</dd>
												</div>
												<!-- 신용카드 일때 -->
												<div>
													<dt class="sr-only">결제방법</dt>
													<!-- kcp 신용카드 -->
													<th:block th:if="${orderInfo.payMeans} == 'G014_30'">
														<!--  체크카드 -->
														<th:block th:if="${orderInfo.cardType} == 'Y'">
															<dd th:text="|체크카드(${orderInfo.cardNm})/${orderInfo.cardMips}|"></dd>
														</th:block>
														<!--  신용카드 -->
														<th:block th:if="${orderInfo.cardType} == 'N'">
															<dd th:text="|신용카드(${orderInfo.cardNm})/${orderInfo.cardMips}|"></dd>
														</th:block>
													</th:block>
													<th:block th:if="${orderInfo.payMeans} != 'G014_30'">
														<dd th:text="${orderInfo.payType}"></dd>
													</th:block>
												</div>
												<!-- //신용카드 일때 -->
											</dl>
											<!-- 회원인경우노출 -->
											<th:block th:if="${isLogin}">
												<dl>
													<div>
														<dt>적립 예정 포인트</dt>
														<dd>
															<span class="save_point"><em th:text="|${#numbers.formatInteger(savePntSumAmt, 1, 'COMMA')}P|"></em></span>
														</dd>
													</div>
												</dl>
											</th:block>
											<!-- //회원인경우노출 -->
										</td>
									</tr>
								</table>
							</div>
						</div>
					</div>
					<div class="sec_foot">
						<div class="btn_group_md">
							<button type="button" class="btn btn_default btn_md"><span>주문 상세보기</span></button>
							<button type="button" class="btn btn_dark btn_md"><span>쇼핑 계속하기</span></button>
						</div>
					</div>
				</div>
				<!-- //CONT-BODY -->
			</div>
		</div>
	</div>
</div>
<!-- // container -->

<script th:inline="javascript">
// 배송관련정보 변수선언
var ordNo			= [[${orderInfo.ordNo}]]		// 배송목록
var isLogin			= [[${isLogin}]];				// 로그인여부
var delvAddrSq		= [[${delvAddrSq}]];			// 배송지번호

// 2.1 회원 배송지변경 팝업열기
$('#btn_adrsChange_pop').on("click", function(){
	// 회원인경우
	if (isLogin == true) {
		$.ajax( {
			type		: "POST",
			url 		: '/common/delvAddrChangePop',
			dataType 	: 'html',
			beforeSend : function(xhr, settings) {
				xhr.setRequestHeader("AJAX"			, "true");
				xhr.setRequestHeader('Accept'		, 'application/json');
				xhr.setRequestHeader('Content-Type'	, 'application/json');
				gagajf.showProgressbar(true);
			},
			success 	: function(result) {
				$("#adrsChangePop .modal-dialog .modal-content").html(result);
				$("#adrsChangePop").modal("show");
			}
		});
	}
	// 비회원인경우
	else {
		$.ajax( {
			type		: "POST",
			url 		: '/common/delvAddrAddPop',
			dataType 	: 'html',
			beforeSend : function(xhr, settings) {
				xhr.setRequestHeader("AJAX"			, "true");
				xhr.setRequestHeader('Accept'		, 'application/json');
				xhr.setRequestHeader('Content-Type'	, 'application/json');
				gagajf.showProgressbar(true);
			},
			success 	: function(result) {
				$("#adrsAddPop .modal-dialog .modal-content").html(result);
				$("#adrsAddPop").modal("show");
			}
		});	
	}
});

// 2.2 배송요청사항 팝업열기
$("#btn_rqstModify_pop").on("click", function(e){
	var jsonObj = new Object();
	jsonObj.delvMemo = $("#delvMemo").text();
	
	$.ajax({
		type		: "POST",
		url 		: "/common/delvMemoChangePop",
		data		: JSON.stringify(jsonObj),
		dataType 	: "html",
		beforeSend 	: function(xhr, settings) {
			xhr.setRequestHeader("AJAX"			, "true");
			xhr.setRequestHeader('Accept'		, 'application/json');
			xhr.setRequestHeader('Content-Type'	, 'application/json');
			gagajf.showProgressbar(true);
		},
		success 	: function(result) {
			if (result != null) {
				$("#rqstModifyPop .modal-dialog .modal-content").html(result);
				$("#rqstModifyPop").modal("show");
			}
		}
	});
	
	return false;
});

// 1.18 배송지정보 설정
var delvAddrSet = function(delvObj) {
	
	var rtnStr = "";
	rtnStr += "| recipNm 			::: " + delvObj.recipNm;
	rtnStr += "| recipPhnno 		::: " + delvObj.recipPhnno;
	rtnStr += "| recipZipcode 		::: " + delvObj.recipZipcode;
	rtnStr += "| recipBaseAddr 		::: " + delvObj.recipBaseAddr;
	rtnStr += "| recipDtlAddr 		::: " + delvObj.recipDtlAddr;
	rtnStr += "| delvMemo 			::: " + delvObj.delvMemo;
	
	$("#recipNm").text(delvObj.recipNm);
	$("#recipPhnno").text(delvObj.recipPhnno);
	$("#recipAddr").text(delvObj.recipBaseAddr + '    ' + delvObj.recipDtlAddr);
	$("#delvMemo").text(delvObj.delvMemo);
	
	// 변수값 설정
	var jsonObj = {
		"ordNo" 			: ordNo
		, "delvAddrSq" 		: delvAddrSq
		, "recipNm"			: delvObj.recipNm
		, "recipPhnno"		: delvObj.recipPhnno
		, "recipZipcode"	: delvObj.recipZipcode
		, "recipBaseAddr"	: delvObj.recipBaseAddr
		, "recipDtlAddr"	: delvObj.recipDtlAddr
		, "delvMemo"		: delvObj.delvMemo
	}
}

// 1.19 배송메모설정
var delvMemoSet = function(delvMemoObj) {
	
	var rtnStr = "";
	rtnStr += "| delvMemo 			::: " + delvMemoObj.delvMemo;

	// 변수값 설정
	var jsonObj = {
		"delvAddrSq" 		: delvAddrSq
		, "delvMemo"		: delvMemoObj.delvMemo
	}
	
	$("#delvMemo").text(delvMemoObj.delvMemo);
	
	
}


</script>


</th:block>
</body>
</html>