diff --git a/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.spec.ts b/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.spec.ts index 0e834fc45a..46de50c14a 100644 --- a/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.spec.ts +++ b/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.spec.ts @@ -674,6 +674,57 @@ describe('PoDynamicFormFieldsComponent: ', () => { expect(component.setContainerFields).toHaveBeenCalled(); }); + it('hasChangeContainer: should call `setContainerFields` if there is a change in hidden fields', () => { + const fieldPrevious: Array = [ + { property: 'campo 1', visible: false }, + { property: 'campo 2' } + ]; + const fieldCurrent: Array = [{ property: 'campo 1', visible: true }, { property: 'campo 2' }]; + + component.visibleFields = fieldCurrent; + + spyOn(component, 'setContainerFields'); + + component['hasChangeContainer'](fieldPrevious, fieldCurrent); + + expect(component['setContainerFields']).toHaveBeenCalled(); + }); + + it('hasChangeContainer: if there is a change in the visible fields', () => { + const fieldPrevious: Array = [{ property: 'campo 1' }, { property: 'campo 2' }]; + const fieldCurrent: Array = [ + { property: 'campo 1' }, + { property: 'campo 2' }, + { property: 'campo 3', visible: false } + ]; + + component.visibleFields = fieldCurrent.filter(x => x.visible === false); + + spyOn(component, 'setContainerFields'); + + component['hasChangeContainer'](fieldPrevious, fieldCurrent); + + expect(component['setContainerFields']).toHaveBeenCalled(); + }); + + it('hasChangeContainer: should call "handleChange Container" if there is a change of fields to visible', () => { + const fieldPrevious: Array = [ + { property: 'campo 1', visible: true }, + { property: 'campo 2', visible: false } + ]; + const fieldCurrent: Array = [ + { property: 'campo 1', visible: false }, + { property: 'campo 2', visible: true } + ]; + + spyOn(component, 'getVisibleFields').and.returnValue(fieldCurrent.filter(x => x.visible === true)); + spyOn(component, 'handleChangesContainer'); + + component['hasChangeContainer'](fieldPrevious, fieldCurrent); + + expect(component['handleChangesContainer']).toHaveBeenCalled(); + }); + it('handleChangesContainer: should not call `setContainerFields` if order had its value changed', () => { const previous: Array = [{ property: 'property1', order: 1 }, { property: 'property2' }]; diff --git a/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.ts b/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.ts index 65d96e8f3b..1a638ee295 100644 --- a/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.ts +++ b/projects/ui/src/lib/components/po-dynamic/po-dynamic-form/po-dynamic-form-fields/po-dynamic-form-fields.component.ts @@ -165,14 +165,16 @@ export class PoDynamicFormFieldsComponent extends PoDynamicFormFieldsBaseCompone container: item.container || null, property: item.property, index, - order: item.order + order: item.order, + visible: item.visible ?? true })); const currArray = current.map((item, index) => ({ container: item.container || null, property: item.property, index, - order: item.order + order: item.order, + visible: item.visible ?? true })); const prevContainers = prevArray.filter(item => item.container); @@ -181,6 +183,12 @@ export class PoDynamicFormFieldsComponent extends PoDynamicFormFieldsBaseCompone const prevOrder = prevArray.filter(item => item.order); const currOrder = currArray.filter(item => item.order); + const prevVisibleTrue = prevArray.filter(item => item.visible === true); + const currVisibleTrue = currArray.filter(item => item.visible === true); + + const prevVisibleFalse = prevArray.filter(item => !item.visible); + const currVisibleFalse = currArray.filter(item => !item.visible); + // Verifica mudança na quantidade de containers if (prevContainers.length !== currContainers.length) { this.setContainerFields(); @@ -193,6 +201,18 @@ export class PoDynamicFormFieldsComponent extends PoDynamicFormFieldsBaseCompone return; } + // Verifica mudança na quantidade de visible + if (prevVisibleTrue.length !== currVisibleTrue.length) { + this.setContainerFields(); + return; + } + + // Verifica mudança na quantidade de visible + if (prevVisibleFalse.length !== currVisibleFalse.length) { + this.setContainerFields(); + return; + } + if (currContainers.length) { this.handleChangesContainer(prevContainers, currContainers, 'container'); } @@ -201,6 +221,14 @@ export class PoDynamicFormFieldsComponent extends PoDynamicFormFieldsBaseCompone this.handleChangesContainer(prevOrder, currOrder, 'order'); } + if (currVisibleTrue.length) { + this.handleChangesContainer(prevVisibleTrue, currVisibleTrue, 'visible'); + } + + if (currVisibleFalse.length) { + this.handleChangesContainer(prevVisibleFalse, currVisibleFalse, 'visible'); + } + //atualiza container sem mudança na estrutura da interface const result = this.diffObjectsArray(previous, this.getVisibleFields()); this.containerFields = this.updateFieldContainer(result, this.containerFields);