WmsWithdrawListForm.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : WmsWithdrawListForm.html
  7. * @desc : WMS회수목록 Page
  8. *=============================================================
  9. * STYLE24
  10. * Copyright(C) 2021 TSIT, All rights reserved.
  11. *=============================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== ==================================
  14. * 1.0 2021.03.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. <form id="searchForm" name="searchForm" action="#" th:action="@{'/withdraw/wms/list'}" onsubmit="fnSearchList(); return false;">
  29. <div class="panelStyle">
  30. <!-- TITLE -->
  31. <div class="panelTitle">
  32. <h3><i class="fa fa-info-circle"></i>아래 검색조건 중 <font color="red">회수요청일</font>은 꼭 입력해 주세요.</h3>
  33. <span class="panelControl">
  34. <i class="fa fa-chevron-up"></i>
  35. </span>
  36. </div>
  37. <!-- //TITLE -->
  38. <div class="panelContent">
  39. <table class="frmStyle">
  40. <colgroup>
  41. <col style="width:8%;"/>
  42. <col style="width:12%;"/>
  43. <col style="width:8%;"/>
  44. <col style="width:12%;"/>
  45. <col style="width:8%;"/>
  46. <col style="width:12%;"/>
  47. </colgroup>
  48. <tr>
  49. <th class="dashR">주문자명</th>
  50. <td class="dashR">
  51. <input type="text" class="w40p" name="customername" placeholder="" maxlength="20" />
  52. </td>
  53. <th class="dashR">주문번호</th>
  54. <td class="dashR">
  55. <input type="text" class="w40p" name="orderno" placeholder="" maxlength="20" data-valid-type="numeric"/>
  56. </td>
  57. <th class="dashR">입고상태</th>
  58. <td class="dashR">
  59. <select name="statuscd" id="statuscd">
  60. <option value="" selected>전체</option>
  61. <option value="입고대기">입고대기</option>
  62. <option value="입고완료">입고완료</option>
  63. </select>
  64. </td>
  65. </tr>
  66. <tr>
  67. <th class="dashR">반품타입</th>
  68. <td class="dashR">
  69. <select name="recalltypecd" id="recalltypecd">
  70. <option value="" selected>전체</option>
  71. <option value="10">일반</option>
  72. <option value="20">교환</option>
  73. </select>
  74. </td>
  75. <th class="dashR">삭제여부</th>
  76. <td colspan="4" class="dashR">
  77. <select name="isdeleted" id="isdeleted">
  78. <option value="">전체</option>
  79. <option value="1">Y</option>
  80. <option value="0" selected>N</option>
  81. </select>
  82. </td>
  83. </tr>
  84. <tr>
  85. <th class="dashR">회수요청일</th>
  86. <td colspan="6" class="dashR">
  87. <span id="terms"></span>
  88. </td>
  89. </tr>
  90. </table>
  91. <ul class="panelBar">
  92. <li class="center">
  93. <button type="button" class="btn btn-base btn-lg" id="btnSearch">조회</button>
  94. <button type="button" class="btn btn-gray btn-lg" onclick="$('#searchForm')[0].reset(); fnInitCalendar();">초기화</button>
  95. <button type="button" id="btnExcel" class="btn btn-info btn-lg" >엑셀다운로드</button>
  96. </li>
  97. </ul>
  98. </div>
  99. </div>
  100. <!-- //검색조건 영역 -->
  101. <!-- 리스트 영역 -->
  102. <div class="panelStyle">
  103. <ul class="panelBar">
  104. <li class="right">
  105. 검색결과 : <strong><span id="gridRowTotalCount">0</span> 건</strong>&nbsp;
  106. 쪽번호 <span id="pgNo">0</span>/ <strong id="endPgNo">0</strong>&nbsp;&nbsp;
  107. <select id="pageSize" name="pageSize">
  108. <option value="20" selected="selected">20개씩 보기</option>
  109. <option value="50">50개씩 보기</option>
  110. <option value="100">100개씩 보기</option>
  111. <option value="500">500개씩 보기</option>
  112. <option value="1000">1000개씩 보기</option>
  113. </select>
  114. <input type="hidden" name="pageNo" id="pageNo" value ="1"/>
  115. </li>
  116. </ul>
  117. <div id="gridList" style="width:100%; height: 700px;" class="ag-theme-balham"></div>
  118. <ul class="panelBar">
  119. <li class="center">
  120. <div class="tablePaging" id="withdrawExceptionListPagination"></div>
  121. </li>
  122. </ul>
  123. </div>
  124. </form>
  125. <!-- //리스트 영역 -->
  126. </div>
  127. <script type="text/javascript" src="/ux/plugins/gaga/gaga.paging.js?v=20210114"></script>
  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. {headerName: "No.", field: "rnum", width: 50, cellClass: 'text-center'},
  137. {headerName: "반품번호", field: "recallno", width: 50, cellClass: 'text-center', hide: true},
  138. {headerName: "주문변경번호", field: "orderexceptionno", width: 100, cellClass: 'text-center'},
  139. {headerName: "주문번호", field: "orderno", width: 100, cellClass: 'text-center',
  140. cellRenderer: function (params) {
  141. if (roleCd.indexOf("C") < 0) {
  142. return "<a href=\"javascript:void(0);\" onclick=\"cfnOpenOrderDetailPopup('" + params.data.orderno + "');\">" + params.data.orderno + "</a>";
  143. } else {
  144. return params.value;
  145. }
  146. }
  147. },
  148. {headerName: "주문상세번호", field: "orderdtlno", width: 100, cellClass: 'text-center'},
  149. {headerName: "상태", field: "statuscd", width: 100, cellClass: 'text-center'},
  150. {headerName: "반품타입", field: "recalltypecd", width: 80, cellClass: 'text-center',
  151. cellRenderer: function (params) { return params.value == '10' ? '일반' : '교환'; }
  152. },
  153. {headerName: "수취인", field: "receiver", width: 100, cellClass: 'text-center'},
  154. {headerName: "수취인전화번호", field: "receivertelnum", width: 120, cellClass: 'text-center'},
  155. {headerName: "수취인휴대폰번호", field: "receivercellnum", width: 120, cellClass: 'text-center'},
  156. {headerName: "우편번호", field: "deliverypostalcode",width: 80, cellClass: 'text-center'},
  157. {headerName: "기본주소", field: "deliveryaddr1", width: 300, cellClass: 'text-left'},
  158. {headerName: "상세주소", field: "deliveryaddr2", width: 200, cellClass: 'text-left'},
  159. {headerName: "주문자", field: "customername", width: 100, cellClass: 'text-center'},
  160. {headerName: "ID", field: "loginid", width: 100, cellClass: 'text-center'},
  161. {headerName: "CS메모", field: "csmemo", width: 250, cellClass: 'text-left'},
  162. {headerName: "CS메모 변경일", field: "datecsmemoupdated", width: 120, cellClass: 'text-center'},
  163. {headerName: "WMS메모", field: "wmsmemo", width: 250, cellClass: 'text-left'},
  164. {headerName: "WMS메모변경일", field: "datewmsmemoupdated",width: 120, cellClass: 'text-center'},
  165. {headerName: "회수요청일", field: "datecreated", width: 100, cellClass: 'text-center'},
  166. {headerName: "삭제여부", field: "isdeleted", width: 80, cellClass: 'text-center',
  167. cellRenderer: function (params) { return params.value == '0' ? 'N' : 'Y'; }
  168. },
  169. {headerName: "도로명주소", field: "deliveryaddrnew", width: 300, cellClass: 'text-left'},
  170. {headerName: "상품번호", field: "productno", width: 100, cellClass: 'text-center'},
  171. {headerName: "상품코드", field: "productcode", width: 100, cellClass: 'text-center'},
  172. {headerName: "상품명", field: "productname", width: 250, cellClass: 'text-left',
  173. cellRenderer: function (params) {
  174. if (roleCd.indexOf("C") < 0) {
  175. return "<a href=\"javascript:void(0);\" onclick=\"cfnOpenGoodsDetailPopup('U','" + params.data.goodsCd + "');\">" + params.value + "</a>";
  176. } else {
  177. return params.value;
  178. }
  179. }
  180. },
  181. {headerName: "옵션코드", field: "skucode", width: 100, cellClass: 'text-center'},
  182. {headerName: "옵션 내용", field: "skuvalue", width: 100, cellClass: 'text-center'},
  183. {headerName: "수량", field: "recallqty", width: 100, cellClass: 'text-center'},
  184. {headerName: "완료일", field: "datecompleted", width: 100, cellClass: 'text-center'},
  185. {headerName: "택배사 명", field: "logisticsname", width: 100, cellClass: 'text-left'},
  186. {headerName: "회수송장번호", field: "recallinvoiceno", width: 120, cellClass: 'text-center'},
  187. {headerName: "원운송장번호", field: "invoiceno", width: 120, cellClass: 'text-center'}
  188. ];
  189. var gridOptions = gagaAgGrid.getGridOptions(columnDefs);
  190. //gridOptions.suppressRowTransform =true;
  191. gridOptions.suppressRowClickSelection = true;
  192. //gridOptions.rowSelection = 'multiple';
  193. //gridOptions.rowHeight = 35;
  194. /*************************************************************************
  195. * 조회 버튼 클릭 시
  196. **************************************************************************/
  197. $('#btnSearch').on('click', function() {
  198. fnSearchList();
  199. });
  200. /*************************************************************************
  201. * 조회
  202. **************************************************************************/
  203. var fnSearchList = function() {
  204. if($('#stDate').val() == ''){
  205. mcxDialog.alert('시작 기간을 입력하세요.');
  206. return;
  207. }
  208. if($('#edDate').val() == ''){
  209. mcxDialog.alert('종료 기간을 입력하세요.');
  210. return;
  211. }
  212. // 날짜 유효성 체크
  213. if (Number($('#stDate').val().replaceAll("-", "")) > Number($('#edDate').val().replaceAll("-", ""))) {
  214. mcxDialog.alert("시작일은 종료일보다 클 수 없습니다.");
  215. return;
  216. }
  217. gagaPaging.init('searchForm', fnSearchCallBack, 'withdrawExceptionListPagination', $('#searchForm').find('#pageSize').val());
  218. gagaPaging.load($("#searchForm input[name=pageNo]").val());
  219. }
  220. /*************************************************************************
  221. * 조회 콜백
  222. **************************************************************************/
  223. var fnSearchCallBack = function(result){
  224. $('#searchForm').find('#gridRowTotalCount').html(result.pageing.pageable.totalCount.addComma());
  225. $('#searchForm').find('#pageNo').val(result.pageing.pageable.pageNo.addComma());
  226. $('#searchForm').find('#pgNo').html(result.pageing.pageable.pageNo.addComma());
  227. $('#searchForm').find('#endPgNo').html(result.pageing.pageable.totalPage.addComma());
  228. gridOptions.api.setRowData(result.wmsWithdrawList);
  229. gagaPaging.createPagination(result.pageing.pageable);
  230. }
  231. /*************************************************************************
  232. * 달력 초기화
  233. **************************************************************************/
  234. var fnInitCalendar = function() {
  235. cfnChangeCalendar('7d', $('#stDate'), $('#edDate')); //달력 초기화
  236. }
  237. function fnRowSpan(params) {
  238. alert("alert");
  239. var orderNo = params.data.orderNo;
  240. alert("orderNo: "+orderNo);
  241. if (orderNo == 18691602) {
  242. // have all Russia age columns width 2
  243. return 2;
  244. } else {
  245. // all other rows should be just normal
  246. return 1;
  247. }
  248. }
  249. // rowSpan: params => params.data.orderNo === '18692992' ? 2 : 1
  250. /*************************************************************************
  251. * 회수예외 처리완료 버튼 - 대기->완료 업데이트
  252. **************************************************************************/
  253. var fnComplete = function(recallExceptionNo) {
  254. var params = {};
  255. params.recallExceptionNo = recallExceptionNo;
  256. mcxDialog.confirm('처리완료 하시겠습니까?', {
  257. cancelBtnText: "취소",
  258. sureBtnText: "확인",
  259. sureBtnClick: function(){
  260. var jsonData = JSON.stringify(params);
  261. gagajf.ajaxJsonSubmit('/withdraw/exception/complete', jsonData, fnCompleteCallback);
  262. }
  263. });
  264. };
  265. /*************************************************************************
  266. * 회수예외 처리완료 콜백
  267. **************************************************************************/
  268. var fnCompleteCallback = function() {
  269. fnSearchList();
  270. };
  271. /*************************************************************************
  272. * 엑셀다운로드
  273. **************************************************************************/
  274. $('#btnExcel').on('click', function() {
  275. var totalRows = gridOptions.api.getDisplayedRowCount();
  276. if(totalRows==0){
  277. mcxDialog.alert('조회된 내역이 없습니다.');
  278. return;
  279. }
  280. var date = new Date().format("YYYYMMDDHHmmss");
  281. var params = {
  282. fileName : "WMS회수예외목록_"+ date,
  283. sheetName: "DATA"
  284. }
  285. gridOptions.excelStyles = [
  286. {
  287. id: 'dateFormat',
  288. dataType: 'dateTime',
  289. numberFormat: {
  290. format: 'YYYY-MM-DD;@'
  291. }
  292. },
  293. {
  294. id: 'textFormat',
  295. dataType: 'string'
  296. }
  297. ]
  298. gridOptions.api.exportDataAsExcel(params);
  299. });
  300. /*************************************************************************
  301. * init
  302. **************************************************************************/
  303. $(document).ready(function() {
  304. gagaAgGrid.createGrid('gridList', gridOptions);
  305. cfnCreateCalendar('#terms', 'stDate', 'edDate', true, '');
  306. fnInitCalendar();
  307. });
  308. /*]]>*/
  309. </script>
  310. </html>