ShotDeliveryForm.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298
  1. <!DOCTYPE html>
  2. <html lang="ko" xmlns:th="http://www.thymeleaf.org">
  3. <!--
  4. *******************************************************************************
  5. * @source : ShotDeliveryForm.html
  6. * @desc : 총알배송 Page
  7. *============================================================================
  8. * SISUN
  9. * Copyright(C) 2020 TSIT, All rights reserved.
  10. *============================================================================
  11. * VER DATE AUTHOR DESCRIPTION
  12. * === =========== ========== =============================================
  13. * 1.0 2021.06.29 sowon 최초 작성
  14. *******************************************************************************
  15. -->
  16. <div id="main">
  17. <!-- 메인타이틀 영역 -->
  18. <div class="main-title">
  19. </div>
  20. <!-- //메인타이틀 영역 -->
  21. <!-- 메뉴 설명 -->
  22. <div class="infoBox menu-desc">
  23. </div>
  24. <!-- //메뉴 설명 -->
  25. <div class="panelStyle" style="height: 750px;">
  26. <div class="panelContent">
  27. <ul class="panelBar">
  28. <li>
  29. <h4>브랜드 목록</h4>
  30. </li>
  31. <li class="right">
  32. <button type="button" class="btn btn-success btn-lg" onclick="fnShotBrandSave();">브랜드 저장</button>
  33. </li>
  34. </ul>
  35. <form id="shotBrandListForm" name="shotBrandListForm" action="#" th:action="@{'/marketing/shot/delivery/brand/list'}" th:method="post">
  36. <div class="panelContent">
  37. <div id="gridListBrand" style="width: 100%; max-height: 230px; height: 230px;" class="ag-theme-balham"></div>
  38. </div>
  39. </form>
  40. </div>
  41. <div class="panelContent">
  42. <ul class="panelBar">
  43. <li>
  44. <h4>브랜드명 : <label id="brandNm"></label></h4>
  45. </li>
  46. <li class="right">
  47. <button type="button" class="btn btn-default btn-lg" onclick="fnOpenGoodsPopup();">상품추가</button>
  48. <button type="button" class="btn btn-danger btn-lg" onclick="fnDeleteGoods();">선택삭제</button>
  49. </li>
  50. </ul>
  51. <div id="gridListGoods" style="width: 100%; max-height: 350px; height: 350px;" class="ag-theme-balham lh60"></div>
  52. <!-- <ul class="panelBar"> -->
  53. <!-- <li class="center"> -->
  54. <!-- <div class="tablePaging" id="brandGoodsPagination"></div> -->
  55. <!-- </li> -->
  56. <!-- </ul> -->
  57. </div>
  58. </div>
  59. </div>
  60. <script type="text/javascript" src="/ux/plugins/gaga/gaga.paging.js"></script>
  61. <script th:inline="javascript">
  62. var cornerDispTypeList = gagajf.convertToArray([[${cornerDispTypeList}]]);
  63. var goodsStatList =gagajf.convertToArray([[${goodsStatList}]]);
  64. // 브랜드 그룹번호 전역변수
  65. var _brandGroupNo = '';
  66. var columnDefsBrand = [
  67. {width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
  68. {headerName: "브랜드번호" , field:'brandGroupNo' , width:150, cellClass: 'text-center', editable: false },
  69. {headerName: "브랜드그룹명" , field:'brandNm' , width:400, cellClass: 'text-center',
  70. cellRenderer: function(params) {return '<a href="javascript:void(0);">' + params.value + '</a>'; },
  71. cellEditorParams: { maxlength: 50, required: true }
  72. },
  73. {headerName: "코너유형" , field:'cornerDispType' , width:180, cellClass: 'text-center',
  74. cellEditor: 'agRichSelectCellEditor',
  75. cellEditorParams: { values: gagaAgGrid.extractValues(cornerDispTypeList) },
  76. valueFormatter: function (params) { return gagaAgGrid.lookupValue(cornerDispTypeList, params.value); },
  77. valueParser: function (params) { return gagaAgGrid.lookupKey(cornerDispTypeList, params.newValue); }
  78. },
  79. {headerName: "전시순서" , field:'dispOrd' , width:100, cellClass: 'text-right',
  80. cellEditor: 'textCellEditor',
  81. cellEditorParams: { maxlength: 3, required: true }
  82. },
  83. {headerName: "등록일" , field:'regDt' , width:200, cellClass: 'text-center', editable: false }
  84. ];
  85. var columnDefsGoods = [
  86. {width: 40, minWidth: 40, cellClass: 'text-center', headerCheckboxSelection: true, checkboxSelection: true, filter: false},
  87. {headerName: "상품코드" , field:'goodsCd' , width:150, cellClass: 'text-left'
  88. , cellRenderer: function(params) {return '<a href="javascript:void(0);">' + params.value + '</a>'; }
  89. },
  90. {headerName: "상품명" , field:'goodsNm' , width:300, cellClass: 'text-left'},
  91. {headerName: "이미지" , field:'sysImgNm' , width:100 , height:60, cellClass: 'text-right'
  92. ,cellRenderer: function(params) {
  93. return '<img width="60" src="'+ _goodsUrl+ "/" + params.value + '?RS=60" alt="" onclick="cfnOpenImagePreViewPopup(\'goodsImgView\', \''+ _goodsUrl+ "/" + params.value +'\')" onerror="this.src=\'/image/no.png\';"/>';
  94. }
  95. },
  96. {headerName: "재고" , field:'stockQtySum' , width:80 , cellClass: 'text-center'
  97. , cellRenderer: function(params) {return !gagajf.isNull(params.value) ? params.value : '0'; }
  98. },
  99. {headerName: "할인율(%)" , field:'dcRate' , width:80 , cellClass: 'text-center'},
  100. {headerName: "정상가" , field:'listPrice' , width:100, cellClass: 'text-right' , hide : true
  101. , valueFormatter: function(params) { return params.value.addComma(); }
  102. },
  103. {headerName: "판매가" , field:'currPrice' , width:100, cellClass: 'text-right'
  104. , valueFormatter: function(params) { return params.value.addComma(); }
  105. },
  106. {headerName: "정상/이월여부", field:'formalGb' , width:120, cellClass: 'text-center'},
  107. {headerName: "상품상태" , field:'goodsStat' , width:100, cellClass: 'text-center'
  108. , valueFormatter: function(params) { return gagaAgGrid.lookupValue(goodsStatList, params.value); }
  109. },
  110. {headerName: "업체" , field:'supplyCompNm' , width:150, cellClass: 'text-left'},
  111. {headerName: "기획전상세" , field:'planDtlSq' , width:200, cellClass: 'text-left', hide: true},
  112. {headerName: "등록일" , field:'regDt' , width:100, cellClass: 'text-left'
  113. , cellRenderer: function(params) { return !gagajf.isNull(params.value) ? params.value.toDate("YYYY-MM-DD HH:MM:SS").format("YYYY-MM-DD") : ''; }
  114. },
  115. ];
  116. var gridOptionsBrand = gagaAgGrid.getGridOptions(columnDefsBrand);
  117. gridOptionsBrand.suppressRowClickSelection = true;
  118. gridOptionsBrand.stopEditingWhenGridLosesFocus = true;
  119. gridOptionsBrand.defaultColDef.editable = true;
  120. //gridOptionsBrand.rowSelection = 'multiple';
  121. var gridOptionsGoods = gagaAgGrid.getGridOptions(columnDefsGoods);
  122. gridOptionsGoods.rowSelection = 'multiple';
  123. gridOptionsGoods.rowHeight = 60; //이미지가 있을경우 높이 지정해야함.
  124. gridOptionsGoods.suppressRowClickSelection = true;
  125. gridOptionsGoods.onCellClicked = function(event) {
  126. if (event.colDef.field == 'goodsCd') {
  127. // 상품 상세 팝업
  128. cfnOpenGoodsDetailPopup('U',event.data.goodsCd);
  129. }
  130. }
  131. // 브랜드 셀 클릭 이벤트
  132. gridOptionsBrand.onCellClicked = function(event) {
  133. var field = event.colDef.field;
  134. if (field != 'brandNm') return;
  135. fnBindSearch(event.data);
  136. }
  137. // 코너 상품 조회 바인딩
  138. var fnBindSearch = function(data) {
  139. if (!gagajf.isNull(data.brandNm)) {
  140. $('#brandNm').html(data.brandNm);
  141. _brandGroupNo = data.brandGroupNo;
  142. fnShotGoodsSearch();
  143. }
  144. }
  145. // 상품 추가 버튼 클릭시
  146. var fnOpenGoodsPopup = function() {
  147. var allData = gagaAgGrid.getAllRowData(gridOptionsBrand);
  148. if (allData.length < 1 ) {
  149. mcxDialog.alert('브랜드가 존재 하지 않습니다.');
  150. return;
  151. }
  152. if ($("#brandNm").text() == null || $("#brandNm").text()=='') {
  153. mcxDialog.alert('브랜드를 선택해주세요.');
  154. return;
  155. }
  156. cfnOpenGoodsPopup('fnCreateGoods');
  157. }
  158. // 브랜드 조회
  159. var fnBrandSearch = function() {
  160. var formId = '#shotBrandListForm';
  161. gagaAgGrid.fetch($(formId).prop('action'), gridOptionsBrand, formId
  162. , function() {
  163. $('#gridListGoods').html('');
  164. $('#brandNm').html('');
  165. gagaAgGrid.createGrid('gridListGoods', gridOptionsGoods);
  166. });
  167. uifnPopupClose('fnCreateGoods');
  168. }
  169. // 코너 저장
  170. var fnShotBrandSave = function() {
  171. var changeData = gagaAgGrid.getChangedData(gridOptionsBrand);
  172. if (changeData.length < 1) {
  173. mcxDialog.alert('변경된 브랜드 목록이 없습니다.');
  174. return;
  175. }
  176. // Validation
  177. if (!gagaAgGrid.validation(gridOptionsBrand, changeData))
  178. return;
  179. mcxDialog.confirm('저장하시겠습니까?', {
  180. cancelBtnText: "취소",
  181. sureBtnText: "확인",
  182. sureBtnClick: function() {
  183. var jsonData = JSON.stringify(changeData);
  184. gagajf.ajaxJsonSubmit('/marketing/shot/delivery/brand/update', jsonData, fnBrandSearch);
  185. }
  186. });
  187. }
  188. // 상품추가
  189. var fnCreateGoods = function(result) {
  190. if (result.length < 1) return;
  191. var oldGoodsList = gagaAgGrid.getAllRowData(gridOptionsGoods);
  192. for (var disp = 0; disp < result.length; disp++) {
  193. let addChk = true;
  194. // 받아온 data for
  195. for(let j = 0 ; j < oldGoodsList.length ; j++) {
  196. if(oldGoodsList[j].goodsCd == result[disp].goodsCd) { addChk = false; } // 중복체크
  197. }
  198. if(addChk) {
  199. var goods = { brandGroupNo : _brandGroupNo ,
  200. goodsCd : result[disp].goodsCd ,
  201. dispOrd : oldGoodsList.length+1
  202. };
  203. oldGoodsList.unshift(goods);
  204. }
  205. }
  206. mcxDialog.confirm('선택하신 상품을 추가 하시겠습니까?', {
  207. cancelBtnText: "취소",
  208. sureBtnText: "확인",
  209. sureBtnClick: function() {
  210. var jsonData = JSON.stringify(oldGoodsList);
  211. gagajf.ajaxJsonSubmit('/marketing/shot/delivery/goods/save', jsonData, fnShotGoodsSearch);
  212. }
  213. });
  214. }
  215. // 브랜드 상품 조회
  216. var fnShotGoodsSearch = function() {
  217. uifnPopupClose('popupGoods');
  218. var actionUrl = '/marketing/shot/delivery/goods/list';
  219. var data = {brandGroupNo:_brandGroupNo};
  220. var jsonData = JSON.stringify(data);
  221. gagajf.ajaxJsonSubmit(actionUrl, jsonData, function(data) {
  222. var data = data.brandGoodsList; //XSS 그리드 내 변환
  223. let modifyList = [];
  224. $.each(data, function(idx, item) {
  225. let goodsNm = item.goodsNm;
  226. item.goodsNm = goodsNm.replaceXSS();
  227. modifyList.push(item);
  228. });
  229. gridOptionsGoods.api.setRowData(modifyList);
  230. });
  231. }
  232. //선택삭제
  233. var fnDeleteGoods = function() {
  234. var removedData = gagaAgGrid.removeRowData(gridOptionsGoods);
  235. if (removedData.length == 0) {
  236. mcxDialog.alert('선택된 행이 없습니다.');
  237. return;
  238. }
  239. mcxDialog.confirm('선택된 상품을 삭제하시겠습니까?', {
  240. cancelBtnText: "취소",
  241. sureBtnText: "확인",
  242. sureBtnClick: function() {
  243. var jsonData = JSON.stringify(removedData);
  244. gagajf.ajaxJsonSubmit('/marketing/shot/delivery/goods/delete', jsonData, function() {
  245. fnShotGoodsSearch();
  246. });
  247. }
  248. });
  249. }
  250. // 엑셀상품추가
  251. //var fnGoodsExcelUpload = function() {
  252. // cfnExcelUploadPopup('createGoods', 'fnCreatePlanGoodsExcel');
  253. //}
  254. $(document).ready(function() {
  255. gagaAgGrid.createGrid('gridListBrand', gridOptionsBrand);
  256. gagaAgGrid.createGrid('gridListGoods', gridOptionsGoods);
  257. fnBrandSearch();
  258. });
  259. </script>