feat(table): utiliza po-tag para exibir o label

Altera o conteúdo do po-table-column-label para utilizar o
componente po-tag

Fixes #1421, DTHFUI-2583

Author: wsteixeira

projects/ui/src/lib/components/po-table/po-table.component.html

@@ -292,7 +292,7 @@
                   <po-table-subtitle-circle [p-subtitle]="getSubtitleColumn(row, column)"></po-table-subtitle-circle>
                 </span>
                 <span *ngSwitchCase="'label'">
-                  <po-table-column-label [p-value]="getColumnLabel(row, column)"> </po-table-column-label>
+                  <po-tag [p-color]="getTagColor(row, column)" [p-value]="getTagValue(row, column)"> </po-tag>
                 </span>
                 <span *ngSwitchDefault>{{ getCellData(row, column) }}</span>
               </div>
@@ -574,7 +574,7 @@
                 <po-table-subtitle-circle [p-subtitle]="getSubtitleColumn(row, column)"></po-table-subtitle-circle>
               </span>
               <span *ngSwitchCase="'label'">
-                <po-table-column-label [p-value]="getColumnLabel(row, column)"> </po-table-column-label>
+                <po-tag [p-color]="getTagColor(row, column)" [p-value]="getTagValue(row, column)"> </po-tag>
               </span>
               <span *ngSwitchDefault>{{ getCellData(row, column) }}</span>
             </div>

projects/ui/src/lib/components/po-table/po-table.component.spec.ts

@@ -515,7 +515,7 @@ describe('PoTableComponent:', () => {
     component.columns.push(labels);
     fixture.detectChanges();
 
-    const labelColumn = tableElement.querySelector('.po-table-column-label');
+    const labelColumn = tableElement.querySelector('.po-tag');
 
     expect(labelColumn).toBeTruthy();
   });

projects/ui/src/lib/components/po-table/po-table.component.ts

@@ -27,7 +27,6 @@ import { PoPopupComponent } from '../po-popup/po-popup.component';
 import { PoTableAction } from './interfaces/po-table-action.interface';
 import { PoTableBaseComponent, QueryParamsType } from './po-table-base.component';
 import { PoTableColumn } from './interfaces/po-table-column.interface';
-import { PoTableColumnLabel } from './po-table-column-label/po-table-column-label.interface';
 import { PoTableRowTemplateDirective } from './po-table-row-template/po-table-row-template.directive';
 import { PoTableSubtitleColumn } from './po-table-subtitle-footer/po-table-subtitle-column.interface';
 import { PoTableCellTemplateDirective } from './po-table-cell-template/po-table-cell-template.directive';
@@ -119,6 +118,7 @@ export class PoTableComponent extends PoTableBaseComponent implements AfterViewI
   tooltipText: string;
   itemSize: number = 32;
   lastVisibleColumnsSelected: Array<PoTableColumn>;
+  tagColor: string;
 
   private _columnManagerTarget: ElementRef;
   private _columnManagerTargetFixed: ElementRef;
@@ -443,7 +443,15 @@ export class PoTableComponent extends PoTableBaseComponent implements AfterViewI
     return rowIcons;
   }
 
-  getColumnLabel(row: any, columnLabel: PoTableColumn): PoTableColumnLabel {
+  getTagColor(row: any, columnLabel: PoTableColumn) {
+    return columnLabel.labels.find(labelItem => this.getCellData(row, columnLabel) === labelItem.value)?.color;
+  }
+
+  getTagValue(row: any, columnLabel: PoTableColumn) {
+    return columnLabel.labels.find(labelItem => this.getCellData(row, columnLabel) === labelItem.value)?.label;
+  }
+
+  getColumnLabel(row: any, columnLabel: PoTableColumn) {
     return columnLabel.labels.find(labelItem => this.getCellData(row, columnLabel) === labelItem.value);
   }
 

projects/ui/src/lib/components/po-table/po-table.module.ts

@@ -11,6 +11,7 @@ import { PoLoadingModule } from '../po-loading/po-loading.module';
 import { PoModalModule } from '../po-modal/po-modal.module';
 import { PoPopoverModule } from '../po-popover/po-popover.module';
 import { PoPopupModule } from './../po-popup/po-popup.module';
+import { PoTagModule } from '../po-tag/po-tag.module';
 import { PoTimeModule } from '../../pipes/po-time/index';
 import { PoTooltipModule } from '../../directives/po-tooltip/index';
 import { PoIconModule } from './../po-icon/po-icon.module';
@@ -48,6 +49,7 @@ import { PoTableListManagerComponent } from './po-table-list-manager/po-table-li
     PoModalModule,
     PoPopoverModule,
     PoPopupModule,
+    PoTagModule,
     PoTimeModule,
     PoTooltipModule,
     PoIconModule,