Управление длительностью
Этот раздел предоставляет инструменты для установки длительности задачи, выбирая ее дату начала и количество дней, которые она занимает.
gantt.config.lightbox.sections=[
{name:"description", height:70, map_to:"text", type:"textarea", focus:true},
{name:"time", height:72, map_to:"auto", type:"duration"} ];
Related sample: Basic initialization
Инициализация
По умолчанию в лайтбоксе включен один элемент управления duration. Если вы хотите добавить еще один, выполните следующие действия:
1) Добавьте новый раздел в конфигурацию лайтбокса:
gantt.config.lightbox.sections=[
{name:"description", height:70, map_to:"text", type:"textarea",focus:true},
{name:"time2", height:72, map_to:"auto", type:"duration"}, {name:"time", height:72, map_to:"auto", type:"duration"}
];
2) Назначьте метку новому разделу:
gantt.locale.labels.section_time2 = "Фактическая длительность";
Свойства
Вот некоторые ключевые свойства, которые могут быть полезны при работе с элементом управления time. Для полного списка ознакомьтесь здесь:
- name - (string) имя раздела
- height - (number) высота раздела
- map_to - (string,object) "auto" или объект, указывает свойство(-а) данных, связанные с разделом
- formatter - (object) экземпляр объекта durationFormatter
- type - (string) указывает тип элемента управления разделом
- focus - (boolean) если установлено в true, раздел получает фокус при открытии лайтбокса
- readonly - (boolean) если установлено в true, раздел становится только для чтения
- year_range - (array,number) определяет диапазон для выбора года. Можно настроить двумя способами:
- year_range: [2005, 2025] - охватывает период с 2005 по 2025
- year_range: 10 - охватывает период от [текущий год - 10 лет; текущий год + 10 лет]
- single_date - (boolean) если установлено в true, отображается только селектор start Date. Задачи определяются только датой начала и имеют нулевую длительность. Это в основном полезно для вех.
- time_format - (string) определяет порядок селекторов даты и времени
Настройка селекторов даты и времени
Вы можете настроить селекторы в разделе "Период времени", используя свойство time_format. Узнайте больше в документации Спецификация Формата Даты.
Добавление селектора времени в раздел 'Период времени'
gantt.config.lightbox.sections = [
{name:"description", height:38, map_to:"text", type:"textarea", focus:true},
{name:"time",type:"duration",map_to:"auto",time_format:["%d","%m","%Y","%H:%i"]}];
Массив time_format поддерживает следующие элементы:
- "%d" - селектор дня
- "%m" - селектор месяца
- "%Y" - селектор года
- "%H:%i" - селектор времени (формат определяется с помощью шаблона time_picker)
Вы можете изменить порядок и количество этих элементов в массиве, но формат данных должен оставаться неизменным. Например:
// время идет первым
time_format:["%H:%i", "%m", "%d", "%Y"]
// месяц идет первым
time_format:["%m","%d", "%Y", "%H:%i"]
// селектор года удален
time_format:["%H:%i", "%m", "%d"]
// неправильный пример
time_format:["%H:%i", "%M", "%d", "%Y"] //"%m" было неправильно заменено на "%M"
Сопоставление с пользовательскими свойствами даты и времени начала/окончания
Сопоставление по умолчанию
Обычно элементы управления временем и длительностью связаны с свойствами 'start_date' и 'end_date' по умолчанию, устанавливая map_to на "auto" (map_to:"auto").
Пользовательское сопоставление
Если вам нужно связать элементы управления с пользовательскими свойствами даты (вместо 'start_date' и 'end_date'), вы можете использовать объектную нотацию для свойства map_to:
gantt.config.lightbox.sections = [
{name: "description", height: 72, type: "textarea", map_to:"text", focus: true},
{name: "time", height: 72, type: "duration", map_to:"auto"},
{name: "baseline", height: 72, type: "duration", map_to:{start_date:"planned_start",end_date:"planned_end"}} ];
Related sample: Display baselines
Когда используется как объект, map_to включает три свойства:
- start_date - имя свойства для хранения даты начала из ввода
- end_date - необязательно, имя свойства для хранения даты окончания из ввода
- duration - необязательно, имя свойства для хранения длительности из ввода
Если свойство не указано, элемент управления будет использовать обязательное свойство даты по умолчанию.
Переключение видимости раздела
Вы можете контролировать видимость раздела длительности, установив type:"duration_optional" и button: true при настройке раздела лайтбокса:
gantt.config.lightbox.sections = [
{name: "description", height: 70, map_to: "text", type: "textarea", focus: true},
{name: "time", map_to: "auto", button: true, type: "duration_optional"} ];
Дополнительно установите метки для двух состояний кнопки:
gantt.locale.labels.time_enable_button = 'Запланировать';
gantt.locale.labels.time_disable_button = 'Отменить планирование';
Рядом с разделом появится кнопка-переключатель, позволяющая показывать или скрывать его. Когда он виден, раздел ведет себя как type:"duration".
Если кнопка отключена, раздел исчезает без каких-либо немедленных изменений. При сохранении свойства задачи, связанные с элементом управления длительностью через map_to, будут установлены в null.
gantt.getTask(1);
// возвращаемое значение
{
id: '1', text: 'Задача #1', unscheduled: true,
duration: 0, parent: '10',
end_date: null, start_date: null,
...
}
Эта функция полезна для пометки задач как незапланированных или для скрытия базовых линий определенных задач напрямую из интерфейса пользователя. Ознакомьтесь с соответствующими примерами:
Related sample: Незапланированные задачи
К началу