Перейти к основному содержимому

timeline_cell_content

Description​

Позволяет задавать пользовательский HTML-контент внутри ячеек timeline

timeline_cell_content: (task: Task, date: Date) => string | number | void;

Parameters​

  • task - (required) Task - объект задачи
  • date - (required) Date - дата, соответствующая ячейке

Returns​

  • text - (string | number | void) - HTML-строка

Example​

gantt.templates.timeline_cell_content = function (task, date) {
    if (gantt.getTaskType(task) === "task"){
        const cost = calculateSlotCost(task, date);
        return `<div className='cost'>${demoValue}</div>`;
    }
    return "";
};

Details​

заметка

note Этот шаблон предпочтительнее использовать вместо метода addTaskLayer(), если вы хотите отображать пользовательский контент внутри ячеек timeline. Он проще в реализации и обеспечивает лучшую производительность.

Учтите, что пользовательский контент будет отображаться под полосами задач, поэтому полосы задач имеют более высокий z-index. Это значит, что контент может быть скрыт, если полоса задачи перекрывает ячейку.

Если вы хотите, чтобы пользовательский контент отображался поверх полос задач, можно задать более высокий 'z-index' для вашего пользовательского элемента:

<style>
    .cost{
        position:absolute;
        z-index: 5;
        pointer-events: none; 
    }
</style>

Change log​

  • добавлено в версии v8.0