You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

156 lines
6.7 KiB

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta name="viewport" content="width=device-width" />
  5. <title>日程管理</title>
  6. <script src="~/Content/jquery/plugin/fullcalendar/js/jquery-1.7.2.min.js"></script>
  7. <script src="~/Content/jquery/plugin/jquery-ui/jquery-ui.min.js"></script>
  8. <script src="~/Content/jquery/plugin/fullcalendar/js/fullcalendar.min.js"></script>
  9. <link href="~/Content/jquery/plugin/fullcalendar/css/fullcalendar.css" rel="stylesheet" />
  10. @Html.AppendCssFile(
  11. "/Views/LR_Content/style/lr-common.css",
  12. "/Views/LR_Content/style/lr-iframe-index.css"
  13. )
  14. <script type='text/javascript'>
  15. $(document).ready(function () {
  16. resize();
  17. $('.calendar').fullCalendar({
  18. header: {
  19. left: 'prev,next',
  20. center: 'title',
  21. right: 'agendaDay,agendaWeek,month'
  22. },
  23. monthNamesShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
  24. dayNamesShort: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
  25. buttonText: {
  26. prev: '上一页',
  27. next: '下一页',
  28. month: '月视图',
  29. week: '周视图',
  30. day: '日视图'
  31. },
  32. titleFormat: "yyyy年MM月",
  33. columnFormat: {
  34. month: 'ddd',
  35. week: 'MM月dd日 ddd',
  36. day: 'MM月dd日 ddd'
  37. },
  38. allDayText: '今天',
  39. axisFormat: "HH:00",
  40. height: $(window).height() - 55,
  41. dayClick: function (date, allDay, jsEvent, view) {
  42. var _date = $.fullCalendar.formatDate(date, 'yyyy-MM-dd');
  43. var _time = $.fullCalendar.formatDate(date, 'HHmm');
  44. if (top.learun.formatDate(_date, 'yyyyMMdd') >= ('@Learun.Util.Time.GetToday("yyyyMMdd")')) {
  45. btn_add(_date, _time);
  46. }
  47. },
  48. editable: true,
  49. eventLimit: true,
  50. eventAfterRender: function (event, element, view) {//数据绑定上去后添加相应信息在页面上
  51. var fstart = $.fullCalendar.formatDate(event.start, "HH:mm");
  52. var fend = $.fullCalendar.formatDate(event.end, "HH:mm");
  53. if (view.name == "month") {//按月份
  54. var evtcontent = '<div class="fc-event-inner fc-event-skin" data-id="' + event.id + '">';
  55. evtcontent += '<span class="fc-event-time">' + fstart + " - " + fend + '</span>';
  56. evtcontent += '<span class="fc-event-title">: ' + event.title + '</span>';
  57. evtcontent += '</div><div class="ui-resizable-handle ui-resizable-e">&nbsp;&nbsp;&nbsp;</div>';
  58. evtcontent += '<div class="fc-event-delete" style="width:100%;height:100%;background-color:#000;" data-id="' + event.id +'">删除</div>';
  59. element.html(evtcontent);
  60. } else {
  61. var evtcontent = '<div class="fc-event-inner fc-event-skin" data-id="' + event.id +'" style="height:98%">';
  62. evtcontent += '<div class="fc-event-head fc-event-skin">';
  63. evtcontent += '<div class="fc-event-time">' + fstart + " - " + fend + event.title + '</div>';
  64. evtcontent += '</div>';
  65. evtcontent += '<div class="fc-event-content"></div>';
  66. evtcontent += '<div class="fc-event-bg"></div>';
  67. evtcontent += '</div>';
  68. evtcontent += '<div class="fc-event-delete" style="width:100%;height:2%;background-color:#000;" data-id="' + event.id +'">删除</div>';
  69. element.html(evtcontent);
  70. }
  71. },
  72. events: (function () {
  73. var _data = [];
  74. $.ajax({
  75. url: top.$.rootUrl + '/LR_OAModule/Schedule/GetList',
  76. type: "get",
  77. dataType: "json",
  78. async: false,
  79. success: function (data) {
  80. _data = data;
  81. }
  82. });
  83. return _data;
  84. })()
  85. });
  86. });
  87. function resize() {
  88. $('#pageayout').height($(window).height() - 20);
  89. $(window).resize(function (e) {
  90. window.setTimeout(function () {
  91. $('#pageayout').height($(window).height() - 20);
  92. }, 200);
  93. e.stopPropagation();
  94. });
  95. }
  96. //添加日程
  97. function btn_add(date, time) {
  98. top.learun.layerForm({
  99. id: 'form',
  100. title: '添加日程',
  101. url: '/LR_OAModule/Schedule/Form?startDate=' + escape(date) + '&startTime=' + time,
  102. width: 500,
  103. height: 350,
  104. callBack: function (id) {
  105. return top[id].acceptClick();
  106. }
  107. });
  108. };
  109. //编辑日程
  110. $(document).on('click', '.fc-event-inner', function () {
  111. var keyValue = $(this).attr('data-id');
  112. top.learun.layerForm({
  113. id: 'form',
  114. title: '编辑日程',
  115. url: '/LR_OAModule/Schedule/Form?keyValue='+keyValue,
  116. width: 500,
  117. height: 350,
  118. callBack: function (id) {
  119. return top[id].acceptClick();
  120. }
  121. });
  122. });
  123. //删除日程
  124. $(document).on('click', '.fc-event-delete', function () {
  125. var keyValue = $(this).attr('data-id');
  126. if (!keyValue) {
  127. learun.alert.warning("请选择日程!");
  128. return false;
  129. }
  130. top.learun.layerConfirm('是否确认删除该项!', function (res) {
  131. if (res) {
  132. top.learun.deleteForm(top.$.rootUrl + '/LR_OAModule/Schedule/RemoveForm', { keyValue: keyValue }, function () {
  133. callback();
  134. });
  135. }
  136. });
  137. });
  138. function callback() {
  139. location.reload();
  140. }
  141. </script>
  142. </head>
  143. <body>
  144. <div id="pageayout" class="border" style="overflow: auto; padding: 0px;">
  145. <div id='calendar' class="calendar" style="margin: 10px;background: #fff; "></div>
  146. </div>
  147. </body>
  148. </html>