keevo-components 1.8.125 → 1.8.127

package/src/lib/api/base-components/base-component-multi-select.ts

@@ -0,0 +1,136 @@
+import {
+  Component,
+  EventEmitter,
+  Input,
+  OnInit,
+  Output,
+} from '@angular/core';
+
+import { FormControl } from '@angular/forms';
+import { Observable, of } from 'rxjs';
+import { BaseComponentInput } from './base-component-input';
+import { ComponentService } from '../services/component.service';
+import { ObjectService } from '../services/object.service';
+import { filtroCombo } from '../components/dropdown/filtro.combo';
+
+@Component({
+  template: '',
+})
+export abstract class BaseComponentMultiSelect extends BaseComponentInput<any> implements OnInit {
+
+  @Input() options: any = [];
+  @Input() optionLabel!: string;
+  @Input() optionValue!: string;
+  @Input() filter: boolean = false;
+  @Input() showClear: boolean = false;
+
+  @Input() lazy: boolean = false;
+  @Input() filteredOptions: any = [];
+
+  @Output() onSelectionChange: EventEmitter<any> = new EventEmitter();
+  @Output() onPanelHide: EventEmitter<any> = new EventEmitter();
+  @Output() onSelectionValue: EventEmitter<any> = new EventEmitter();
+  @Output() onClick: EventEmitter<any> = new EventEmitter();
+
+  loadedCombo: boolean = false;
+
+  constructor(
+    componentService: ComponentService,
+  ) {
+    super(componentService);
+    this.registerOnTouched(() => { });
+  }
+
+  override ngOnInit(): void {
+    super.ngOnInit();
+    this.setPlaceHolder('Selecione um valor');
+
+    if (!this.lazy) this.carregarCombo();
+  }
+
+  public carregarCombo(filtro?: filtroCombo): void {
+    if (filtro) {
+      this.carregarComboObs(this.listarCombo(filtro));
+    }
+    else {
+      this.carregarComboObs(this.listar());
+    }
+  }
+
+  private carregarComboObs(obs: Observable<any>) {
+    if (obs) {
+      obs
+        .subscribe({
+          next: (data: any) => {
+            this.options = data;
+            this.filteredOptions = data;
+            this.loadedCombo = true
+          },
+          error: (error: any) => {
+            console.log(error);
+          },
+        });
+    }
+  }
+
+  public filterOptions(field: string, value: any): void {
+    if (this.options) {
+      let lista = ObjectService.filterObject(this.options, field, value);
+      if (lista?.length > 0) {
+        of(lista).subscribe((opts: any[]) => {
+          this.filteredOptions = opts;
+        });
+      } else this.filteredOptions = [];
+    }
+  }
+
+  protected onInputChange(event: any) {
+    this.onSelectionValue.emit(event);
+
+    if (this.formControl) {
+      const controlName = this.getName(this.formControl as FormControl);
+      if (controlName) {
+        let currentItem = ObjectService.findObject(
+          this.options,
+          controlName,
+          event.value
+        );
+        this.onSelectionChange.emit(currentItem);
+      }
+    }
+  }
+
+  onInputClick(event: any) {
+    this.onClick.emit(event);
+  }
+
+  onInputFilter(event: any) {
+    if (event) {
+      if (event.filter) {
+        if (event.filter.length > 2) {
+          this.carregarCombo({ termoPesquisa: event.filter } as filtroCombo);
+        }
+      }
+    }
+  }
+
+  protected listar(): any { }
+  protected listarCombo(value: any): any { }
+
+  panelHide(event: any) {
+    this.onPanelHide.emit(event);
+  }
+
+  public override get baseInputClass(): string {
+    return `p-multiselect-sm ${this.hasError ? 'ng-invalid ng-dirty' : ''}`;
+  }
+
+  selectionChange(event: any) {
+    this.onSelectionChange.emit(event);
+  }
+
+  public requestCompleted() {
+    return this.loadedCombo;
+  }
+
+}

