@sapphire-ion/framework 1.3.5 → 1.3.8

package/src/lib/components/default/default-table/default-table.component.ts

@@ -1,255 +0,0 @@
-import { formatNumber } from '@angular/common';
-import { Component, computed, effect, Input, input, InputSignal, model, ModelSignal, OnInit, output, OutputEmitterRef, OutputRef, Signal, TemplateRef } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
-
-import { InputDecimalConfiguration } from '../../inputs/input-decimal/input-decimal.configuration';
-import { InputSelectConfiguration } from '../../inputs/input-select/input.select.configuration';
-import { FormatTelefoneCelular } from '../../inputs/input-telefone/input-telefone.component';
-import { StorageService } from '../../../services/web/storage.service';
-import { FormatCpfCnpj } from '../../inputs/input-cpf-cnpj/input-cpf-cnpj.component';
-import { HttpService } from '../../../services/web/http.service'
-import { TableField } from '../../../classes/inputs/table-field';
-import { Comparison, CompileLstTableField } from '../../../classes/comparison/comparison';
-import { FormatCep } from '../../inputs/input-cep/input-cep.component';
-import { InputType } from '../../inputs/input-type';
-import { Utils } from '../../../services/utils.service';
-
-type CSSStyleStringGenerator = (index: string, object: any) => string;
-
-@Component({
-  selector: 'default-table',
-  templateUrl: './default-table.component.html',
-  styleUrls: ['./default-table.component.scss'],
-})
-export class DefaultTableComponent<Service extends HttpService, T = any> implements OnInit {
-
-  @Input() acoesTemplate: TemplateRef<any>;
-  /** Template de ações, deve ser um elemento ```<ng-template>``` */
-  // acoesTemplate: InputSignal<TemplateRef<any>> = input<TemplateRef<any>>();
-
-  /** Service a ser utilizado na listagem */
-  service: InputSignal<Service> = input<Service>();
-
-  total: ModelSignal<number> = model<number>(0);
-
-  /** Número de items máximo (usando two way data binding) */
-  limit: ModelSignal<number> = model<number>();
-
-  /** Valor da pagina, setado = 1 quando troca-se o valor de limite de paginas (usando two way data binding) */
-  page: ModelSignal<number> = model<number>(1);
-
-  /** Propriedade de ordenação (usando two way data binding) */
-  orderByProperty: ModelSignal<string | null> = model<string | null>(null);
-    
-  /** Propriedade de ordenação
-   * Se = true  Ordenará de menor ao maior 
-   * Se = false Ordenará de maior ao menor (usando two way data binding) */
-  ascending: ModelSignal<boolean> = model<boolean>(true);
-
-  /** Filtros (usando two way data binding) */ 
-  filter: ModelSignal<Comparison[]> = model<Comparison[]>([]);
-
-  /** Evento emitido quando um dos dados é ativado. Emite o id do dado */  
-  ativar : OutputEmitterRef<number> = output<number>();
-  refresh: OutputEmitterRef<void> = output<void>();
-
-
-  loading: ModelSignal<boolean> = model<boolean>(false);
-
-  /** Lista de dados a ser exibidos */
-  items: ModelSignal<T[]> = model<T[]>([]);
-
-  /** Lista de campos a ser exibidos */
-  lstTableFields: ModelSignal<TableField[]> = model<TableField[]>([]);
-  lstTableFieldsAvailable: Signal<AvailableTableField[]> = computed<AvailableTableField[]>(() => { 
-    return this.lstTableFields().filter(p => !p.hidden).map(tf => {
-      return new AvailableTableField(
-        tf, 
-        this.ascending() && this.orderByProperty() == tf.index, 
-        !this.ascending() && this.orderByProperty() == tf.index
-      );
-    });
-  });
-
-  /** Remove os filtros no cabeçalho da tabela  */
-  noFilters: InputSignal<boolean> = input<boolean>(false);
-
-  /** Aplica classes de CSS na coluna de acirdo com o retorno da função passada como parametro  */
-  columnClass: InputSignal<CSSStyleStringGenerator | null> = input<CSSStyleStringGenerator | null>(null);
-
-  /** Aplica style de CSS na coluna de acirco com o retorno da função passada como parametro  */
-  columnStyle: InputSignal<CSSStyleStringGenerator | null> = input<CSSStyleStringGenerator | null>(null);
-
-  /** Remove a paginação da listagem */
-  noPagination: InputSignal<boolean> = input<boolean>(false);
-
-  /** Caminho de redirecionamento do item */
-  itemPath: InputSignal<string> = input<string>('view/:id');
-  itemClick: OutputEmitterRef<{item: T, field: TableField}> = output<{item: T, field: TableField}>();
-
-  InputType = InputType;
-
-  constructor(
-    public storageService : StorageService,
-    private activatedRoute: ActivatedRoute,
-    private router        : Router,
-  ) { 
-    effect(() => {
-      for (const tf of this.lstTableFields().filter(p => p.type == InputType.Select)) {
-        (tf.configuration as InputSelectConfiguration).loader.Refresh().then(() => this.SetLstRows());
-      }
-      this.SetLstRows();
-    });
-  }
-
-Redirect(field: TableField | undefined, item: T): void {
-  if (field == null) {
-    return;
-  }
-  this.itemClick.emit({ item, field });
-  if (field.index == 'ativo') {
-    return;
-  }
-  if (field.type == 'File') {
-    return;
-  }
-  if (this.itemPath()) {
-    const id = item['id'];
-    const path = this.itemPath().replace(":id", id.toString());
-    this.router.navigate([`./${path}`], { relativeTo: this.activatedRoute })
-  }
-}
-
-  SetLstRows(){ 
-    this.lstRows = this.items().map(item => {
-      return new DefaultTableRow<T>(
-        item, 
-        item['id'],
-        this.GetColumns(item),
-        '',
-        '',
-      );
-    });
-  }
-  
-  lstRows: DefaultTableRow<T>[] = []; 
-
-  GetColumns(item: T): DefaultTableColumn[] {
-    return this.lstTableFields().filter(p => !p.hidden).map(tf => {
-      const value = item[tf.index];
-      const column = new DefaultTableColumn(value, tf);
-      column.class = this.columnClass() ? this.columnClass()(tf.index, item) : '';
-      column.style = this.columnStyle() ? this.columnStyle()(tf.index, item) : '';
-      
-      if(!value){ 
-        column.label = '-' 
-        return column;
-      }
-      
-      if(tf.type == InputType.Bool){
-        column.label = "<bool>"
-      } else
-      if(tf.type == InputType.Cep){
-        column.label = FormatCep(value);
-      } else
-      if(tf.type == InputType.Color){
-        column.label = value;
-      } else
-      if([InputType.Cpf, InputType.Cnpj, InputType.CpfCnpj].includes(tf.type)){
-        column.label = FormatCpfCnpj(value);
-      } else
-      if(tf.type == InputType.DateTime){
-        column.class += ' font-mono';
-        column.label = Utils.DateISOToDDMMYYYYHHMM(value);
-      } else
-      if(tf.type == InputType.Date){
-        column.class += ' font-mono';
-        column.label = Utils.DateISOToDDMMYYYY(value);
-      } else
-      if(tf.type == InputType.Time){
-        column.class += ' font-mono';
-        column.label = value;
-      } else
-      if([InputType.Decimal, InputType.Decimal, InputType.Currency, InputType.Number].includes(tf.type)){
-        const configuration: InputDecimalConfiguration = tf.configuration;
-        column.label = [
-          configuration.prefix, 
-          formatNumber(value as number, 'pt-BR', `1.${configuration.precision}-${configuration.precision}`),
-          configuration.sufix, 
-        ].join(' ');
-      } else
-      if(tf.type == InputType.File){
-        column.label = '<file>';
-      } else
-      if(tf.type == InputType.Icon){
-        column.label = 'icon';
-      } else
-      if(tf.type == InputType.Select){
-        column.label = (tf.configuration as InputSelectConfiguration).loader.GetLabel(value);
-        column.loading = !(tf.configuration as InputSelectConfiguration).loader.isLoaded;
-      } else
-      if([InputType.String, InputType.TextArea].includes(tf.type)){
-        column.label = value
-      } else
-      if([InputType.Telefone, InputType.Celular, InputType.TelefoneCelular].includes(tf.type)){
-        column.label = FormatTelefoneCelular(value);
-      }
-
-      return column;
-    });
-  }
-
-  ngOnInit() { this.SetLstRows(); }
-
-  SwitchOrder(tf: TableField): void{
-    if(this.orderByProperty() != tf.index){
-      this.orderByProperty.set(tf.index);
-      this.ascending.set(true);
-    } else 
-    if(this.ascending()){
-      this.ascending.set(false);
-    } else{ 
-      this.orderByProperty.set(null); 
-    }
-    this.refresh.emit();
-  }
-
-  ChangeFilter(): void{
-    this.filter.set(CompileLstTableField(this.lstTableFields()));
-    this.page.set(1);
-    this.refresh.emit();
-  }
-
-  Ativar(id: number): void{
-    this.ativar.emit(id);
-  }
-}
-
-class DefaultTableRow<T>{
-  constructor(
-    public item: T,
-    public id: number | undefined,
-    public lstColumns: DefaultTableColumn[],
-    public acoesClass: string = '',
-    public acoesStyle: string = '',
-  ){}
-} 
-
-class DefaultTableColumn{
-  public label: string | null
-  public loading: boolean = false;
-  public class: string = '';
-  public style: string = '';
-  constructor(
-    public value: any = null,
-    public tf: TableField,
-  ){}
-}
-
-class AvailableTableField{
-  constructor(
-    public tf: TableField,
-    public ascending: boolean,
-    public descending: boolean,
-  ){}
-}

