|
|
@@ -0,0 +1,268 @@
|
|
|
+<!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/DefaultLayoutMob">
|
|
|
+<!--
|
|
|
+ *******************************************************************************
|
|
|
+ * @source : OrderAddPaymentMob.html
|
|
|
+ * @desc : 추가결제화면 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2020 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.05.10 jsh77b 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+<th:block layout:fragment="content">
|
|
|
+
|
|
|
+<!-- payment.js -->
|
|
|
+<script type="text/javascript" th:src="${@environment.getProperty('pg.kcp.js.url')}" src=""></script>
|
|
|
+<script type="text/javascript" src="/biz/payment.js"></script>
|
|
|
+
|
|
|
+<!-- 주문정보form -->
|
|
|
+<form id="order_info" name="order_info" method="post" action="/order/addPay/result/response" style="display:none"></form>
|
|
|
+<!-- //주문정보form -->
|
|
|
+
|
|
|
+<form class="form_wrap" name="addPayForm" id="addPayForm">
|
|
|
+ <input type="hidden" name="refundAmt" th:value="${refundAmt}">
|
|
|
+ <input type="hidden" name="ordNo" th:value="${ordNo}">
|
|
|
+ <input type="hidden" name="addPayCost" th:value="${addPayCost}">
|
|
|
+ <input type="hidden" name="ordChgSq" th:value="${ordChgSq}">
|
|
|
+
|
|
|
+ <input type="hidden" name="chgGb" th:value="${chgGb}">
|
|
|
+ <input type="hidden" name="chgerPhnno" th:value="${chgerPhnno}">
|
|
|
+ <input type="hidden" name="chgerNm" th:value="${chgerNm}">
|
|
|
+ <input type="hidden" name="goodsNm" th:value="${goodsNm}">
|
|
|
+
|
|
|
+ <main class="container od">
|
|
|
+ <section class="content od_extra">
|
|
|
+ <form action="" class="form_wrap">
|
|
|
+ <!-- 주문내역 -->
|
|
|
+ <div class="inner wide">
|
|
|
+ <div class="foldGroup">
|
|
|
+ <ul>
|
|
|
+ <li class="fold_order">
|
|
|
+ <div class="fold_head">
|
|
|
+ <a href="javascript:void(0)">
|
|
|
+ <div>
|
|
|
+ <div class="fold_tit">
|
|
|
+ <th:block th:if="${chGb} == 'G680_20'">
|
|
|
+ <span pan>취소상품</span>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${chGb} == 'G680_30'">
|
|
|
+ <span pan>반품상품</span>
|
|
|
+ </th:block>
|
|
|
+ <th:block th:if="${chGb} == 'G680_40'">
|
|
|
+ <span pan>교환상품</span>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="fold_cont" style="display: none;">
|
|
|
+ <div class="od_item_box">
|
|
|
+ <div class="part_goods">
|
|
|
+ <th:block th:each="goods, i : ${orderAddPayGoodsList}" th:with="imageUrl=${@environment.getProperty('upload.goods.view')}">
|
|
|
+ <div class="goods_section">
|
|
|
+ <div class="goods_detail">
|
|
|
+ <a href="">
|
|
|
+ <div class="thumb_box">
|
|
|
+ <img th:src="${imageUrl + '/' + goods.sysImgNm}" src="/" width="100%" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="info_box">
|
|
|
+ <div class="od_name">
|
|
|
+ <div class="brand">
|
|
|
+ <span th:text="${goods.brandEnm} + ' ' + ${goods.brandKnm}"></span>
|
|
|
+ </div>
|
|
|
+ <div class="name" th:text="${goods.goodsNm}"></div>
|
|
|
+ </div>
|
|
|
+ <div class="od_opt">
|
|
|
+ <div class="option" th:each="colorNm, index : ${goods.colorNmArr}">
|
|
|
+ <em th:text="${colorNm}"></em><em th:text="${goods.optCd2Arr[index.index]}"></em>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="od_calc">
|
|
|
+ <p class="count">수량 <em th:text="${goods.chgQty}"></em>개</p>
|
|
|
+ <p class="price">
|
|
|
+ <span class="selling_price"><em th:text="${#numbers.formatInteger((goods.currPrice + goods.optAddPrice) * goods.chgQty, 1, 'COMMA')}"></em>원</span>
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="od_amount_box">
|
|
|
+ <dl>
|
|
|
+ <div>
|
|
|
+ <dt>환불상품금액</dt>
|
|
|
+ <dd th:text="|${#numbers.formatInteger(refundAmt, 1, 'COMMA')}원|"></dd>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <dt>반품/교환배송비</dt>
|
|
|
+ <dd th:text="|${#numbers.formatInteger(addPayCost, 1, 'COMMA')}원|"></dd>
|
|
|
+ </div>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ <div class="totalprice_box">
|
|
|
+ <dl>
|
|
|
+ <dt>총 결제 예정 금액</dt>
|
|
|
+ <dd data-weight="price" data-font="lato"><span th:text="|${#numbers.formatInteger(addPayCost, 1, 'COMMA')}|"></span>원</dd>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ <div class="announce_txt">
|
|
|
+ <div class="announce_list">
|
|
|
+ <ul>
|
|
|
+ <li>환불할 상품금액이 반품/교환 배송비보다 적을 경우 배송비를 결제하신 후 남은 상품금액이 환불처리 됩니다.</li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- //주문고객정보 -->
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- //주문내역 -->
|
|
|
+
|
|
|
+ <!-- 결제 정보 -->
|
|
|
+ <div class="inner">
|
|
|
+ <div class="tbl_wrap">
|
|
|
+ <div class="tbl_tit">
|
|
|
+ <h3>결제수단 선택</h3>
|
|
|
+ </div>
|
|
|
+ <div class="tbl tbl_radio">
|
|
|
+ <table>
|
|
|
+ <colgroup>
|
|
|
+ <col width="*">
|
|
|
+ </colgroup>
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <th class="sr-only">신용카드</th>
|
|
|
+ <td>
|
|
|
+ <div class="form_field">
|
|
|
+ <input id="chk-1" type="radio" name="rdi-paynormal" value="KCP|G014_30" checked="checked">
|
|
|
+ <label for="chk-1"><span>신용카드</span></label>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <th class="sr-only">휴대폰결제</th>
|
|
|
+ <td>
|
|
|
+ <div class="form_field">
|
|
|
+ <input id="chk-2" type="radio" name="rdi-paynormal" value="KCP|G014_60">
|
|
|
+ <label for="chk-2"><span>휴대폰 결제</span></label>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="area_paymentinfo">
|
|
|
+ <div class="paymentinfo">
|
|
|
+ <div class="payinfo_blk_wrap">
|
|
|
+ <a href="">
|
|
|
+ 구매조건 확인 및 결제대행 서비스 약관 동의
|
|
|
+ <span>보기</span>
|
|
|
+ </a>
|
|
|
+ <div class="payinfo_blk_parent">
|
|
|
+ <div class="payinfo_blk">
|
|
|
+ <a href="javascript:void(0);">
|
|
|
+ 개인정보 제공에 대한 동의
|
|
|
+ <span>보기</span>
|
|
|
+ </a>
|
|
|
+ <div class="infotxt">
|
|
|
+ 개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.개인정보제공에 대한 동의 내용입니다.
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="payinfo_blk">
|
|
|
+ <a href="javascript:void(0);">
|
|
|
+ 결제대행 서비스 약관 동의
|
|
|
+ <span>보기</span>
|
|
|
+ </a>
|
|
|
+ <div class="infotxt">
|
|
|
+ 결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.결제대행서비스 약관 동의 내용입니다.
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="agree_payment">
|
|
|
+ 위 주문내역을 확인 하였으며, 회원 본인은 <br> 결제에 동의합니다.
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- //결제 정보 -->
|
|
|
+ <div class="inner wide">
|
|
|
+ <div class="area_paybtn">
|
|
|
+ <div class="btn_group btn_group_flex">
|
|
|
+ <div>
|
|
|
+ <button type="button" class="btn btn_primary" id="btn_payment">동의 후 <span class="total_price" th:text="|${#numbers.formatInteger(addPayCost, 1, 'COMMA')}|"></span>원 결제하기</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </section>
|
|
|
+ </main>
|
|
|
+</form>
|
|
|
+
|
|
|
+<script th:inline="javascript">
|
|
|
+//결재하기
|
|
|
+$("#btn_payment").on("click", function(){
|
|
|
+ var paynormal = $("input[name='rdi-paynormal']:checked").val();
|
|
|
+ var paynormalArr = paynormal.split("|");
|
|
|
+ var pgGb = paynormalArr[0];
|
|
|
+ var payMeans = paynormalArr[1];
|
|
|
+
|
|
|
+ // 주문데이타 생성
|
|
|
+ var orderData = {
|
|
|
+ "pgGb" : pgGb
|
|
|
+ ,"payMeans" : payMeans // 네이버페이, 카카오페이
|
|
|
+ ,"ordNo" : $("#addPayForm input[name=ordNo]").val()
|
|
|
+ ,"addPayCost" : $("#addPayForm input[name=addPayCost]").val()
|
|
|
+ ,"ordChgSq" : $("#addPayForm input[name=ordChgSq]").val()
|
|
|
+ ,"chgGb" : $("#addPayForm input[name=chgGb]").val()
|
|
|
+ ,"chgerPhnno" : $("#addPayForm input[name=chgerPhnno]").val()
|
|
|
+ ,"chgerNm" : $("#addPayForm input[name=chgerNm]").val()
|
|
|
+ ,"goodsNm" : $("#addPayForm input[name=goodsNm]").val()
|
|
|
+ };
|
|
|
+
|
|
|
+ $.ajax( {
|
|
|
+ type : "POST",
|
|
|
+ url : '/order/addPayment',
|
|
|
+ data : JSON.stringify(orderData),
|
|
|
+ dataType : 'html',
|
|
|
+ beforeSend : function(xhr, settings) {
|
|
|
+ xhr.setRequestHeader("AJAX" , "true");
|
|
|
+ xhr.setRequestHeader('Accept' , 'application/json');
|
|
|
+ xhr.setRequestHeader('Content-Type' , 'application/json');
|
|
|
+ },
|
|
|
+ success : function(result) {
|
|
|
+ // 결재정보로드
|
|
|
+ $("#order_info").html(result);
|
|
|
+
|
|
|
+ var pgGb = $("#order_info input[name=pgGb]").val();
|
|
|
+
|
|
|
+ if (pgGb == "NAVER") {
|
|
|
+ fnNaverPaymentReady();
|
|
|
+ } else if (pgGb == "KAKAO") {
|
|
|
+ fnKakaoPaymentReady();
|
|
|
+ } else if (pgGb == "KCP" || pgGb == "PAYCO") {
|
|
|
+ jsf__pay(document.order_info);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+});
|
|
|
+
|
|
|
+</script>
|
|
|
+</th:block>
|
|
|
+</body>
|
|
|
+</html>
|
tsit14