Пользовательское содержимое события

Чтобы настроить содержимое события и определить, какие данные отображать, используйте шаблоны. Разные режимы просмотра используют различные шаблоны, и чтобы узнать, какие именно применяются в конкретном режиме, обратитесь к статье Форматирование меток, дат, стилей.

В этой статье рассматривается, как изменять шаблоны для наиболее часто используемых представлений — Дневной вид и Week View.

В этих представлениях для настройки текста события используются два шаблона:

• event_header — определяет заголовок события
• event_text — определяет текст события

Также существует шаблон event_bar_text, который задаёт текст для событий, продолжающихся несколько дней. Этот шаблон используется в Месячный вид и Вид "Timeline".

Настройка заголовка события

Заголовок события формируется с помощью шаблона event_header.

// стандартное определение
scheduler.templates.event_header = function(start,end,ev){
    return scheduler.templates.event_date(start)+" - "+
    scheduler.templates.event_date(end);
};

Предположим, что в ваших объектах данных есть булево свойство important, которое определяет важность события. Вы хотите выделить важные события, добавив красную иконку с галочкой и выделив длительность события оранжевым цветом.

Вот пример кода для реализации этого:

scheduler.attachEvent("onTemplatesReady", function(){
    scheduler.templates.event_header = function(start,end,ev){
        if (event.important == true){
            return ("<img src='red_check.png'/> <b style='color:#F08080'>"+
                scheduler.templates.event_date(start)+" - "+
        } else {
            return(scheduler.templates.event_date(start)+" - "+
            scheduler.templates.event_date(end))
        }
    };
}); 
...
scheduler.init('scheduler_here', new Date(2019, 6, 5), "week");

Настройка текста события

Текст события задаётся с помощью шаблона event_text.

// стандартное определение
scheduler.templates.event_text = function(start,end,ev){
    return ev.text;
};

Допустим, в ваших объектах данных есть дополнительное свойство location, указывающее место проведения события. Вы хотите отображать место проведения вместе с текстом события внутри блока события.

Вот как это можно реализовать:

scheduler.attachEvent("onTemplatesReady", function(){
    scheduler.templates.event_text=function(start,end,event){
        return "<b>" + event.text + "</b><br><i>" + event.location + "</i>";
    }
}); 
...
scheduler.init('scheduler_here', new Date(2019, 6, 5), "week");

Наверх