package/src/lib/components/default/default-table/th-filter/th-filter.component.html

@@ -1,69 +0,0 @@
-<div #anchor class="h-5 aspect-square flex items-center justify-center cursor-pointer">
-  <ion-icon name="filter-circle" (click)="popover.present($event)" class="text-xl align-sub size-full" [color]="isFilterActive ? 'secondary' : 'medium' "></ion-icon>
-</div>
-
-<ion-popover class="th-filter" fill="solid" #popover triggerAction="click" (onWillDismiss)="WillDismiss()">
-  <ng-template>
-    <div class="w-72 flex flex-col gap-2 p-2" >
-      @if(!['Select', 'Bool', 'String', 'TextArea', 'Cpf', 'Cnpj', 'CpfCnpj', 'Cep'].includes(field.type)){
-        <ion-label class="w-full flex items-center justify-center">  Filtro - {{field.header}} </ion-label>
-      }
-      @switch (field.type) {
-        @case ('String') {
-          <input-string [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}" (blur)="Change()"></input-string>
-        }
-        @case ('Number') {
-          <div class="grid grid-cols-1 gap-2">
-            <input-number (change)="Change()" [(ngModel)]="modelMinimum" label="Valor Mínimo" [configuration]="field.configuration"></input-number>
-            <input-number (change)="Change()" [(ngModel)]="modelMaximum" label="Valor Maximo" [configuration]="field.configuration"></input-number>
-          </div>
-        }
-        @case ('Decimal') {
-          <div class="grid grid-cols-1 gap-2">
-            <input-decimal (change)="Change()" [(ngModel)]="modelMinimum" label="Valor Mínimo" [configuration]="field.configuration"></input-decimal>
-            <input-decimal (change)="Change()" [(ngModel)]="modelMaximum" label="Valor Maximo" [configuration]="field.configuration"></input-decimal>
-          </div>
-        }
-        @case ('Currency') {
-          <div class="grid grid-cols-1 gap-2">
-            <input-currency (change)="Change()" [(ngModel)]="modelMinimum" label="Valor Mínimo" [configuration]="field.configuration"></input-currency>
-            <input-currency (change)="Change()" [(ngModel)]="modelMaximum" label="Valor Maximo" [configuration]="field.configuration"></input-currency>
-          </div>
-        }
-        @case ('Select') {
-          <input-select (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}" [configuration]="configuration"></input-select>
-        }
-        @case ('TextArea') {
-          <input-string (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}"></input-string>
-        }
-        @case ('Bool') {
-          <input-select (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}" placeholder="" [configuration]="configuration"></input-select>
-        }
-        @case ('Date') {
-          <div class="size-full grid grid-cols-1 gap-2">
-            <input-date (change)="Change()" [(ngModel)]="modelMinimum" label="Data Mínima" [configuration]="configuration"></input-date>
-            <input-date (change)="Change()" [(ngModel)]="modelMaximum" label="Data Maxima" [configuration]="configuration"></input-date>
-          </div>
-        }
-        @case ('DateTime') {
-          <div class="grid grid-cols-1 gap-2">
-            <input-date-time (change)="Change()" [(ngModel)]="modelMinimum" label="Data Mínima" [configuration]="configuration"></input-date-time>
-            <input-date-time (change)="Change()" [(ngModel)]="modelMaximum" label="Data Maxima" [configuration]="configuration"></input-date-time>
-          </div>
-        }
-        @case("Cep") {
-          <input-cep (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}"></input-cep>
-        }
-        @case ('Cpf') {
-          <input-cpf (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}"></input-cpf>
-        }
-        @case ('Cnpj') {
-          <input-cnpj (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}"></input-cnpj>
-        }
-        @case ('CpfCnpj') {
-          <input-cpf-cnpj (change)="Change()" [(ngModel)]="model" class="th-select" label="Filtro - {{field.header}}"></input-cpf-cnpj>
-        }
-      }
-    </div>
-  </ng-template>
-</ion-popover>

