Migration From Older Versions
7.1 -> 7.2
Обновление до версии 7.2 вносит изменения в некоторые значения по умолчанию.
Плагин all_timed теперь включён по умолчанию
Плагин all_timed теперь активирован по умолчанию, что позволяет отображать события, продолжающиеся через ночь. Чтобы вернуть прежнее поведение, настройте конфигурацию следующим образом:
scheduler.config.all_timed = false;
Функции работы с датой больше не изменяют свой аргумент
В более ранних версиях функции работы с датой, такие как scheduler.date.day_start, scheduler.date.week_start и scheduler.date.date_part, изменяли исходный объект даты, переданный в качестве аргумента:
const date = new Date(2025, 1, 15, 13, 00);
const dayStart = scheduler.date.day_start(date);
console.log(dayStart);
// 2025-02-15 00:00:00
console.log(date);
// 2025-02-15 00:00:00
Начиная с версии 7.2 исходная дата остаётся неизменной:
const date = new Date(2025, 1, 15, 13, 00);
const dayStart = scheduler.date.day_start(date);
console.log(dayStart);
// 2025-02-15 00:00:00
console.log(date);
// 2025-02-15 13:00:00
7.0 -> 7.1
Обновление до версии 7.1 включает несколько несовместимых изменений.
Новый движок для повторяющихся событий
Новый движок для Повторяющихся событий используется при включении плагина recurring:
scheduler.plugin({
recurring:true
});
Так как новый плагин использует другой набор свойств для описания повторяющихся событий, на данный момент отсутствует прямой путь миграции. Вы можете продолжить использовать старый движок для повторяющихся событий, включив устаревший плагин до момента готовности к переходу:
scheduler.plugin({
recurring_legacy:true
});
Всплывающее окно отмены
Функция отмены, управляемая undo_deleted, теперь включена по умолчанию. Если такое поведение не подходит, его можно отключить через конфигурацию:
scheduler.config.undo_deleted = false;
Изменения в Map View
Некоторые свойства устарели и теперь входят в объект конфигурации map_settings:
- scheduler.config.map_error_position
- scheduler.config.map_initial_position
- scheduler.config.map_type
Обновлённый способ задания этих свойств:
scheduler.config.map_settings = {
initial_position: {
lat: 48.724,
lng: 8.215
},
error_position: {
lat: 15,
lng: 15
},
type: google.maps.MapTypeId.HYBRID
}
...
scheduler.init('scheduler_here',new Date(2024,05,11),"map");
Также эти шаблоны Map view устарели и заменены на map_info_content:
- scheduler.templates.marker_date
- scheduler.templates.marker_text
Пример нового использования шаблона:
scheduler.templates.map_info_content = function(event){
const formatDate = scheduler.templates.tooltip_date_format;
return `<div><b>Text:</b> ${event.text}
<div><b>Location:</b> ${event.event_location}</div>
<div><b>Starts:</b> ${formatDate(event.start_date)}</div>
<div><b>Ends:</b> ${formatDate(event.end_date)}</div>
</div>`;
};
Свойства, доступные отдельно и внутри общего объекта
Свойство map_view_provider можно указывать как отдельно, так и внутри объекта конфигурации map_settings следующим образом:
scheduler.config.map_settings = {
view_provider: "googleMap"
}
...
scheduler.init('scheduler_here',new Date(2024,05,11),"map");
Свойства, используемые отдельно
Следующие свойства карты остаются вне объекта map_settings:
6.0 -> 7.0
Обновление до версии 7.0 вносит несколько несовместимых изменений.
Скины теперь используют CSS-переменные
CSS-скины (темы) были полностью переработаны и теперь используют CSS-переменные. Хотя структура HTML и имена CSS-классов в основном остались прежними, пользовательские стили, написанные для старых версий Scheduler, могут работать некорректно в версии 7.0.
Например, ранее для изменения цвета фона события использовался следующий стиль:
<style>
/* событие в дневном или недельном представлении */
.dhx_cal_event.manager_event div{
background-color: #009966 !important;
color: black !important;
}
/* многодневное событие в месячном представлении */
.dhx_cal_event_line.manager_event{
background-color: #009966 !important;
color: black !important;
}
/* событие с фиксированным временем в месячном представлении */
.dhx_cal_event_clear.manager_event{
color: black !important;
}
</style>
Начиная с версии 7.0 тот же эффект достигается так:
<style>
.manager_event {
--dhx-scheduler-event-background: #009966;
--dhx-scheduler-event-color: black;
}
</style>
Список доступных переменных можно найти на странице Настройка скинов.
Для сохранения желаемого внешнего вида после миграции потребуется обновить ваши стили.
Один CSS-файл для всех тем
Теперь все темы объединены в один файл dhtmlxscheduler.css.
Для выбора конкретного скина используйте свойство scheduler.skin:
scheduler.skin = "material";
Или воспользуйтесь методом setSkin:
scheduler.setSkin("material");
Учтите, что scheduler.setSkin() вызывает перерисовку Scheduler.
Если вы переключаетесь с любого скина, кроме terrace, выполните следующие шаги:
- Замените старый CSS-файл скина на новый объединённый файл:
<!-- СТАРЫЙ -->
<link rel="stylesheet" href="./codebase/dhtmlxscheduler_material.css" type="text/css">
<!-- НОВЫЙ -->
<link rel="stylesheet" href="./codebase/dhtmlxscheduler.css" type="text/css">
- Включите скин через JavaScript:
scheduler.setSkin("material");
scheduler.init("scheduler_here");
Устаревшие настройки scheduler.xy
Следующие свойства scheduler.xy больше не используются:
- scheduler.xy.nav_height
- scheduler.xy.event_header_height
Их высота теперь регулируется CSS-стилями, например:
.dhx_cal_navline {
height: 40px;
}
.dhx_cal_event dhx_title {
height: 30px;
}
Изменены значения по умолчанию
Значения по умолчанию для свойств details_on_create и details_on_dblclick изменены с false на true.
Шрифт для скина Material
Скин Material больше не включает шрифт Roboto по умолчанию.
Если вы используете Material, импортируйте шрифт вручную:
@import url(
'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap'
);
Новый API для тултипов
Тултипы теперь имеют обновлённый API, который упрощает привязку тултипов к пользовательским элементам. Подробнее в статье Тултипы.
Отступы в колонках Day/Week view
В представлениях День, Неделя и Units теперь добавлен небольшой отступ по краям колонок. Это обеспечивает пустое пространство, в котором пользователь может создать новое событие двойным щелчком.
Чтобы убрать этот отступ, установите day_column_padding в ноль:
scheduler.config.day_column_padding = 0;
Интеграция сервиса экспорта
Начиная с версии 7.0, функции импорта/экспорта входят в библиотеку Scheduler.
Если ранее вы подключали https://export.dhtmlx.com/scheduler/api.js для он лайн-экспорта, например:
<script src="codebase/dhtmlxscheduler.js"></script>
<script src="https://export.dhtmlx.com/scheduler/api.js"></script>
Удалите этот файл и включите расширение export_api через scheduler.plugins:
scheduler.plugins({
export_api: true
});
Обновлена реализация Promise
Библиотека Bluebird была удалена из пакета Scheduler. Теперь Promise использует нативную реализацию Promise.
5.3 -> 6.0
Обновление до версии 6.0 вносит две основные структурные перемены в пакет Scheduler:
- Все файлы расширений теперь включены в dhtmlxscheduler.js. Для включения дополнительных расширений используйте API.
- Если вы ранее подключали расширения отдельно, например:
<script src="../codebase/dhtmlxscheduler.js"></script>
<script src="../codebase/ext/dhtmlxscheduler_active_links.js"></script>
или
import "dhtmlx-scheduler";
import "dhtmlx-scheduler/ext/dhtmlxscheduler_active_links";
Удалите отдельные файлы расширений и включайте расширения через scheduler.plugins:
scheduler.plugins({
active_links: true
});
Полный список расширений смотрите здесь.
-
Если вы используете модифицированные или кастомные файлы расширений, продолжайте подключать их вручную, как прежде.
-
Обратите внимание, что расширение dhtmlxscheduler_csp.js полностью удалено и больше не требует ручного включения.
- Все локали теперь входят в dhtmlxscheduler.js. Для активации локали используйте вызов API.
- Удалите любые отдельные файлы локалей со страницы и включайте нужную локаль с помощью scheduler.i18n.setLocale:
scheduler.i18n.setLocale("de");
- Кастомные файлы локалей по-прежнему можно загружать вручную.
Инициализация DataProcessor
Конструктор DataProcessor перемещён из глобальной функции dataProcessor в функцию scheduler.DataProcessor.
Если в вашем приложении используется DataProcessor, обновите код инициализации следующим образом:
// старый способ
var dp = new dataProcessor("/scheduler/backend/events");
dp.init(scheduler);
dp.setTransactionMode("REST", false);
Замените на:
// обновлённый способ
var dp = new scheduler.DataProcessor("/scheduler/backend/events");
dp.init(scheduler);
dp.setTransactionMode("REST", false);
Рекомендуется использовать scheduler.createDataProcessor:
// предпочтительный способ
var dp = scheduler.createDataProcessor({
url: "/scheduler/backend/events",
mode: "REST"
});
В этом случае вызов DataProcessor.init(scheduler) не требуется, а DataProcessor.setTransactionMode можно вызывать как обычно при необходимости.
Устаревший API
Объект dhtmlx больше не определяется в dhtmlxscheduler.js, поэтому ряд методов и глобальных объектов устарели начиная с версии 6.0.
- Следующие методы устарели и заменены на:
| Устаревшие методы | Рабочие методы |
| dhtmlx.alert | scheduler.alert |
| dhtmlx.confirm | scheduler.confirm |
| dhtmlx.modalbox | scheduler.modalbox |
| dhtmlx.uid | scheduler.uid |
| dhtmlx.copy | scheduler.copy |
| dhtmlx.mixin | scheduler.mixin |
| dhtmlx.defined | scheduler.defined |
| dhtmlx.bind | scheduler.bind |
| dhtmlx.assert | scheduler.assert |
| window.dataProcessor | scheduler.DataProcessor |
Аргументы и поведение методов не изменились.
- Следующие глобальные объекты устарели:
- dhtmlxAjax
- dtmlXMLLoaderObject
- dhtmlDragAndDropObject
- dhtmlxEventable
- dhtmlxError
Если они всё ещё требуются в вашем приложении, включайте их через плагин legacy:
scheduler.plugins({
legacy: true
});
5.2 -> 5.3
Сенсорные жесты
Обработчик жеста свайпа теперь по умолчанию отключён.
Чтобы включить его обратно, используйте настройку scheduler.config.touch_swipe_dates следующим образом:
scheduler.config.touch_swipe_dates = true;
Разметка и стили
Режим box-sizing для элементов событий в Месячный вид был изменён с content-box на border-box во всех скинах.
Это касается элементов .dhx_cal_event_clear и .dhx_cal_event_line.
Это изменение не должно привести к видимым отличиям, но если вы настраивали отображение событий в представлении Месяц или используете собственный скин, возможно, потребуется скорректировать ваши стили.
5.1 -> 5.2
Поведение drag-n-drop
Начиная с версии 5.2, события можно перетаскивать за любую часть их тела, а не только за заголовок, как раньше. Чтобы вернуть прежнее поведение, установите свойство drag_event_body в false (по умолчанию включено):
scheduler.config.drag_event_body = false;
События onXLE/onXLS устарели
Эти события всё ещё работают, но будут удалены в будущем. Замените их следующим образом:
scheduler.attachEvent("onXLS",function(){}); →
scheduler.attachEvent("onLoadStart",function(){});
scheduler.attachEvent("onXLE",function(){}); →
scheduler.attachEvent("onLoadEnd",function(){});