package/src/lib/api/base-components/base-component.ts

@@ -0,0 +1,47 @@
+import { Component, Input } from "@angular/core";
+import { ControlValueAccessor } from "@angular/forms";
+import { Subject } from "rxjs";
+
+@Component({
+  template: ''
+})
+export abstract class BaseComponent<T> implements ControlValueAccessor {
+
+  protected stateChanges: Subject<void> = new Subject();
+  protected onChange!: (value: T) => void;
+  protected onTouched!: () => void;
+  protected _value!: T;
+
+  @Input('required') isRequired: boolean = false;
+
+  public set value(value: T) {
+    this._value = value;
+    if (this.onChange) this.onChange(value);
+    this.stateChanges.next();
+  }
+
+  public get value(): T {
+    return this._value;
+  }
+
+  @Input() componentId!: string;
+  @Input() label!: string;
+  @Input() disabled: boolean = false;
+  @Input() maxLength!: number;
+
+  registerOnChange(fn: any): void {
+    this.onChange = fn;
+  }
+
+  registerOnTouched(fn: any): void {
+    this.onTouched = fn;
+  }
+
+  setDisabledState?(isDisabled: boolean): void {
+    this.disabled = isDisabled;
+  }
+
+  writeValue(value: T): void {
+    this.value = value;
+  }
+}

package/src/lib/api/components/chart/chart.config.ts

@@ -0,0 +1,12 @@
+export interface ChartConfig {
+  labels: string[];
+  datasets: ChartDatasetConfig[];
+}
+
+export interface ChartDatasetConfig {
+  label?: string;
+  backgroundColor: string[];
+  hoverBackgroundColor: string[];
+  borderColor?: string[];
+  data: number[];
+}

package/src/lib/api/components/chart/chart.model.ts

@@ -0,0 +1,9 @@
+export interface chartModel {
+  labels: string;
+  numDatasets: number;
+  labelDataset?: string;
+  datasets: number;
+  backgroundColor: string;
+  hoverBackgroundColor?: string;
+  borderColor?: string;
+}

package/src/lib/api/components/chart/orchart.config.ts

@@ -0,0 +1,41 @@
+export default interface OrgChartConfig{
+
+
+  /**
+   * @type {string}
+   * Esse item espera uma string html template
+   * (no formato angular com interpolação de variaveis via {{data.'PROPIEDADE DESEJADA'}})
+   * Todos os dados expostos na propiedade data de
+   * cada item estão acessiveis pelo objeto data;
+   * Para realizar interpolação, referencie data entre {{}} e a chave desejada;
+   ** Exemplo: ` <h1> Nome: {{data.nome}} </h1>  `
+   *
+   */
+  templateItem: string;
+
+  /**
+   * @type {number}
+   * Esse item espera receber a largura media do card, para calculo do icone de collapse
+   */
+  cardWidht: number;
+
+  /**
+   * @type {number}
+   * Esse item espera receber a altura media do card, para calculo do icone de collapse
+   */
+  cardHeight: number;
+
+  /**
+   * @type {string}
+   * Esse item espera receber a cor das connections
+   * * Default { #d6d6d6 }
+   */
+  connectionColor?: string;
+
+    /**
+   * @type {number}
+   * Esse item espera receber a cor das connections
+   * * Default { 2 }
+   */
+    conectionWidth?: number;
+}

package/src/lib/api/components/chart/orchart.item.ts

@@ -0,0 +1,33 @@
+export default interface OrgChartItem{
+
+  /**
+   * @type {number}
+   * Esse item espera receber o identificador do card
+   */
+  id: number;
+
+  /**
+   * @type {number | null}
+   * Esse item espera receber o identificador do card pai desse card
+   * * Aceita null no caso de ser o nó root
+   *
+   * @warning Caso tenha mais de um objeto com {{ parentId: null }} havera um erro de multiplos roots
+   */
+  parentId: number | null;
+
+
+  /**
+   * @type {object}
+   * Esse item espera receber os dados do card
+   * @warning Mantenha a consistencia de dados, caso tente acessar um dado que não exista em outro objeto havera um erro
+   */
+  data: object;
+
+
+  /**
+   * @type {object | undefined}
+   * Esse item espera receber um template personalizado para este nó em especifico
+   */
+  template?: string;
+  // [key: string]: any;
+}

