brainloper-ui 14.0.29 → 14.0.31

package/src/app/modules/brainloper-ui/components/data-table/data-table.component.ts

@@ -1,753 +0,0 @@
-import { ScreenSizeUtil } from './../../../services/screen-size-util';
-import { ExportDataService } from './../../../services/export-data.service';
-import {
-  Component,
-  OnInit,
-  Input,
-  Output,
-  EventEmitter,
-  OnChanges,
-  SimpleChanges,
-  ViewChild,
-} from '@angular/core';
-import { MatDialog } from '@angular/material/dialog';
-import { TableModalComponent } from '../../../brainloper-ui/components/data-table/table-modal/table-modal.component';
-import { HttpService } from '../../../services/http.service';
-import { MatPaginator } from '@angular/material/paginator';
-import { MessageService } from '../../../services/message.service';
-import { FunctionsService } from '../../../services/functions.service';
-import { MatPaginatorIntl } from '@angular/material/paginator';
-import { TooltipPosition } from '@angular/material/tooltip';
-import { IPermissions, modulesByRol } from '@edgarzon93/brainloper-shared';
-
-
-const spanishRangeLabel = (page: number, pageSize: number, length: number) => {
-  if (length == 0 || pageSize == 0) {
-    return `0 de ${length}`;
-  }
-
-  length = Math.max(length, 0);
-
-  const startIndex = page * pageSize;
-
-  const endIndex =
-    startIndex < length
-      ? Math.min(startIndex + pageSize, length)
-      : startIndex + pageSize;
-
-  return `${startIndex + 1} - ${endIndex} de ${length}`;
-};
-
-const rolesAndPermissions = modulesByRol
-@Component({
-  selector: 'data-table',
-  templateUrl: './data-table.component.html',
-  styleUrls: ['./data-table.component.scss'],
-})
-export class DataTableComponent implements OnInit, OnChanges {
-  @Input() title;
-  @Input() columns;
-  @Input() data: any = [];
-  @Input() combo;
-  @Input() configuration = {
-    add: false,
-    edit: false,
-    delete: false,
-    active: false,
-    selectable: false,
-    print: false,
-    addPer: false,
-    editPer: false,
-    primaryKey: 'id',
-    exportXslx: false,
-    hideTitle: true,
-    hideFilter: true,
-    notInitialize: false,
-    exportXslxByRow: false,
-    exportXslxWithPages: false,
-    view: false,
-    closeOrder: false,
-    packOff: false,
-    advance: true,
-    advanceLabel: null,
-    income: false,
-    exit: false,
-    sendEmail: false,
-    addComment: false,
-  };
-
-  @Input() reloadTable: EventEmitter<any>;
-  @Input() url: string;
-  @Input() params: Array<any>;
-  @Input() titleLoading: string = '';
-  @Input() messageLoading: string = '';
-  @Input() headerFileXlsm: Array<any> = [];
-  @Input() headerFilters: Array<any> = [];
-  @Input() xslxTitleFields: string[];
-  @Input() xslxSheetNameFields: string[];
-  @Input() xslxBodyFields: string;
-  @Input() xslxParams: Array<any> = null;
-  @Input() roleId: number = 0;
-  @Input() moduleId: number = 0;
-  @Input() subModuleId: number = 0;
-
-
-  private hasAccessToAll = true;
-  private rolesAndPermissionUser: IPermissions = {} as IPermissions;
-
-  @Output() clickRow = new EventEmitter<any>();
-  @Output() add = new EventEmitter<any>();
-  @Output() edit = new EventEmitter<any>();
-  @Output() delete = new EventEmitter<any>();
-  @Output() print = new EventEmitter<any>();
-  @Output() exportXslxByRow = new EventEmitter<any>();
-  @Output() active = new EventEmitter<any>();
-  @Output() selected = new EventEmitter<any>();
-  @Output() view = new EventEmitter<any>();
-  @Output() closeOrder = new EventEmitter<any>();
-  @Output() packOff = new EventEmitter<any>();
-  @Output() advance = new EventEmitter<any>();
-  @Output() income = new EventEmitter<any>();
-  @Output() exit = new EventEmitter<any>();
-  @Output() internalData = new EventEmitter<any>();
-  @Output() sendEmail = new EventEmitter<any>();
-  @Output() addComment = new EventEmitter<any>(); 
-  @Output() fileIconClick: EventEmitter<any> = new EventEmitter<any>();
-
-  movil = ScreenSizeUtil.isMobile();
-  filtersPost: Array<any> = [];
-  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
-
-  selectedRows = []; /** almacena las filas seleccionadas */
-  checkboxs = {};
-  selectAll = false;
-  indeterminateState = false;
-  filters;
-  originalData = [];
-  paginatorActive = true;
-  screen: boolean = true;
-
-  id_compania;
-
-  pageSizeOptions: number[] = [5, 10, 25, 50, 100];
-
-  pageSize = screen.width > 500 ? 10 : 5;
-  length = 0;
-
-  page = 0;
-
-  above: TooltipPosition[] = ['above'];
-
-  constructor(
-    public dialog: MatDialog,
-    private http: HttpService,
-    private message: MessageService,
-    private functionEter: FunctionsService,
-    private paginatorTranslate: MatPaginatorIntl,
-    private exportService: ExportDataService
-  ) {
-    this.paginatorTranslate.itemsPerPageLabel = 'Elementos por página';
-    this.paginatorTranslate.nextPageLabel = 'Siguiente página';
-    this.paginatorTranslate.lastPageLabel = 'Última página';
-    this.paginatorTranslate.previousPageLabel = 'Página anterior';
-    this.paginatorTranslate.firstPageLabel = 'Primera página';
-    this.paginatorTranslate.getRangeLabel = spanishRangeLabel;
-  }
-
-  buttonsConfig = [
-  ];
-
-
-  async ngOnInit() {
-    this.validateRolAndPermission()
-    if (window.screen.width > 1000) {
-      this.screen = true;
-      window.addEventListener('resize', () => {
-        window.screen.width > 1000
-          ? (this.screen = true)
-          : (this.screen = false);
-      });
-    } else {
-      this.screen = false;
-      window.addEventListener('resize', () => {
-        window.screen.width > 1000
-          ? (this.screen = true)
-          : (this.screen = false);
-      });
-    }
-
-    if (this.reloadTable) {
-      this.reloadTable.subscribe((res) => {
-        this.originalData = [];
-        this.selectAll = false;
-        this.seletecAllEvent('');
-      });
-    }
-
-    this.titleLoading == '' ? (this.titleLoading = 'Cargando') : '';
-    this.messageLoading == ''
-      ? (this.messageLoading = 'Obteniendo datos...')
-      : '';
-    this.url && !this.configuration.notInitialize
-      ? this.message.openLoading(this.titleLoading, this.messageLoading)
-      : '';
-
-    try {
-      if (this.url && !this.configuration.notInitialize) {
-        let service = await this.getDateTableByUrl();
-        this.data = service['data'];
-        this.length = service['count'];
-
-        this.data.forEach((row) => {
-          this.checkboxs[row[this.configuration.primaryKey]] = false;
-        });
-
-        this.internalData.emit(service);
-        setTimeout(() => {
-          this.message.closeLoading();
-        }, 1000);
-        this.validateRules();
-      } else if (!this.url) {
-        this.paginatorActive = false;
-      }
-    } catch (error) {
-      console.log(error);
-    }
-  }
-
-  validateRolAndPermission() {
-    if (this.roleId != 0) {
-      let rolePermissions = rolesAndPermissions?.find(x => x.id == this.roleId)
-      this.hasAccessToAll = rolePermissions?.hasAccessToAll ?? rolePermissions.modules?.find(x => x.id == this.moduleId)?.hasAccessToAll ?? false;
-    };
-
-    this.rolesAndPermissionUser = rolesAndPermissions?.find(x => x.id == this.roleId)?.modules?.find(x => x.id == this.moduleId)?.subModules?.find(x => x.id == this.subModuleId)?.permissions ?? {} as IPermissions;
-    if (!this.hasAccessToAll && !this.rolesAndPermissionUser.readAll && this.rolesAndPermissionUser.readOwn == true) {
-      this.params = [...this.params, { id: 'readOwn', value: true }];
-    }
-    this.configureButtons()
-  }
-
-  configureButtons() {
-    this.buttonsConfig = [
-      {
-        action: 'edit',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 &&
-          this.configuration.edit &&
-          this.hasPermission('update'),
-        condition: () => this.configuration.edit && this.hasPermission('update'),
-        icon: 'fa-edit',
-        tooltip: 'Editar',
-      },
-      {
-        action: 'print',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 &&
-          this.configuration.print &&
-          this.screen &&
-          this.hasPermission('print'),
-        condition: () => this.configuration.print && this.screen && this.hasPermission('print'),
-        icon: 'fa-print',
-        tooltip: 'Imprimir',
-      },
-      {
-        action: 'active',
-        conditionShowHeader: () =>
-          this.selectedRows.length > 0 && this.configuration.active && this.hasPermission('activateAndInactivate'),
-        condition: () => this.configuration.active && this.hasPermission('activateAndInactivate'),
-        icon: 'fa-adjust',
-        tooltip: 'Activar/Desactivar',
-      },
-      {
-        action: 'add',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 0 && this.configuration.add && this.hasPermission('write'),
-        condition: () => false,
-        icon: 'fa-plus-circle',
-        tooltip: 'Nuevo',
-      },
-      {
-        action: 'income',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 0 && this.configuration.income && this.hasPermission('write'),
-        condition: () => false,
-        icon: 'fa-user-plus',
-        tooltip: 'Ingreso',
-      },
-      {
-        action: 'exit',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 0 && this.configuration.exit && this.hasPermission('write'),
-        condition: () => false,
-        icon: 'fa-user-times',
-        tooltip: 'Salida',
-      },
-      {
-        action: 'view',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 && this.configuration.view && this.hasPermission('readDetail'),
-        condition: () => this.configuration.view && this.hasPermission('readDetail'),
-        icon: 'fa-eye',
-        tooltip: 'Ver detalle',
-      },
-      {
-        action: 'closeOrder',
-        conditionShowHeader: () =>
-          (this.selectedRows.length === 1 && this.configuration.closeOrder) && this.hasPermission('closeOT'),
-        condition: () => this.configuration.closeOrder && this.hasPermission('closeOT'),
-        icon: 'fa-check-circle',
-        tooltip: 'Cerrar orden',
-      },
-      {
-        action: 'packOff',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 && this.configuration.packOff && this.hasPermission('allocateResources'),
-        condition: () => this.configuration.packOff && this.hasPermission('allocateResources'),
-        icon: 'fa-cart-arrow-down',
-        tooltip: 'Despachar recursos',
-      },
-      {
-        action: 'advance',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 && this.configuration.advance && this.hasPermission('advance'),
-        condition: () => this.configuration.advance && this.hasPermission('advance'),
-        icon: 'fa-arrow-right',
-        tooltip: this.configuration.advanceLabel,
-      },
-      {
-        action: 'sendEmail',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 &&
-          this.configuration.sendEmail &&
-          this.hasPermission('sendEmail'),
-        condition: () => this.configuration.sendEmail && this.hasPermission('sendEmail'),
-        icon: 'fa-mail-bulk',
-        tooltip: 'Envia correo',
-      },
-      {
-        action: 'exportToExcel',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 0 &&
-          this.data.length > 0 &&
-          (this.configuration.exportXslx || this.configuration.exportXslxWithPages) &&
-          this.hasPermission('export'),
-        condition: () => false,
-        icon: 'fa-download',
-        tooltip: 'Exportar Tabla',
-      },
-      {
-        action: 'exportToExcelByRow',
-        conditionShowHeader: () =>
-          this.selectedRows.length === 1 && this.configuration.exportXslxByRow && this.hasPermission('export'),
-        condition: () => this.configuration.exportXslxByRow && this.hasPermission('export'),
-        icon: 'fa-download',
-        tooltip: 'Exportar Registro',
-      },
-      {
-        action: 'delete',
-        conditionShowHeader: () =>
-          this.selectedRows.length > 0 && this.configuration.delete && this.hasPermission('delete'),
-        condition: () => this.configuration.delete && this.hasPermission('delete'),
-        icon: 'fa-trash',
-        tooltip: 'Eliminar',
-      },
-    ];
-  }
-
-
-  hasPermission(permission: string): boolean {
-    if (this.hasAccessToAll) return true;
-    return this.rolesAndPermissionUser?.[permission] ?? false;
-  }
-
-  async getDateTableByUrl() {
-    this.validarParams();
-    return await this.http.postDataBody(
-      this.url,
-      this.filtersPost,
-      this.params
-    );
-  }
-
-  validarParams() {
-    this.params = this.functionEter.removeDuplicateObjects(this.params);
-    if (this.params) {
-      if (!this.params.find((x) => x.id == 'page')) {
-        this.params.push({ id: 'page', value: '0' });
-      }
-      if (!this.params.find((x) => x.id == 'per_page')) {
-        this.params.push({ id: 'per_page', value: this.pageSize });
-      }
-      if (!this.params.find((x) => x.id == 'filter')) {
-        this.params.push({ id: 'filter', value: '' });
-      }
-    }
-  }
-
-  async validateRules() {
-    for (const [index, columns] of this.columns.entries()) {
-      for (const [indexData, element] of this.data.entries()) {
-        if (columns.rules) {
-          for (const rule of columns.rules) {
-            if (rule.rule == enumRules['==']) {
-              if (
-                element[columns.ID] &&
-                element[columns.ID].toString() == rule.valueRule.toString()
-              ) {
-                this.data[indexData][columns.ID] = rule.valueAction;
-              }
-            }
-          }
-        }
-        const columnValue = element[columns.ID];
-        if (columns.type == 'fecha' || columns.type == 'date')
-          this.data[indexData][columns.ID] =
-            this.functionEter.dateIso(columnValue);
-        if (columns.type == 'dateWithTime')
-          this.data[indexData][columns.ID] = this.functionEter.dateWithTime(
-            columnValue?.toString() ?? columnValue
-          );
-        if (columns.type == 'currency')
-          this.data[indexData][columns.ID] =
-            Intl.NumberFormat('es-CO').format(columnValue);
-        if (columns.type == 'boolean')
-          this.data[indexData][columns.ID] = columnValue == 1 ? 'Si' : 'No';
-      }
-    }
-  }
-
-  ngOnChanges(changes: SimpleChanges) {
-    if (changes.data) {
-      if (this.data) {
-        this.data.forEach((row) => {
-          this.checkboxs[row[this.configuration.primaryKey]] = false;
-        });
-        if (this.originalData.length == 0) {
-          if (this.data.length != 0) {
-            this.data.forEach((element) => {
-              this.originalData.push(element);
-            });
-          }
-        }
-      }
-      this.validateRules();
-    }
-
-  }
-
-  evaluateRules(value: any, rules: any[]): boolean {
-    if (!rules) {
-        return false;
-    }
-    let active = false;
-    const allowedExtensions = [
-        '.png', '.jpeg', '.jpg', '.gif', '.bmp', '.webp', '.svg',
-        '.pdf', '.doc', '.docx', '.xls', '.xlsx'
-    ];
-    rules.forEach(rule => {
-        if (rule.action === enumActions.SHOW_FILE_ICON && value && value.startsWith('/docs/')) {
-            const lowerValue = value.toLowerCase();
-            for (const ext of allowedExtensions) {
-                if (lowerValue.endsWith(ext)) {
-                    active = true;
-                    break;
-                }
-            }
-        }
-    });
-    return active;
-}
-
-  onFileIconClick(event, value: any): void {
-    event.stopPropagation();
-    this.fileIconClick.emit(value);
-  }
-
-  clickOnRoW(rowData) {
-    let state = this.checkboxs[rowData[this.configuration.primaryKey]];
-
-    if (!this.configuration.selectable) {
-      this.clearCheckboxes();
-    }
-
-    this.selection(rowData, { checked: !state }, this.configuration.selectable);
-    this.clickRow.emit(rowData);
-  }
-
-  showMenu($event) {
-    $event.stopPropagation();
-  }
-
-  action(action, row = null) {
-    var currentRow = row ? [row] : this.selectedRows;
-
-    switch (action) {
-      case 'add':
-        if (this.configuration.addPer) {
-          this.add.emit(this.length);
-        } else {
-          this.dialog
-            .open(TableModalComponent, {
-              data: {
-                action,
-                columns: JSON.parse(JSON.stringify(this.columns)),
-              },
-              width: '60vh',
-            })
-            .afterClosed()
-            .subscribe((result) => {
-              if (result) {
-                this.add.emit(result);
-              }
-            });
-        }
-
-        break;
-
-      case 'edit':
-        if (this.configuration.editPer) {
-          this.edit.emit(currentRow);
-        } else {
-          let columns: any;
-          columns = this.columns;
-
-          columns.forEach((column, index) => {
-            Object.keys(currentRow[0]).forEach((key) => {
-              if (column.ID == key) {
-                columns[index].value = currentRow[0][key];
-              }
-            });
-          });
-
-          this.dialog
-            .open(TableModalComponent, {
-              data: {
-                action,
-                columns: JSON.parse(JSON.stringify(this.columns)),
-                values: currentRow[0],
-              },
-              width: '60vh',
-            })
-            .afterClosed()
-            .subscribe((result) => {
-              if (result) {
-                this.edit.emit({ new: result, old: currentRow[0] });
-              }
-            });
-        }
-
-        break;
-
-      case 'delete':
-        this.delete.emit(currentRow);
-        break;
-      case 'print':
-        this.print.emit(currentRow);
-        break;
-      case 'active':
-        this.active.emit(currentRow);
-        break;
-      case 'exportToExcel':
-        this.exportToExcel();
-        break;
-      case 'exportToExcelByRow':
-        this.exportXslxByRow.emit(currentRow);
-        break;
-      case 'view':
-        this.view.emit(currentRow);
-        break;
-      case 'closeOrder':
-        this.closeOrder.emit(currentRow);
-        break;
-      case 'packOff':
-        this.packOff.emit(currentRow);
-        break;
-      case 'advance':
-        this.advance.emit(currentRow);
-        break;
-      case 'income':
-        this.income.emit(this.length);
-        break;
-      case 'exit':
-        this.exit.emit(this.length);
-        break;
-      case 'sendEmail':
-        this.sendEmail.emit(currentRow);
-        break;
-      case 'addComment':
-        this.addComment.emit(currentRow);
-          break;
-    }
-  }
-
-  shouldShowMenu(): boolean {
-    return this.buttonsConfig.some((btn) => btn.condition());
-  }
-
-  exportToExcel() {
-    let params = [];
-    if (this.url && this.params) {
-      params = [...this.params];
-
-      if (this.xslxParams) {
-        params = [...params, ...this.xslxParams];
-      }
-      let i = params.findIndex((x) => x.id == 'per_page');
-      if (i != -1) params[i].value = 100000000;
-    }
-
-    if (this.configuration.exportXslxWithPages) {
-      this.exportService.generateExcelWithSheets<any>(
-        this.title,
-        this.headerFileXlsm,
-        this.title,
-        this.url ? null : this.data,
-        this.url,
-        params,
-        this.filtersPost,
-        this.xslxTitleFields,
-        this.xslxSheetNameFields,
-        this.xslxBodyFields
-      );
-    } else {
-      this.exportService.generateToXlsx<any>(
-        this.title,
-        this.headerFileXlsm,
-        this.title,
-        this.url ? null : this.data,
-        this.url,
-        params,
-        this.filtersPost
-      );
-    }
-  }
-
-  selection(row, $event, emitEvent = true) {
-    this.checkboxs[row[this.configuration.primaryKey]] = $event.checked;
-    if ($event.checked) {
-      this.selectedRows.push(row);
-    } else {
-      let index = this.selectedRows.indexOf(row);
-      this.selectedRows.splice(index, 1);
-    }
-
-    if (this.configuration.selectable && emitEvent) {
-      this.selected.emit(this.selectedRows);
-    }
-
-    if (this.selectedRows.length == this.data.length) {
-      this.selectAll = true;
-    } else {
-      this.selectAll = false;
-    }
-
-    if (
-      this.selectedRows.length > 0 &&
-      this.selectedRows.length < this.data.length
-    ) {
-      this.indeterminateState = true;
-    } else {
-      this.indeterminateState = false;
-    }
-  }
-
-  clicked($event) {
-    event.stopPropagation();
-  }
-
-  async seletecAllEvent($event) {
-    this.indeterminateState = false;
-
-    if (this.selectAll) {
-      Object.keys(this.checkboxs).forEach((key) => {
-        this.checkboxs[key] = true;
-      });
-
-      this.selectedRows = [];
-      let data = this.data;
-      data.forEach((element) => {
-        this.selectedRows.push(element);
-      });
-
-      this.selected.emit(this.selectedRows);
-    } else {
-      this.clearCheckboxes();
-      this.selected.emit(this.selectedRows);
-    }
-
-    let service = await this.getDateTableByUrl();
-    this.data = service['data'];
-    this.internalData.emit(service);
-    this.length = service['count'];
-    this.validateRules();
-  }
-
-  clearCheckboxes() {
-    Object.keys(this.checkboxs).forEach((key) => {
-      this.checkboxs[key] = false;
-    });
-
-    this.selectedRows = [];
-  }
-
-  changeFilters() {
-    if (this.params)
-      this.params.forEach((element) => {
-        if (element.id == 'filter') {
-          element.value = this.filters;
-        }
-      });
-
-    this.applyFilters();
-  }
-
-  public async applyFilters($event?: any) {
-    if ($event) this.filtersPost = $event;
-    if (this.url) {
-      let res: any = await this.getDateTableByUrl();
-      this.data = res['data'];
-      this.validateRules();
-      this.length = res['count'];
-      this.internalData.emit(res);
-    } else {
-      this.data = this.originalData.filter((data) => {
-        for (let key of Object.keys(data)) {
-          let result = data[key]
-            .toString()
-            .toLowerCase()
-            .includes(this.filters.toLowerCase());
-          if (result) {
-            return data;
-          }
-        }
-      });
-    }
-  }
-
-  changePage($event) {
-    this.params.forEach((element, index) => {
-      if (element.id == 'per_page') {
-        element.value = $event.pageSize;
-      }
-      if (element.id == 'page') {
-        element.value = $event.pageIndex;
-      }
-    });
-    this.applyFilters();
-  }
-}
-
-enum enumRules {
-  '>',
-  '<',
-  '==',
-  '!=',
-}
-
-enum enumActions {
-  REPLACE,
-  ADD,
-  REMOVE,
-  SHOW_FILE_ICON
-}