Overview

It is the starting point for your Kanban Board, where you can easily configure the number of lines, the color of the text line header, and the header background. In addition, you can set whether cards are draggable from a certain line or droppable in it.

Example implementation:

Documentation

Description

It is the starting point for your Kanban Board, where you can easily configure the number of lines, the color of the text line header, and the background. In addition, you can set whether cards are draggable from a certain line or droppable in it.

This Kanban Board includes its own bundled drag-and-drop widget, a customized fork of the community "Drag and Drop (updated)" widget, with a fix for a desktop drag-release issue. No additional Marketplace downloads are required.

Source code: https://github.com/NinFaroth/app-services-components/tree/main/apps/web-widgets/drag-and-drop-widget

Typical usage scenario

• Kanban Board for Task or Material Management

Features and limitations

• Drag & Drop
• Change colors
  
  

Dependencies

• At least Mendix Studio Pro 9.24.4
• Community Commons
  

Installation

1. Install all dependencies.
2. Import the module.
3. Assign the appropriate module roles for the user roles in the security settings of your app.
4. Create a new KanbanImplementation module.
5. Include the KanbanConfiguration snippet from the “USE_ME” folder on your administration page. From here, you can manage your lines and cards. Customize the header background and text colors as desired. You can also specify if cards are draggable from a particular line or if they can be dropped onto it. Also add the KanbanBoard snippet to your selected page. If you are placing the KanbanBoard within another DataView widgets, ensure the editability of all surrounding DataViews are set to true.
6. Move the snippet and microflows from the 'ADJUSTME' folder into your implementation module.
7. Create there a KanbanCardExtension entity with any additional attributes required for your Kanban cards. Then, associate it with the KanbanCard entity in the Kanban module using a 1-1 association (see screenshot). KanbanCardExtension should be committed in the ACO_KanbanCard.
8. Create an ACT_KanbanCard_Create microflow to create a kanban card. Retrieve the line to be assigned to, implement Kanbancard_Create (from “USE_ME”) microflow to there and set all required paramteres . Then create an object of the new created KanbanCardExtenstion and set association between the KanbanCardExtension entity and the user accounts entity to allocate users to the cards (see screenshot).
9. Modify the snippets to fit your preferences, especially regarding your preferred Kanban Card. For added details, utilize the KanbanCardExtension entity and integrate those attributes into the KanbanCard snippet.
10. If you wish to commit, create, or delete a KanbanCard in your application, always use the provided microflows in the USE_ME folder.
11. To enhance your KanbanBoard with automation, use the supplied ACO_KanbanCard microflow and follow the instructions therein.
12. To change the line drag validation in your KanbanBoard, change the supplied KanbanCard_ValidateDragAction.
    
    

Note:

• Styling Changes. If you wish to modify the styling of the Kanban board, navigate to the app directory in the explorer and adjust the SASS styling within the module.
• Concurrent editing is not handled.  The move updates the acting user's board, but other users are not force-refreshed and keep a stale view; a second user acting on that stale board can hit a conflict/error. Handle cross-client refresh (and locking, if needed) on the implementing side.
• Multiple Kanban boards. If you plan to use more than one Kanban board, you'll need to adjust the logic yourself.