feat(dynamic-view): implementa novas propriedades em fields

Permite visualização de lista ou objeto de uma propriedade.
Permite utilização de fieldLabel e fieldValue para itens.
Permite concatenar fieldLabel e fieldValue para exibição do item.
Criação da propriedade searchService.

fixes DTHFUI-7549

Author: CSimoesJr

projects/ui/src/lib/components/po-dynamic/index.ts

@@ -1,6 +1,7 @@
 export * from './po-dynamic-field-type.enum';
 export * from './po-dynamic-field-force-component.enum';
 export * from './po-dynamic-form/po-dynamic-form-field.interface';
+export * from './po-dynamic-view/interfaces/po-dynamic-view-request.interface';
 export * from './po-dynamic-form/po-dynamic-form-load/po-dynamic-form-load.interface';
 export * from './po-dynamic-form/po-dynamic-form-validation/po-dynamic-form-field-changed.interface';
 export * from './po-dynamic-form/po-dynamic-form-validation/po-dynamic-form-field-validation.interface';

projects/ui/src/lib/components/po-dynamic/po-dynamic-view/interfaces/po-dynamic-view-request.interface.ts

@@ -0,0 +1,19 @@
+import { Observable } from 'rxjs';
+
+/**
+ * @usedBy PoDynamicViewComponent
+ *
+ * @description
+ *
+ * Define o tipo de busca customizada para um campo em específico.
+ */
+export interface PoDynamicViewRequest {
+  /**
+   * Método responsável por enviar um valor que será buscado no serviço.
+   *
+   *
+   * @param {string|Array<any>} value Valor único a ser buscado na fonte de dados.
+   * @param {any} filterParams Valor opcional para informar filtros customizados.
+   */
+  getObjectByValue(value: string | Array<any>, filterParams?: any): Observable<any>;
+}

projects/ui/src/lib/components/po-dynamic/po-dynamic-view/po-dynamic-view-base.component.spec.ts

@@ -1,14 +1,28 @@
 import { CurrencyPipe, DatePipe, DecimalPipe, TitleCasePipe } from '@angular/common';
 import { HttpClient, HttpHandler } from '@angular/common/http';
-import { TestBed } from '@angular/core/testing';
+import { TestBed, fakeAsync, inject, tick } from '@angular/core/testing';
 
-import { expectPropertiesValues, expectArraysSameOrdering } from '../../../util-test/util-expect.spec';
 import { PoTimePipe } from '../../../pipes/po-time/po-time.pipe';
+import { expectArraysSameOrdering, expectPropertiesValues } from '../../../util-test/util-expect.spec';
 
+import { Observable, of } from 'rxjs';
 import * as PoDynamicUtil from '../po-dynamic.util';
+import { PoDynamicViewRequest } from './interfaces/po-dynamic-view-request.interface';
 import { PoDynamicViewBaseComponent } from './po-dynamic-view-base.component';
-import { PoDynamicViewService } from './po-dynamic-view.service';
 import { PoDynamicViewField } from './po-dynamic-view-field.interface';
+import { PoDynamicViewService } from './services/po-dynamic-view.service';
+
+class DynamicViewService implements PoDynamicViewRequest {
+  getObjectByValue(id: string): Observable<any> {
+    return of({ value: 123, label: 'teste' });
+  }
+}
+
+class TestService implements PoDynamicViewRequest {
+  getObjectByValue(id: string): Observable<any> {
+    return of({ value: 123, label: 'teste' });
+  }
+}
 
 describe('PoDynamicViewBaseComponent:', () => {
   let component: PoDynamicViewBaseComponent;
@@ -30,7 +44,8 @@ describe('PoDynamicViewBaseComponent:', () => {
         PoTimePipe,
         PoDynamicViewService,
         HttpClient,
-        HttpHandler
+        HttpHandler,
+        DynamicViewService
       ]
     });
 
@@ -189,8 +204,107 @@ describe('PoDynamicViewBaseComponent:', () => {
 
         expectArraysSameOrdering(newFields, expectedFields);
       });
+
+      it('should return ordering fields with property searchService', fakeAsync(
+        inject([DynamicViewService], (dynamicService: DynamicViewService) => {
+          component.service = dynamicService;
+          const fields: Array<PoDynamicViewField> = [
+            { property: 'test 1', order: 6 },
+            { property: 'test 0', order: 2, searchService: 'url.test.com', fieldLabel: 'name', fieldValue: 'id' },
+            { property: 'test 2', order: 3 },
+            { property: 'test 3', order: 1 },
+            { property: 'test 4', order: 5 },
+            { property: 'test 5', order: 4 }
+          ];
+          component.value[fields[1].property] = '123';
+          spyOn(component.service, 'getObjectByValue').and.returnValue(of([{ id: 1, name: 'po' }]));
+          spyOn(component, <any>'searchById').and.returnValue(of([{ id: 1, name: 'po' }]));
+
+          const expectedFields = [
+            { property: 'test 3' },
+            { property: 'test 0', value: 'po' },
+            { property: 'test 2' },
+            { property: 'test 5' },
+            { property: 'test 4' },
+            { property: 'test 1' }
+          ];
+
+          component.fields = [...fields];
+
+          const newFields = component['getConfiguredFields']();
+          tick(500);
+          console.log(newFields);
+
+          expectArraysSameOrdering(newFields, expectedFields);
+        })
+      ));
+
+      it('should return ordering fields with property searchService using service type', fakeAsync(
+        inject([DynamicViewService], (dynamicService: DynamicViewService) => {
+          component.service = dynamicService;
+          const fields: Array<PoDynamicViewField> = [
+            { property: 'test 1' },
+            { property: 'test 0', searchService: new TestService(), fieldLabel: 'name', fieldValue: 'id' },
+            { property: 'test 2', searchService: 'url.com' },
+            { property: 'test 3', searchService: 'url.com' },
+            { property: 'test 4' },
+            { property: 'test 5' }
+          ];
+          component.value[fields[1].property] = '123';
+          component.value[fields[2].property] = [{ test: 123 }];
+          component.value[fields[3].property] = { test: 123 };
+
+          spyOn(component.service, 'getObjectByValue').and.returnValue(of([{ id: 1, name: 'po' }]));
+
+          const expectedFields = [
+            { property: 'test 1', value: undefined },
+            { property: 'test 0', value: 'teste' },
+            { property: 'test 2', value: null },
+            { property: 'test 3', value: null },
+            { property: 'test 4' },
+            { property: 'test 5' }
+          ];
+
+          component.fields = [...fields];
+
+          const newFields = component['getConfiguredFields']();
+          tick(500);
+          console.log(newFields);
+
+          expectArraysSameOrdering(newFields, expectedFields);
+        })
+      ));
+    });
+
+    it('searchById: should return null if value is empty', done => {
+      const value = '';
+      const field: any = { property: 'test' };
+
+      component['searchById'](value, field).subscribe(result => {
+        expect(result).toBeNull(); // Verifique se o resultado é nulo
+        done();
+      });
     });
 