package/src/lib/components/default/default-table/th-filter/th-filter.component.ts

@@ -1,205 +0,0 @@
-import { Component, EventEmitter, Input, OnInit, Output, QueryList, ViewChildren, viewChildren } from '@angular/core';
-
-import { TableField } from '../../../../classes/inputs/table-field';
-import { InputType } from '../../../inputs/input-type';
-import { Utils } from '../../../../services/utils.service';
-
-import { InputDecimalConfiguration, InputCurrencyConfiguration, InputNumberConfiguration } from '../../../inputs/input-decimal/input-decimal.configuration';
-import { InputStringConfiguration } from '../../../inputs/input-string/input-string.configuration';
-import { InputSelectConfiguration } from '../../../inputs/input-select/input.select.configuration';
-import { InputDateConfiguration } from '../../../inputs/input-date/input-date.configuration';
-import { InputFileConfiguration } from '../../../inputs/input-file/input-file.configuration';
-import { InputBoolConfiguration } from '../../../inputs/input-bool/input-bool.configuration';
-import { InputConfiguration } from '../../../inputs/input-configuration';
-
-import { ImplicitProperty } from '../../../../classes/comparison/properties/implicit-property';
-import { DecimalProperty } from '../../../../classes/comparison/properties/decimal-property';
-import { StringProperty } from '../../../../classes/comparison/properties/string-property';
-import { BoolProperty } from '../../../../classes/comparison/properties/bool-property';
-import { DateProperty } from '../../../../classes/comparison/properties/date-property';
-
-import { Comparison } from '../../../../classes/comparison/comparison';
-import { InputDateComponent } from '../../../inputs/input-date/input-date.component';
-import { InputCpfCnpjConfiguration } from '../../../inputs/input-cpf-cnpj/input-cpf-cnpj.configuration';
-import { InputCepConfiguration } from '../../../inputs/input-cep/input-cep.configuration';
-import { ComparisonValueType } from '../../../../classes/comparison/comparison-value-type';
-
-
-@Component({
-  selector: 'th-filter',
-  templateUrl: './th-filter.component.html',
-  styleUrls: ['./th-filter.component.scss'],
-})
-export class ThFilterComponent implements OnInit {
-
-  @Input() field : TableField 
-
-  guid: string = Utils.GenerateGUID();
-  configuration: InputConfiguration;
-
-  constructor() { }
-
-  ngOnInit() {
-    this.configuration = this.field.configuration;
-    
-    if(!this.configuration){
-      if([InputType.Date, InputType.DateTime, InputType.Time].includes(this.field.type)){ this.configuration = new InputDateConfiguration() } else
-      if(this.field.type == InputType.File    ){ this.configuration = new InputFileConfiguration()     }else
-      if(this.field.type == InputType.Number  ){ this.configuration = new InputNumberConfiguration()   }else
-      if(this.field.type == InputType.Decimal ){ this.configuration = new InputDecimalConfiguration()  }else
-      if(this.field.type == InputType.Currency){ this.configuration = new InputCurrencyConfiguration() }else
-      if(this.field.type == InputType.String  ){ this.configuration = new InputStringConfiguration()   }else
-      if(this.field.type == InputType.Select  ){ this.configuration = new InputSelectConfiguration()   }else
-      if(this.field.type == InputType.TextArea){ this.configuration = new InputStringConfiguration();  }else 
-      if(this.field.type == InputType.Bool    ){ this.configuration = new InputBoolConfiguration();    } else
-      if(this.field.type == InputType.Cpf     ){ this.configuration = new InputCpfCnpjConfiguration("CPF"); }  else
-      if(this.field.type == InputType.Cnpj    ){ this.configuration = new InputCpfCnpjConfiguration("CNPJ"); }  else
-      if(this.field.type == InputType.CpfCnpj ){ this.configuration = new InputCpfCnpjConfiguration("CPFCNPJ"); } else
-      if(this.field.type == InputType.Cep     ){ this.configuration = new InputCepConfiguration();  }
-    }
-
-    if(this.configuration instanceof InputSelectConfiguration){
-      this.configuration = new InputSelectConfiguration(
-        this.configuration.bindValue,
-        this.configuration.bindLabel,
-        true,
-        true,
-        this.configuration.loadFrom,
-        true,
-      );
-      (this.configuration as InputSelectConfiguration).popoverConfiguration.flip = false;
-    }
-
-    if(this.configuration instanceof InputDateConfiguration){
-      this.configuration = new InputDateConfiguration(true);
-    }
-
-    if(this.field.type == InputType.Bool){
-      if(this.field.index == "ativo"){
-        this.configuration = this.configuration = new InputSelectConfiguration('value', 'label', true, true, [
-          { label: 'Somente Ativos'    , value: true  },
-          { label: 'Somente Não Ativos', value: false },
-        ]);
-        this.model = true;
-      }
-      else{
-        this.configuration = new InputSelectConfiguration('value', 'label', true, false, [
-          { label: 'Sim', value: true  },
-          { label: 'Não', value: false },
-        ])
-      }
-    }
-  }
-
-  isFilterActive: boolean = false;
-
-  model: any | null = null;
-  modelMinimum: any | null = null;
-  modelMaximum: any | null = null;
-  @Output('change') changeEmitter: EventEmitter<void> = new EventEmitter<void>();
-
-    Change(): void{
-      if(((typeof(this.model) == 'string' && !this.model) || 
-           this.model == null || 
-           (Array.isArray(this.model) && this.model.length == 0)) && 
-        !this.modelMinimum && !this.modelMaximum)
-      {
-        this.SetInactive();
-        return;
-      }
-
-      if([InputType.Currency, InputType.Decimal, InputType.Number].includes(this.field.type)){
-        var Comparison: Comparison[] = [];
-        if(this.modelMinimum){
-          var Bigger  = new DecimalProperty(this.field.index).GreaterThanOrEqual(this.modelMinimum);
-          Comparison = [Bigger];
-        }
-        if(this.modelMaximum){
-          var Smaller = new DecimalProperty(this.field.index).LessThanOrEqual(this.modelMaximum);
-          if(Comparison.length){ Comparison.push(Smaller); } 
-          else                 { Comparison = [Smaller]; }
-        }
-
-        this.field.filter = Comparison;
-        this.isFilterActive = true;
-        this.changeEmitter.emit();
-        return;
-      }else
-      if([InputType.String, InputType.TextArea, InputType.Cep, InputType.Cpf, InputType.Cnpj, InputType.CpfCnpj].includes(this.field.type)){
-        this.field.filter   = [new StringProperty(this.field.index).IsContainedIn(this.model)];
-        this.isFilterActive = true;
-        this.changeEmitter.emit();
-        return;
-      }else
-      if(this.field.type == InputType.Select){
-        this.field.filter   = [new ImplicitProperty(this.field.index).IsContainedIn(this.model)];
-        this.isFilterActive = true;
-        this.changeEmitter.emit();
-        return;
-      }else
-      if(this.field.type == InputType.Bool){
-        this.field.filter   = [new BoolProperty(this.field.index).Equals(this.model)];
-        this.isFilterActive = true;
-        this.changeEmitter.emit();
-        return;
-      } else
-      if ([InputType.Date, InputType.DateTime].includes(this.field.type)) {
-
-    if (this.field.type == InputType.Date) {
-      if (this.modelMinimum) {
-        this.modelMinimum = this.modelMinimum.split("T")[0] + "T00:00:00";
-      }
-      if (this.modelMaximum) {
-        this.modelMaximum = this.modelMaximum.split("T")[0] + "T23:59:59";
-      }
-    }
-
-    const valueType = (this.field.type == InputType.DateTime)
-        ? ComparisonValueType.DateTime
-        : ComparisonValueType.Date;
-
-    let ComparisonList: Comparison[] = [];
-
-    if (this.modelMinimum) {
-      let c = new DateProperty(this.field.index)
-                  .GreaterThanOrEqual(this.modelMinimum);
-
-      c.valueType = valueType;  
-      ComparisonList = [c];
-    }
-
-    if (this.modelMaximum) {
-      let c = new DateProperty(this.field.index)
-                  .LessThanOrEqual(this.modelMaximum);
-
-      c.valueType = valueType;  
-      if (ComparisonList.length) {
-        ComparisonList.push(c);
-      } else {
-        ComparisonList = [c];
-      }
-    }
-
-    this.field.filter = ComparisonList;
-    this.isFilterActive = true;
-    this.changeEmitter.emit();
-    return;
-  }
-
-
-    this.changeEmitter.emit();
-  }
-
-  SetInactive(): void{
-    this.field.filter = null;
-    this.isFilterActive = false;
-    this.changeEmitter.emit();
-    return;
-  }
-
-  @ViewChildren(InputDateComponent) lstInputDate: QueryList<InputDateComponent>;
-  WillDismiss(): void{
-    console.log(this.lstInputDate.toArray());
-    this.lstInputDate.forEach(i => i.Dismiss());
-  }
-}

