keevo-components 2.0.107 → 2.0.108

package/src/lib/components/kv-table-edit/kv-table-edit.component.ts

@@ -1,425 +0,0 @@
-import {
-  Component,
-  EventEmitter,
-  input,
-  Input,
-  OnChanges,
-  OnInit,
-  Output,
-  signal,
-  SimpleChanges,
-  TemplateRef} from '@angular/core';
-
-import {
-  DatePipe,
-  DecimalPipe
-} from '@angular/common';
-
-import {
-  MenuItem} from 'primeng/api';
-
-
-import {
-  ActionItem,
-  CpfCnpjPipe,
-  NotificationService,
-  TableConfigColumn,
-  TelefonePipe,
-  ValueOrFn,
-  getOrExecute,
-  mapToMenuItem
-} from '../../../public-api';
-
-import { TableEditConfigColumn } from '../../api/components/table/tableedit.config.column';
-import TableEditConfig from '../../api/components/table/tabledit.config';
-import { Subject, Subscription, takeUntil, timer } from 'rxjs';
-import { BasecomponentTable } from '../../api/base-components/base-component-table';
-
-
-@Component({
-  selector: 'kv-table-edit',
-  templateUrl: './kv-table-edit.component.html',
-  styleUrls: ['./kv-table-edit.component.scss']
-})
-export class KvTableEditComponent extends BasecomponentTable implements OnInit, OnChanges {
-  override config!: TableEditConfig;
-
-  enableSizes = input<boolean>(false);
-  editMode = input<'row' | 'cell'>('cell');
-  hideBtnEdit = input<boolean>(false);
-  enableDisplayMode = input<boolean>(false);
-
-  private itemsParaSalvamento: any[] = []
-  protected itemInitialState!: any;
-
-  isEditing: boolean = false;
-  isShowSizes: boolean = false;
-  clonedDataSource: { [s: string]: any } = {};
-  selectedProduct: any = {
-    rowData: {},
-    editing: false
-  };
-
-  menuItems: MenuItem[] = [];
-
-  itemsContextMenu!: MenuItem[];
-
-  selectedDisplayMode: 'details' | 'list' = 'details';
-
-  setDisplayMode(mode: 'list' | 'details') {
-  this.selectedDisplayMode = mode;
-
-  }
-
-
-  actionsDisplayMode: ActionItem[] = [
-    {
-      label: 'Lista',
-      icon: 'pi pi-list-check',
-      command: () => {
-        this.selectedDisplayMode = 'list';
-      }
-    },
-    {
-      label: 'Detalhes',
-      icon: 'pi pi-table',
-      command: () => {
-        this.selectedDisplayMode = 'details';
-      }
-    },
-  ];
-
-  get visibleColumns(): TableEditConfigColumn[] {    
-    return this.config.columns.filter(col => 
-      !col.displayMode || col.displayMode.includes(this.selectedDisplayMode)
-    );
-  }
-
-  /**  Emite evento de salvamento da linha */
-  @Output() onSave: EventEmitter<any> = new EventEmitter();
-  @Output() filterField: EventEmitter<any> = new EventEmitter();
-
-  constructor(
-    datePipe: DatePipe,
-    decimalPipe: DecimalPipe,
-    cpfCnpjPipe: CpfCnpjPipe,
-    telefonePipe: TelefonePipe,
-    notificationService: NotificationService
-    // capitalizePipe: CapitalizePipe,
-  ) {
-    super(datePipe, decimalPipe, cpfCnpjPipe, telefonePipe, notificationService);
-    this.isRowSelectable = this.isRowSelectable.bind(this);
-  }
-
-
-  getOrExecute<T>(action: ValueOrFn<T>, data: any): T {
-    return getOrExecute(action, data);
-  }
-
-  sizes = [
-    {
-      label: 'Pequeno', class: 'p-datatable-sm', size: 0.83, command: (x: any) => {
-        this.selectedSize = { label: 'Pequeno', class: 'p-datatable-sm', size: 0.83 }
-      }
-    },
-    {
-      label: 'Médio', class: 'p-datatable-md', size: 1, command: (x: any) => {
-        this.selectedSize = { label: 'Médio', class: 'p-datatable-md', size: 1 }
-      }
-    },
-    {
-      label: 'Grande', class: 'p-datatable-lg', size: 1.17, command: (x: any) => {
-        this.selectedSize = { label: 'Large', class: 'p-datatable-lg', size: 1.17 }
-
-      }
-    },
-  ];
-
-
-  //FIXME: Mover para um local adequado
-  timerSubscription!: Subscription; // Assinatura do temporizador
-  onSaveTimer$: Subject<void> = new Subject<void>(); // Sujeito para controlar o temporizador
-  private onDestroy$: Subject<void> = new Subject<void>();
-
-  override ngOnInit() {
-    super.ngOnInit();
-
-    this.onSaveTimer$.pipe(
-      takeUntil(this.onDestroy$)
-    ).subscribe(() => {
-      // Quando o temporizador terminar, emita o evento onSave com os dados a serem salvos
-      this.onRowEditSave();
-    });
-
-
-    this.tamanhoTela = window.innerWidth;
-
-    this.itemsContextMenu = [
-      {
-        label: 'Editar linha', icon: 'pi pi-fw pi-pencil', command: () => {
-          const element = document.getElementById('rowEdit' + this.selectedProduct.rowData[this.config.dataKey]);
-          if (element && !this.config.disableEditRowFunction?.(this.selectedProduct.rowData)) {
-            element.click()
-          } else {
-            this.notificationService.toastWarn("A edição dessa linha esta desabilitada")
-          }
-          this.onRowEditInit(this.selectedProduct)
-
-        }
-      },
-      {
-        label: 'Cancelar edição', icon: 'pi pi-fw pi-times', command: (data: any) => {
-          const element = document.getElementById('rowCancel' + this.selectedProduct.rowData[this.config.dataKey]);
-          if (element) {
-            element.click();
-          } else {
-            this.notificationService.toastWarn("A edição dessa linha esta desabilitada")
-          }
-        }
-      },
-      {
-        label: 'Salvar edição', icon: 'pi pi-fw pi-save', command: (data: any) => {
-          const element = document.getElementById('rowSave' + this.selectedProduct.rowData[this.config.dataKey]);
-          if (element) {
-            element.click(); // Dispara um evento de clique no elemento com ID 'teste'
-          } else {
-            this.notificationService.toastWarn("A edição dessa linha esta desabilitada")
-          }
-        }
-      },
-      {
-        label: 'Entrar em modo de edição', icon: 'pi pi-fw pi-pencil', command: () => {
-          this.isEditing = true;
-        }
-      },
-      {
-        label: 'Sair do modo de edição', icon: 'pi pi-fw pi-pencil', command: () => {
-          this.isEditing = false;
-          if (this.itemsParaSalvamento.length > 0)
-            this.onRowEditSave();
-        }
-      },
-    ];
-
-    // Subscreve-se ao sujeito onSaveTimer$
-
-  }
-
-  override adjustTableSize(){
-  }
-
-  ngOnDestroy(): void {
-    // Completa o sujeito onDestroy$
-    this.onDestroy$.next();
-    this.onDestroy$.complete();
-    // Se houver um temporizador em execução, pare-o
-    if (this.timerSubscription) {
-      this.timerSubscription.unsubscribe();
-      // Após parar o temporizador, chame onSave diretamente para salvar os dados
-      this.onRowEditSave();
-    }
-  }
-
-  ngDoCheck(): void {
-    this.itemsContextMenu[0].visible = this.editMode() == 'row' && !this.selectedProduct.editing && this.isEditableTable() !== false;
-    this.itemsContextMenu[1].visible = this.editMode() == 'row' && this.selectedProduct.editing && this.isEditableTable() !== false;
-    this.itemsContextMenu[2].visible = this.editMode() == 'row' && this.selectedProduct.editing && this.isEditableTable() !== false;
-
-    this.itemsContextMenu[3].visible = this.editMode() == 'cell' && !this.isEditing;
-    this.itemsContextMenu[4].visible = this.editMode() == 'cell' && this.isEditing;
-
-
-  }
-
-
-  dbClickEdit() {
-
-    const element = document.getElementById('rowEdit' + this.selectedItem[this.config.dataKey]);
-    if (element) {
-      element.click();
-      
-    } else {
-      if (this.editMode() == 'row')
-        this.notificationService.toastWarn("A edição dessa linha esta desabilitada")
-    }
-  }
-
-  isRowSelectable(event: any) {
-    return !this.isDisabledCheckbox(event.data);
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    //Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
-    //Add '${implements OnChanges}' to the class.
-    if (changes['setConfig'] && this.config) {
-
-      this.config.columns.forEach((e: TableEditConfigColumn) => {
-        if (e.fieldControlType == 'dropdown') {
-          this.listarDrop(e.fieldDropDownControl?.fieldControlDropdownService, e)
-
-        }
-      })
-    }
-  }
-  criarMenusModal(data: any) {
-    if (this.config.actions && data) {
-      for (const action of this.config.actions) {
-        const menuInsert = mapToMenuItem(action, data);
-
-        let item = this.menuItems.filter(
-          x => x.command == menuInsert.command
-        );
-
-        if (item.length == 0) this.menuItems.push(menuInsert);
-        else {
-          if (menuInsert.label != item[0].label) {
-            let index = this.menuItems.indexOf(item[0]);
-            this.menuItems.splice(index, 1);
-          }
-
-          if (menuInsert.visible != item[0].visible) {
-            let index = this.menuItems.indexOf(item[0]);
-            this.menuItems.splice(index, 1);
-          }
-
-          if (menuInsert.disabled != item[0].disabled) {
-            let index = this.menuItems.indexOf(item[0]);
-            this.menuItems.splice(index, 1);
-          }
-        }
-      }
-    }
-  }
-
-  onRowEditInit(rowData: any) {
-    this.clonedDataSource[rowData.id as string] = { ...rowData };
-  }
-
-  onEditInit(event1: any) {
-    if (this.isEditing) this.itemInitialState = { ...event1.data }
-  }
-
-  onEditComplete(event: any) {
-    if (this.isEditing) {
-      if (this.itemsParaSalvamento.length === 0 || 
-        this.itemsParaSalvamento[this.itemsParaSalvamento.length - 1].index === event.index) {
-        
-        if (event.data && this.itemInitialState &&
-          event.data.hasOwnProperty(event.field) && 
-          this.itemInitialState.hasOwnProperty(event.field) &&
-          event.data[event.field] != this.itemInitialState[event.field]) {
-          this.adicionarCelulaParaSalvar(event);
-        }
-      } else {
-        this.onRowEditSave();
-        this.adicionarCelulaParaSalvar(event);
-      }
-    }
-  }
-
-  adicionarCelulaParaSalvar(item: any) {
-    // Adiciona os dados editados ao array para salvamento
-    this.itemsParaSalvamento.push(item);
-
-    // Se houver um temporizador em execução, limpe-o e reinicie
-    if (this.timerSubscription) {
-      this.timerSubscription.unsubscribe();
-    }
-
-    // Inicia o temporizador para emitir onSave após 5 segundos
-    this.timerSubscription = timer(5000).subscribe(() => {
-      this.onSaveTimer$.next(); // Emita onSave após 5 segundos
-    });
-  }
-
-
-  onRowEditSave() {
-    if (this.itemsParaSalvamento.length == 0 || !this.itemsParaSalvamento[0].data)
-      return;
-
-    const objetoRefletido: any = { ...this.itemsParaSalvamento[0].data };
-    // Reflete as alterações em um objeto
-    this.itemsParaSalvamento.forEach(item => {
-      if (!item.data) return; // Verifica se o item tem a propriedade 'data'
-      const chave = item.field
-      const valor = item.data[chave];
-      objetoRefletido[chave] = valor;
-    });
-    this.onSave.emit(objetoRefletido)
-    this.itemsParaSalvamento = [];
-  }
-
-
-  onRowEditCancel(product: any, index: number) {
-    this.dataSource[index] = this.clonedDataSource[product.id as string];
-    delete this.clonedDataSource[product.id as string];
-  }
-
-  listarDrop(service: any, col: any, indtodos?: boolean) {
-    const column = this.config.columns?.indexOf(col);
-    return this.config.columns[column].fieldDropDownControl?.fieldControlDropdownSource
-  }
-
-  retornaDescricaoDrop(rowData: any[], col: TableEditConfigColumn) {
-
-    const data = col.fieldDropDownControl?.fieldControlDropdownSource
-    const idobjeto = col.fieldDropDownControl?.idobjeto
-    const descricaoobjeto = col.fieldDropDownControl?.descricaoobjeto
-    // @ts-ignore
-    const valorAtual = rowData[col.field]
-
-    if (data && idobjeto && descricaoobjeto)
-      return data?.find((item: any) => item[idobjeto] == valorAtual)[descricaoobjeto]
-    else return 'Carregando'
-  }
-
-
-
-  isDisableEditRowFunction(rowData: any): boolean {
-    return this.config.disableEditRowFunction ? this.config.disableEditRowFunction(rowData) : false;
-  }
-
-  isDisableEditRowCellFunction(rowData: any, col: any): boolean {
-    return col.disableEditRowCellFunction ? col.disableEditRowCellFunction(rowData) : false;
-  }
-
-  isEditableTable(): boolean | null {
-    if (!this.config.columns)
-      return null;
-
-    return this.config.columns.some((column: any) => 'fieldControlType' in column);
-  }  
-
-
-  transformValueDrop(value: any, col: TableConfigColumn) {
-    if (value != null) {
-      if (!col.pipe) {
-        return value;
-      }
-
-      switch (col.pipe) {
-        case 'date':
-          return this.datePipe.transform(value, 'dd/MM/yyyy');
-        case 'datetime':
-          return this.datePipe.transform(value, 'dd/MM/yyyy hh:mm');
-        case 'decimal':
-          return this.decimalPipe.transform(value, '1.2-2', 'pt-BR');
-        case 'cpfcnpj':
-          return this.cpfCnpjPipe.transform(value);
-        case 'telefone':
-          return this.telefonePipe.transform(value);
-        case 'capitalize':
-             return this.transformCapitalize(value);
-        case 'money':
-          return this.formatarValor(value);
-        case 'percentage':
-          return `${ value } %`;
-
-        default:
-          break;
-      }
-    }
-  }
-
-}
-

package/src/lib/components/kv-table-edit/kv-table-edit.module.ts

@@ -1,31 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { NgModule } from '@angular/core';
-
-import {
-  KvButtonsModule,
-  KvInputsModule,
-  PipesModule,
-  PrimeNgModule
-} from '../../../public-api';
-
-import { KvTableEditComponent } from './kv-table-edit.component';
-import { SelectButtonModule } from 'primeng/selectbutton';
-
-import { KvButtonModule } from '../kv-button/kv-button.module';
-
-@NgModule({
-  declarations: [KvTableEditComponent],
-  imports: [
-    CommonModule,
-    PrimeNgModule,
-    FormsModule,
-    KvInputsModule,
-    KvButtonsModule,
-    PipesModule,
-    SelectButtonModule,
-    KvButtonModule
-  ],
-  exports: [KvTableEditComponent]
-})
-export class KvTableEditModule { }