GoodsFreeGoodsForm.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : GoodsFreeGoodsForm.html
  7. * @desc : 사은품관리 Page
  8. *============================================================================
  9. * STYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2020.12.28 eskim 최초 작성
  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. <div class="panelStyle">
  27. <div class="panelContent">
  28. <form id="searchForm" name="searchForm" action="#" th:action="@{'/goods/freeGoods/list'}">
  29. <input type="hidden" id="searchGb" name="searchGb" value="BASIC" />
  30. <input type="hidden" id="dateGbn" name="dateGbn" value="R"/> <!-- 등록일 -->
  31. <table class="frmStyle">
  32. <colgroup>
  33. <col style="width:9%;"/>
  34. <col/>
  35. <col style="width:9%;"/>
  36. <col style="width:20%;"/>
  37. </colgroup>
  38. <tr>
  39. <th>업체/브랜드</th>
  40. <td>
  41. <select name="supplyCompCd" id="supplyCompCd">
  42. <option value="" th:if="${sessionInfo.roleCd} != 'G001_B000'">[전체]</option>
  43. <option th:if="${supplyCompList}" th:each="oneData, status : ${supplyCompList}" th:value="${oneData.cd}" th:text="${'[' + oneData.cd + '] ' + oneData.cdNm}"></option>
  44. </select>
  45. <span id="multiBrand"></span>
  46. </td>
  47. <th rowspan="2">키워드</th>
  48. <td rowspan="2">
  49. <select name="search" id="search">
  50. <option value="searchProductNo">WMS상품번호</option>
  51. <option value="searchGoodsNm">사은품명</option>
  52. <option value="searchProductCode">WMS상품코드</option>
  53. <option value="searchSkucode">SKUCODE</option>
  54. <option value="searchSkumodelno">SKUMODELNO</option>
  55. </select>
  56. <textarea class="textareaR2 w130" name="condition" id="condition"></textarea>
  57. </td>
  58. </tr>
  59. <tr>
  60. <th>등록일</th>
  61. <td id="sellTerms"></td>
  62. </tr>
  63. </table>
  64. <ul class="panelBar">
  65. <li class="center">
  66. <button type="button" class="btn btn-default btn-lg" id="btnInit">초기화</button>
  67. <button type="button" class="btn btn-success btn-lg" id="btnSearch">조회</button>
  68. </li>
  69. </ul>
  70. </form>
  71. </div>
  72. </div>
  73. <!-- //검색조건 영역 -->
  74. <!-- 리스트 영역 -->
  75. <div class="panelStyle">
  76. <div id="gridList" style="width: 100%; height: 450px;" class="ag-theme-balham lh60"></div>
  77. </div>
  78. <!-- //리스트 영역 -->
  79. <!-- 등록/수정 -->
  80. <div class="panelStyle">
  81. <form id="detailForm" name="detailForm" action="#" th:action="@{'/goods/freeGoods/update'}">
  82. <table class="frmStyle">
  83. <colgroup>
  84. <col style="width:8%;"/>
  85. <col style="width:11%;"/>
  86. <col style="width:8%;"/>
  87. <col style="width:11%;"/>
  88. <col style="width:8%;"/>
  89. <col style="width:11%;"/>
  90. <col style="width:8%;"/>
  91. <col style="width:17%;"/>
  92. <col style="width:8%;"/>
  93. <col/>
  94. </colgroup>
  95. <tr>
  96. <td colspan='10'>사은품 상세</td>
  97. </tr>
  98. <tr>
  99. <th>WMS상품번호</th>
  100. <td>
  101. <input class="w130" type="text" name="productNo" data-valid-name="wms상품번호" readonly="readonly"/>
  102. </td>
  103. <th>품번</th>
  104. <td>
  105. <input class="w130" type="text" name="goodsNum" data-valid-name="품번" readonly="readonly"/>
  106. </td>
  107. <th>브랜드</th>
  108. <td>
  109. <!-- <input class="w130" type="text" name="brandCd" data-valid-name="브랜드코드" readonly="readonly" />/ -->
  110. <input class="w130" type="text" name="brandEnm" data-valid-name="브랜드명" readonly="readonly" />
  111. </td>
  112. <th>사은품명<em class="required" title="필수"></em></th>
  113. <td>
  114. <input class="w200" type="text" name="goodsNm" maxlength="50" required="required" data-valid-name="사은품명"/>
  115. </td>
  116. <th>사용여부<em class="required" title="필수"></em></th>
  117. <td>
  118. <label class="rdoBtn"><input type="radio" name="useYn" value="Y" checked="checked">Y</label>
  119. <label class="rdoBtn"><input type="radio" name="useYn" value="N">N</label>
  120. </td>
  121. </tr>
  122. <tr>
  123. <th>이미지</th>
  124. <td colspan="9">
  125. <div class="uFile w300">
  126. <input type="file" id="file" name="file" class="uFileInput"/>
  127. <label for="file" class="uFileLabel">파일 선택</label>
  128. <input type="hidden" name="sysImgNm" id="sysImgNm"/>
  129. <input type="hidden" name="newSysImgNm" id="newSysImgNm"/>
  130. </div>
  131. <input type="hidden" name="uploadDefaultUrl" id="uploadDefaultUrl" th:value="${@environment.getProperty('upload.default.view')}"/>
  132. <div id="imgView" class="off">
  133. <img id="bannerPreViewUrl" src="" style="height:100px"/>
  134. </div>
  135. </td>
  136. </tr>
  137. </table>
  138. <ul class="panelBar">
  139. <li class="center">
  140. <button type="button" class="btn btn-success btn-lg" id="btnSave">저장</button>
  141. </li>
  142. </ul>
  143. </form>
  144. </div>
  145. </div>
  146. <script th:inline="javascript">
  147. /*<![CDATA[*/
  148. var sessRoleCd = [[${sessionInfo.roleCd}]];
  149. // specify the columns
  150. var columnDefs = [
  151. {headerName: 'No', width: 60, cellClass: 'text-center', valueGetter: function(params) { return params.node.rowIndex + 1 }},
  152. {headerName: "이미지", field: "sysImgNm", width: 100, height: 60, cellClass: 'text-center'
  153. ,cellRenderer: function(params) {
  154. return '<img width="60" src="'+ _imgUrl+ params.value + '" alt="" onerror="this.src=\'/image/no.png\';"/>';
  155. }
  156. },
  157. {headerName: "브랜드", field: "brandEnm", width: 130, cellClass: 'text-center'},
  158. {headerName: "wms상품번호", field: "productNo", width: 120, cellClass: 'text-center',
  159. cellRenderer: function(params) {
  160. return '<a href="javascript:void(0);">' + params.value + '</a>';
  161. }
  162. },
  163. {headerName: "WMS상품코드", field: "productCode", width: 100, cellClass: 'text-center'},
  164. {headerName: "SKUCODE", field: "skucode", width: 90, cellClass: 'text-center'},
  165. {headerName: "사은품명", field: "goodsNm", width: 300, cellClass: 'text-left'},
  166. {headerName: "SKUMODELNO", field: "skumodelno", width: 100, cellClass: 'text-left'},
  167. {
  168. headerName: "재고수량", field: "limitQty", width: 100, cellClass: 'text-center',
  169. cellRenderer: function(params) { return gagaAgGrid.toAddComma(params.value) }
  170. },
  171. // {
  172. // headerName: "남은수량", field: "leftQty", width: 100, cellClass: 'text-center',
  173. // cellRenderer: function(params) { return gagaAgGrid.toAddComma(params.value) }
  174. // },
  175. {headerName: "사용여부", field: "useYn", width: 100, cellClass: 'text-center'},
  176. {headerName: "등록일자", field: "regDt", width: 150, cellClass: 'text-center',
  177. cellRenderer: function(params) {
  178. return !gagajf.isNull(params.value) ? params.value.toDate("YYYYMMDDHHmmss").format("YYYY-MM-DD HH:mm:ss") : '';
  179. }
  180. },
  181. {headerName: "등록자", field: "regNm", width: 130, cellClass: 'text-center'},
  182. {headerName: "수정일자", field: "updDt", width: 150, cellClass: 'text-center',
  183. cellRenderer: function(params) {
  184. return !gagajf.isNull(params.value) ? params.value.toDate("YYYYMMDDHHmmss").format("YYYY-MM-DD HH:mm:ss") : '';
  185. }
  186. },
  187. {headerName: "수정자", field: "updNm", width: 130, cellClass: 'text-center'},
  188. ];
  189. // Get GridOptions
  190. var gridOptions = gagaAgGrid.getGridOptions(columnDefs);
  191. //gridOptions.suppressRowClickSelection = true;
  192. gridOptions.rowHeight = 60; //이미지가 있을경우 높이 지정해야함.
  193. // 상품코드 셀 클릭
  194. gridOptions.onCellClicked = function(event) {
  195. if (event.colDef.field == "productNo"){
  196. $("#detailForm")[0].reset();
  197. $("#detailForm input[name=productNo]").val('');
  198. $("#detailForm input[name=goodsNum]").val('');
  199. $("#detailForm input[name=brandNm]").val('');
  200. var formId = '#detailForm';
  201. $(formId + " input[name=productNo]").val(event.data.productNo);
  202. $(formId + " input[name=goodsNum]").val(event.data.goodsNum);
  203. $(formId + " input[name=brandEnm]").val(event.data.brandEnm);
  204. $(formId + " input[name=goodsNm]").val(event.data.goodsNm);
  205. $(formId + " input:radio[name=useYn]:input[value="+event.data.useYn+"]").click();
  206. var sysImgNm = event.data.sysImgNm;
  207. if(!gagajf.isNull(sysImgNm)){
  208. $("#sysImgNm").val(sysImgNm);
  209. $("#bannerPreViewUrl").attr('src', $("#uploadDefaultUrl").val()+sysImgNm);
  210. $("#imgView").removeClass("off").addClass("on");
  211. }else {
  212. $("#sysImgNm").val('');
  213. $("#bannerPreViewUrl").attr('src', '');
  214. $("#imgView").removeClass("on").addClass("off");
  215. }
  216. $('#detailForm input[name=file]').closest('div').find('label').text('파일선택');
  217. }
  218. }
  219. //업체변경시
  220. $('#searchForm select[name=supplyCompCd]').on('change', function() {
  221. var actionUrl = '/renderer/supplyCompany/brand/list/' + $(this).val();
  222. if(sessRoleCd == "G001_B000"){
  223. actionUrl = '/renderer/brand/AuthBrandlist';
  224. }
  225. cfnCreateMultiCombo(actionUrl,"multiBrand", "[전체]",null, 'Y');
  226. });
  227. // 조회
  228. $('#btnSearch').on('click', function() {
  229. var formId = '#searchForm';
  230. var form = document.searchForm;
  231. var searchFlag = false;
  232. var cnt = 0;
  233. if( !gagajf.isNull($("#searchForm select[name=supplyCompCd]").val())
  234. || !gagajf.isNull($("#searchForm textarea[name=condition]").val())
  235. || (!gagajf.isNull($("#searchForm input[name=stDate]").val()) && !gagajf.isNull($("#searchForm input[name=edDate]").val()))
  236. ){
  237. searchFlag = true;
  238. }else{
  239. /* for (i = 0; i < form.elements.length; i++ ) {
  240. var el = form.elements[i];
  241. if ($(el).prop("type") == "text" || ($(el).prop("type") == "select-one" && el.name != "search" && el.name != "pageSize")) {
  242. if (!(el.value == null || el.value == "")) {
  243. cnt++;
  244. }
  245. }
  246. }
  247. if(cnt > 0) searchFlag = true; */
  248. }
  249. /* if(searchFlag == false){
  250. mcxDialog.alert("검색조건을 입력하세요.");
  251. return false;
  252. }
  253. if($("#searchForm input[name=multiBrand]:checked").length == 0) {
  254. mcxDialog.alert("브랜드까지 조회해주세요.");
  255. return false;
  256. } */
  257. // 기간 값 체크
  258. if (!fnCalendarDateValidation('#sellTerms', 'stDate', 'edDate')){
  259. return false;
  260. }
  261. if (!gagajf.isNull($('#searchForm textarea[name=condition]').val())){
  262. var arrData = $('#searchForm textarea[name=condition]').val().replace(/\r\n/g,"\n").split("\n");
  263. if (arrData.length > 500){
  264. mcxDialog.alertC("키워드 조회값을 500 이하로 조회 하세요.", {
  265. sureBtnText: "확인",
  266. sureBtnClick: function() {
  267. $('#searchForm textarea[name=condition]').focus();
  268. }
  269. });
  270. return false;
  271. }
  272. }
  273. // Fetch data
  274. gagaAgGrid.fetch($('#searchForm').prop('action'), gridOptions, '#searchForm');
  275. });
  276. // 검색조건 초기화
  277. $('#btnInit').on('click', function() {
  278. $("#searchForm")[0].reset();
  279. $("#multiBrand").empty();
  280. });
  281. // 파일첨부 선택 시
  282. $('#detailForm input[name=file]').on('change', function() {
  283. // multiple 속성이 있으면 files에는 다수의 객체가 할당됨
  284. var file = this.files[0];
  285. // 파일 업로드
  286. gagajf.ajaxFileUpload('/common/file/upload?subDir=/contents/freegoods'
  287. , file
  288. , function(result) {
  289. // 업로드한 파일명 설정
  290. $('#detailForm input[name=newSysImgNm]').val(result.newFileName);
  291. $("#bannerPreViewUrl").attr('src', $("#uploadDefaultUrl").val()+"/contents/freegoods/"+result.newFileName);
  292. $("#imgView").removeClass("off").addClass("on");
  293. }
  294. );
  295. });
  296. // 사은품 저장
  297. $("#btnSave").on('click', function() {
  298. if(gagajf.isNull($('#detailForm input[name=productNo]').val())){
  299. mcxDialog.alert("사은품 선택 후 저장하세요.");
  300. return false;
  301. }
  302. // 입력 값 체크
  303. if (!gagajf.validation('#detailForm'))
  304. return false;
  305. mcxDialog.confirm('저장하시겠습니까?', {
  306. cancelBtnText: "취소",
  307. sureBtnText: "확인",
  308. sureBtnClick: function() {
  309. gagajf.ajaxFormSubmit($('#detailForm').prop('action'), '#detailForm', function() {
  310. fnDetailFormInit();
  311. $('#btnSearch').click();
  312. });
  313. }
  314. });
  315. });
  316. var fnDetailFormInit = function(){
  317. $("#detailForm")[0].reset();
  318. $("#bannerPreViewUrl").attr('src', '');
  319. $("#imgView").removeClass("on").addClass("off");
  320. }
  321. $(document).ready(function() {
  322. cfnCreateCalendar('#sellTerms', 'stDate', 'edDate', true, '등록일', true);
  323. // Create a agGrid
  324. gagaAgGrid.createGrid('gridList', gridOptions);
  325. });
  326. /*]]>*/
  327. </script>
  328. </html>