[INFO REQ] Issue in bodyItems of the Taskboard component

[licjapodaca]

Hi there, I have an issue in the bodyItems specification like so and never triggers its execution:

Screen Shot 2021-06-25 at 4.43.53 p.m..png (223.98 KiB) Viewed 821 times

The field called "subtareas" it is not rendering correctly in the card like so:

Screen Shot 2021-06-25 at 4.41.52 p.m..png (98.88 KiB) Viewed 821 times

Here it is the data that comes from our Backend:

{
	"success": true,
	"tasks": {
		"rows": [
			{
				"id": 67847,
				"name": "Tarea RH - Padre",
				"percentDone": 30,
				"startDate": "2021-06-15",
				"endDate": "2021-06-18",
				"duration": 4.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"resourceId": -616,
				"resourceName": "Ádriana Ochoa Gastelum",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/e7ba4e09-bd77-4de7-8f00-74752295100f.jpeg?sv=2018-03-28&sr=c&sig=14pXuXyNJOHqrbBiov7V%2FlSafZl2JJf3ugwgMmWyY7c%3D&st=2021-06-25T23%3A35%3A42Z&se=2021-06-26T23%3A40%3A42Z&sp=rwdl",
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal"
			},
			{
				"id": 68521,
				"name": "Convocatorias",
				"percentDone": 25,
				"startDate": "2021-06-25",
				"endDate": "2021-06-25",
				"duration": 2.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"resourceId": -248,
				"resourceName": "Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Romero García",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/4b73b843-324a-4aac-90a4-39331c05e0f2.jpeg?sv=2018-03-28&sr=c&sig=14pXuXyNJOHqrbBiov7V%2FlSafZl2JJf3ugwgMmWyY7c%3D&st=2021-06-25T23%3A35%3A42Z&se=2021-06-26T23%3A40%3A42Z&sp=rwdl",
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal"
			},
			{
				"id": 68522,
				"name": "Cursos",
				"percentDone": 90,
				"startDate": "2021-06-25",
				"endDate": "2021-07-21",
				"duration": 19.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"resourceId": -616,
				"resourceName": "Ádriana Ochoa Gastelum",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/e7ba4e09-bd77-4de7-8f00-74752295100f.jpeg?sv=2018-03-28&sr=c&sig=14pXuXyNJOHqrbBiov7V%2FlSafZl2JJf3ugwgMmWyY7c%3D&st=2021-06-25T23%3A35%3A42Z&se=2021-06-26T23%3A40%3A42Z&sp=rwdl",
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal",
				"subtareas": 2 // <===== This is the data that I want to render in the card
			},
			{
				"id": 68523,
				"parentId": 68522,
				"name": "Grupales",
				"percentDone": 0,
				"startDate": "2021-06-25",
				"endDate": "2021-07-07",
				"duration": 10.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"resourceId": -616,
				"resourceName": "&#193;driana Ochoa Gastelum",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/e7ba4e09-bd77-4de7-8f00-74752295100f.jpeg?sv=2018-03-28&amp;sr=c&amp;sig=14pXuXyNJOHqrbBiov7V%2FlSafZl2JJf3ugwgMmWyY7c%3D&amp;st=2021-06-25T23%3A35%3A42Z&amp;se=2021-06-26T23%3A40%3A42Z&amp;sp=rwdl",
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal"
			},
			{
				"id": 68524,
				"parentId": 68522,
				"name": "Individuales",
				"percentDone": 0,
				"startDate": "2021-06-25",
				"endDate": "2021-07-21",
				"duration": 20.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"resourceId": -746,
				"resourceName": "ESTEBAN Mejia Garc&#237;a",
				"resourceInitials": "EM",
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal"
			}
		]
	},
	"resources": {
		"rows": [
			{
				"id": -616,
				"name": "&#193;driana Ochoa Gastelum"
			},
			{
				"id": -248,
				"name": "Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Romero Garc&#237;a"
			},
			{
				"id": -746,
				"name": "ESTEBAN Mejia Garc&#237;a"
			}
		]
	},
	"assignments": {
		"rows": [
			{
				"id": 1,
				"event": 67847,
				"resource": -616
			},
			{
				"id": 2,
				"event": 68521,
				"resource": -248
			},
			{
				"id": 3,
				"event": 68522,
				"resource": -616
			},
			{
				"id": 4,
				"event": 68523,
				"resource": -616
			},
			{
				"id": 5,
				"event": 68524,
				"resource": -746
			}
		]
	}
}

Regards

[licjapodaca]

I made a change in our Backend that was not excluding the properties that comes in null and now our Backend data arrives like so:

