ExtmallSearchForm.html 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : ExtmallSearchForm.html
  7. * @desc : 제휴몰 리스트 팝업
  8. *============================================================================
  9. * STYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2020.12.28 xodud1202 최초 작성
  15. *******************************************************************************
  16. -->
  17. <div class="modalPopup" data-width="500" id="popupExtmallList">
  18. <div class="panelStyle">
  19. <!-- TITLE -->
  20. <div class="panelTitle">
  21. <strong>공급업체 목록</strong>
  22. <button type="button" class="close" onclick="uifnPopupClose('popupExtmallList');"><em class="fa fa-times"></em></button>
  23. </div>
  24. <!-- //TITLE -->
  25. <!-- 검색 조건 -->
  26. <div class="panelContent">
  27. <form id="searchExtmallListForm" name="searchExtmallListForm" action="#" th:action="@{'/ocm/extmall/list'}" onsubmit="$('#btnSearchExtmallList').trigger('click'); return false;">
  28. <table class="frmStyle" aria-describedby="검색조건">
  29. <colgroup>
  30. <col style="width:15%;"/>
  31. <col/>
  32. </colgroup>
  33. <tbody>
  34. <tr>
  35. <th>제휴몰 명</th>
  36. <td>
  37. <input type="text" name="searchTxt" th:value="${params.searchTxt}" maxlength="20" onkeypress="if (event.keyCode == 13) { $('#btnSearchExtmallList').trigger('click'); }"/>
  38. </td>
  39. </tr>
  40. </tbody>
  41. </table>
  42. <ul class="panelBar">
  43. <li class="center">
  44. <button type="button" class="btn btn-base btn-lg" id="btnSearchExtmallList">조회</button>
  45. </li>
  46. </ul>
  47. </form>
  48. </div>
  49. <!-- //검색 조건 -->
  50. <!-- 리스트 영역 -->
  51. <div class="panelContent">
  52. <div id="gridComapanyPopupList" style="width: 100%; height: 470px" class="ag-theme-balham"></div>
  53. </div>
  54. <!-- //리스트 영역 -->
  55. <!-- 버튼 배치 영역 -->
  56. <ul class="panelBar">
  57. <li class="right">
  58. <button type="button" class="btn btn-info btn-lg" id="btnConfirmExtmall">확인</button>
  59. </li>
  60. </ul>
  61. </div>
  62. <script th:inline="javascript">
  63. /*<![CDATA[*/
  64. let extmallGbList = gagajf.convertToArray([[${extmallGbList}]]); // 상품 상태 리스트
  65. let columnExtmallPopupDefList = [
  66. {width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
  67. {headerName: "제휴몰구분", field: "vendorId" , width: 120, cellClass: 'text-center',
  68. cellEditorParams: { values: gagaAgGrid.extractValues(extmallGbList) },
  69. valueFormatter: function (params) { return gagaAgGrid.lookupValue(extmallGbList, params.value); },
  70. valueParser: function (params) { return gagaAgGrid.lookupKey(extmallGbList, params.newValue); }
  71. },
  72. {headerName: "제휴몰ID", field: "extmallId", width: 150, cellClass: 'text-center'},
  73. {headerName: "제휴몰명", field: "extmallNm", width: 150, cellClass: 'text-center'}
  74. ];
  75. let gridOptionsExtmallPopupList = gagaAgGrid.getGridOptions(columnExtmallPopupDefList);
  76. gridOptionsExtmallPopupList.rowSelection = "multiple";
  77. // Row double click
  78. gridOptionsExtmallPopupList.onRowDoubleClicked = function(event) {
  79. $('#btnConfirmExtmall').trigger('click');
  80. }
  81. // 조회
  82. $('#btnSearchExtmallList').on('click', function() {
  83. // Fetch data
  84. gagaAgGrid.fetch($('#searchExtmallListForm').prop('action'), gridOptionsExtmallPopupList, '#searchExtmallListForm');
  85. });
  86. // 확인
  87. $('#btnConfirmExtmall').on('click', function() {
  88. var selectedData = gagaAgGrid.selectedRowData(gridOptionsExtmallPopupList);
  89. if (selectedData.length == 0) {
  90. mcxDialog.alert('선택된 공급업체가 없습니다.');
  91. return false;
  92. }
  93. var callbackFn = [[${params.callbackFn}]];
  94. var jsonData = JSON.stringify(selectedData);
  95. if (typeof callbackFn != 'undefined' && callbackFn) {
  96. if (typeof callbackFn == 'function') {
  97. callbackFn(jsonData);
  98. } else {
  99. if (callbackFn) {
  100. if (callbackFn.indexOf("(") == -1) {
  101. eval(callbackFn + "(" + jsonData + ")");
  102. } else {
  103. eval(callbackFn(jsonData));
  104. }
  105. }
  106. }
  107. uifnPopupClose('popupExtmallList');
  108. }
  109. });
  110. $(document).ready(function() {
  111. // Create a agGrid
  112. gagaAgGrid.createGrid('gridComapanyPopupList', gridOptionsExtmallPopupList);
  113. });
  114. /*]]>*/
  115. </script>
  116. </div>
  117. </html>