KanbanBoard
TsgcHTMLComponent_KanbanBoard — Delphi, C++ Builder ve .NET'te isteğe bağlı SortableJS sürükle-bırak ile sütunlardan ve kartlardan oluşan bir kanban panosu işleyin.
TsgcHTMLComponent_KanbanBoard — Delphi, C++ Builder ve .NET'te isteğe bağlı SortableJS sürükle-bırak ile sütunlardan ve kartlardan oluşan bir kanban panosu işleyin.
Sütunlar ekleyin, her birine kartlar bırakın (ya da duruma göre gruplanmış bir veri kümesi bağlayın), isteğe bağlı olarak sürüklemeyi etkinleştirin, ardından HTML özelliğini okuyun.
TsgcHTMLComponent_KanbanBoard
Bootstrap 5 panosu + kapsamlı CSS (isteğe bağlı SortableJS)
Delphi, C++ Builder, .NET
Her şerit için AddColumn'u çağırın, kartları sütunun AddCard'ı ile iletin, yeniden sıralama isterseniz DragEnabled'ı etkinleştirin, ardından HTML'i okuyun.
uses
sgcHTML_Enums, sgcHTML_Component_KanbanBoard;
var
oBoard: TsgcHTMLComponent_KanbanBoard;
oCol: TsgcHTMLKanbanColumn;
begin
oBoard := TsgcHTMLComponent_KanbanBoard.Create(nil);
try
oBoard.BoardID := 'sprint';
oBoard.Height := '500px';
oBoard.DragEnabled := True;
oCol := oBoard.AddColumn('To Do', hcSecondary);
oCol.AddCard('Draft spec', 'Outline the API.', hcLight, 'Ana');
oBoard.AddColumn('Done', hcSuccess);
WebModule.Response := oBoard.HTML; // board + scoped CSS
finally
oBoard.Free;
end;
end;
// Or bind it straight to a dataset (grouped by status):
oBoard.LoadFromDataSet(qryTasks, 'Status', 'Title', 'Notes', 'Owner');// includes: sgcHTML_Enums.hpp, sgcHTML_Component_KanbanBoard.hpp
TsgcHTMLComponent_KanbanBoard *oBoard = new TsgcHTMLComponent_KanbanBoard(NULL);
try
{
oBoard->BoardID = "sprint";
oBoard->Height = "500px";
oBoard->DragEnabled = true;
TsgcHTMLKanbanColumn *oCol = oBoard->AddColumn("To Do", hcSecondary);
oCol->AddCard("Draft spec", "Outline the API.", hcLight, "Ana");
oBoard->AddColumn("Done", hcSuccess);
String html = oBoard->HTML; // board + scoped CSS
}
__finally
{
delete oBoard;
}using esegece.sgcWebSockets;
var board = new TsgcHTMLComponent_KanbanBoard();
board.BoardID = "sprint";
board.Height = "500px";
board.DragEnabled = true;
var col = board.AddColumn("To Do", TsgcHTMLColor.hcSecondary);
col.AddCard("Draft spec", "Outline the API.", TsgcHTMLColor.hcLight, "Ana");
board.AddColumn("Done", TsgcHTMLColor.hcSuccess);
string html = board.HTML; // board + scoped CSSEn sık başvurduğunuz üyeler.
Columns, her biri bir Title, enum Color, ColumnID ve bir Cards koleksiyonuna sahip şeritleri tutar.
AddColumn(aTitle, aColor), bir şerit ekler ve ona kart eklemeye devam edebilmeniz için TsgcHTMLKanbanColumn'u döndürür.
Bir sütunun AddCard(aTitle, aDescription, aColor, aAssignee, aTag, aTagColor)'ı, isteğe bağlı bir açıklama, görevli ve renkli etiket rozetiyle bir kart ekler.
LoadFromDataSet(aDataSet, aGroupField, aTitleField, aDescField, aAssigneeField), her farklı grup değeri için bir sütun ve her satır için bir kart oluşturur.
DragEnabled, kartların sütunlar arasında sürüklenebilmesi için SortableJS enjekte eder; statik bir pano için kapalı bırakın.
BoardID, panoyu tanımlar; Height, kaydırma alanını sınırlar; HTML, panoyu ve onun kapsamlı CSS'sini döndürür.