appproject-components 1.0.47 → 1.0.48

package/src/lib/input-pesquisa/input-pesquisa.component.ts

@@ -1,558 +0,0 @@
-import { HttpClient } from '@angular/common/http';
-import { Component, EventEmitter, Inject, Input, OnInit, Predicate, ViewChild } from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { IonSelect, ModalController } from '@ionic/angular';
-import { Subject, Subscription, of } from 'rxjs';
-import { BaseInputComponent } from '../baseInputComponent';
-import { debounceTime, switchMap } from 'rxjs/operators'
-import { ModelTreeviewComponent } from '../model-treeview/model-treeview.component';
-import { LibConfig } from '../lib-config';
-//import { LibConfig, LibConfigService } from '../appproject-components.module';
-
-@Component({
-  selector: 'kb-input-pesquisa',
-  templateUrl: './input-pesquisa.component.html',
-  styleUrls: ['./input-pesquisa.component.scss', './../baseComponent.scss'],
-  providers: [{
-    provide: NG_VALUE_ACCESSOR,
-    useExisting: InputPesquisaComponent,
-    multi: true
-  }]
-})
-export class InputPesquisaComponent extends BaseInputComponent implements OnInit, ControlValueAccessor {
-
-  podePesquisar: boolean = true;
-  @Input() textoPesquisa: string = '';
-  selectElementVisivel: boolean = false;
-  listaPesquisa: any[] = [];
-  selectedItem: any;
-  @Input() override max: string = '30';
-  private pesquisaSubject: Subject<string> = new Subject();
-
-  @Input() filterFunction: Predicate<any> | null = null;
-  @Input() selectId: string = 'selectElement';
-  @Input() campoId: string = 'Id';
-  @Input() campoPaiId: string = 'PaiId';
-  @Input() campoDisplay: string = 'Descricao';
-  @Input() tipo: string = '';
-  //@ViewChild('selectElement', { read: ElementRef, static: true }) selectElement;
-  @ViewChild('selectElement', { static: false }) selectElement: IonSelect | null = null;
-
-  @Input() pesquisaChange = new EventEmitter();
-  @Input() pesquisaAction?: Function;
-  @Input() limpar?: Function;
-  //parametros para chamada API
-  //endpoint para pesquisa por digitação
-  @Input() url: string = '';
-  @Input() urlItem: string = '';
-  //endpoint para montar a arvore, se estiver vazia será usado o campo 'url'
-  @Input() urlTree: string = '';
-  @Input() empresa: number = 0;
-  @Input() loadInit: boolean = false;
-  @Input() treeTitulo: string;
-
-  //planoContas: number;
-
-  //control value acessor
-  public data: number | any;
-  private onChange: Function = (data: number) => { };
-  private onTouch: Function = () => { };
-  private disabled: boolean = false;
-  public console = console;
-
-  modelChanged: Subject<any> = new Subject<any>();
-  modelChangeSubscription?: Subscription;
-
-  writeValue(value: number | any): void {
-    //console.log('write value', value);
-    this.onChange(value);
-    this.data = value;
-    if (value == null || value == 0) {
-      this.writePesquisa('');
-      this.selectedItem = null;
-    } else {
-      if (this.loadInit == true) {
-        this.loadInit = false;
-        this.modelChanged.next(value);
-        //this.carregaItemIdParaLista(value);
-      } else {
-        //console.log(this.selectedItem);
-        if (!this.selectedItem || (this.selectedItem && this.selectedItem[this.campoId] != value)) {
-          console.log('Id diferente');
-          this.modelChanged.next(value);
-          //this.carregaItemIdParaLista(value);
-        }
-      }
-    }
-
-  }
-  registerOnChange(fn: any): void {
-    this.onChange = fn;
-  }
-  registerOnTouched(fn: any): void {
-    this.onTouch = fn;
-  }
-  setDisabledState?(isDisabled: boolean): void {
-    this.disabled = this.disabled;
-  }
-
-  BASE_API = this.config.apiUrl;
-
-  constructor(@Inject('LibConfigService') private config: LibConfig,
-    private httpClient: HttpClient,
-    private modalCtrl: ModalController) {
-    super();
-
-    this.modelChangeSubscription = this.modelChanged
-      .pipe(debounceTime(500)
-      )
-      .subscribe(data => {
-        this.carregaItemIdParaLista(data);
-      });
-  }
-
-  onBlur(event: any) {
-    console.log('blur', event);
-    //console.log(event.detail.relatedTarget);
-    if (event.detail.relatedTarget == null || event.detail.relatedTarget.id.indexOf(this.selectId + 'IonItem') == -1) {
-      //console.log("true", event.detail.relatedTarget.id);
-      //pesquisar item na lista
-      if (!this.existeNaListaTexto(this.textoPesquisa, true)) {
-        this.limparClick();
-      }
-
-      this.dropDownPesquisa(0);
-      if (this.form) {
-        this.form.get(this.formControlName)?.markAsTouched();
-      }
-    }
-  }
-
-  override ngOnInit() {
-    //tratar urls
-    this.url = this.url.startsWith('http') ? this.url : `${this.BASE_API}/${this.url}`;
-    this.urlItem = this.urlItem.startsWith('http') ? this.urlItem : `${this.BASE_API}/${this.urlItem}`;
-
-    this.pesquisaSubject.pipe(switchMap((url) => {
-      //this.console.log('subject url:', url);      
-      if (!this.isEmpty(url)) {
-        return this.httpClient.get(url);
-        //return of(url);
-      }
-      else
-        return of([]);
-    }))
-      .subscribe({
-        next: (result: any) => {
-          //this.listaPesquisa = result;
-          this.console.log('subject subscribe result:', result);
-          this.listaPesquisa = [];
-
-          if (result && result.length > 0) {
-            if (this.filterFunction) {
-              result = result.filter(this.filterFunction);
-            }
-
-            result.forEach((ent: any, index: any) => {
-              this.listaPesquisa.push({ ...ent, Index: index, Selected: false });
-            });
-          }
-
-          this.podePesquisar = true;
-          if (this.listaPesquisa.length > 0) {
-            this.dropDownPesquisa(this.listaPesquisa.length);
-          }
-        }
-        , error: (error) => {
-          this.podePesquisar = true;
-          console.log('erro pesquisa', error);
-        }
-      });
-  }
-
-  writePesquisa(value: string | any): void {
-    //console.log('write pesquisa', value);
-    this.textoPesquisa = value;
-  }
-
-  showPesquisa(e: any): void {
-    //console.log('show pesquisa', e.keyCode);
-    var self = this;
-    const index = e.target.selectionStart >= 1 ? (e.target.selectionStart - 1) : 0;
-    //console.log(index, 'valor ', event.target.value, 'char ', event.target.value.charCodeAt(index));
-    const keyAt = e.target.value.charCodeAt(index);
-    /*
-    if ((e.keyCode >= 48 && e.keyCode <= 57) ||
-      (keyAt >= 48 && keyAt <= 57) ||
-      (e.keyCode >= 65 && e.keyCode <= 90) ||
-      (e.keyCode >= 96 && e.keyCode <= 105) ||
-      (e.keyCode == 8)) {
-        */
-    if (e.keyCode != 40 && e.keyCode != 38) {
-      if (!self.podePesquisar) {
-        return;
-      }
-      let filtro = self.textoPesquisa;
-      if (filtro != null && filtro != '' && filtro.length >= 2) {
-        self.pesquisarEntidade(filtro);
-
-      }
-      else {
-        if (e.keyCode == 8 && !filtro) {
-          this.limparClick();
-        }
-      }
-    }
-
-    else {
-      if (e.keyCode == 40 || e.keyCode == 38) {
-        self.dropDownPesquisa(self.listaPesquisa.length);
-        if (self.selectElementVisivel == true) {
-          //let select = self.selectElement; //document.getElementById(self.TemplateSelect1Id());
-
-          //ion-list
-          //selecionado
-          //console.log(self.listaPesquisa);
-          let inc = e.keyCode == 40 ? 1 : -1;
-          let selected = self.listaPesquisa.find(s => s['Selected'] === true);
-          let cur = 0;
-          if (selected != null) {
-            cur = selected['Index'];
-            //desmarcar o atual
-            selected['Selected'] = false;
-            cur = cur + inc;
-          } else {
-            cur = 0;
-          }
-
-          if (cur < 0) {
-            cur = self.listaPesquisa.length - 1;
-          } else if (cur >= self.listaPesquisa.length) {
-            cur = 0;
-          }
-
-          let novoSelected = self.listaPesquisa.find(n => n['Index'] === cur);
-          if (novoSelected != null) {
-            novoSelected['Selected'] = true;
-            self.selectedItem = novoSelected;
-            self.textoPesquisa = novoSelected[self.campoDisplay];
-          }
-          /*
-          let select = document.getElementById(this.selectId) as any;
-          console.log('select Element', select)
-          if (select != null) {
-            let inc = e.keyCode == 40 ? 1 : -1;
-            let cur = select.selectedIndex;
-            if (cur == NaN) cur = -1;
-            select.selectedIndex = cur + inc;
-            if (select.selectedIndex >= 0 && select.selectedIndex < self.listaPesquisa.length) {
-              self.selectedItem = self.listaPesquisa[select.selectedIndex];
-              if (self.selectedItem != null) {
-                self.textoPesquisa = self.selectedItem[self.campoDisplay];
-              }
-            }
-          }
-          */
-        }
-
-      } else
-        if (e.keyCode == 13) {
-          console.log('enter key', e)
-          //self.selecionarComboClick(e);
-          self.selecionarComboClick(null);
-          //return false;
-        } else if (e.keyCode == 27) {
-          //ESC
-          self.dropDownPesquisa(0);
-        }
-    }
-
-  }
-
-  highlight(texto: string): string {
-    let index = texto.toLowerCase().indexOf(this.textoPesquisa.toLowerCase());
-    //console.log(index);
-    if (index >= 0) {
-      return texto.substring(0, index) + '<strong>' + texto.substring(index, index + this.textoPesquisa.length) + '</strong>' + texto.substring(index + this.textoPesquisa.length);  //texto.replace(this.textoPesquisa, `<strong>${this.textoPesquisa}</strong>`);
-    } else {
-      return texto;
-    }
-  }
-
-  selecionarComboClick(item: any) {
-    // console.log(item);
-    var self = this;
-    // console.log('combo click', self);
-
-    /*
-    let select = document.getElementById(this.selectId) as any;
-    if (select.selectedIndex >= 0) {
-      self.selectedItem = self.listaPesquisa[select.selectedIndex];
-    }
-    console.log('selected', this.selectedItem);
-    //self.selectedItem = this.listaPesquisa.find(i => i[this.campoId] == e);
-    if (self.selectedItem != null) {
-      self.textoPesquisa = self.selectedItem[self.campoDisplay];
-      self.writeValue(self.selectedItem[self.campoId]);
-      if (e != null) {
-        self.selectElementVisivel = false;
-        if (self.action != null) {
-          self.action(self.selectedItem(), e);
-        }
-      }
-    }
-    else {
-      self.selectElementVisivel = false;
-    }
-    */
-    // pesquisar selecionado
-    // console.log(this.listaPesquisa);
-    let selected = this.listaPesquisa.find(s => s['Selected'] === true);
-
-    // if (!selected) {
-    //   console.log(this.campoId, item);
-    //   selected = this.listaPesquisa.filter( s => s[this.campoId] == item[this.campoId]);
-    // }
-
-    //se o item form passado como parametro (click no ion-item)
-    if (item != null) {
-      if (selected != null) {
-        selected['Selected'] = false;
-      }
-      item['Selected'] = true;
-      selected = item;
-    }
-    if (selected != null) {
-      self.selectedItem = selected;
-      self.textoPesquisa = selected[self.campoDisplay];
-      self.writeValue(selected[self.campoId]);
-      self.selectElementVisivel = false;
-      //console.log('action', self.change);
-      if (self.pesquisaChange != null) {
-        self.pesquisaChange.emit(self.selectedItem);
-      }
-    } else {
-      self.selectElementVisivel = false;
-    }
-    // this.listaPesquisa.forEach( pesquisa => {
-    //   console.log(pesquisa, self.data);
-    // } );
-    // console.log(this.textoPesquisa);
-  }
-
-  selecionarComboChange(e: any) {
-    var self = this;
-    console.log('combo change', e);
-    self.selectedItem = this.listaPesquisa.find(i => i[this.campoId] == e);
-    if (self.selectedItem != null) {
-      self.writeValue(e);
-      self.textoPesquisa = self.selectedItem[self.campoDisplay];
-      if (e != null) {
-        self.selectElementVisivel = false;
-        if (self.pesquisaChange != null) {
-          self.pesquisaChange.emit(self.selectedItem);
-        }
-      }
-    }
-    else {
-      self.selectElementVisivel = false;
-    }
-  }
-
-  dropDownPesquisa(length: number) {
-    var self = this;
-    if (self.listaPesquisa != null && self.listaPesquisa.length > 0) {
-      if (length == -1) {
-        length = self.listaPesquisa.length;
-      }
-      self.selectElementVisivel = length == 0 ? false : true;
-
-      //console.log(this.selectElement);
-      //this.selectElement.open();
-
-      /*
-      //let element = this.selectElement;
-      let element = document.getElementById(this.selectId);
-      console.log('dropDown', element);
-      (element as any).size = length + 1;
-      if (length == 0) {
-        self.selectElementVisivel = false;
-      } else {
-        self.selectElementVisivel = true;
-      }
-      */
-    }
-  }
-
-  pesquisarEntidade(filtro: string) {
-    let url = this.url.replace('<<FILTRO>>', filtro).replace('<<EMPRESA>>', this.empresa.toString());
-    console.log('pesquisarEntidade url', url);
-    this.podePesquisar = false;
-    this.pesquisaSubject.next(url);
-  }
-
-  pesquisarEntidadeOld(filtro: string) {
-    let url = this.url.replace('<<FILTRO>>', filtro).replace('<<EMPRESA>>', this.empresa.toString());
-    console.log('pesquisarEntidade url', url);
-    this.podePesquisar = false;
-    this.httpClient.get<any>(url)
-      .subscribe({ next: (result: any) => {
-        //this.listaPesquisa = result;
-        if (this.filterFunction) {
-          result = result.filter(this.filterFunction);
-        }
-        this.listaPesquisa = [];
-        result.forEach((ent: any, index: number) => {
-          this.listaPesquisa.push({ ...ent, Index: index, Selected: false });
-        });
-
-        this.podePesquisar = true;
-        if (this.listaPesquisa.length > 0) {
-          this.dropDownPesquisa(this.listaPesquisa.length);
-        }
-      }, error: error => {
-        console.log('erro pesquisa', error);
-        this.podePesquisar = true;
-      }});
-  }
-
-  existeNaLista(id: number, setRegistro: boolean = false): boolean {
-    if (this.listaPesquisa && this.listaPesquisa.length > 0) {
-      let existe = this.listaPesquisa.find(l => l[this.campoId] === id);
-      if (existe) {
-        if (setRegistro) {
-          this.selectedItem = existe;
-          this.selecionarComboClick(this.selectedItem);
-        }
-        return true;
-      } else {
-        return false;
-      }
-    } else {
-      return false;
-    }
-  }
-
-  existeNaListaTexto(texto: string, setRegistro: boolean = false): boolean {
-    console.log("existe texto:", texto, this.campoDisplay, this.listaPesquisa);
-    if (this.listaPesquisa && this.listaPesquisa.length > 0) {
-      let existe = this.listaPesquisa.find(l => l[this.campoDisplay].toUpperCase() === texto.toUpperCase());
-      if (existe) {
-        if (setRegistro) {
-          this.selectedItem = existe;
-          this.selecionarComboClick(this.selectedItem);
-        }
-        return true;
-      } else {
-        return false;
-      }
-    } else {
-      return false;
-    }
-  }
-
-  validarItemSelecionado(setarRegistro: boolean = false): boolean {
-    console.log('validar selecionado');
-    //passar pela função de filtro
-    let valido = false;
-    if (this.selectedItem) {
-      if (this.filterFunction) {
-        let existe = [{ ...this.selectedItem }].filter(this.filterFunction);
-        if (existe != null && existe.length > 0) {
-          valido = true;
-        }
-      } else {
-        valido = true;
-      }
-      if (valido && setarRegistro) {
-        this.selecionarComboClick(this.selectedItem);
-      }
-
-      return valido;
-    } else {
-      return false;
-    }
-  }
-
-  carregaItemIdParaLista(id: number) {
-    let url = this.urlItem.replace('<<ID>>', id.toString());
-    console.log(this.urlItem);
-    console.log('pesquisar ID url', url);
-    this.podePesquisar = false;
-    this.httpClient.get<any>(url)
-      .subscribe({ next: (result: any) => {
-        this.listaPesquisa = [];
-        this.listaPesquisa.push({ ...result, Index: 0, Selected: true });
-        this.podePesquisar = true;
-        if (this.listaPesquisa.length > 0) {
-          this.selectedItem = this.listaPesquisa[0];
-          this.selecionarComboClick(this.selectedItem);
-        }
-      }, error:  error => {
-        console.log('erro pesquisa', error);
-        this.podePesquisar = true;
-      }});
-  }
-
-  limparClick() {
-    this.writeValue(null);
-    this.writePesquisa(null);
-    this.listaPesquisa = [];
-    this.dropDownPesquisa(0);
-    //this.podePesquisar = true;
-    this.pesquisaSubject.next('');
-    if (this.limpar) {
-      this.limpar();
-    }
-  }
-
-  verificarPesquisa() {
-    //TODO: verificar se o texto corresponde com um item da lista
-    this.selecionarComboClick(null);
-  }
-
-  async pesquisarClick() {
-    /*
-    if (this.pesquisaAction != null) {
-      this.pesquisaAction();
-    }
-    */
-    //pesquisaCategoria
-    console.log(this.filterFunction, this.url, this.urlTree);
-
-    const modal = await this.modalCtrl.create({
-      component: ModelTreeviewComponent,
-      componentProps: {
-        //campoId: this.campoId,
-        //campoPai: this.campoPaiId,
-        //campoLabel: this.campoDisplay,
-        textoPesquisa: this.textoPesquisa,
-        filterFunction: this.filterFunction,
-        empresaSelecionadaId: this.empresa,
-        tipo: this.tipo,
-        //especifico
-        //planoContas: this.planoContas,
-        url: this.isEmpty(this.urlTree) ? this.url : this.urlTree,
-        titulo: this.treeTitulo,
-        campoLabel: this.campoDisplay,
-        campoId: this.campoId,
-        campoPai: this.campoPaiId
-      },
-      cssClass: 'my-custom-modal-pesquisa'
-    });
-
-    modal.onDidDismiss().then(data => {
-      let result = data['data'];
-      console.log(result);
-      if (result != null && result.Id > 0) {
-        this.carregaItemIdParaLista(result.Id);
-      }
-    });
-    modal.present();
-
-  }
-
-  isEmpty(valor: string | any) {
-    return valor == null || valor == undefined || valor == ''
-  }
-}

