Я использую FullCalendar и отлично работает (ish) 🙂
Теперь мои пользователи требуют простого способа скопировать полные месячные запланированные смены на следующий месяц – или в любой месяц.
У меня уже есть функция «Копировать неделю», и она работает нормально. Но я просто не могу понять, как правильно копировать целые месячные смены. Я думал копировать «день N Месяца А» в «день N Месяца B», но это приводит к неудаче – по мере того, как 1. день в месяце постоянно перемещается.
Любые идеи, как это сделать?
Редактировать:
Задача, которую я ищу для ввода, действительно находится в бэкэнде PHP / MySQL. В интерфейсе у пользователя просто есть 2 варианта: Копировать месяц и кнопку «Копировать».
В бэкэнд я получаю «mthfrom => 2014-1» и «mthto => 2015-1». У меня нет проблем с поиском всех событий с 2014 года с помощью SELECT * from dbevent WHERE year(shiftstart)='2014' and MONTH(shiftstart)='1'; ,
Проблема в том, что мне нужно «сопоставить» правильные рабочие дни, поэтому соответствующие выходные дни совпадают в скопированном месяце. Например, я хочу скопировать все смены с января 2014 года по март 2014 года.
Возможно, вы можете использовать два подключенных датпикера (то есть, самая ранняя дата второго должна быть последней, чем дата первого), и используйте кнопку для копирования событий.
ИМО – лучший способ скопировать события на сервере. Предполагая, что у вас есть БД, вы выбираете события из данного периода и дублируете события одним нажатием кнопки.
Таким образом, у вас будет «Копировать события за периодом» вместо «копировать события по неделям (и месяцу, и кварталу, ..)».
Таким образом, ваш внешний код будет выглядеть примерно так:
<div class='input-group date' id='dtpFrom'> <input type='text' class="form-control" /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </span> </div> <div class='input-group date' id='dtpTo'> <input type='text' class="form-control" /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </span> </div> <button id="copyEvents" class="btn btn-default">Copy Events </button> <div id="calendar"></div> <script> $('#dtpFrom').datetimepicker(); $('#dtpTo').datetimepicker(); $("#copyEvents").on('click', function() { var dateFrom = $('#dtpFrom').data("DateTimePicker").getDate(), dateTo = $("#dtpTo").data("DateTimePicker").getDate(); $.ajax({ url: 'url-for-server', data: {from: dateFrom, to: dateTo}, type: 'post', dataType: 'json', success: function() { // reload events if you want $("#calendar").fullCalendar( 'refetchEvents' ); } }); }); // start fullcalendar $("#calendar").fullCalendar(); </script>
Полный код находится в этом JsFiddle и служит демонстрацией, которая поможет вам. Я использовал Bootstrap, но вы можете использовать datepickers из jQuery UI.
Единственное, чего нет, это код сервера, который вам нужно создать для себя. Тем не менее, у вас будет период для копирования на следующий месяц, поэтому его просто дублируют строки базы данных, добавляя 1 месяц к каждому началу / концу.