Работа с сервером

Загрузка данных

Scheduler ожидает бэкенд сервер для загрузки событий и календарей. Передайте ссылку на сервер в параметр url:

webix.ui({
    view: "scheduler",
    url:"http://localhost:3200/"
});

Scheduler загружает и сохраняет данные, используя следующие URL:

  • events (напр., http://localhost:3200/events) - получение и сохранения событий
  • calendars (напр., http://localhost:3200/calendars) - получение и сохранение календарей
  • sections (напр., http://localhost:3200/sections) - получение секций
  • units (напр., http://localhost:3200/units) - получение категорий.

Вы можете скачать готовый бэкенд для Scheduler.

Если у вас нет бэкенд сервера, вы можете кастомизировать методы сервиса Backend и предоставлять клиентские данные в виде промиса.

Сервис Backend

Сервис Backend это серверная модель, у которой есть методы для запросов на сервер. Они вызываются сервисом Operations при необходимости загрузки или сохранения данных.

Ниже вы найдёте полный список методов.

Как кастомизировать модель Backend

Чтобы менять запросы, получать и обрабатывать ответные данные вы можете:

  • создать свой бэкенд сервис и наследовать его от сервиса по умолчанию;
  • определять и переопределять методы;
  • использовать произвольный бэкенд сервис через свойство override.
class MyBackend extends scheduler.services.Backend {
  // новые методы 
}
 
webix.ui({
    view: "scheduler",
    url:"http://localhost:3200/",
    override: new Map([[scheduler.services.Backend, MyBackend]]),
});

Как изменить запрос на сервер

Чвы можете отправлять AJAX запросы на ваш сервер с помощью необходимых URL, напр.:

Добавляем событие

class MyBackend extends scheduler.services.Backend {
  addEvent(event) {
    return webix.ajax.post("//localhost:3200/events", event)
      .then(res => res.json());
  }
}

Обработка клиентских данных

Если вы хотите передать в Scheduler клиентские данные, вам необходимо вернуть промис внутри следующих методов:

Клиентские данные

class MyBackend extends scheduler.services.Backend {
    events() {
        return webix.promise.resolve(events);
    }
    calendars() {
        return webix.promise.resolve(calendars);
    }
 }

Related sample:  Scheduler: Local Data

Смотрите требуемый формат входящих данных.

Методы сервиса Backend

В этой секции вы найдёте детальное описание следующих методов:

url(path)

Используется другими методами для подготовки URL к запросам.

Parameters:

  • path (string) - относительный путь.

Returns: абсолютный путь.

events([params])

Вызывается при инициализации виджета.

Parameters:

  • params (object) - необязательный параметр. Объект с начальной и конечной датами; необходимо передавать этот параметр, если вы хотите получить события за определённый временной промежуток (напр., при динамической загрузке):
{
  from: "2018-05-21 00:00:00",
  to: "2018-05-22 00:00:00"
}

Returns: промис с массивом событий (всех или за определённый временной период).

Request:

GET http://localhost:3000/events
 
// dynamic loading
GET http://localhost:3000/events?from=2020-10-01%2000%3A00%3A00&to=2020-11-01%2000%3A00%3A00

Response:

Сервер возвращает массив с объектами событий:

[
  {"start_date":"2018-06-08 17:00:00","end_date":"2018-06-08 20:00:00",
  "text":" Zentralstadion - Leipzig ","details":" Leipzig, GER ",
  "color":"#91E4A6","calendar":2,"id":"1"},
 
  {"recurring":"FREQ=WEEKLY;BYDAY=MO","text":"Meeting",
  "start_date":"2018-05-21 20:00:00","end_date":"2018-05-21 21:00:00",
  "all_day":"0","calendar":1,"color":"#D2FB9E",
  "details":"Starbucks","id":"ftwMT7mkIZPJIMmO", section: "1", units: "3"},
 
  // другие события
]

addEvent(obj)

Добавляет новое событие на сервер.

Parameters:

  • obj (object) - данные события.

Returns: промис с объектом ID нового события.

Request:

POST http://localhost:3000/events
Form Data
recurring: FREQ=YEARLY;BYMONTH=1;BYMONTHDAY=1
text: Meeting
start_date: 2018-05-21 20:00:00
end_date: 2018-05-21 21:00:00
all_day: 0
calendar: 1
color: #997CEB
details: Meeting with Dave at Starbucks
sections: 1
units: 3

Более подробно о формате iCal и его правилах читайте в спецификации.

Response:

Сервер возвращает объект с ID созданного события.

{id: "mY7VoF4uLsxHaJqf"}

updateEvent(id, obj, mode [, date])

Обновляет указанный объект.

Parameters:

  • id (string, number) - ID события;
  • obj (object) - объект с новыми данными;
  • mode (string) - название режима, в котором обновится событие:
    • "this" - передавайте this, если необходимо обновить текущее повторение события;
    • "all" - передавайте all, если необходимо обновитть все повторения события;
    • "next" - передавайте next, если необходимо обновить повторения события, начиная с определённой даты;
  • date (Date) - необязательный параметр. Дата, которая используется при обновлении в режиме "next" (только для повторяющихся событий).

Returns: промис.

Request:

PUT http://localhost:3000/events/mY7VoF4uLsxHaJqf
Form Data
// единичное событие
"start_date":"2020-10-10 11:35:00","end_date":"2020-10-10 14:35:00"
"mode": "all"
 
// повторяющиеся
"recurring":"FREQ=DAILY;INTERVAL=1;UNTIL=20201009T000000Z"
"recurring_update_date": some date
"recurring_update_mode": "next"
"mode": next
"date": 2020-10-09 00:00:00

Более подробно о формате iCal и его правилах читайте в спецификации.

removeEvent(id)

Удаляет указанное событие.

Parameters:

  • id (string, number) - ID события.

Returns: промис.

Request:

DELETE http://localhost:3000/events/mY7VoF4uLsxHaJqf

sections()

Вызывается, когда Scheduler переходит в режим таймлайна.

Returns: промис с массивом всех секций.

Request:

GET http://localhost:3000/sections

Response:

Сервер возвращает массив объектов данных секций.

[
  {"text":"Section 1","id":"1"},
  {"text":"Section 2","id":"2"},
  // другие секции
]

units()

Вызывается, когда Scheduler переходит в режим Units.

Returns: промис с массивом всех категорий.

Request:

GET http://localhost:3000/units

Response:

Сервер возвращает массив объектов данных категорий.

[
   {"id":"1"," value":"Sports"},
   {"id":"2", "value":"Social activities"},
   {"id":"3","value":"Celebrations"},
]

calendars()

Вызывается при инициализации виджета.

Returns: промис с массивом календарей (групп событий).

Request:

GET http://localhost:3000/calendars

Response:

Сервер возвращает массив с объектами данных календарей.

[
  {"text":"Personal","color":"#997CEB","active":1,"id":"1"},
  {"text":"Public","color":"#01C2A5","active":1,"id":"2"},
  {"text":"Birthdays","color":"#D2FB9E","active":0,"id":"3"},
  {"text":"Holidays","color":"#F68896","active":0,"id":"4"},
  // другие календари
]

addCalendar(obj)

Добавляет новый календарь на сервер.

Parameters:

  • obj (object) - данные календаря.

Returns: промис с объектом ID календаря.

Request:

POST http://localhost:3000/calendars
Form Data
text: (no title)
color: #997CEB
active: 1

Response:

Сервер возвращает объект с ID нового календаря.

{id: "nNQcTUFtOCZQXP2F"}

updateCalendar(id, obj)

Обновляет указанный календарь.

Parameters:

  • id (string, number) - ID календаря;
  • obj (object) - новые данные.

Returns: a promise.

Request:

PUT http://localhost:3000/calendars/nNQcTUFtOCZQXP2F
Form Data
id: nNQcTUFtOCZQXP2F
text: Legends
color: #F7CC34
active: 1

removeCalendar(id)

Удаляет указанный календарь.

Parameters:

  • id (string, number) - ID календаря.

Returns: промис.

Request:

DELETE http://localhost:3000/calendars/nNQcTUFtOCZQXP2F
Наверх