package/src/lib/api/components/dropdown/filtro.combo.ts

@@ -0,0 +1,4 @@
+export interface filtroCombo {
+  id: string;
+  termoPesquisa: string;
+}

package/src/lib/api/components/table/action-item.ts

@@ -0,0 +1,11 @@
+export interface ActionItem {
+  label: string;
+  icon?: string;
+  color?: string;
+  colorHover?: string;
+  textColor?: string;
+  disabled?: boolean;
+  visible?: boolean;
+  closeAfterClick?: boolean;
+  command?: (event?: any) => void;
+}

package/src/lib/api/components/table/kv-menuitem.ts

@@ -0,0 +1,198 @@
+import { MenuItem, MenuItemCommandEvent } from "primeng/api/menuitem";
+import { QueryParamsHandling } from "@angular/router";
+import { TooltipOptions } from "primeng/api";
+
+export interface KvMenuItem {
+  /**
+   * Texto do item.
+   */
+  label?: ValueOrFn<string | undefined>;
+  /**
+   * Ícone do item.
+   */
+  icon?: ValueOrFn<string | undefined>;
+  /**
+   * Callback a ser executada quando o item é clicado.
+   */
+  command?: (event: MenuItemCommandEvent) => void;
+  /**
+   * Link externo para navegar quando o item é clicado.
+   */
+  url?: ValueOrFn<string | undefined>;
+  /**
+   * Array de filhos do item.
+   */
+  items?: ValueOrFn<KvMenuItem[] | undefined>;
+  /**
+   * Visibilidade do submenu.
+   */
+  expanded?: ValueOrFn<boolean | undefined>;
+  /**
+   * Quando verdadeiro, desabilita o item.
+   */
+  disabled?: ValueOrFn<boolean | undefined>;
+  /**
+   * Define se o elemento da dom do item é ou não criado.
+   */
+  visible?: ValueOrFn<boolean | undefined>;
+  /**
+   * Specifies where to open the linked document.
+   */
+  target?: ValueOrFn<string | undefined>;
+  /**
+   * Whether to escape the label or not. Set to false to display html content.
+   */
+  escape?: boolean;
+  /**
+   * Configuration for active router link.
+   */
+  routerLinkActiveOptions?: ValueOrFn<any | undefined>;
+  /**
+   * Defines the item as a separator.
+   */
+  separator?: boolean;
+  /**
+   * Value of the badge.
+   */
+  badge?: ValueOrFn<string | undefined>;
+  /**
+   * Tooltip of the item.
+   */
+  tooltip?: ValueOrFn<string | undefined>;
+  /**
+   * Position of the tooltip item.
+   */
+  tooltipPosition?: ValueOrFn<string | undefined>;
+  /**
+   * Style class of the badge.
+   */
+  badgeStyleClass?: ValueOrFn<string | undefined>;
+  /**
+   * Inline style of the menuitem.
+   */
+  style?: ValueOrFn<{
+    [klass: string]: any;
+  } | null | undefined>;
+  /**
+   * Style class of the menuitem.
+   */
+  styleClass?: ValueOrFn<string | undefined>;
+  /**
+   * Tooltip text of the item.
+   */
+  title?: ValueOrFn<string | undefined>;
+  /**
+   * Identifier of the element.
+   */
+  id?: ValueOrFn<string | undefined>;
+  /**
+   * Value of HTML data-* attribute.
+   */
+  automationId?: ValueOrFn<any | undefined>;
+  /**
+   * Specifies tab order of the item.
+   */
+  tabindex?: ValueOrFn<string | undefined>;
+  /**
+   * RouterLink definition for internal navigation.
+   */
+  routerLink?: ValueOrFn<any | undefined>;
+  /**
+   * Query parameters for internal navigation via routerLink.
+   */
+  queryParams?: ValueOrFn<{
+    [k: string]: any;
+  } | undefined>;
+  /**
+   * Sets the hash fragment for the URL.
+   */
+  fragment?: ValueOrFn<string | undefined>;
+  /**
+   *  How to handle query parameters in the router link for the next navigation. One of:
+      merge : Merge new with current parameters.
+      preserve : Preserve current parameters.k.
+   */
+  queryParamsHandling?: ValueOrFn<QueryParamsHandling | undefined>;
+  /**
+   * When true, preserves the URL fragment for the next navigation.
+   */
+  preserveFragment?: ValueOrFn<boolean | undefined>;
+  /**
+   * When true, navigates without pushing a new state into history.
+   */
+  skipLocationChange?: ValueOrFn<boolean | undefined>;
+  /**
+   * When true, navigates while replacing the current state in history.
+   */
+  replaceUrl?: ValueOrFn<boolean | undefined>;
+  /**
+   * Inline style of the item's icon.
+   */
+  iconStyle?: ValueOrFn<{
+    [klass: string]: any;
+  } | null | undefined>;
+  /**
+   * Class of the item's icon.
+   */
+  iconClass?: ValueOrFn<string | undefined>;
+  /**
+   * Developer-defined state that can be passed to any navigation.
+   * @see {MenuItemState}
+   */
+  state?: ValueOrFn<{
+    [k: string]: any;
+  } | undefined>;
+  /**
+   * Options of the item's tooltip.
+   * @see {TooltipOptions}
+   */
+  tooltipOptions?: ValueOrFn<TooltipOptions | undefined>;
+}
+
+export type ValueOrFn<T> = T | ((data: any) => T);
+
+export function getOrExecute<T>(vof: ValueOrFn<T>, data: any): T {
+  if (typeof vof === "function") {
+    return (vof as (data: any) => T)(data);
+  } else {
+    return vof;
+  }
+}
+
+export function mapToMenuItem(kvMenuItem: KvMenuItem, data: any): MenuItem {
+  return {
+    label: getOrExecute(kvMenuItem.label, data),
+    icon: getOrExecute(kvMenuItem.icon, data),
+    command: kvMenuItem.command,
+    url: getOrExecute(kvMenuItem.url, data),
+    items: getOrExecute(kvMenuItem.items, data)?.map(x => mapToMenuItem(x, data)),
+    expanded: getOrExecute(kvMenuItem.expanded, data),
+    disabled: getOrExecute(kvMenuItem.disabled, data),
+    visible: getOrExecute(kvMenuItem.visible, data),
+    target: getOrExecute(kvMenuItem.target, data),
+    escape: kvMenuItem.escape,
+    routerLinkActiveOptions: getOrExecute(kvMenuItem.routerLinkActiveOptions, data),
+    separator: kvMenuItem.separator,
+    badge: getOrExecute(kvMenuItem.badge, data),
+    tooltip: getOrExecute(kvMenuItem.tooltip, data),
+    tooltipPosition: getOrExecute(kvMenuItem.tooltipPosition, data),
+    badgeStyleClass: getOrExecute(kvMenuItem.badgeStyleClass, data),
+    style: getOrExecute(kvMenuItem.style, data),
+    styleClass: getOrExecute(kvMenuItem.styleClass, data),
+    title: getOrExecute(kvMenuItem.title, data),
+    id: getOrExecute(kvMenuItem.id, data),
+    automationId: getOrExecute(kvMenuItem.automationId, data),
+    tabindex: getOrExecute(kvMenuItem.tabindex, data),
+    routerLink: getOrExecute(kvMenuItem.routerLink, data),
+    queryParams: getOrExecute(kvMenuItem.queryParams, data),
+    fragment: getOrExecute(kvMenuItem.fragment, data),
+    queryParamsHandling: getOrExecute(kvMenuItem.queryParamsHandling, data),
+    preserveFragment: getOrExecute(kvMenuItem.preserveFragment, data),
+    skipLocationChange: getOrExecute(kvMenuItem.skipLocationChange, data),
+    replaceUrl: getOrExecute(kvMenuItem.replaceUrl, data),
+    iconStyle: getOrExecute(kvMenuItem.iconStyle, data),
+    iconClass: getOrExecute(kvMenuItem.iconClass, data),
+    state: getOrExecute(kvMenuItem.state, data),
+    tooltipOptions: getOrExecute(kvMenuItem.tooltipOptions, data),
+  };
+}

