tuain-ng-forms-lib 14.0.0 → 14.0.1

package/src/lib/components/elements/tables/table-record-action.component.ts

@@ -0,0 +1,37 @@
+import { Component, Input, Output, OnInit, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
+import { TableEvent, TableActionEvent } from '../../../classes/forms/table/table';
+
+const INLINE_ACTION = 'INLINE';
+
+@Component({
+  selector: 'lib-table-record-action',
+  template: `<ng-content></ng-content>`,
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+export class LibTableRecordActionComponent implements OnInit {
+  @Input() recordId: any;
+  @Input() recordData: any;
+  @Input() action: any;
+
+  @Output() actionSelected: EventEmitter<object> = new EventEmitter<object>();
+
+  constructor() { }
+
+  ngOnInit() {
+    this.start();
+  }
+
+  start() { }
+
+  onActivate() {
+    const tableEvent: TableActionEvent = {
+      actionCode: this.action.actionCode,
+      recordId: this.recordId,
+      recordData: this.recordData,
+    };
+    this.actionSelected.emit(tableEvent);
+  }
+
+  class() { }
+}

package/src/lib/components/elements/tables/table-record-field.component.ts

@@ -0,0 +1,19 @@
+import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
+
+@Component({
+  selector: 'lib-table-record-field',
+  template: `<ng-content></ng-content>`,
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+export class LibTableRecordFieldComponent implements OnInit {
+  @Input() fieldCode: any;
+  @Input() fieldType: any;
+  @Input() fieldValue: any;
+
+  ngOnInit() {
+    this.start();
+  }
+
+  start() { }
+}

package/src/lib/components/elements/tables/table.component.ts

@@ -0,0 +1,102 @@
+import { Component, OnInit, Input, ChangeDetectionStrategy } from '@angular/core';
+import { TableRecordData } from '../../../classes/forms/table/row-data';
+import { TableActionEvent } from '../../../classes/forms/table/table';
+import { RecordTable, TableEvent } from '../../../classes/forms/table/table';
+
+const changeViewAttributes = ['visibleRecords', 'currentPage', 'recordsPerPage'];
+
+@Component({
+  selector: 'lib-table',
+  template: `<ng-content></ng-content>`,
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+export class LibTableComponent implements OnInit {
+  formConfig: any;
+  globalFilterString: string = '';
+
+  // Atributos sincronizados del objeto
+  code: any;
+  columns: any;
+  currentPage: number = 1;
+  globalSearch: boolean = false;
+  visibleRecords: any[];
+  selectedRecords: any[] = [];
+  recordsPerPage: any;
+  totalRecordsNumber: number = 0;
+  allSelected: boolean = false;
+  layout: string;
+
+  tableFieldStyles: any;
+  loaded = false;
+  selectable = false;
+  hasActions = false;
+  inlineActions: any;
+  globalActions: any;
+  selectionActions: any;
+
+  @Input() table: RecordTable;
+  @Input() tableRecords: TableRecordData[];
+  @Input() disabled: boolean = false;
+  @Input() state: string;
+  @Input() waiting: boolean;
+
+  ngOnInit() {
+    if (this.table) {
+      this.formConfig = this.table?._formConfig;
+      this.tableFieldStyles = this.formConfig.tableFieldStyles;
+      this.selectable = this.table.selectable;
+      this.hasActions = this.table.hasActions();
+      this.inlineActions = this.table.getActions(this.formConfig.tableActions.inline);
+      this.globalActions = this.table.getActions(this.formConfig.tableActions.global);
+      this.selectionActions = this.table.getActions(this.formConfig.tableActions.selection);
+      // Inicialización de campos mapeados del objeto
+      const mapping = Object.entries(this.formConfig.componentTableAttrMap);
+      for (let index = 0; index < mapping.length; index++) {
+        const [tableAttrRaw, compAttrRaw] = mapping[index];
+        const tableAttr = tableAttrRaw.toString();
+        const compAttr = compAttrRaw.toString();
+        this.syncAttribute(compAttr, this.table[tableAttr]);
+      }
+      // Subscripción a cambios en atributos
+      this.table.attributeChange.subscribe(event => {
+        const { name: tableAttr, value } = event;
+        const compAttr = this.formConfig.componentTableAttrMap[tableAttr];
+        this.syncAttribute(compAttr, value);
+      });
+    }
+    this.start();
+  }
+
+  start() { }
+  updateTableData() { }
+  tableGlobalAction(actionCode: string) { this.table.notifyGlobalAction(actionCode); }
+  tableSelectionAction(actionCode: string) { this.table.notifySelectionAction(actionCode); }
+  tableActionSelected(actionEvent: TableActionEvent) { this.table.notifyInlineAction(actionEvent); }
+  tableSelectionToggle(recordId: any) { this.table.notifyRecordSelection(recordId); }
+  toggleSelectAll() { return (this.allSelected) ? this.table.unSelectAll() : this.table.selectAll(); }
+  globalFilterCompleted() { this.changePage(1); }
+  changePage(requestedPage: number) { this.table.changePage(requestedPage); }
+  tableColumnSort(columnName: string, direction = null) { this.table.sort(columnName, direction ?? 'ascend'); }
+  globalFilterChanged() { this.table.setGlobalFilterString(this.globalFilterString?.trim() ?? ''); }
+
+  syncAttribute(name: string, value: any) {
+    try {
+      if (name === 'visibleRecords') {
+        this.updateTableData();
+      }
+      this[name] = value;
+      return true;
+    } catch {
+      return false;
+    }
+  }
+
+  filterHasChanged(column, values) {
+    if (!values || values.length === 0) {
+      this.table.removeColumnFilter(column.fieldCode);
+    } else {
+      this.table.addColumnFilter(column.fieldCode, values);
+    }
+  }
+}