Обработка нажатия мышки
&НаКлиенте
Процедура ПолеHTML_ПриНажатии(Элемент, ДанныеСобытия, СтандартнаяОбработка)
НажатыйЭлемент = ДанныеСобытия.Element;
Если НажатыйЭлемент.id = "KanBanInteractionClick" Тогда
// СОБЫТИЕ: Нажатие на карточку
// ID элемента: НажатыйЭлемент.dataset.itemid
КонецЕсли;
Если НажатыйЭлемент.id = "KanBanInteractionDrop" Тогда
// СОБЫТИЕ: Перетаскивание карточки
// ID элемента: НажатыйЭлемент.dataset.itemid
// ID строки: НажатыйЭлемент.dataset.groupid
// ID колонки: НажатыйЭлемент.dataset.boardid
// ID ОТКУДА строки: НажатыйЭлемент.dataset.from_groupid
// ID ОТКУДА колонки: НажатыйЭлемент.dataset.from_boardid
// Номер позиции от начала колонки: НажатыйЭлемент.dataset.order
КонецЕсли;
КонецПроцедуры
Пример формирования канбан, для передачи данных скрипту:
&НаКлиенте
Процедура Обновить()
СтруктураДанных=СформироватьСтруктуруДанных();
Структура=Новый Структура;
Структура.Вставить("rows", СтруктураДанных.KanBan_Rows);
Структура.Вставить("boards", СтруктураДанных.KanBan_Boards);
Структура.Вставить("items", СтруктураДанных.KanBan_items);
Структура.Вставить("settings", Новый Структура("hideaddbutton", Ложь));
Элементы.КанбанHTML.document.KanBanTableRemoveAll();
Элементы.КанбанHTML.Документ.KanBanTableStyle(СтруктураДанных.kanban_CSS);
Элементы.КанбанHTML.Документ.KanBanTable(СтрокаJSON(Структура));
КонецПроцедуры
Функции:
Удалить все:
document.KanBanTableRemoveAll();
Установить стили:
document.KanBanTableStyle('CSS');
Создание таблицы:
var kanban_rows = [
{
id: 'Sid',
title: 'Сидоров'
},
{
id: 'Sid2',
title: 'Сидоров2'
}
];
var kanban_items = [
{
date: '27/07/2020',
id: "id01",
title: "Задание 01",
rowid: 'Petrov',
boardid: '_todo'
},
{
date: '27/07/2020',
id: "id02",
title: "Задание 02",
rowid: 'Petrov',
boardid: '_todo'
}
];
var kanban_boards = [
{
id: "_todo",
title: "В Обработке",
class: "info",
},
{
id: "_todo2",
title: "В Обработке2",
class: "info",
}
];
document.KanBanTable({
rows: kanban_rows,
boards: kanban_boards,
items: kanban_items,
settings: {
hideaddbutton: true
}
});