package/src/lib/input-radio/input-radio.component.html

@@ -1,21 +0,0 @@
-<div>
-    <ion-item lines="none" style="--background: inherited; --background-focused: transparent; padding-right: 0px;" [class]="itemClass"
-        [style.opacity]="readonly ? '0.5' : '1'">
-        <ion-radio-group [disabled]="readonly" #inputRadio 
-            [value]="data"
-            (ionChange)="writeValue(inputRadio.value)">
-            <span style="font-size: 13px">
-                {{ label }}
-            </span>
-            <ion-row>
-                <ion-col *ngFor="let item of itens">
-                    <ion-radio style="margin-right: 12px;" [color]="color" 
-                        labelPlacement="end" 
-                        justify="start"
-                        [value]="item[itemId]">
-                        {{ item[itemNome] }}</ion-radio><br />
-                </ion-col>
-            </ion-row>
-        </ion-radio-group>
-    </ion-item>
-</div>

package/src/lib/input-radio/input-radio.component.scss

@@ -1,3 +0,0 @@
-ion-item {
-    --min-height: var(--checkbox-min-height, 48px) !important;
-}

package/src/lib/input-radio/input-radio.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { InputRadioComponent } from './input-radio.component';
-
-describe('InputRadioComponent', () => {
-  let component: InputRadioComponent;
-  let fixture: ComponentFixture<InputRadioComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [InputRadioComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(InputRadioComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/input-radio/input-radio.component.ts

@@ -1,49 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { BaseInputComponent } from '../baseInputComponent';
-
-@Component({
-  selector: 'kb-input-radio',
-  templateUrl: './input-radio.component.html',
-  styleUrls: ['./input-radio.component.scss', './../baseComponent.scss'],
-  providers: [{
-    provide: NG_VALUE_ACCESSOR,
-    useExisting: InputRadioComponent,
-    multi: true
-  }]
-})
-export class InputRadioComponent extends BaseInputComponent implements OnInit, ControlValueAccessor {
-  @Input() itens: any[] = [];
-  @Input() itemId: string = "Id";
-  @Input() itemNome: string = "Nome";
-  @Input() color: string = "primary";
-  //control value acessor
-  public data!: string | undefined;
-  private onChange: Function = (data: string) => { };
-  private onTouch: Function = () => { };
-  private disabled: boolean = false;
-  public console = console;
-
-  writeValue(value?: any): void {
-    //console.log('write value', value);
-    this.onChange(value);
-    this.data = value;
-  }
-  registerOnChange(fn: any): void {
-    this.onChange = fn;
-  }
-  registerOnTouched(fn: any): void {
-    this.onTouch = fn;
-  }
-  setDisabledState?(isDisabled: boolean): void {
-    this.disabled = this.disabled;
-  }
-  constructor() {
-    super();
-  }
-
-  override ngOnInit(): void {
-  }
-
-
-}

package/src/lib/input-select/input-select.component.html

@@ -1,29 +0,0 @@
-<!--
-<div [formGroup]="form">
--->
-<div>
-    <ion-item lines="none" style="--background: inherited; --background-focused: transparent;" [class]="itemClass" #itemSelect
-    [ngClass]="form?.get(formControlName)?.errors && (form?.get(formControlName)?.dirty || form?.get(formControlName)?.touched) ? 'error-shake' : '' "
-    >
-      <ion-label *ngIf="label" [position]="labelPosition" class="focus-label">{{ label }}</ion-label>
-      <!-- formControlName="{{ formControlName }}"  -->
-      <select #inputSelect
-        style="width: 100%;" (change)="onSelectChange(inputSelect.value)"
-        (blur)="onBlur()" (focus)="onEnter()" [disabled]="readonly">
-        <option *ngIf="itemNull" [value]="''" selected>{{ opcaoDefault }}</option>
-        <option *ngFor="let item of itens" [value]="item[itemId]" [selected]="item[itemId] == data">{{ item[itemNome] }}
-        </option>
-      </select>    
-    </ion-item>
-  
-    
-    <div class="validation-errors" *ngIf="form">
-      <ng-container *ngFor="let validation of validation_messages">
-        <div class="error-message"
-          *ngIf="form && form.get(formControlName)?.hasError(validation.type) && (form.get(formControlName)?.touched)">
-          &#8226; {{ validation.message }}
-        </div>
-      </ng-container>
-    </div>
-    
-  </div>