Skip to content

Commit cd019ef

Browse files
Klegeralinelariguet
Kleger
authored and
alinelariguet
committed
feat(page-dynamic-table): permite definir a não remoção dos disclaimers
O template po-page-dynamic-table não permite ocultar a opção de remover todos os disclaimers, bem como não permite ocultar a opção de fechar um determinado disclaimer, como é feito no po-disclaimer-group. Adiciona as propriedades hide-remove-all-disclaimer e hide-close-disclaimers nos componentes po-page-dynamic-table e po-page-dynamic-search para permitir que as opções de remoção dos disclaimers sejam ocultadas. Fixes #1306
1 parent 6fad1a1 commit cd019ef

14 files changed

+554
-29
lines changed

‎projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search-base.component.spec.ts

+24
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,30 @@ describe('PoPageDynamicSearchBaseComponent:', () => {
4747
expectPropertiesValues(component, 'filters', validValues, validValues);
4848
});
4949

50+
it('hideRemoveAllDisclaimer: should set property `p-hide-remove-all-disclaimer` to `false` if invalid value', () => {
51+
const booleanInvalidValues = [undefined, null, NaN, 2, 'string'];
52+
53+
expectPropertiesValues(component, 'hideRemoveAllDisclaimer', booleanInvalidValues, false);
54+
});
55+
56+
it('hideRemoveAllDisclaimer: should update property `p-hide-remove-all-disclaimer` to `true` with valid values', () => {
57+
const booleanValidTrueValues = [true, 'true', 1, ''];
58+
59+
expectPropertiesValues(component, 'hideRemoveAllDisclaimer', booleanValidTrueValues, true);
60+
});
61+
62+
it('hideCloseDisclaimers: should set property `p-hide-close-disclaimers` to `[]` if not Array value', () => {
63+
const invalidValues = [undefined, null, '', true, false, 0, 1, 'string', {}];
64+
65+
expectPropertiesValues(component, 'hideCloseDisclaimers', invalidValues, []);
66+
});
67+
68+
it('hideCloseDisclaimers: should update property `p-hide-close-disclaimers` with valid values', () => {
69+
const validValues = [['Teste 1'], ['Teste 2', 'Teste 3']];
70+
71+
expectPropertiesValues(component, 'hideCloseDisclaimers', validValues, validValues);
72+
});
73+
5074
it('should return stringify value with filter without searchService', () => {
5175
const columns: Array<any> = [{ property: 'test' }, { searchService: 'service/test' }];
5276
const result = '[{"property":"test"},{}]';

‎projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search-base.component.ts

+37
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,21 @@ export abstract class PoPageDynamicSearchBaseComponent {
100100
@Input('p-concat-filters')
101101
concatFilters: boolean = false;
102102

103+
/**
104+
* @optional
105+
*
106+
* @description
107+
*
108+
* Oculta o botão para remover todos os *disclaimers* do grupo.
109+
*
110+
* > Por padrão, o mesmo é exibido à partir de dois ou mais *disclaimers* com a opção `hideClose` habilitada.
111+
*
112+
* @default `false`
113+
*/
114+
@InputBoolean()
115+
@Input('p-hide-remove-all-disclaimer')
116+
hideRemoveAllDisclaimer?: boolean = false;
117+
103118
/**
104119
* Função ou serviço que será executado na inicialização do componente.
105120
*
@@ -167,6 +182,7 @@ export abstract class PoPageDynamicSearchBaseComponent {
167182
advancedFilterLiterals: PoAdvancedFilterLiterals;
168183

169184
private _filters: Array<PoDynamicFormField> = [];
185+
private _hideCloseDisclaimers: Array<string> = [];
170186
private _literals: PoPageDynamicSearchLiterals;
171187
private _quickSearchWidth: number;
172188

@@ -267,6 +283,27 @@ export abstract class PoPageDynamicSearchBaseComponent {
267283
return this._quickSearchWidth;
268284
}
269285

286+
/**
287+
* @optional
288+
*
289+
* @description
290+
*
291+
* Lista de filtros que terão a opção de fechar ocultada
292+
* em seu respectivo disclaimer. Utilizar o atributo `property` do filtro.
293+
*
294+
* Exemplo de utilização:
295+
* ```
296+
* ['city','name'];
297+
* ```
298+
*/
299+
@Input('p-hide-close-disclaimers') set hideCloseDisclaimers(value: Array<string>) {
300+
this._hideCloseDisclaimers = Array.isArray(value) ? value : [];
301+
}
302+
303+
get hideCloseDisclaimers(): Array<string> {
304+
return this._hideCloseDisclaimers;
305+
}
306+
270307
constructor(languageService: PoLanguageService) {
271308
this.language = languageService.getShortLanguage();
272309
}

‎projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search-options.interface.ts

+16
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,22 @@ export interface PoPageDynamicSearchOptions {
5757
*/
5858
concatFilters?: boolean;
5959

60+
/**
61+
* Oculta o botão para remover todos os *disclaimers*.
62+
*/
63+
hideRemoveAllDisclaimer?: boolean;
64+
65+
/**
66+
* Lista de filtros que terão a opção de fechar ocultada
67+
* em seu respectivo disclaimer. Utilizar o atributo `property` do filtro.
68+
*
69+
* Exemplo de utilização:
70+
* ```
71+
* ['city','name'];
72+
* ```
73+
*/
74+
hideCloseDisclaimers?: Array<string>;
75+
6076
/**
6177
* Largura do campo de busca, utilizando o *Grid System*,
6278
* e limitado ao máximo de 6 colunas. O tamanho mínimo é controlado

‎projects/templates/src/lib/components/po-page-dynamic-search/po-page-dynamic-search.component.spec.ts

+112-20
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,18 @@ describe('PoPageDynamicSearchComponent:', () => {
5757
expect(component.filterSettings.width).toBe(filterWidth);
5858
});
5959

60+
it('get disclaimerGroup: should apply `hideRemoveAll` value to false by default', () => {
61+
const disclaimerGroup = component.disclaimerGroup;
62+
63+
expect(disclaimerGroup.hideRemoveAll).toBeFalse();
64+
});
65+
it('get disclaimerGroup: should apply `hideRemoveAll` value to true when property `hideRemoveAllDisclaimer` is true', () => {
66+
component.hideRemoveAllDisclaimer = true;
67+
const disclaimerGroup = component.disclaimerGroup;
68+
69+
expect(disclaimerGroup.hideRemoveAll).toBeTrue();
70+
});
71+
6072
describe('onAction:', () => {
6173
let fakethis;
6274

@@ -74,7 +86,8 @@ describe('PoPageDynamicSearchComponent:', () => {
7486
},
7587
literals: {
7688
quickSearchLabel: 'Pesquisa rápida:'
77-
}
89+
},
90+
hideCloseDisclaimers: []
7891
};
7992
});
8093

@@ -96,9 +109,35 @@ describe('PoPageDynamicSearchComponent:', () => {
96109
expect(fakethis.quickSearch.emit).not.toHaveBeenCalled();
97110
});
98111

99-
it('should set `_dislaimerGroup.disclaimers` with property, label and value', () => {
100-
const result = [{ property: 'search', label: 'Pesquisa rápida: quickFilter', value: 'quickFilter' }];
112+
it('should set `_dislaimerGroup.disclaimers` with property, label, value and hideClose', () => {
113+
const result = [
114+
{ property: 'search', label: 'Pesquisa rápida: quickFilter', value: 'quickFilter', hideClose: false }
115+
];
116+
117+
component.onAction.call(fakethis, 'quickFilter');
118+
119+
expect(fakethis._disclaimerGroup.disclaimers).toEqual(result);
120+
});
121+
122+
it(`should set '_dislaimerGroup.disclaimers' with 'hideClose: true' when property is
123+
included on the 'hideCloseDisclaimers'`, () => {
124+
const result = [
125+
{ property: 'search', label: 'Pesquisa rápida: quickFilter', value: 'quickFilter', hideClose: true }
126+
];
127+
128+
fakethis['hideCloseDisclaimers'] = ['search'];
129+
component.onAction.call(fakethis, 'quickFilter');
130+
131+
expect(fakethis._disclaimerGroup.disclaimers).toEqual(result);
132+
});
133+
134+
it(`should set '_dislaimerGroup.disclaimers' with 'hideClose: false' when property is not
135+
included on the 'hideCloseDisclaimers'`, () => {
136+
const result = [
137+
{ property: 'search', label: 'Pesquisa rápida: quickFilter', value: 'quickFilter', hideClose: false }
138+
];
101139

140+
fakethis['hideCloseDisclaimers'] = ['name'];
102141
component.onAction.call(fakethis, 'quickFilter');
103142

104143
expect(fakethis._disclaimerGroup.disclaimers).toEqual(result);
@@ -276,9 +315,9 @@ describe('PoPageDynamicSearchComponent:', () => {
276315
const filters = { name: 'Roger', birthdate: '2018-12-12T00:00:01-00:00', genre: 'male' };
277316

278317
const result = [
279-
{ label: 'Name: Roger', property: 'name', value: 'Roger' },
280-
{ label: 'Birthdate: 12/12/2018', property: 'birthdate', value: '2018-12-12T00:00:01-00:00' },
281-
{ label: 'Genre: male', property: 'genre', value: 'male' }
318+
{ label: 'Name: Roger', property: 'name', value: 'Roger', hideClose: false },
319+
{ label: 'Birthdate: 12/12/2018', property: 'birthdate', value: '2018-12-12T00:00:01-00:00', hideClose: false },
320+
{ label: 'Genre: male', property: 'genre', value: 'male', hideClose: false }
282321
];
283322

284323
spyOn(component, <any>'getFieldByProperty').and.callThrough();
@@ -299,8 +338,8 @@ describe('PoPageDynamicSearchComponent:', () => {
299338
const filters = { name: 'Name1', genre: 'male' };
300339

301340
const result = [
302-
{ label: 'Name: Name1', property: 'name', value: 'Name1' },
303-
{ label: 'Genre: male', property: 'genre', value: 'male' }
341+
{ label: 'Name: Name1', property: 'name', value: 'Name1', hideClose: false },
342+
{ label: 'Genre: male', property: 'genre', value: 'male', hideClose: false }
304343
];
305344

306345
spyOn(component, <any>'getFieldByProperty').and.callThrough();
@@ -318,8 +357,8 @@ describe('PoPageDynamicSearchComponent:', () => {
318357
const filters = { name: 'Name1', genre: 'male' };
319358

320359
const result = [
321-
{ label: 'Name: Name1', property: 'name', value: 'Name1' },
322-
{ label: 'Genre: male', property: 'genre', value: 'male' }
360+
{ label: 'Name: Name1', property: 'name', value: 'Name1', hideClose: false },
361+
{ label: 'Genre: male', property: 'genre', value: 'male', hideClose: false }
323362
];
324363

325364
expect(component['setDisclaimers'](filters)).toEqual(result);
@@ -334,7 +373,47 @@ describe('PoPageDynamicSearchComponent:', () => {
334373

335374
const filters = { name: 'Name1', genre: 'male' };
336375

337-
const result = [{ label: 'Name: Name1', property: 'name', value: 'Name1' }];
376+
const result = [{ label: 'Name: Name1', property: 'name', value: 'Name1', hideClose: false }];
377+
378+
expect(component['setDisclaimers'](filters)).toEqual(result);
379+
});
380+
381+
it(`setDisclaimers: should return disclaimers based on the 'filters' with the 'hideClose: true' to filters included on the 'hideCloseDisclaimers'`, () => {
382+
component.filters = [
383+
{ property: 'name', label: 'Name' },
384+
{ property: 'birthdate', label: 'Birthdate', type: 'date' },
385+
{ property: 'genre', label: 'Genre' }
386+
];
387+
388+
component.hideCloseDisclaimers = ['name', 'birthdate'];
389+
390+
const filters = { name: 'Roger', birthdate: '2018-12-12T00:00:01-00:00', genre: 'male' };
391+
392+
const result = [
393+
{ label: 'Name: Roger', property: 'name', value: 'Roger', hideClose: true },
394+
{ label: 'Birthdate: 12/12/2018', property: 'birthdate', value: '2018-12-12T00:00:01-00:00', hideClose: true },
395+
{ label: 'Genre: male', property: 'genre', value: 'male', hideClose: false }
396+
];
397+
398+
expect(component['setDisclaimers'](filters)).toEqual(result);
399+
});
400+
401+
it(`setDisclaimers: should return disclaimers based on the 'filters' with the 'hideClose: false' to filters not included on the 'hideCloseDisclaimers'`, () => {
402+
component.filters = [
403+
{ property: 'name', label: 'Name' },
404+
{ property: 'birthdate', label: 'Birthdate', type: 'date' },
405+
{ property: 'genre', label: 'Genre' }
406+
];
407+
408+
component.hideCloseDisclaimers = ['test'];
409+
410+
const filters = { name: 'Roger', birthdate: '2018-12-12T00:00:01-00:00', genre: 'male' };
411+
412+
const result = [
413+
{ label: 'Name: Roger', property: 'name', value: 'Roger', hideClose: false },
414+
{ label: 'Birthdate: 12/12/2018', property: 'birthdate', value: '2018-12-12T00:00:01-00:00', hideClose: false },
415+
{ label: 'Genre: male', property: 'genre', value: 'male', hideClose: false }
416+
];
338417

339418
expect(component['setDisclaimers'](filters)).toEqual(result);
340419
});
@@ -551,6 +630,7 @@ describe('PoPageDynamicSearchComponent:', () => {
551630
component.filters = [{ property: 'filter1' }, { property: 'filter2' }];
552631
component.title = 'Original Title';
553632
component.quickSearchWidth = 3;
633+
component.hideCloseDisclaimers = ['filter1'];
554634

555635
component.onLoad = () => ({
556636
title: 'New Title',
@@ -563,7 +643,9 @@ describe('PoPageDynamicSearchComponent:', () => {
563643
],
564644
filters: [{ property: 'filter1' }, { property: 'filter3' }],
565645
keepFilters: true,
566-
quickSearchWidth: 6
646+
quickSearchWidth: 6,
647+
hideRemoveAllDisclaimer: true,
648+
hideCloseDisclaimers: ['filter3']
567649
});
568650

569651
component.ngOnInit();
@@ -580,6 +662,8 @@ describe('PoPageDynamicSearchComponent:', () => {
580662
});
581663
expect(component.keepFilters).toBeTrue();
582664
expect(component.quickSearchWidth).toBe(6);
665+
expect(component.hideRemoveAllDisclaimer).toBeTrue();
666+
expect(component.hideCloseDisclaimers).toEqual(['filter3']);
583667
}));
584668
});
585669
});
@@ -605,8 +689,8 @@ describe('PoPageDynamicSearchComponent:', () => {
605689
component.onAction('Chicago');
606690

607691
const currentDisclaimers = [
608-
{ label: 'City: Ontario', value: 'Ontario', property: 'city' },
609-
{ property: 'search', label: `Search Chicago`, value: 'Chicago' }
692+
{ label: 'City: Ontario', value: 'Ontario', property: 'city', hideClose: false },
693+
{ property: 'search', label: `Search Chicago`, value: 'Chicago', hideClose: false }
610694
];
611695

612696
expect(component.disclaimerGroup.disclaimers).toEqual(currentDisclaimers);
@@ -623,8 +707,8 @@ describe('PoPageDynamicSearchComponent:', () => {
623707
component.onAction('Test');
624708

625709
const currentDisclaimers = [
626-
{ label: 'City: Ontario', value: 'Ontario', property: 'city' },
627-
{ property: 'search', label: `Search Test`, value: 'Test' }
710+
{ label: 'City: Ontario', value: 'Ontario', property: 'city', hideClose: false },
711+
{ property: 'search', label: `Search Test`, value: 'Test', hideClose: false }
628712
];
629713

630714
expect(component.disclaimerGroup.disclaimers).toEqual(currentDisclaimers);
@@ -635,11 +719,15 @@ describe('PoPageDynamicSearchComponent:', () => {
635719

636720
component.literals.quickSearchLabel = 'Search';
637721
component.onAction('Chicago');
638-
const disclaimersWithQuickFilter = [{ property: 'search', label: `Search Chicago`, value: 'Chicago' }];
722+
const disclaimersWithQuickFilter = [
723+
{ property: 'search', label: `Search Chicago`, value: 'Chicago', hideClose: false }
724+
];
639725

640726
expect(component.disclaimerGroup.disclaimers).toEqual(disclaimersWithQuickFilter);
641727

642-
const disclaimersWithAdvancedSearch = [{ label: 'City: Ontario', value: 'Ontario', property: 'city' }];
728+
const disclaimersWithAdvancedSearch = [
729+
{ label: 'City: Ontario', value: 'Ontario', property: 'city', hideClose: false }
730+
];
643731

644732
component.filters = [{ property: 'city', initValue: 'Ontario' }];
645733

@@ -651,11 +739,15 @@ describe('PoPageDynamicSearchComponent:', () => {
651739

652740
component.literals.quickSearchLabel = 'Search';
653741
component.onAction('Chicago');
654-
const disclaimersWithQuickFilter = [{ property: 'search', label: `Search Chicago`, value: 'Chicago' }];
742+
const disclaimersWithQuickFilter = [
743+
{ property: 'search', label: `Search Chicago`, value: 'Chicago', hideClose: false }
744+
];
655745

656746
expect(component.disclaimerGroup.disclaimers).toEqual(disclaimersWithQuickFilter);
657747

658-
const disclaimersWithAdvancedSearch = [{ label: 'City: Ontario', value: 'Ontario', property: 'city' }];
748+
const disclaimersWithAdvancedSearch = [
749+
{ label: 'City: Ontario', value: 'Ontario', property: 'city', hideClose: false }
750+
];
659751

660752
component.filters = [{ property: 'city', initValue: 'Ontario' }];
661753

0 commit comments

Comments
 (0)