package/src/lib/api/components/table/table-dropdown-control.ts

@@ -0,0 +1,6 @@
+export default interface FieldDropDownControl {
+  fieldControlDropdownService?: any;
+  fieldControlDropdownSource?: any;
+  idobjeto: string;
+  descricaoobjeto: string;
+}

package/src/lib/api/components/table/table.config.column.ts

@@ -0,0 +1,27 @@
+import FieldDropDownControl from "./table-dropdown-control";
+
+export interface TableConfigColumn {
+  position?: number;
+  field: string;
+  header: string;
+  headerTooltip?: string;
+  fieldType?: string;
+  onlyReadField?: boolean;
+  width?: string;
+  pipe?: 'date' | 'dateMonthYear' | 'decimal' | 'cpfcnpj' | 'telefone' | 'codigofipe' | 'money' | 'percentage' | 'capitalize';
+  sortable: boolean;
+  grouped?: boolean;
+  centralize?: boolean;
+  expiredDate?: boolean;
+  icon?: string;
+  iconField?: boolean;
+  indIconMaterial?: boolean;
+  checked?: boolean;
+  hideColumn?: boolean;
+  fixedColumn?: boolean;
+  template?: any;
+  align?: string;
+  subtitle?: string;
+  boolean?: boolean;
+  templateOnly?: 'pai' | 'filho'
+}

