A Kanban board component for visualizing workflow and managing tasks with drag-and-drop functionality.
Source
<pe:kanban id="kanban"
widgetVar="kanbanWidget"
value="#{kanbanController.columns}"
draggable="true"
addItemButton="true"
style="height:400px">
<p:ajax event="drop" listener="#{kanbanController.onDrop}" update="growl" />
<p:ajax event="itemAdd" listener="#{kanbanController.onAddItem}" update="kanban growl" />
</pe:kanban>
@Named
@ViewScoped
public class KanbanController implements Serializable {
private static final long serialVersionUID = 1L;
private List<KanbanColumn> columns;
@PostConstruct
public void init() {
columns = new ArrayList<>();
// To Do column
KanbanColumn todoColumn = new KanbanColumn("todo", "To Do");
todoColumn.setCssClass("kanban-todo");
todoColumn.addItem(new KanbanItem("item1", "Add support for Kanban",
"Create a new Kanban component for PrimeFaces Extensions"));
todoColumn.addItem(new KanbanItem("item2", "Write documentation",
"Document the new component"));
// In Progress column
KanbanColumn inProgressColumn = new KanbanColumn("inprogress", "In Progress");
inProgressColumn.setCssClass("kanban-inprogress");
inProgressColumn.addItem(new KanbanItem("item3", "Design component",
"Design the Kanban board component"));
// Done column
KanbanColumn doneColumn = new KanbanColumn("done", "Done");
doneColumn.setCssClass("kanban-done");
doneColumn.addItem(new KanbanItem("item4", "Research libraries",
"Research available Kanban libraries"));
columns.add(todoColumn);
columns.add(inProgressColumn);
columns.add(doneColumn);
}
public void onDrop(KanbanDragEvent event) {
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Item Moved",
"Item " + event.getItemId() + " moved from " + event.getSourceColumnId()
+ " to " + event.getTargetColumnId() + " at position " + event.getNewPosition());
FacesContext.getCurrentInstance().addMessage(null, message);
}
public void onAddItem(KanbanAddEvent event) {
for (KanbanColumn column : columns) {
if (column.getId().equals(event.getColumnId())) {
int count = column.getItems().size() + 1;
column.addItem(new KanbanItem("new-" + count, "New Task " + count,
"Click to edit this task"));
break;
}
}
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Item Added",
"New item added to column " + event.getColumnId());
FacesContext.getCurrentInstance().addMessage(null, message);
}
public List<KanbanColumn> getColumns() {
return columns;
}
public void setColumns(List<KanbanColumn> columns) {
this.columns = columns;
}
}