+    it('createFieldWithService: should call searchById and update newFields correctly', fakeAsync(() => {
+      const field = { property: 'test' };
+      const newFields = [];
+      const index = 0;
+
+      const valueToSearch = '123';
+      const expectedResult = 'transformedValue';
+
+      const mockSearchById = spyOn(component, <any>'searchById').and.returnValue(of(expectedResult));
+
+      component.value[field.property] = valueToSearch;
+      component['createFieldWithService'](field, newFields, index);
+
+      tick();
+
+      expect(mockSearchById).toHaveBeenCalledWith(valueToSearch, field);
+      expect(newFields[index].value).toBe(expectedResult);
+    }));
+
     it('getMergedFields: should return a merged array between configuredFields and valueFields', () => {
       const configuredFields = [{ property: 'name', value: 'po' }];
       const valueFields = [{ property: 'email' }];
@@ -236,6 +350,78 @@ describe('PoDynamicViewBaseComponent:', () => {
       expect(component['transformValue']).toHaveBeenCalled();
     });
 
+    it(`createField: should call 'transformArrayValue', return a
+    object and value is a label property`, () => {
+      const field = { property: 'name', label: 'Nome', isArrayOrObject: true };
+      component.value = { name: { label: 'Test1', value: 123 } };
+
+      const newField = component['createField'](field);
+
+      expect(newField.value).toBe('Test1');
+    });
+
+    it(`createField: should call 'transformArrayValue', return a
+    list and value is a title property`, () => {
+      const field = {
+        property: 'name',
+        label: 'Nome',
+        isArrayOrObject: true,
+        concatLabelValue: true,
+        fieldLabel: 'title',
+        fieldValue: 'id'
+      };
+      component.value = {
+        name: [
+          { title: 'Test1', id: 123 },
+          { title: 'Test2', id: 321 }
+        ]
+      };
+
+      const newField = component['createField'](field);
+
+      expect(newField.value).toBe('Test1 - 123, Test2 - 321');
+    });
+
+    it(`createField: should call 'transformArrayValue' and return a empty value if fieldLabel is a property invalid`, () => {
+      const field = { property: 'name', label: 'Nome', isArrayOrObject: true, fieldLabel: 'item', fieldValue: 'other' };
+      const listName = [
+        { title: 'Test1', id: 123 },
+        { title: 'Test2', id: 321 }
+      ];
+      component.value = {
+        name: listName
+      };
+
+      const newField = component['createField'](field);
+
+      expect(newField.value).toEqual(listName);
+    });
+
+    it(`createField: should call 'transformFieldLabel' and return a fieldLabel property`, () => {
+      const field = { property: 'name', label: 'Nome', fieldLabel: 'title', fieldValue: 'id' };
+      component.value = { name: 'Test Name', title: 'Title Test', id: 123 };
+
+      const newField = component['createField'](field);
+
+      expect(newField.value).toBe('Title Test');
+    });
+
+    it('createField: should call `transformFieldLabel`, return a `fieldLabel` and `fieldValue` property if `concatLabelValue` is true', () => {
+      const field = {
+        property: 'name',
+        label: 'Nome',
+        fieldLabel: 'title',
+        fieldValue: 'id',
+        concatLabelValue: true,
+        type: 'currency'
+      };
+      component.value = { name: 'Test Name', title: 'Test Title', id: 123 };
+
+      const newField = component['createField'](field);
+
+      expect(newField.value).toBe('Test Title - 123');
+    });
+
     it('getValueFields: should return an array converting the value object', () => {
       component.value = { name: 'Po' };