BangoodsListForm.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : BangoodsListForm.html
  7. * @desc : 출고금지상품관리 Page
  8. *=============================================================
  9. * ISTYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *=============================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== ==================================
  14. * 1.0 2020.11.10 moon 최초 작성
  15. * 1.1
  16. ********************************************************************************
  17. -->
  18. <div id="main">
  19. <!-- 메인타이틀 영역 -->
  20. <div class="main-title">
  21. </div>
  22. <!-- //메인타이틀 영역 -->
  23. <!-- 메뉴 설명 -->
  24. <div class="infoBox menu-desc">
  25. </div>
  26. <!-- //메뉴 설명 -->
  27. <!-- 검색조건 영역 -->
  28. <div class="panelStyle">
  29. <!-- TITLE -->
  30. <div class="panelTitle">
  31. <h3><i class="fa fa-info-circle"></i>아래 검색조건 중 <font color="red">기간, 키워드</font>중 하나를 꼭 입력해 주세요.</h3>
  32. <span class="panelControl">
  33. <i class="fa fa-chevron-up"></i>
  34. </span>
  35. </div>
  36. <!-- //TITLE -->
  37. <div class="panelContent">
  38. <form id="searchForm" name="searchForm" action="#" th:action="@{'/delivery/bangoods/list'}" onsubmit="fnSearchList(); return false;">
  39. <table class="frmStyle">
  40. <colgroup>
  41. <col style="width:8%;"/>
  42. <col style="width:30%;"/>
  43. <col style="width:8%;"/>
  44. <col style="width:30%;"/>
  45. </colgroup>
  46. <tr>
  47. <th class="dashR">업체/브랜드</th>
  48. <td class="dashR">
  49. <select name="supplyCompCd" id="supplyCompCd">
  50. <option value="">[전체]</option>
  51. <option th:if="${supplyCompList}" th:each="oneData, status : ${supplyCompList}" th:value="${oneData.cd}" th:text="${oneData.cdNm}"></option>
  52. </select>
  53. /
  54. <select name="brandCd" id="brandCd">
  55. <option value="">[전체]</option>
  56. </select>
  57. </td>
  58. <th class="dashR">구분</th>
  59. <td class="dashR">
  60. <select name="goodsGb" id="">
  61. <option value="goodsCd">상품코드</option>
  62. <option value="goodsNm">상품명</option>
  63. </select>
  64. <input type="text" class="w40p" name="searchTxt" placeholder="" maxlength="20" />
  65. </td>
  66. </tr>
  67. <tr>
  68. <th class="dashR">출고처</th>
  69. <td class="dashR">
  70. <select name="delvLocCd" id="delvLocCd">
  71. <option value="">[전체]</option>
  72. <option th:if="${getDeliveryLocList}" th:each="oneData, status : ${getDeliveryLocList}" th:value="${oneData.cd}" th:text="${oneData.cdNm}"></option>
  73. </select>
  74. </td>
  75. <th class="dashR">삭제여부</th>
  76. <td class="dashR">
  77. <select name="delYn" id="delYn" class="w80">
  78. <option value="">전체</option>
  79. <option value="N" selected>N</option>
  80. <option value="Y">Y</option>
  81. </select>
  82. </td>
  83. </tr>
  84. <tr>
  85. <th class="dashR">등록일</th>
  86. <td colspan="4" class="dashR">
  87. <span id="terms"></span>
  88. </td>
  89. </tr>
  90. <tr>
  91. <th class="dashR">출고금지시작일자</th>
  92. <td colspan="" class="dashR">
  93. <span id="terms2"></span>
  94. </td>
  95. <th class="dashR">출고금지종료일자</th>
  96. <td colspan="" class="dashR">
  97. <span id="terms3"></span>
  98. </td>
  99. </tr>
  100. </table>
  101. <ul class="panelBar">
  102. <li class="center">
  103. <button type="button" class="btn btn-base btn-lg" id="btnSearch">조회</button>
  104. <button type="button" class="btn btn-gray btn-lg" onclick="$('#searchForm')[0].reset(); fnInitCalendar();">초기화</button>
  105. <button type="button" id="btnExcel" class="btn btn-info btn-lg" >엑셀다운로드</button>
  106. </li>
  107. </ul>
  108. </form>
  109. </div>
  110. </div>
  111. <!-- //검색조건 영역 -->
  112. <!-- 리스트 영역 -->
  113. <div class="panelStyle">
  114. <ul class=panelBar>
  115. <li class="left">
  116. <button type="button" id="btnSoldout" class="btn btn-danger btn-lg" onclick="deleteBangoods();" >삭제</button>
  117. </li>
  118. <li class="right">
  119. <button type="button" id="btnSave" class="btn btn-success btn-lg btnRight" onclick="registerBangoods();">등록</button>
  120. </li>
  121. </ul>
  122. <div class="panelContent" style="overflow: hidden;">
  123. <div id="gridList" style="width:100%; height: 500px;" class="ag-theme-balham lh60"></div>
  124. </div>
  125. </div>
  126. <!-- //리스트 영역 -->
  127. </div>
  128. <script th:inline="javascript">
  129. /*<![CDATA[*/
  130. /*************************************************************************
  131. * AG-GRID 영역
  132. **************************************************************************/
  133. var uploadGoodsUrl = [[${@environment.getProperty('upload.goods.view')}]];
  134. var roleCd = [[${sessionInfo.roleCd}]];
  135. var columnDefs = [
  136. { width: 42, minWidth: 42, cellClass: 'text-center', headerCheckboxSelection: true, headerCheckboxSelectionFilteredOnly: true
  137. , checkboxSelection: function (params) {
  138. return (params.data.delYn == 'N' ) ? true : false;
  139. },
  140. },
  141. {headerName: "출고금지상품번호", field: "delvBanGoodsSq",width: 50, cellClass: 'text-center', hide: true},
  142. {headerName: "삭제", field: "delYn", width: 50, cellClass: 'text-center'},
  143. {headerName: "브랜드", field: "brandKnm", width: 150, cellClass: 'text-center'},
  144. {headerName: "출고처명", field: "delvLocNm", width: 150, cellClass: 'text-center'},
  145. {headerName: "이미지", field: "sysImgNm", width: 100, height: 60, cellClass: 'text-center',
  146. cellRenderer: function(params) {
  147. return '<img width="60" src="'+ _goodsUrl+ "/" +params.value + '" alt=""/>';
  148. }
  149. },
  150. {headerName: "상품명", field: "goodsNm", width: 150, cellClass: 'text-center'},
  151. {
  152. headerName: "상품코드", field: "goodsCd", width: 130, cellClass: 'text-center', sortable: true,
  153. cellRenderer: function (params) {
  154. if (roleCd.indexOf("C") < 0) {
  155. return "<a href=\"javascript:void(0);\" onclick=\"cfnOpenGoodsDetailPopup('U','" + params.value + "');\">" + params.value + "</a>";
  156. } else {
  157. return params.value;
  158. }
  159. }
  160. },
  161. {headerName: "옵션1", field: "optCd1", width: 80, cellClass: 'text-center'},
  162. {headerName: "옵션2", field: "optCd2", width: 80, cellClass: 'text-center'},
  163. {headerName: "상품상태", field: "goodsStat", width: 80, cellClass: 'text-center'},
  164. {headerName: "출고금지시작일자", field: "delvBanStdt", width: 150, cellClass: 'text-center', cellRenderer: function (params) { return gagaAgGrid.toDateFormat(params.value); }},
  165. {headerName: "출고금지종료일자", field: "delvBanEddt", width: 150, cellClass: 'text-center', cellRenderer: function (params) { return gagaAgGrid.toDateFormat(params.value); }},
  166. {headerName: "등록일자", field: "regDt", width: 100, cellClass: 'text-center', cellRenderer: function (params) { return gagaAgGrid.toDateFormat(params.value); }}
  167. ];
  168. var gridOptions = gagaAgGrid.getGridOptions(columnDefs);
  169. //gridOptions.rowSelection = 'multiple';
  170. //gridOptions.suppressRowClickSelection = true;
  171. gridOptions.isRowSelectable = function(rowNode) {
  172. return rowNode.data.delYn == 'N';
  173. }
  174. gridOptions.rowHeight = 60; //이미지가 있을경우 높이 지정해야함.
  175. //gridOptions.rowHeight = 60;
  176. /*************************************************************************
  177. * 조회 버튼 클릭 시
  178. **************************************************************************/
  179. $('#btnSearch').on('click', function() {
  180. fnSearchList();
  181. });
  182. /*************************************************************************
  183. * 조회
  184. **************************************************************************/
  185. var fnSearchList = function() {
  186. if($('#stDate').val() == ''){
  187. mcxDialog.alert('시작 기간을 입력하세요.');
  188. return;
  189. }
  190. if($('#edDate').val() == ''){
  191. mcxDialog.alert('종료 기간을 입력하세요.');
  192. return;
  193. }
  194. // 날짜 유효성 체크
  195. if (Number($('#stDate').val().replaceAll("-", "")) > Number($('#edDate').val().replaceAll("-", ""))) {
  196. mcxDialog.alert("시작일은 종료일보다 클 수 없습니다.");
  197. return;
  198. }
  199. gagaAgGrid.fetch($('#searchForm').prop('action'), gridOptions, '#searchForm', function() {
  200. });
  201. }
  202. /*************************************************************************
  203. * 달력 초기화
  204. **************************************************************************/
  205. var fnInitCalendar = function() {
  206. cfnChangeCalendar('7d', $('#stDate'), $('#edDate')); //달력 초기화
  207. }
  208. /*************************************************************************
  209. * 업체 콤보박스 변경 시
  210. **************************************************************************/
  211. $('#searchForm select[name=supplyCompCd]').on('change', function() {
  212. var actionUrl = '/renderer/supplyCompany/brand/list/'+ $(this).val();
  213. cfnCreateCombo(actionUrl, $('#searchForm select[name=brandCd]'), "[전체]");
  214. var actionUrl2 = '/renderer/delvloc/list/'+ $(this).val();
  215. cfnCreateCombo(actionUrl2, $('#searchForm select[name=delvLocCd]'), "[전체]");
  216. });
  217. /*************************************************************************
  218. * 엑셀다운로드
  219. **************************************************************************/
  220. $('#btnExcel').on('click', function() {
  221. var totalRows = gridOptions.api.getDisplayedRowCount();
  222. if(totalRows==0){
  223. mcxDialog.alert('조회된 내역이 없습니다.');
  224. return;
  225. }
  226. var date = new Date().format("YYYYMMDDHHmmss");
  227. var params = {
  228. fileName : "출고금지상품목록_"+ date,
  229. sheetName: "DATA"
  230. }
  231. gridOptions.excelStyles = [
  232. {
  233. id: 'dateFormat',
  234. dataType: 'dateTime',
  235. numberFormat: {
  236. format: 'YYYY-MM-DD;@'
  237. }
  238. },
  239. {
  240. id: 'textFormat',
  241. dataType: 'string'
  242. }
  243. ]
  244. gridOptions.api.exportDataAsExcel(params);
  245. });
  246. /*************************************************************************
  247. * 삭제
  248. **************************************************************************/
  249. var deleteBangoods = function(){
  250. var selectedData = gridOptions.api.getSelectedNodes();
  251. $.each(selectedData, function(idx, row) {
  252. if(row.data.delYn == "Y") {
  253. gridOptions.api.deselectIndex(row.rowIndex);
  254. }
  255. });
  256. mcxDialog.confirm("삭제하시겠습니까?", {
  257. cancelBtnText: "취소",
  258. sureBtnText: "확인",
  259. sureBtnClick: function() {
  260. var gridData = gagaAgGrid.removeRowData(gridOptions,false);
  261. if (gridData.length == 0) {
  262. mcxDialog.alert('선택된 행이 없습니다.');
  263. return;
  264. }
  265. var createData = [];
  266. $.each(gridData, function(idx, item) {
  267. var param = new Object;
  268. param.delvBanGoodsSq = item.delvBanGoodsSq;
  269. param.goodsCd = item.goodsCd;
  270. param.optCd1 = item.optCd1;
  271. param.optCd2 = item.optCd2;
  272. createData.push(param);
  273. });
  274. var jsonData = JSON.stringify(createData);
  275. gagajf.ajaxJsonSubmit('/delivery/bangoods/delete', jsonData, fnSearchList);
  276. }
  277. });
  278. }
  279. /*************************************************************************
  280. * 등록 팝업 호출
  281. **************************************************************************/
  282. var registerBangoods = function(){
  283. var actionUrl = "/delivery/bangoods/regist/form";
  284. cfnOpenModalPopup(actionUrl,'popupRegistBangoods');
  285. }
  286. $(document).ready(function() {
  287. gagaAgGrid.createGrid('gridList', gridOptions);
  288. gridOptions.api.hideOverlay();
  289. var hideList = ["btnThisWeek", "btnYesterWeek", "btnRecentMonth", "btnThisMonth", "btnYesterMonth", "btnRecent3Month"];
  290. cfnCreateCalendar('#terms', 'stDate', 'edDate', true, '출고금지상품관리');
  291. cfnCreateCalendar('#terms2', 'stDate2', 'edDate2', true, '출고금지상품관리','',hideList);
  292. cfnCreateCalendar('#terms3', 'stDate3', 'edDate3', true, '출고금지상품관리','',hideList);
  293. //var hideList = ["btnThisWeek", "btnYesterWeek", "btnRecentMonth", "btnThisMonth", "btnYesterMonth", "btnRecent3Month"];
  294. //cfnCreateCalendar('#terms', 'stDate', 'edDate', true, '출고금지상품관리', '', hideList);
  295. fnInitCalendar();
  296. });
  297. /*]]>*/
  298. </script>
  299. </html>