|
|
@@ -0,0 +1,454 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="ko" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorator="mob/common/layout/SubLayoutMob">
|
|
|
+<!--
|
|
|
+ *******************************************************************************
|
|
|
+ * @source : OrderCompleteMob.html
|
|
|
+ * @desc : 주문완료 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2020 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.04.12 jsh77b 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+<th:block layout:fragment="content">
|
|
|
+<main role="" id="" class="container od">
|
|
|
+ <section class="content completed">
|
|
|
+ <div class="inner wide">
|
|
|
+ <div class="info_complete">
|
|
|
+ <img src="/images/mo/ico_complete_check.png" alt="주문이 완료 되었습니다.">
|
|
|
+ <p class="txt_box">주문이 완료되었습니다.</p>
|
|
|
+ <dl class="report_box">
|
|
|
+ <div>
|
|
|
+ <dt>주문번호</dt>
|
|
|
+ <dd><span th:text="${orderInfo.ordNo}"></span></dd>
|
|
|
+ </div>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 무통장입금 결제시 -->
|
|
|
+ <th:block th:if="${orderInfo.payMeans} == 'G014_20'">
|
|
|
+ <div class="inner">
|
|
|
+ <div class="tbl_wrap">
|
|
|
+ <div class="tbl_tit">
|
|
|
+ <h3>무통장 입금 정보</h3>
|
|
|
+ </div>
|
|
|
+ <div class="tbl type1">
|
|
|
+ <table>
|
|
|
+ <colgroup>
|
|
|
+ <col width="107">
|
|
|
+ <col width="*">
|
|
|
+ </colgroup>
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <th>은행명/명의자</th>
|
|
|
+ <td>
|
|
|
+ <div>
|
|
|
+ <span th:text="${orderInfo.cardNm}"></span>/<span th:text="${orderInfo.ordNm}"></span>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th>계좌번호</th>
|
|
|
+ <td>
|
|
|
+ <div>
|
|
|
+ <span th:text="${orderInfo.vaNo}"></span>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th>입금기한</th>
|
|
|
+ <td>
|
|
|
+ <div>
|
|
|
+ <span th:text="|${orderInfo.vaDeadline}"></span><!-- <span>12:00:00</span> --> 까지
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ <div class="inner wide">
|
|
|
+ <!-- 폴딩리스트 -->
|
|
|
+ <div class="ui_row">
|
|
|
+ <div class="foldGroup">
|
|
|
+ <ul>
|
|
|
+ <li class="fold_mbinfo">
|
|
|
+ <div class="fold_head">
|
|
|
+ <a href="javascript:void(0)">
|
|
|
+ <div>
|
|
|
+ <div class="fold_tit">
|
|
|
+ <span th:text="${orderInfo.ordNm}"></span>
|
|
|
+ </div>
|
|
|
+ <div class="data">
|
|
|
+ <span th:text="${orderInfo.ordNm}"></span>
|
|
|
+ <span th:text="${orderInfo.ordPhnno}"></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="fold_cont">
|
|
|
+ <div class="customer_info">
|
|
|
+ <dl>
|
|
|
+ <div>
|
|
|
+ <dt><span class="sr-only">주문자명</span></dt>
|
|
|
+ <dd th:text="${orderInfo.ordNm}"></dd>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt><span class="sr-only">이메일</span></dt>
|
|
|
+ <dd th:text="${orderInfo.ordEmail}"></dd>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt><span class="sr-only">휴대폰 번호</span></dt>
|
|
|
+ <dd th:text="${orderInfo.ordPhnno}"></dd>
|
|
|
+ </div>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 폴딩리스트 -->
|
|
|
+ </div>
|
|
|
+ <div class="inner wide">
|
|
|
+ <!-- 폴딩리스트 -->
|
|
|
+ <div class="ui_row">
|
|
|
+ <div class="foldGroup shipfold">
|
|
|
+ <ul>
|
|
|
+ <li class="fold_delivery">
|
|
|
+ <div class="fold_head">
|
|
|
+ <a href="javascript:void(0)">
|
|
|
+ <div>
|
|
|
+ <div class="fold_tit">
|
|
|
+ <span>배송지 정보</span>
|
|
|
+ </div>
|
|
|
+ <div class="data">
|
|
|
+ <span class="recipAddr" th:text="${orderInfo.recipBaseAddr} + ' ' + ${orderInfo.recipDtlAddr}"></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="fold_cont">
|
|
|
+ <!-- //배송지 정보 변경불가 -->
|
|
|
+ <div class="ship_info">
|
|
|
+ <button type="button" id="btn_adrsChange_pop" class="btn_popup"><span>배송지 변경</span></button>
|
|
|
+ <dl>
|
|
|
+ <div class="company">
|
|
|
+ <dt><span class="sr-only">배송지명</span></dt>
|
|
|
+ <dd id="recipNm" th:text="${orderInfo.recipNm}">
|
|
|
+ <!--
|
|
|
+ <span class="icon_tag">
|
|
|
+ <em class="tag_stype1">기본 배송지</em>
|
|
|
+ <em class="tag_stype2">총알배송</em>
|
|
|
+ </span>
|
|
|
+ -->
|
|
|
+ </dd>
|
|
|
+ </div>
|
|
|
+ <div class="phone">
|
|
|
+ <dt><span class="sr-only">휴대폰 번호</span></dt>
|
|
|
+ <dd id="recipPhnno" th:text="${orderInfo.recipPhnno}"></dd>
|
|
|
+ </div>
|
|
|
+ <div class="addr">
|
|
|
+ <dt><span class="sr-only">배송주소</span></dt>
|
|
|
+ <dd id="recipAddr" th:text="${orderInfo.recipBaseAddr} + ' ' + ${orderInfo.recipDtlAddr}"></dd>
|
|
|
+ </div>
|
|
|
+ <div class="ship_request">
|
|
|
+ <dt>배송요청 사항</dt>
|
|
|
+ <dd id="delvMemo" th:text="${orderInfo.delvMemo}"></dd>
|
|
|
+ </div>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ <!-- //배송지 정보 변경불가 -->
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 폴딩리스트 -->
|
|
|
+ </div>
|
|
|
+ <div class="inner">
|
|
|
+ <div class="tbl_wrap pay_wrap">
|
|
|
+ <div class="tbl_tit">
|
|
|
+ <h3>결제 정보</h3>
|
|
|
+ <strong class="pay"><span th:text="${#numbers.formatInteger(realOrdSumAmt, 1, 'COMMA')}"></span>원</strong>
|
|
|
+ </div>
|
|
|
+ <div class="tbl type1">
|
|
|
+ <table>
|
|
|
+ <colgroup>
|
|
|
+ <col width="227">
|
|
|
+ <col width="*">
|
|
|
+ </colgroup>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <dl>
|
|
|
+ <!-- 210330 : 태그 분할 -->
|
|
|
+ <div>
|
|
|
+ <dt>상품금액</dt>
|
|
|
+ <dd>
|
|
|
+ <div><span th:text="${#numbers.formatInteger(goodsSumAmt, 1, 'COMMA')}"></span>원</div>
|
|
|
+ </dd>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>배송비</dt>
|
|
|
+ <dd>
|
|
|
+ <div><span th:text="${#numbers.formatInteger(delvFeeSumAmt, 1, 'COMMA')}"></span>원</div>
|
|
|
+ </dd>
|
|
|
+ </div>
|
|
|
+ <!-- //210330 : 태그 분할 -->
|
|
|
+ <div>
|
|
|
+ <dt>상품할인(즉시할인)</dt>
|
|
|
+ <th:block th:if="${cpn1DcSumAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(cpn1DcSumAmt, 1, 'COMMA')}|"></span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${cpn1DcSumAmt}<1">
|
|
|
+ <dd><div><span>0</span>원<div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- 회원인경우노출 -->
|
|
|
+ <th:block th:if="${isLogin}">
|
|
|
+ <div>
|
|
|
+ <dt>다다익선 할인</dt>
|
|
|
+ <th:block th:if="${tmtbSumAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(tmtbSumAmt, 1, 'COMMA')}|"></span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${tmtbSumAmt}<1">
|
|
|
+ <dd><div><span >0</span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>쿠폰할인</dt>
|
|
|
+ <th:block th:if="${cpnDcSumAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(cpnDcSumAmt, 1, 'COMMA')}|"></span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${cpnDcSumAmt}<1">
|
|
|
+ <dd><div><em>0</em>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>선 포인트 사용</dt>
|
|
|
+ <th:block th:if="${prePntDcSumAmt}>0">
|
|
|
+ <dd><div><em th:text="|- ${#numbers.formatInteger(prePntDcSumAmt, 1, 'COMMA')}|"></em>P</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${prePntDcSumAmt}<1">
|
|
|
+ <dd><div><span>0</span>P</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>포인트 사용</dt>
|
|
|
+ <th:block th:if="${pntDcSumAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(pntDcSumAmt, 1, 'COMMA')}|"></span></div>P</dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${pntDcSumAmt}<1">
|
|
|
+ <dd><div><span>0</span>P</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>상품권 사용</dt>
|
|
|
+ <th:block th:if="${gfcdUseSumAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(gfcdUseSumAmt, 1, 'COMMA')}|"></span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${gfcdUseSumAmt}<1">
|
|
|
+ <dd><div><span>0</span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ <div>
|
|
|
+ <dt>마일리지 사용</dt>
|
|
|
+ <th:block th:if="${mileageDcAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(mileageDcAmt, 1, 'COMMA')}|"></span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${mileageDcAmt}<1">
|
|
|
+ <dd><div><span>0</span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>제휴 할인</dt>
|
|
|
+ <th:block th:if="${allianceDcAmt}>0">
|
|
|
+ <dd><div><span th:text="|- ${#numbers.formatInteger(allianceDcAmt, 1, 'COMMA')}|"></span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${allianceDcAmt}<1">
|
|
|
+ <dd><div><span>0</span>원</div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>적립예정 포인트</dt>
|
|
|
+ <dd>
|
|
|
+ <div>
|
|
|
+ <span th:text="${#numbers.formatInteger(savePntSumAmt, 1, 'COMMA')}">3000</span>P
|
|
|
+ </div>
|
|
|
+ </dd>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>결제방법</dt>
|
|
|
+ <!-- kcp 신용카드 -->
|
|
|
+ <th:block th:if="${orderInfo.payMeans} == 'G014_30'">
|
|
|
+ <!-- 체크카드 -->
|
|
|
+ <th:block th:if="${orderInfo.cardType} == 'Y'">
|
|
|
+ <dd><div><span th:text="|체크카드(${orderInfo.cardNm})/${orderInfo.cardMips}|"></span></div></dd>
|
|
|
+ </th:block>
|
|
|
+ <!-- 신용카드 -->
|
|
|
+ <th:block th:if="${orderInfo.cardType} == 'N'">
|
|
|
+ <dd><div><span th:text="|체크카드(${orderInfo.cardNm})/${orderInfo.cardMips}|"></span></div></dd>
|
|
|
+ </th:block>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${orderInfo.payMeans} != 'G014_30'">
|
|
|
+ <dd><div><span th:text="${orderInfo.payType}"></span></div></dd>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ </dl>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn_group btn_group_flex">
|
|
|
+ <div><button type="button" class="btn btn_gost"><span>주문 상세보기</span></button></div>
|
|
|
+ <div><button type="button" class="btn btn_dark"><span>쇼핑 계속하기</span></button></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+</main>
|
|
|
+
|
|
|
+
|
|
|
+<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 = {
|
|
|
+ "delvAddrSq" : delvAddrSq
|
|
|
+ , "recipNm" : delvObj.recipNm
|
|
|
+ , "recipPhnno" : delvObj.recipPhnno
|
|
|
+ , "recipZipcode" : delvObj.recipZipcode
|
|
|
+ , "recipBaseAddr" : delvObj.recipBaseAddr
|
|
|
+ , "recipDtlAddr" : delvObj.recipDtlAddr
|
|
|
+ , "delvMemo" : delvObj.delvMemo
|
|
|
+ }
|
|
|
+
|
|
|
+ gagajf.ajaxJsonSubmit(
|
|
|
+ "/common/updateDeliverAddr"
|
|
|
+ , JSON.stringify(jsonObj)
|
|
|
+ , function (result) {
|
|
|
+ mcxDialog.alert("수정되었습니다.");
|
|
|
+ }
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+// 1.19 배송메모설정
|
|
|
+var delvMemoSet = function(delvMemoObj) {
|
|
|
+
|
|
|
+ var rtnStr = "";
|
|
|
+ rtnStr += "| delvMemo ::: " + delvMemoObj.delvMemo;
|
|
|
+
|
|
|
+ // 변수값 설정
|
|
|
+ var jsonObj = {
|
|
|
+ "delvAddrSq" : delvAddrSq
|
|
|
+ , "delvMemo" : delvMemoObj.delvMemo
|
|
|
+ }
|
|
|
+
|
|
|
+ $("#delvMemo").text(delvMemoObj.delvMemo);
|
|
|
+
|
|
|
+ gagajf.ajaxJsonSubmit(
|
|
|
+ "/common/updateDeliverAddrDelvMemo"
|
|
|
+ , JSON.stringify(jsonObj)
|
|
|
+ , function (result) {
|
|
|
+ mcxDialog.alert("수정되었습니다.");
|
|
|
+ }
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+</th:block>
|
|
|
+</body>
|
|
|
+</html>
|