BizdayForm.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : BizdayForm.html
  7. * @desc : 영업일관리 Page
  8. *============================================================================
  9. * SISUN
  10. * Copyright(C) 2019 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2019.12.13 jaewonHo 최초 작성
  15. *******************************************************************************
  16. -->
  17. <form id="calendarForm" name="calendarForm">
  18. <input type="hidden" name="startDt" id="startDt"/>
  19. <input type="hidden" name="endDt" id="endDt"/>
  20. <input type="hidden" name="bizday" id="bizDay"/>
  21. <div id="main-wrapper">
  22. <div id="main">
  23. <div class="main-title"></div>
  24. <div class="panelStyle2">
  25. <ul class="notice">
  26. <li><strong class="cBlue">영업일 : </strong>휴일을 Click 하시면 영업일로 변경 가능 합니다.</li>
  27. <li><strong class="cRed">휴무일 : </strong>영업일을 Click 하시면 휴무일로 변경 가능 합니다.</li>
  28. </ul>
  29. <div id="calendar" style="margin: 5px;"></div>
  30. </div>
  31. </div>
  32. </div>
  33. </form>
  34. <script class="cssdesk" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.0/moment.min.js" type="text/javascript"></script>
  35. <script src="/ux/js/fullcalendar-4.2.0.js"></script>
  36. <script th:inline="javascript">
  37. /*<![CDATA[*/
  38. $(document).ready(function() {
  39. fnstartCalendar();
  40. uifnFitGrid();
  41. })
  42. var fnstartCalendar = function() {
  43. var calendarEl = document.getElementById('calendar');
  44. calendar = new FullCalendar.Calendar(calendarEl, {
  45. plugins: [ 'interaction', 'dayGrid' ],
  46. locale: 'ko', //한글화
  47. timeZone: 'local',
  48. selectable: true,
  49. editable: false,
  50. eventLimit: true,
  51. select: function(arg) {
  52. if ((new Date(arg.end)).format('YYYYMMDD') - (new Date(arg.start)).format('YYYYMMDD') > 1 ) return;
  53. var title ='휴일';
  54. mcxDialog.confirm("휴일로 변경하시겠습니까?", {
  55. cancelBtnText: "취소",
  56. sureBtnText: "확인",
  57. sureBtnClick: function() {
  58. fnUpdateDay('Holiday' , arg);
  59. }
  60. });
  61. calendar.unselect();
  62. },
  63. //영업일로 변경 -----
  64. eventClick: function(arg) {
  65. mcxDialog.confirm("영업일로 변경하시겠습니까?", {
  66. cancelBtnText: "취소",
  67. sureBtnText: "확인",
  68. sureBtnClick: function() {
  69. fnUpdateDay('Bizday' , arg);
  70. }
  71. });
  72. },
  73. events: function(info, callback){
  74. var dt = setViewDate(info);
  75. $('#calendarForm input[name=startDt]').val(dt[0]);
  76. $('#calendarForm input[name=endDt]').val(dt[1]);
  77. $.get('/system/bizday/list' + '?' + $('#calendarForm').serialize()
  78. , function(data) {
  79. var events = [];
  80. for(var i = 0 ; i < data.length ; i++ ) {
  81. events.push( {
  82. title : data[i].restdayDesc,
  83. start : data[i].bizday } );
  84. }
  85. callback(events);
  86. });
  87. }
  88. });
  89. calendar.render();
  90. }
  91. //해당월 시작일, 마지막일설정
  92. var setViewDate = function(date) {
  93. var dt = [];
  94. dt[0] = (new Date(date.startStr)).format('YYYYMMDD');
  95. dt[1] = (new Date(date.endStr)).format('YYYYMMDD');
  96. return dt;
  97. }
  98. // 휴일,영업일 업데이트(저장)
  99. var fnUpdateDay = function(day ,arg) {
  100. var formId = '#calendarForm';
  101. var start="";
  102. var end = "";
  103. $('#calendarForm input[name=bizDay]').val("");
  104. if( day == 'Holiday' ) {
  105. bizday = (new Date(arg.start)).format('YYYYMMDD');
  106. $('#calendarForm input[name=bizday]').val(bizday);
  107. gagajf.ajaxFormSubmit('system/bizday/save', formId, fnSaveCallback);
  108. calendar.addEvent({
  109. title: '휴일',
  110. start: arg.start,
  111. end: arg.end,
  112. allDay: arg.allDay
  113. });
  114. }
  115. else {
  116. bizday = (new Date(arg.event.start)).format('YYYYMMDD');
  117. $('#calendarForm input[name=bizday]').val(bizday);
  118. gagajf.ajaxFormSubmit('system/bizday/save', formId, fnSaveCallback);
  119. arg.event.remove();
  120. }
  121. }
  122. // 저장 후 콜백
  123. fnSaveCallback = function() {
  124. }
  125. /*]]>*/
  126. </script>
  127. </html>