diff --git a/packages/ketchup-showcase/src/mock/dataTable.ts b/packages/ketchup-showcase/src/mock/dataTable.ts index 9fc93d6d15..2fef39d38c 100644 --- a/packages/ketchup-showcase/src/mock/dataTable.ts +++ b/packages/ketchup-showcase/src/mock/dataTable.ts @@ -1489,6 +1489,135 @@ export const dataTableWithNoCommandsMatching = { ], }; +export const dataTableWithEmptyObjCommands = { + columns: [ + { + decimals: 0, + isEditable: false, + isKey: false, + name: 'X$RIGA', + obj: { + k: '', + p: '', + t: 'NR', + }, + title: 'ROW', + tooltip: false, + }, + { + isEditable: false, + isKey: false, + name: 'X$ARTI', + title: 'ITEM', + tooltip: false, + }, + { + decimals: 0, + isEditable: false, + isKey: false, + name: 'X$QTA', + obj: { + k: '', + p: '', + t: 'NR', + }, + title: 'QTY\nCART', + tooltip: false, + }, + { + isEditable: false, + isKey: false, + name: 'X$CFG', + obj: { + k: '', + p: 'COD_VER', + t: 'VO', + }, + size: '70px', + title: 'CFG', + tooltip: false, + }, + ], + rows: [ + { + cells: { + X$RIGA: { + data: { + size: 4, + helperEnabled: false, + maxLength: 4, + integers: 4, + }, + isEditable: false, + obj: { + k: '2', + p: '', + t: 'NR', + }, + value: '1', + displayedValue: '1', + element: { + 's-hn': 'KUP-DATA-TABLE', + }, + }, + X$CFG: { + isEditable: false, + obj: { + k: '', + p: '', + t: '', + }, + value: '', + element: { + 's-hn': 'KUP-DATA-TABLE', + }, + }, + X$ARTI: { + data: { + size: 80, + helperEnabled: false, + hiddenCounter: true, + maxLength: 80, + }, + isEditable: false, + obj: { + k: 'MAP000014 PRESSED TUBE PTFE G200 25x25x200', + p: '', + t: '', + }, + value: 'COMMAND WITH TEXT AND ICON AND BLANK T P K', + element: { + 's-hn': 'KUP-DATA-TABLE', + }, + }, + X$QTA: { + data: { + size: 15, + helperEnabled: false, + maxLength: 15, + integers: 15, + }, + isEditable: false, + obj: { + k: '5', + p: '', + t: 'NR', + }, + value: '5', + displayedValue: '5', + element: { + 's-hn': 'KUP-DATA-TABLE', + }, + }, + }, + cssClass: 'clickable', + id: '1', + object: '', + readOnly: true, + }, + ], +}; + export const hiddenColumnsData = { columns: [ { diff --git a/packages/ketchup-showcase/src/views/components/advanced/datatable/Datatable.vue b/packages/ketchup-showcase/src/views/components/advanced/datatable/Datatable.vue index c69356802c..1500926852 100644 --- a/packages/ketchup-showcase/src/views/components/advanced/datatable/Datatable.vue +++ b/packages/ketchup-showcase/src/views/components/advanced/datatable/Datatable.vue @@ -52,51 +52,54 @@ + @@ -131,6 +134,7 @@ import DatatableRowActions from '@/views/components/advanced/datatable/examples/ import DatatableRowActionsWithCommands from '@/views/components/advanced/datatable/examples/DatatableRowActionsWithCommands'; import DatatableCodverMatching from '@/views/components/advanced/datatable/examples/DatatableCodverMatching'; import DatatableCodverNotMatching from '@/views/components/advanced/datatable/examples/DatatableCodverNotMatching'; +import DatatableCommandsWithEmptyObj from '@/views/components/advanced/datatable/examples/DatatableCommandsWithEmptyObj'; import DatatableRowSelection from '@/views/components/advanced/datatable/examples/DatatableRowSelection'; import DatatableWithoutRowSelection from '@/views/components/advanced/datatable/examples/DatatableWithoutRowSelection'; import DatatableRowsRepetition from '@/views/components/advanced/datatable/examples/DatatableRowsRepetition'; @@ -166,6 +170,7 @@ export default { DatatableRowActionsWithCommands, DatatableCodverMatching, DatatableCodverNotMatching, + DatatableCommandsWithEmptyObj, DatatableRowSelection, DatatableWithoutRowSelection, DatatableRowsRepetition, @@ -206,6 +211,7 @@ export default { 'Row actions with commands', 'Codver with commands matching', 'Codver with no commands matching', + 'Actions from commands with blank tpk obj', 'With row selection', 'Without row selection', 'With row repetition', diff --git a/packages/ketchup-showcase/src/views/components/advanced/datatable/examples/DatatableCommandsWithEmptyObj.vue b/packages/ketchup-showcase/src/views/components/advanced/datatable/examples/DatatableCommandsWithEmptyObj.vue new file mode 100644 index 0000000000..bd2013035b --- /dev/null +++ b/packages/ketchup-showcase/src/views/components/advanced/datatable/examples/DatatableCommandsWithEmptyObj.vue @@ -0,0 +1,71 @@ + + + + + diff --git a/packages/ketchup/src/components/kup-data-table/kup-data-table-declarations.ts b/packages/ketchup/src/components/kup-data-table/kup-data-table-declarations.ts index 668194e4a3..38fe81a29c 100644 --- a/packages/ketchup/src/components/kup-data-table/kup-data-table-declarations.ts +++ b/packages/ketchup/src/components/kup-data-table/kup-data-table-declarations.ts @@ -301,7 +301,8 @@ export interface KupDatatableRowActionItemClickEventPayload type: | DropDownAction.CODVER | DropDownAction.ROWACTION - | DropDownAction.CODVERWITHCOMMANDS; + | DropDownAction.CODVERWITHCOMMANDS + | DropDownAction.COMMANDWITHEMPTYOBJ; obj?: KupObj; column?: KupDataColumn; cell?: KupDataCell; diff --git a/packages/ketchup/src/components/kup-data-table/kup-data-table.tsx b/packages/ketchup/src/components/kup-data-table/kup-data-table.tsx index 1628991e45..d8c5096afa 100644 --- a/packages/ketchup/src/components/kup-data-table/kup-data-table.tsx +++ b/packages/ketchup/src/components/kup-data-table/kup-data-table.tsx @@ -4953,7 +4953,7 @@ export class KupDataTable { row, this.data.columns, this.rowActions, - this.commands + this.commands ?? [] ); if ( @@ -4966,7 +4966,7 @@ export class KupDataTable { const imageProp: FImageProps = this.#kupManager.data.action.buildImageProp( action.icon, - action.text || action.column.title, + action.text || action.column?.title || '', 'action', () => { this.kupRowActionItemClick.emit({ diff --git a/packages/ketchup/src/managers/kup-data/kup-data-declarations.ts b/packages/ketchup/src/managers/kup-data/kup-data-declarations.ts index 91125c8106..3b4cc8e8b8 100644 --- a/packages/ketchup/src/managers/kup-data/kup-data-declarations.ts +++ b/packages/ketchup/src/managers/kup-data/kup-data-declarations.ts @@ -64,7 +64,8 @@ export interface KupDataRowAction { type: | DropDownAction.CODVER | DropDownAction.ROWACTION - | DropDownAction.CODVERWITHCOMMANDS; + | DropDownAction.CODVERWITHCOMMANDS + | DropDownAction.COMMANDWITHEMPTYOBJ; index?: number; obj?: KupObj; cell?: KupDataCell; @@ -230,4 +231,5 @@ export enum DropDownAction { ROWACTION = 'row-action', CODVER = 'cod_ver', CODVERWITHCOMMANDS = 'cod_ver-with-commands', + COMMANDWITHEMPTYOBJ = 'command-with-empty-obj', } diff --git a/packages/ketchup/src/managers/kup-data/kup-data.ts b/packages/ketchup/src/managers/kup-data/kup-data.ts index bf3e34a1e9..f46a313a49 100644 --- a/packages/ketchup/src/managers/kup-data/kup-data.ts +++ b/packages/ketchup/src/managers/kup-data/kup-data.ts @@ -317,13 +317,20 @@ export class KupData { const codVerActions = this.action.createActionsFromVoCodRow( row, columns, - commands ?? [] + commands ); + const commandsWithEmptyObj = + this.action.createCommandsWithEmptyObj(commands); + const rowActionsWithCodVer = actions && actions.length - ? [...this.row.rowActionsAdapter(actions), ...codVerActions] - : [...codVerActions]; + ? [ + ...this.row.rowActionsAdapter(actions), + ...codVerActions, + ...commandsWithEmptyObj, + ] + : [...codVerActions, ...commandsWithEmptyObj]; return rowActionsWithCodVer; }, @@ -442,6 +449,24 @@ export class KupData { return actions; }, + createCommandsWithEmptyObj: ( + commands: KupCommand[] + ): KupDataRowAction[] => { + return commands.length + ? commands + .filter((c) => !c.obj.k && !c.obj.t && !c.obj.p) + .map( + (c, index) => + ({ + text: c.text || '', + icon: c.icon || '', + obj: c.obj, + index: index, + type: DropDownAction.COMMANDWITHEMPTYOBJ, + } as KupDataRowAction) + ) + : []; + }, }; /** * Utility used by findRow and findCell. diff --git a/packages/ketchup/tests/resources/mock/kup-data-dataset-commands-with-empty-obj.json b/packages/ketchup/tests/resources/mock/kup-data-dataset-commands-with-empty-obj.json new file mode 100644 index 0000000000..33537b57e3 --- /dev/null +++ b/packages/ketchup/tests/resources/mock/kup-data-dataset-commands-with-empty-obj.json @@ -0,0 +1,369 @@ +{ + "data": { + "columns": [ + { + "decimals": 0, + "isEditable": false, + "isKey": false, + "name": "X$RIGA", + "obj": { + "k": "", + "p": "", + "t": "NR" + }, + "title": "ROW", + "tooltip": false + }, + { + "isEditable": false, + "isKey": false, + "name": "X$ARTI", + "title": "ITEM", + "tooltip": false + }, + { + "decimals": 0, + "isEditable": false, + "isKey": false, + "name": "X$QTA", + "obj": { + "k": "", + "p": "", + "t": "NR" + }, + "title": "QTY\nCART", + "tooltip": false + }, + { + "isEditable": false, + "isKey": false, + "name": "X$CFG", + "obj": { + "k": "", + "p": "COD_VER", + "t": "VO" + }, + "size": "70px", + "title": "CFG", + "tooltip": false + } + ], + "rows": [ + { + "cells": { + "X$RIGA": { + "data": { + "size": 4, + "helperEnabled": false, + "maxLength": 4, + "integers": 4 + }, + "isEditable": false, + "obj": { + "k": "1", + "p": "", + "t": "NR" + }, + "value": "1", + "displayedValue": "1", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$CFG": { + "isEditable": false, + "obj": { + "k": "000050", + "p": "COD_VER", + "t": "VO" + }, + "value": "", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$ARTI": { + "data": { + "size": 80, + "helperEnabled": false, + "hiddenCounter": true, + "maxLength": 80 + }, + "isEditable": false, + "obj": { + "k": "MAP000061 PRESSED TUBE PTFE G400 50x25x300", + "p": "", + "t": "" + }, + "value": "MAP000061 PRESSED TUBE PTFE G400 50x25x300", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$QTA": { + "data": { + "size": 15, + "helperEnabled": false, + "maxLength": 15, + "integers": 15 + }, + "isEditable": false, + "obj": { + "k": "2", + "p": "", + "t": "NR" + }, + "value": "2", + "displayedValue": "2", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + } + }, + "cssClass": "clickable", + "id": "0", + "object": "", + "readOnly": true + }, + { + "cells": { + "X$RIGA": { + "data": { + "size": 4, + "helperEnabled": false, + "maxLength": 4, + "integers": 4 + }, + "isEditable": false, + "obj": { + "k": "2", + "p": "", + "t": "NR" + }, + "value": "2", + "displayedValue": "2", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$CFG": { + "isEditable": false, + "obj": { + "k": "", + "p": "", + "t": "" + }, + "value": "", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$ARTI": { + "data": { + "size": 80, + "helperEnabled": false, + "hiddenCounter": true, + "maxLength": 80 + }, + "isEditable": false, + "obj": { + "k": "MAP000014 PRESSED TUBE PTFE G200 25x25x200", + "p": "", + "t": "" + }, + "value": "MAP000014 PRESSED TUBE PTFE G200 25x25x200", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$QTA": { + "data": { + "size": 15, + "helperEnabled": false, + "maxLength": 15, + "integers": 15 + }, + "isEditable": false, + "obj": { + "k": "5", + "p": "", + "t": "NR" + }, + "value": "5", + "displayedValue": "5", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + } + }, + "cssClass": "clickable", + "id": "1", + "object": "", + "readOnly": true + }, + { + "cells": { + "X$RIGA": { + "data": { + "size": 4, + "helperEnabled": false, + "maxLength": 4, + "integers": 4 + }, + "isEditable": false, + "obj": { + "k": "3", + "p": "", + "t": "NR" + }, + "value": "3", + "displayedValue": "3", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$CFG": { + "isEditable": false, + "obj": { + "k": "", + "p": "", + "t": "" + }, + "value": "Test", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$ARTI": { + "data": { + "size": 80, + "helperEnabled": false, + "hiddenCounter": true, + "maxLength": 80 + }, + "isEditable": false, + "obj": { + "k": "MEP000001 METALLIC PLIER", + "p": "", + "t": "" + }, + "value": "MEP000001 METALLIC PLIER", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$QTA": { + "data": { + "size": 15, + "helperEnabled": false, + "maxLength": 15, + "integers": 15 + }, + "isEditable": false, + "obj": { + "k": "1", + "p": "", + "t": "NR" + }, + "value": "1", + "displayedValue": "1", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + } + }, + "cssClass": "clickable", + "id": "2", + "object": "", + "readOnly": true + }, + { + "cells": { + "X$RIGA": { + "data": { + "size": 4, + "helperEnabled": false, + "maxLength": 4, + "integers": 4 + }, + "isEditable": false, + "obj": { + "k": "3", + "p": "", + "t": "NR" + }, + "value": "3", + "displayedValue": "3", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$CFG": { + "isEditable": false, + "obj": { + "k": "", + "p": "", + "t": "" + }, + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$ARTI": { + "data": { + "size": 80, + "helperEnabled": false, + "hiddenCounter": true, + "maxLength": 80 + }, + "isEditable": false, + "obj": { + "k": "MEP000001 METALLIC PLIER", + "p": "", + "t": "" + }, + "value": "MEP000001 METALLIC PLIER", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + }, + "X$QTA": { + "data": { + "size": 15, + "helperEnabled": false, + "maxLength": 15, + "integers": 15 + }, + "isEditable": false, + "obj": { + "k": "1", + "p": "", + "t": "NR" + }, + "value": "1", + "displayedValue": "1", + "element": { + "s-hn": "KUP-DATA-TABLE" + } + } + }, + "cssClass": "clickable", + "id": "2", + "object": "", + "readOnly": true + } + ] + }, + "rowActions": [], + "commands": [ + { + "icon": "magnify", + "obj": { + "k": "", + "p": "", + "t": "" + }, + "text": "Dettaglio" + } + ] +} diff --git a/packages/ketchup/tests/unit/components/kup-data-table/kup-data-table-row-actions.spec.ts b/packages/ketchup/tests/unit/components/kup-data-table/kup-data-table-row-actions.spec.ts index 2f2eb7485c..2c2dd6a312 100644 --- a/packages/ketchup/tests/unit/components/kup-data-table/kup-data-table-row-actions.spec.ts +++ b/packages/ketchup/tests/unit/components/kup-data-table/kup-data-table-row-actions.spec.ts @@ -13,10 +13,12 @@ if (!dom.ketchup) { import sampleKupDataDatasetNoCodVer from '../../../resources/mock/kup-data-dataset-with-places-and-nrs.json'; import sampleKupDataDataset from '../../../resources/mock/kup-data-dataset-with-commands.json'; +import sampleKupDataCommandsWithEmptyObj from '../../../resources/mock/kup-data-dataset-commands-with-empty-obj.json'; import { DropDownAction, KupDataCell, KupDataColumn, + KupDataRow, } from '../../../../src/managers/kup-data/kup-data-declarations'; import { KupDataTableCell } from '../../../../src/components/kup-data-table/kup-data-table-declarations'; @@ -303,3 +305,27 @@ describe('kup data getCodVerRows', () => { expect(result).toEqual([]); }); }); + +describe('kup data createCommandsEmptyObj', () => { + it('should handle empty obj commands actions', () => { + let result: KupDataRowAction[] = []; + const commands = + sampleKupDataCommandsWithEmptyObj.commands as unknown as KupCommand[]; + const expectedResult: KupDataRowAction[] = [ + { + icon: 'magnify', + text: 'Dettaglio', + obj: { k: '', p: '', t: '' }, + type: DropDownAction.COMMANDWITHEMPTYOBJ, + index: 0, + }, + ]; + + const kupDataRowAction = + dom.ketchup.data.action.createCommandsWithEmptyObj(commands); + + result.push(...kupDataRowAction); + + expect(result).toEqual(expectedResult); + }); +});