package/src/lib/api/components/table/table.config.ts

@@ -0,0 +1,34 @@
+import { TableConfigColumn } from './table.config.column';
+import { KvMenuItem, ValueOrFn } from './kv-menuitem';
+import Severity from '../../types/severity';
+
+export interface TableConfig {
+  actions?: KvMenuItem[];
+  actionsLote?: ActionsLoteItem[];
+  columns: TableConfigColumn[];
+  dataKey?: string;
+  rows?: any;
+  title?: string;
+  subtitle?: string;
+  lazy: boolean;
+  fieldGroup?: string;
+  enableCation?: boolean;
+  enableFilter?: boolean;
+  enableSelect?: boolean;
+  enableToggleNodes?: boolean;
+  // visibleControlCheckboxFunction?: (rowData: any) => boolean; // A função que controla a edição
+  disableControlCheckboxFunction?: (rowData: any, rowNode?: any) => boolean; // A função que controla a edição
+}
+
+export interface ActionsLoteItem {
+  /**
+   * Ignorado por enquanto
+   */
+  severity?: Severity;
+  icon: string;
+  showAcoesLote?: boolean;
+  tooltip?: ValueOrFn<string | undefined>;
+  disabled?: ValueOrFn<boolean | undefined>;
+  visible?: ValueOrFn<boolean | undefined>;
+  command?: () => void;
+}

package/src/lib/api/components/table/table.paginate.ts

@@ -0,0 +1,6 @@
+export class TablePaginate {
+  paginaInicial: number = 1;
+  tamanhoPagina: number = 10;
+  termoPesquisa: string = '';
+  ordenacao: string = '';
+}

package/src/lib/api/components/table/tabledit.config.ts

