Hi Team,
We have an issue in tooltip names for resourceAvatars , If my event have 5 resouces and card size is big enough to show all, they comes fine. But If I resize the width and i get +2, or +3 design then names coming in tooltip is missing one name and showing 1 duplicate name.
Example screenhots:
When all are shown: Its fine in this case
- s1.png (185.76 KiB) Viewed 3751 times
Now when I resize and gets +2:
Alpha and Beta comes fine then above +2 comes charlie, beta and Ellie.
here beta is duplicated and Delta is gone missing
- s1.png (158.45 KiB) Viewed 3751 times
Tested on this link: https://bryntum.com/products/taskboard/examples/responsive/
This is the minimal code to reproduce ths issue.
import shared from '../_shared/shared.module.js?492204';
import { TaskBoard } from '../../build/taskboard.module.js?492204';
var kanban = [
{
id : 1,
weight : 76000000,
secondary_parent_item_name : "Multiple Assignee",
secondary_status_name : "At risk",
status : "In progress",
secondary_status_colour : "#f0ad4e",
item_name : "Plan 1",
color : "#5bc0de",
description : "BUG",
name : "6248",
deadline_date : "20 Feb 26 10:50",
secondary_parent_item_id : "5231"
},
{
id : 2,
weight : 78000000,
secondary_parent_item_name : "Multiple Assignee",
status : "Planned",
item_name : "Plan 2",
color : "#777777",
description : "Test2",
name : "6249",
deadline_date : "27 Feb 26 19:00",
secondary_parent_item_id : "5231"
},
{
id : 3,
weight : 79000000,
secondary_parent_item_name : "Multiple Assignee",
status : "To do",
item_name : "Plan 1j",
color : "#777777",
description : "test3",
name : "6250",
deadline_date : "27 Feb 26 06:35",
secondary_parent_item_id : "5231"
}
];
var kanbanResources = [
{ id : 1, name : "Xain", image : null, iconCls : "" },
{ id : 2, name : "Alpha", image : null, iconCls : "" },
{ id : 3, name : "Beta", image : null, iconCls : "" },
{ id : 4, name : "Charlie", image : null, iconCls : "" },
{ id : 5, name : "Delta", image : null, iconCls : "" },
{ id : 6, name : "Ellie", image : null, iconCls : "" }
];
var kanbanResourceAssignment = [
{ id : 1, event : 1, resource : 5 },
{ id : 2, event : 1, resource : 2 },
{ id : 3, event : 1, resource : 4 },
{ id : 4, event : 1, resource : 3 },
{ id : 5, event : 1, resource : 6 },
{ id : 6, event : 2, resource : 3 },
{ id : 7, event : 2, resource : 2 },
{ id : 8, event : 3, resource : 2 },
{ id : 9, event : 3, resource : 1 }
];
const taskBoard = new TaskBoard({
appendTo : 'container',
cls : 'demo-app',
features : {
columnDrag : true
},
resourceImagePath : '../_shared/images/transparent-users/',
columns : [
{ id : 'To do', text : 'To do', color : 'indigo' },
{ id : 'Planned', text : 'Planned', color : 'teal' },
{ id : 'In progress', text : 'In progress', color : 'blue' },
{ id : 'At risk', text : 'At risk', color : 'orange' }
],
columnField : 'status',
footerItems : {
resourceAvatars : { overlap : true }
},
// 👇 YOUR DATA HERE
project : {
tasks : kanban,
resources : kanbanResources,
assignments : kanbanResourceAssignment
}
});
