Kanban Board

Unleashing the Power of a Kanban Board Widget

There are 2 versions of the Kanban Board widget:

1. Kanban board (the original, first version) > does not support drag&drop

2. Kanban board DragDrop > new version, supports Drag & Drop and Double-Click.

For the Drag&Drop widget, a demo is accessible at: https://kanban-widget-demo.staging.wem.io/ This project is also available in the App Store in MyWEM, so you can get a copy of this working example project to play with in your own workspace.

The Kanban Board

The kanban board is a visual project management tool used to track and visualize work in progress. The board typically consists of columns representing different stages of work, and tasks- or work items which are represented by cards that move across the columns as progress is made. By providing a clear visual representation of the workflow, a kanban board helps teams visualize their work, identify bottlenecks, and promote collaboration and efficiency. In the following image you can see the kanban widget used for a ticket management system.

Properties

General

Property	Datatype	Description
Datasource	List	This is the list that contains the content or data you want to show as the cards. This can be a list from your datamodel or you can use a filter as the list.
SelectedCard	Reference	This should be a reference field that the Datasource as Referenced list. This is used as the selected card in your session.
VisibleColumns	ConceptSet	Set of concepts that represent the columns. You can use getchildren(concept parent) or { 'concept', 'concept2', etc}
Subject	Text
Column	Single select	This datafield defines the column in which a card is located.
Color	text	Defines the color of the card. Can be written as color name, hex value, etc.
Date	Date Time
Priority	Text	In this example Tostring(concept) is used.
Description	Text
Tooltip	Text	When empty uses Description.
User	Text
Message	Text
Message context	Text	Change the color of the message. You can find the possible values below.
Notification count	Number
Attachment count	Number
Selected Column	Text datafield	Field to store selected column (concept-id) to be used for drag&drop in the Change Columns flow. ONLY available in DragDrop version.

Behavior original widget (without drag&drop feature)

Property	Datatype	Description
OnClick	Dropdown	Choose what happens when a card or kanban item is selected.
Exit/flowchart	Dropdown	Choose which exit or flowchart should be used when a card is selected.

Behavior Drag&Drop widget

Property	Datatype	Description
OnColumnChange	Dropdown	Choose what happens when a card is being dragged onto another column.
Exit/flowchart	Dropdown	Choose exit or flowchart to be used when a card is dropped in a column.
OnDoubleClick	Dropdown	Choose what happens when a card is being doubleclicked on (single click is needed for grab to start dragging).
ClickExit/ClickFlowchart	Dropdown	Choose exit or flowchart to be used when a card is double-clicked.

Appearance

Property	Datatype	Description
HeaderText	Text	Header or title of the kanban board
Show Counters	Yes/No	Toggle on if the notification and Attachment count should be shown.
Background	Dropdown	Bootstrap context colors
Min width	Number	Minimum size in pixels
Min height	Number	Minimum size in pixels
Date format	Dropdown	Choose date format Long with time: Short without time:
*Custom date format	Text	dd-mm-yy hh:mm:ss

Values

Text Input	Result
"Default"
"Primary"
"Success"
"Info"
"Warning"
"Danger" message and error background