@@ -0,0 +1,10 @@
+import { TableConfig } from "./table.config";
+import { TableConfigColumn } from "./table.config.column";
+import { TableEditConfigColumn } from "./tableedit.config.column";
+
+export default interface TableEditConfig extends TableConfig {
+  columns: TableEditConfigColumn[];
+  dataKey: string;
+  reorderableColumns?: boolean;
+  disableEditRowFunction?: (rowData: any, rowNode?: any) => boolean;
+}

package/src/lib/api/components/table/tableedit.config.column.ts

@@ -0,0 +1,12 @@
+import FieldDropDownControl from "./table-dropdown-control";
+import { TableConfigColumn } from "./table.config.column";
+
+export interface TableEditConfigColumn extends TableConfigColumn {
+  required?: boolean;
+  validator?: any;
+  mask?: string;
+  fieldControlType?: 'text' | 'switch' | 'dropdown' | 'multiselect' | 'number' | 'calendar' | 'mask';
+  fieldDropDownControl?: FieldDropDownControl;
+  disableEditRowCellFunction?: (rowData: any, rowNode?: any) => boolean;
+
+}

package/src/lib/api/components/tree-table/tree-table.config.ts

@@ -0,0 +1,30 @@
+import { TableConfigColumn } from '../table/table.config.column';
+import { KvMenuItem, ValueOrFn } from '../table/kv-menuitem';
+import Severity from '../../types/severity';
+import { ActionsLoteItem } from '../table/table.config';
+
+export interface TreeTableConfig {
+  actions?: KvMenuItem[];
+  actionsLote?: ActionsLoteItem[];
+  actionsPai?: ActionsPaiItem[];
+  columns: TableConfigColumn[];
+  dataKey?: string;
+  rows?: any;
+  title?: string;
+  subtitle?: string;
+  lazy: boolean;
+  fieldGroup?: string;
+  enableCation?: boolean;
+  enableFilter?: boolean;
+  enableSelect?: boolean;
+  enableToggleNodes?: boolean;
+  // visibleControlCheckboxFunction?: (rowData: any) => boolean; // A função que controla a edição
+  disableControlCheckboxFunction?: (rowData: any, rowNode?: any) => boolean; // A função que controla a edição
+}
+
+interface ActionsPaiItem {
+  severity?: Severity;
+  visible?: ValueOrFn<boolean | undefined>;
+  command: (event: MouseEvent) => void;
+  icon: string;
+};

package/src/lib/api/directives/directives.module.ts

@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+
+import { DragDirective } from './drag/drag.directive';
+import { TemplateDirective } from './template/template.directive';
+
+@NgModule({
+  declarations: [
+    DragDirective,
+    TemplateDirective
+  ],
+  exports:[
+    DragDirective,
+    TemplateDirective
+  ]
+})
+export class DirectiveModule { }

package/src/lib/api/directives/drag/drag.directive.ts

@@ -0,0 +1,40 @@
+import {
+    Directive,
+    Output,
+    EventEmitter,
+    HostBinding,
+    HostListener
+  } from '@angular/core';
+
+  @Directive({
+    selector: '[appDrag]'
+  })
+  export class DragDirective {
+    @HostBinding('class.fileover') fileOver!: boolean;
+    @Output() fileDropped = new EventEmitter<any>();
+
+    // Dragover listener
+    @HostListener('dragover', ['$event']) onDragOver(evt: any) {
+      evt.preventDefault();
+      evt.stopPropagation();
+      this.fileOver = true;
+    }
+
+    // Dragleave listener
+    @HostListener('dragleave', ['$event']) public onDragLeave(evt: any) {
+      evt.preventDefault();
+      evt.stopPropagation();
+      this.fileOver = false;
+    }
+
+    // Drop listener
+    @HostListener('drop', ['$event']) public ondrop(evt: any) {
+      evt.preventDefault();
+      evt.stopPropagation();
+      this.fileOver = false;
+      let files = evt.dataTransfer.files;
+      if (files.length > 0) {
+        this.fileDropped.emit(files);
+      }
+    }
+  }