PgDepositSettleForm.html 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : PgDepositSettleForm.html
  7. * @desc : PG입금정산 Page
  8. *============================================================================
  9. * STYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2020.10.26 gagamel 최초 작성
  15. *******************************************************************************
  16. -->
  17. <div id="main">
  18. <!-- 메인타이틀 영역 -->
  19. <div class="main-title">
  20. </div>
  21. <!-- //메인타이틀 영역 -->
  22. <!-- 메뉴 설명 -->
  23. <div class="infoBox menu-desc">
  24. </div>
  25. <!-- //메뉴 설명 -->
  26. <!-- 검색조건 영역 -->
  27. <div class="panelStyle">
  28. <form id="searchForm" name="searchForm" action="#" th:action="@{'/settle/pg/deposit/list'}" onsubmit="$('#btnSearch').trigger('click'); return false;">
  29. <table class="frmStyle" aria-describedby="검색조건">
  30. <colgroup>
  31. <col style="width:10%;"/>
  32. <col style="width:60%;"/>
  33. <col style="width:10%;"/>
  34. <col/>
  35. </colgroup>
  36. <tr>
  37. <th>기간<i class="required" title="필수" aria-hidden="true"></i></th>
  38. <td>
  39. <select name="termGb">
  40. <option value="ORD_DT">주문일자</option>
  41. <option value="USAC_DT">정산일자</option>
  42. </select>
  43. <span id="terms">
  44. </span>
  45. </td>
  46. <th>PG구분</th>
  47. <td>
  48. <select name="pgGb">
  49. <option value="">[전체]</option>
  50. <option th:if="${pgGbList}" th:each="oneData, status : ${pgGbList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
  51. </select>
  52. </td>
  53. </tr>
  54. <tr>
  55. <th>결제수단</th>
  56. <td colspan="3">
  57. <select name="payMeans">
  58. <option value="">[전체]</option>
  59. <option th:if="${payMeansList}" th:each="oneData, status : ${payMeansList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
  60. </select>
  61. </td>
  62. </tr>
  63. </table>
  64. <ul class="panelBar">
  65. <li class="center">
  66. <button type="button" class="btn btn-base btn-lg" id="btnSearch">조회</button>
  67. <button type="button" class="btn btn-gray btn-lg" onclick="$('#searchForm')[0].reset();">초기화</button>
  68. </li>
  69. </ul>
  70. </form>
  71. </div>
  72. <!-- 검색조건 영역 -->
  73. <!-- 리스트 영역 -->
  74. <div class="panelStyle">
  75. <!-- 버튼 배치 영역 -->
  76. <ul class="panelBar">
  77. <li class="right">
  78. <button type="button" class="btn btn-default btn-lg" id="btnExcel">엑셀다운로드</button>
  79. </li>
  80. </ul>
  81. <!-- //버튼 배치 영역 -->
  82. <div id="gridList" style="width: 100%; height: 470px" class="ag-theme-balham"></div>
  83. </div>
  84. <!-- //리스트 영역 -->
  85. </div>
  86. <script th:inline="javascript">
  87. /*<![CDATA[*/
  88. let pgGbList = gagajf.convertToArray([[${pgGbList}]]);
  89. let payMeansList = gagajf.convertToArray([[${payMeansList}]]);
  90. let columnDefs = [
  91. {
  92. headerName: "PG구분", field: "pgGb", width: 100, cellClass: 'text-center',
  93. valueGetter: function (params) {
  94. return gagaAgGrid.lookupValue(pgGbList, params.data.pgGb);
  95. }
  96. },
  97. { headerName: "PG상점ID", field: "pgShopId", width: 100, cellClass: 'text-center' },
  98. { headerName: "결제ID", field: "pgTradeNo", width: 150, cellClass: 'text-center' },
  99. {
  100. headerName: "결제수단", field: "payMeans", width: 100, cellClass: 'text-center',
  101. valueGetter: function (params) {
  102. return gagaAgGrid.lookupValue(payMeansList, params.data.payMeans);
  103. }
  104. },
  105. { headerName: "주문번호", field: "ordNo", width: 100, cellClass: 'text-center' },
  106. { headerName: "주문일자", field: "ordDt", width: 100, cellClass: 'text-center' },
  107. { headerName: "주문상태", field: "ordDtlStat", width: 100, cellClass: 'text-center' },
  108. { headerName: "총주문금액", field: "totOrdAmt", width: 120, cellClass: 'text-right' },
  109. { headerName: "총상품금액", field: "totGoodsAmt", width: 120, cellClass: 'text-right' },
  110. { headerName: "배송비", field: "delvFeeAmt", width: 100, cellClass: 'text-right' },
  111. { headerName: "쿠폰할인금액", field: "cpnDcAmt", width: 120, cellClass: 'text-right' },
  112. { headerName: "포인트할인금액", field: "pntDcAmt", width: 120, cellClass: 'text-right' },
  113. { headerName: "상품권", field: "giftCardAmt", width: 120, cellClass: 'text-right' },
  114. { headerName: "결제금액", field: "payAmt", width: 120, cellClass: 'text-right' },
  115. { headerName: "판매/환입", field: "usacGb", width: 100, cellClass: 'text-center' },
  116. { headerName: "결제일", field: "payDt", width: 100, cellClass: 'text-center' },
  117. { headerName: "일치여부", field: "sameYn", width: 100, cellClass: 'text-center' },
  118. { headerName: "불일치사유", field: "notSameRsn", width: 120, cellClass: 'text-center' },
  119. { headerName: "차이금액", field: "diffAmt", width: 120, cellClass: 'text-right' },
  120. { headerName: "PG금액", field: "pgUsacAmt", width: 120, cellClass: 'text-right' },
  121. { headerName: "PG입금일시", field: "pgDepositDt", width: 100, cellClass: 'text-center' },
  122. { headerName: "PG승인상태", field: "pgStat", width: 100, cellClass: 'text-center' },
  123. { headerName: "PG승인상태설명", field: "pgStatDesc", width: 150, cellClass: 'text-center' },
  124. { headerName: "거래형태", field: "pgTradeType", width: 100, cellClass: 'text-center' },
  125. { headerName: "결제수수료", field: "pgFee", width: 100, cellClass: 'text-right' },
  126. { headerName: "정산예정일", field: "pgUsacDt", width: 100, cellClass: 'text-center' }
  127. ];
  128. let gridOptions = gagaAgGrid.getGridOptions(columnDefs);
  129. // 검색
  130. $('#btnSearch').on('click', function() {
  131. gagaAgGrid.fetch($('#searchForm').prop('action'), gridOptions, '#searchForm');
  132. });
  133. // 엑셀다운로드
  134. $('#btnExcel').on('click', function() {
  135. gagaAgGrid.exportToExcel('PG입금정산 목록', gridOptions);
  136. });
  137. $(document).ready(function() {
  138. cfnCreateCalendar('#terms', 'startDt', 'endDt', true);
  139. $('.btnToday').trigger('click');
  140. // Create a agGrid
  141. gagaAgGrid.createGrid('gridList', gridOptions);
  142. });
  143. /*]]>*/
  144. </script>
  145. </html>