OrderMemoRegistForm.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. <!DOCTYPE html>
  2. <html lang="ko" xmlns:th="http://www.thymeleaf.org">
  3. <!--
  4. *******************************************************************************
  5. * @source : OrderMemoRegistForm.html
  6. * @desc : 주문메모 등록 화면
  7. *============================================================================
  8. * STYLE24
  9. * Copyright(C) 2020 TSIT, All rights reserved.
  10. *============================================================================
  11. * VER DATE AUTHOR DESCRIPTION
  12. * === =========== ========== =============================================
  13. * 1.0 2020.11.16 jsh77b 최초 작성
  14. *******************************************************************************
  15. -->
  16. <div class="modalPopup" data-width="900">
  17. <div class="panelStyle">
  18. <div class="panelTitle">
  19. <h2>주문메모등록</h2>
  20. <button type="button" class="close" onclick="uifnPopupClose('popupCreateOrderMemo');"><i class="fa fa-times"></i></button>
  21. </div>
  22. <div class="panelContent" style="height:100%; overflow-y:auto;">
  23. <form id="orderMemoRequestFrm">
  24. <input type="hidden" name="ordNo" th:value="${ordNo}" />
  25. <input type="hidden" name="seq" th:value="${seq}" />
  26. <input type="hidden" name="mode" th:value="${mode}" />
  27. <table class="frmStyle">
  28. <colgroup>
  29. <col style="width:30%" />
  30. <col />
  31. </colgroup>
  32. <tbody>
  33. <tr>
  34. <th>등록자ID</th>
  35. <td id="userNm"></td>
  36. </tr>
  37. <tr>
  38. <th>관리자 메모</th>
  39. <td>
  40. <textarea th:if="${orderMemo != null and orderMemo != ''}" name="memo" style="height:100px;" th:text="${orderMemo.memo}"></textarea>
  41. <textarea th:unless="${orderMemo != null and orderMemo != ''}" name="memo" style="height:100px;" text=""></textarea>
  42. </td>
  43. </tr>
  44. <tr id="imageFileTr">
  45. <th>파일</th>
  46. <td><div class="uFile">
  47. <input id="imageFile" name="imageFile" type="file" class="uFileInput"/>
  48. <label for="imageFile" class="uFileLabel">파일선택</label>
  49. <input type="hidden" name="orgFileNm"/>
  50. <input type="hidden" name="sysFileNm"/>
  51. </div>
  52. </td>
  53. </tr>
  54. <th:block th:if="${mode == 'U' and orderMemo.sysFileNm != null and orderMemo.sysFileNm != ''}" th:with="uploadImageUrl=${@environment.getProperty('upload.image.view')}">
  55. <tr>
  56. <th>이미지</th>
  57. <td>
  58. <a href="javascript:void(0);" onclick="fnPreImgView()">
  59. <img id="memoImg" th:src="|${uploadImageUrl}/memo/${orderMemo.sysFileNm}|" th:onerror="'this.src=\''+@{${@environment.getProperty('domain.uximage')}+ '/image/no.gif'}+'\';'" width="300px"/>
  60. </a>
  61. </td>
  62. </tr>
  63. </th:block>
  64. </tbody>
  65. </table>
  66. <div>
  67. <button type="button" class="btn btn-success btnRight marT10" id="btnOrderMemoRegistOk">저장</button>
  68. </div>
  69. <br>
  70. </form>
  71. </div>
  72. </div>
  73. </div>
  74. <script th:inline="javascript">
  75. /*<![CDATA[*/
  76. // 이벤트 바인딩 관련
  77. var orderMemo = [[${orderMemo}]];
  78. var userNo = [[${userNo}]];
  79. var userNm = [[${userNm}]];
  80. var mode = [[${mode}]];
  81. // 첨부파일 등록
  82. $('#orderMemoRequestFrm input[name=imageFile]').on('change', function() {
  83. var file = this.files[0];
  84. if (typeof(file) == 'undefined'){
  85. return;
  86. }
  87. gagajf.ajaxFileUpload('/common/file/upload?subDir=/memo'
  88. , file
  89. , function(result) {
  90. $('#orderMemoRequestFrm input[name=orgFileNm]').val(result.oldFileName);
  91. $('#orderMemoRequestFrm input[name=sysFileNm]').val(result.newFileName);
  92. }
  93. , 'image'
  94. );
  95. });
  96. // 주문메모저장
  97. $('#btnOrderMemoRegistOk').on('click', function() {
  98. var memo = $('#orderMemoRequestFrm textarea[name=memo]').val();
  99. if (gagajf.isNull(memo)) {
  100. mcxDialog.alert('메모 입력해 주세요.');
  101. $('#orderMemoRequestFrm textarea[name=memo]').focus();
  102. return;
  103. }
  104. mcxDialog.confirm('저장하시겠습니까?', {
  105. cancelBtnText : "취소",
  106. sureBtnText : "확인",
  107. sureBtnClick : function(){
  108. var jsonData = JSON.stringify($('#orderMemoRequestFrm').serializeObject());
  109. gagajf.ajaxJsonSubmit(
  110. '/order/memo/save'
  111. , jsonData
  112. , function(){
  113. fnBindOrderMemo();
  114. uifnPopupClose('popupCreateOrderMemo');
  115. }
  116. );
  117. }
  118. });
  119. });
  120. // 이미지 클릭 시 미리보기 팝업 이벤트
  121. var fnPreImgView = function(){
  122. cfnOpenImagePreViewPopup('preImgView', $('#memoImg').attr('src'));
  123. }
  124. // 이미지 로드 시 사이즈 변경
  125. $('#imagePreView').bind('load', function(){
  126. var windowWidth = $(window).width() * 0.95;
  127. var windowHeight = $(window).height() * 0.95;
  128. var width = $('#imagePreView').width();
  129. var height = $('#imagePreView').height();
  130. if (width > windowWidth) {
  131. $('#preImgView >.videoPopup').css('width', windowWidth);
  132. $('#imagePreView').css('width', windowWidth);
  133. }
  134. if (height > windowHeight) {
  135. $('#preImgView >.videoPopup').css('height', windowHeight);
  136. $('#imagePreView').css('height', windowHeight);
  137. }
  138. });
  139. $(document).ready(function() {
  140. var userText = '';
  141. if (mode == 'U') {
  142. userText = orderMemo.userNm + ' ('+orderMemo.updNo+')';
  143. $('#orderMemoRequestFrm input[name=orgFileNm]').val(orderMemo.orgFileNm);
  144. $('#orderMemoRequestFrm input[name=sysFileNm]').val(orderMemo.sysFileNm);
  145. } else {
  146. if (!gagajf.isNull(userNm) && !gagajf.isNull(userNo)) {
  147. userText = userNm + ' (' + userNo + ')';
  148. } else {
  149. if (gagajf.isNull(userNm)) userText = userNm;
  150. if (gagajf.isNull(userNo)) userText = userNo;
  151. }
  152. }
  153. $('#userNm').text(userText);
  154. // 등록자만 수정 가능하게 처리
  155. if (mode == 'U' && userNo != orderMemo.updNo) {
  156. $('#btnOrderMemoRegistOk').css('display', 'none');
  157. $('#imageFileTr').css('display', 'none');
  158. $('#orderMemoRequestFrm textarea[name=memo]').attr('readonly', true);
  159. }
  160. });
  161. /*]]>*/
  162. </script>
  163. </html>