Loading...
 
Skip to main content

History: PluginKanban

Source of version: 36 (current)

Copy to clipboard
            ! {{page}}
''New in ((Tiki25)) (some work was done for Tiki24 but it wasn't usable). Use this ((wiki plugin)) to move ((tracker)) items with drag & drop capabilities in Trello-like boards.''

"A kanban board is one of the tools that can be used to implement [https://en.wikipedia.org/wiki/Kanban_(development)|Kanban] to manage work at a personal or organizational level.

Kanban boards visually depict work at various stages of a process using cards to represent work items and columns to represent each stage of the process. Cards are moved from left to right to show progress and to help coordinate teams performing the work. A kanban board may be divided into horizontal "swimlanes" representing different kinds of work or different teams performing the work." Source: [https://en.wikipedia.org/wiki/Kanban_board]

!! Components of a Kanban board

* __Columns__: The columns represent the different stages of the workflow. For example, a Kanban board might have columns for "Backlog", "To Do", "In Progress", and "Done"

* __Cards__: The cards represent individual work items. Each card should contain information about the work item, such as the title, description, priority, and due date.

* __Swimlanes__: Swimlanes are used to group cards together. For example, a Kanban board for a software development team might have lanes for different types of work items, such as "Bugs", "Features", and "Maintenance".

* __WIP limits__: WIP limits are used to control the amount of work that is in progress at any given time. This helps to ensure that work is completed in a timely manner.

Here is a demo: https://kanban.dev4.evoludata.com/

!! Manual Setup
!!! Settings requirement
It requires following preference settings to work:
* ((API)) access enabled (__Security > API access__), 
* Enable Vue.js (__Features > Interface > Enable Vue.js__)
* Always Load Vue.js (__Features > Interface > Always Load Vue.js__),

In the Tiki admin Control Panel, search for "vuejs".
By default mysql search won't find "vue" or "vue.js" (mysql ft_min_word_len default is greater than 3 char, [https://dev.mysql.com/doc/refman/8.0/en/fulltext-fine-tuning.html|see mysql documentation]).

!!! Feature requirements
You will also need to __set or use an existing [https://doc.tiki.org/Trackers|tracker]__ to store the cards (items) of your Kanban board with a few fields required for the board to be generated. Note that those fields should be public and searchable (tracker edit Fields list) and don't forget to rebuild-index after changes.

!!! The column parameter
The column parameter is looking for numerical values. If you use a dropdown with text values only it won't populate the items unless you fill the "Column acceptable values and configuration" parameter. Alternatively, you can use numerical value and text label in the dropdown field options that will be used as your "Column". IE: 0=Not done,1=Done,2=Need improvement.''{sign user="Bsfez" datetime="2023-03-14T08:28:46+00:00"}

!!! Filtering items displayed
The Kanban plugin items can be filtered using the same filters as the plugin List family. (see: ((PluginList filter control block)) )

!!Parameters
{pluginmanager plugin="kanban"}

To filter cards on the board (beyond swimlaneValues and columnValues), you can use the filter control block (https://doc.tiki.org/PluginList-filter-control-block), which will filter the items in the tracker.  It is important to note that if you do, there is no guarantee that newly created items from the board (their default values may filter them out).

!! Examples
!!! Example 1

As of 2023-03-13, doc.tiki.org is set up for Kanban style management of its own documentation. The example is here: https://doc.tiki.org/DocsTodoKanbanByPriority

!!! Example 2 
Here is the Step by step PluginKanban setup example.

!!!!Step 1 : Tracker setup
Setup a tracker to store the cards (items) of your Kanban board. Copy the below Profile/YAML code to import the tracker

{CODE(colors="scss")}
permissions: {  }
preferences: {  }
objects:
  -
    type: tracker
    ref: kanban_tasks
    data:
      name: 'Kanban Tasks'
      description: "{syntax type=tiki}\r\n{syntax type=tiki}\r\nTo test the new Kanban plugin"
      sort_default_order: desc
      show:
        - list_modification_date
  -
    type: tracker_field
    ref: kanban_tasks_ktaskName
    data:
      name: Name
      permname: ktaskName
      tracker: '$profileobject:kanban_tasks$'
      options:
        samerow: 1
        autocomplete: 'n'
        exact: 'n'
      type: text_field
      order: 10
      visby: {  }
      editby: {  }
      flags:
        - list
        - public
        - mandatory
  -
    type: tracker_field
    ref: kanban_tasks_ktaskDescription
    data:
      name: Description
      permname: ktaskDescription
      tracker: '$profileobject:kanban_tasks$'
      options:
        samerow: 1
        distinct: 'n'
        wysiwyg: 'n'
      type: text_area
      order: 20
      visby: {  }
      editby: {  }
      flags:
        - public
  -
    type: tracker_field
    ref: kanban_tasks_ktaskSwimlane
    data:
      name: Swimlane
      permname: ktaskSwimlane
      tracker: '$profileobject:kanban_tasks$'
      options:
        options:
          - top=Crawl
          - middle=Butterfly
          - bottom=Backstroke
      type: dropdown
      order: 40
      description: 'Also row'
      visby: {  }
      editby: {  }
      flags:
        - list
        - public
  -
    type: tracker_field
    ref: kanban_tasks_ktaskPriority
    data:
      name: Priority
      permname: ktaskPriority
      tracker: '$profileobject:kanban_tasks$'
      options:
        samerow: 1
        dec_point: .
        thousands: ','
      type: numeric
      order: 50
      visby: {  }
      editby: {  }
      flags:
        - list
        - public
  -
    type: tracker_field
    ref: kanban_tasks_ktaskColumn
    data:
      name: Column
      permname: ktaskColumn
      tracker: '$profileobject:kanban_tasks$'
      options:
        options:
          - wish=Wishes
          - prending=Pending
          - open=Open
          - done=Done
      type: dropdown
      order: 60
      visby: {  }
      editby: {  }
      flags:
        - list
        - public
  -
    type: tracker_option
    ref: kanban_tasks_sort_default_field
    data:
      tracker: '$profileobject:kanban_tasks$'
      name: sort_default_field
      value: modification
{CODE}

Once the YAML code above copied, in your tiki instance, go to  __Trackers -> Import -> Import From Profile/YAML -> paste the above YAML__ code, then __Import__

{img fileId="1990" showicon="y"}

After importing Tracker from Profile/YAML, you should have a tracker with all necessary fields as shown below:

{img fileId="1995" showicon="y"}

!!!!Step 2 : Use PluginKanban in your Wiki page 
Copy the below code into your wiki page (replacing the -+boardTrackerId+- in the code below from __11__ to the number of your Kanban tracker number in your tiki site). 

{CODE(colors="scss")}
{KANBAN(boardTrackerId="11" title="ktaskName"  description="ktaskDescription" column="ktaskColumn" columnValues="wish,Ready,10:prending,Pending,5:open:done"  order="ktaskPriority" swimlane="ktaskSwimlane" swimlaneValues=",Unsorted cards")}{KANBAN}
{CODE}

__i.e.__ PluginKanban uses  __permanent names__ of tracker fields as parameter value. 

{img fileId="1993" showicon="y"}

The result should be as shown below:

{img fileId="1994" showicon="y"}


!!!!Step 3 : Usage
{mediaplayer src="display1992"}

!! Related pages
* ((AllPlugins))
* ((Trackers))

!! Aliases
(alias(Plugin Kanban)) | (alias(Kanban))

Related
* https://gitlab.com/tikiwiki/tiki/-/merge_requests/1006
* ((dev:Kanban))
* https://kanboard.discourse.group/t/the-tiki-platform-implemented-kanban-functionality/2552/
* https://gitter.im/tiki-org/community?at=63b6f6887de82d2616142aa8