package/src/lib/components/default/default-view/abstract-view.ts

@@ -1,25 +0,0 @@
-import { Component, OnInit, ViewChild } from "@angular/core";
-import { ActivatedRoute } from "@angular/router";
-
-import { GenericService } from "../../../services/generic.service";
-import { HttpService } from "../../../services/web/http.service";
-import { DefaultViewComponent } from "./default-view.component";
-
-/** Componente padrão para a invocação do DefaultView */
-@Component({ template: '', styles: '' })
-export abstract class AbstractView<T extends HttpService> implements OnInit {
-  public service       : T;
-  public genericService: GenericService;
-  public activatedRoute: ActivatedRoute;
-  
-  public id: number;
-  
-  ngOnInit(): void {
-    this.id = this.genericService.GetId(this.activatedRoute, 0);
-  }
-
-  @ViewChild(DefaultViewComponent<any>) public DefaultView: DefaultViewComponent<any>;
-  public static GetProvider(component): any[]{
-    return [{ provide: AbstractView, useExisting: component }]
-  }
-}

package/src/lib/components/default/default-view/default-view.component.html

@@ -1,111 +0,0 @@
-<ion-content class="bg-transparent"> 
-  <div class="wrapper" [ngClass]="{'!p-0 translucid-primary-background': nested}" tabindex="-1">
-    @if (!noBreadcrumbs) {
-      <ion-breadcrumbs>
-        <ion-breadcrumb class="cursor-pointer" (click)="NavigateToList()">
-          {{service.title}}
-        </ion-breadcrumb>
-        <ion-breadcrumb> 
-          {{id == 0 ? 'Novo Registro' : 'Editar Registro' }} 
-        </ion-breadcrumb>
-      </ion-breadcrumbs>
-    }
-    
-    <ion-card>
-      <ion-card-header class="!block">
-        @if (service) {
-          <header-view 
-            *ngIf="service" 
-            [novo]="id == 0" 
-            [useDefaultRouting]="nested" 
-            [loading]="loading" 
-            [progress]="progress" 
-            (save)="Save()" 
-            [noBack]="noBack" 
-            [noNew]="noNew"
-            [backRouterLink]="backRouterLink"
-          ></header-view>
-        }
-      </ion-card-header>
-      <ion-card-content class="p-0 h-full !overflow-y-auto overflow-x-hidden">
-        <div class="grid grid-cols-12 gap-2 w-full" *ngIf="frm" [formGroup]="frm">
-  
-          @for (field of lstTableFields; track $index) {
-            @if (field.index != 'id') {
-              @if (!field.hiddenView) {
-                @switch (field.type) {
-                  @case (InputType.Bool) {
-                    <input-bool      [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration" ></input-bool>
-                  }
-                  @case (InputType.Cep){
-                    <input-cep       [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted"></input-cep>
-                  }
-                  @case (InputType.Color){
-                    <input-color     [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted"></input-color>
-                  }
-                  @case (InputType.CpfCnpj) {
-                    <input-cpf       [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-cpf>
-                  }
-                  @case (InputType.Cpf) {
-                    <input-cpf       [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-cpf>
-                  }
-                  @case (InputType.Cnpj) {
-                    <input-cnpj      [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-cnpj>
-                  }
-                  @case (InputType.Date) {
-                    <input-date      [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-date>
-                  }
-                  @case (InputType.DateTime) {
-                    <input-date-time [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-date-time>
-                  }
-                  @case (InputType.Time) {
-                    <input-time      [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-time>
-                  }
-                  @case (InputType.Decimal) {
-                    <input-decimal   [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-decimal>
-                  }
-                  @case (InputType.Currency) {
-                    <input-currency  [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-currency>
-                  }
-                  @case (InputType.Number) {
-                    <input-number    [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-number>
-                  }
-                  @case (InputType.File) {
-                    <input-file      [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-file>
-                  }
-                  @case (InputType.Icon) {
-                    <input-icon      [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted"></input-icon>
-                  }
-                  @case (InputType.Select) {
-                    <input-select    [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-select>
-                  }
-                  @case (InputType.String) {
-                    <input-string    [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-string>
-                  }
-                  @case (InputType.TelefoneCelular) {
-                    <input-telefone-celular    [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-telefone-celular>
-                  }
-                  @case (InputType.Telefone) {
-                    <input-telefone  [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-telefone>
-                  }
-                  @case (InputType.Celular) {
-                    <input-celular   [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-celular>
-                  }
-                  @case (InputType.TextArea) {
-                    <input-textarea  [class]="field.class" [formControlName]="field.index" [label]="field.header" [loading]="loading" [disabled]="field.disabled" [submitted]="submitted" [configuration]="field.configuration"></input-textarea>
-                  }
-                }
-              }
-            }
-          }
-  
-          <div class="col-span-full rounded-2xl p-3 flex items-center justify-center" *ngIf="!service || service.lstTableFields.length == 0" style="background: var(--ion-color-danger);">
-            <ion-text class="text-2xl text-light">
-              <ion-icon class="align-sub text-3xl" name="alert-circle"></ion-icon> [ Invalid Configuration ]
-            </ion-text>
-          </div>
-        </div>
-      </ion-card-content>
-    </ion-card>
-  </div>
-</ion-content>