{
	"success": true,
	"tasks": {
		"rows": [
			{
				"id": 67847,
				"parentId": null,
				"name": "Tarea RH - Padre",
				"description": null,
				"percentDone": 30,
				"startDate": "2021-06-15",
				"endDate": "2021-06-18",
				"duration": 4.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"rowTask": null,
				"resourceId": -616,
				"resourceName": "Ádriana Ochoa Gastelum",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/e7ba4e09-bd77-4de7-8f00-74752295100f.jpeg?sv=2018-03-28&sr=c&sig=xuQPKHTH%2FC2%2FyjoL1%2B7oQhMtMyvOU5llsdmJ79ovu2c%3D&st=2021-06-25T23%3A55%3A10Z&se=2021-06-27T00%3A00%3A10Z&sp=rwdl",
				"resourceInitials": null,
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal",
				"subtareas": null
			},
			{
				"id": 68521,
				"parentId": null,
				"name": "Convocatorias",
				"description": null,
				"percentDone": 25,
				"startDate": "2021-06-25",
				"endDate": "2021-06-25",
				"duration": 2.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"rowTask": null,
				"resourceId": -248,
				"resourceName": "Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Romero García",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/4b73b843-324a-4aac-90a4-39331c05e0f2.jpeg?sv=2018-03-28&sr=c&sig=xuQPKHTH%2FC2%2FyjoL1%2B7oQhMtMyvOU5llsdmJ79ovu2c%3D&st=2021-06-25T23%3A55%3A10Z&se=2021-06-27T00%3A00%3A10Z&sp=rwdl",
				"resourceInitials": null,
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal",
				"subtareas": null
			},
			{
				"id": 68522,
				"parentId": null,
				"name": "Cursos",
				"description": null,
				"percentDone": 90,
				"startDate": "2021-06-25",
				"endDate": "2021-07-21",
				"duration": 19.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"rowTask": null,
				"resourceId": -616,
				"resourceName": "Ádriana Ochoa Gastelum",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/e7ba4e09-bd77-4de7-8f00-74752295100f.jpeg?sv=2018-03-28&sr=c&sig=xuQPKHTH%2FC2%2FyjoL1%2B7oQhMtMyvOU5llsdmJ79ovu2c%3D&st=2021-06-25T23%3A55%3A10Z&se=2021-06-27T00%3A00%3A10Z&sp=rwdl",
				"resourceInitials": null,
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal",
				"subtareas": 2
			},
			{
				"id": 68523,
				"parentId": 68522,
				"name": "Grupales",
				"description": null,
				"percentDone": 0,
				"startDate": "2021-06-25",
				"endDate": "2021-07-07",
				"duration": 10.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"rowTask": null,
				"resourceId": -616,
				"resourceName": "Ádriana Ochoa Gastelum",
				"resourcePhoto": "https://tprede.blob.core.windows.net/200265/tenant/200265/empleados/fotos/e7ba4e09-bd77-4de7-8f00-74752295100f.jpeg?sv=2018-03-28&sr=c&sig=xuQPKHTH%2FC2%2FyjoL1%2B7oQhMtMyvOU5llsdmJ79ovu2c%3D&st=2021-06-25T23%3A55%3A10Z&se=2021-06-27T00%3A00%3A10Z&sp=rwdl",
				"resourceInitials": null,
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal",
				"subtareas": null
			},
			{
				"id": 68524,
				"parentId": 68522,
				"name": "Individuales",
				"description": null,
				"percentDone": 0,
				"startDate": "2021-06-25",
				"endDate": "2021-07-21",
				"duration": 20.00,
				"durationUnit": "day",
				"activo": "S",
				"columnTask": 1,
				"rowTask": null,
				"resourceId": -746,
				"resourceName": "ESTEBAN Mejia García",
				"resourcePhoto": null,
				"resourceInitials": "EM",
				"diasHolguraWarningSemaforo": 3,
				"prioridad": "normal",
				"subtareas": null
			}
		]
	},
	"resources": {
		"rows": [
			{
				"id": -616,
				"name": "Ádriana Ochoa Gastelum"
			},
			{
				"id": -248,
				"name": "Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Julieta Romero García"
			},
			{
				"id": -746,
				"name": "ESTEBAN Mejia García"
			}
		]
	},
	"assignments": {
		"rows": [
			{
				"id": 1,
				"event": 67847,
				"resource": -616
			},
			{
				"id": 2,
				"event": 68521,
				"resource": -248
			},
			{
				"id": 3,
				"event": 68522,
				"resource": -616
			},
			{
				"id": 4,
				"event": 68523,
				"resource": -616
			},
			{
				"id": 5,
				"event": 68524,
				"resource": -746
			}
		]
	}
}

And after that, the card renders correctly like so:

Screen Shot 2021-06-25 at 5.05.37 p.m..png (100.33 KiB) Viewed 818 times

But why? is there a Taskboard configuration for that?

Regards

[mats]

Probably you have not defined your fields in your model - try defining all your fields in a model class you use for your application:

class MyTask extends TaskModel {
    static get fields() {
        return [
            'subtareas',
            // Or as object form
            { name : 'prioridad', defaultValue : 1 }
        ];
    }
}

Then provide this model to the Project when configuring it: https://bryntum.com/docs/taskboard/#Scheduler/model/mixin/ProjectModelMixin#config-eventModelClass

[licjapodaca]

Thanks a lot @mats, after have defined MyTaskModel like so:

class MyTaskModel extends bryntum.taskboard.TaskModel {
	static get fields() {
		return [
			{ name: 'percentDone', type: 'number', defaultValue: 0 },
			{ name: 'activo', type: 'string' },
			{ name: 'columnTask', type: 'number' },
			{ name: 'rowTask', type: 'number' },
			{ name: 'resourceName', type: 'string' },
			{ name: 'resourcePhoto', type: 'string' },
			{ name: 'resourceInitials', type: 'string' },
			{ name: 'diasHolguraWarningSemaforo', type: 'number' },
			{ name: 'prioridad', type: 'string' },
			{ name: 'subtareas', type: 'number' }
		];
	}
}

and assign to the property "taskModelClass" of the TaskBoard project like so:

					me.getView()._taskboard = new bryntum.taskboard.TaskBoard({
						project: {
							taskModelClass: MyTaskModel, // <===== New Task Model Class
							autoLoad: false,
							transport: {
								load: {
									url: urlTareas,
									method: 'GET',
									headers: Ext.Ajax.getDefaultHeaders(),
									credentials: 'same-origin'
								}
							},
							...
							}
							...
							});

and modify our Backend to exclude the properties of null values in JSON again, everything is OK again like so:

Screen Shot 2021-06-27 at 4.39.19 p.m..png (77.51 KiB) Viewed 804 times

Regards