tuain-ng-forms-lib 14.4.90 → 14.4.93

package/src/lib/components/elements/layout/piece.component.ts

@@ -0,0 +1,34 @@
+import { Component } from '@angular/core';
+
+const CUSTOM_ATTRIBUTES = 'customAttributes';
+@Component({
+  selector: 'lib-piece',
+  template: `<ng-content></ng-content>`
+})
+export class PieceComponent {
+  formConfig: any;
+  visible: boolean = true;
+  disabled: boolean = false;
+  customAttributes: any = {};
+
+  defaultProcessAttributeChange(attribute: string, value?: any): boolean {
+    if (!attribute || attribute.trim() === '') {
+      return false;
+    }
+    const attributeParts = attribute.split('.');
+    if (attributeParts?.length > 1) {
+      const [attributeType, subAttribute] = attributeParts;
+      if (attributeType === CUSTOM_ATTRIBUTES) {
+        this.customAttributes[subAttribute] = value;
+        this.customAttributeChange(subAttribute, value);
+      }
+    } else {
+      this[attribute] = value;
+    }
+    return true;
+  }
+
+  customProcessAttributeChange(attribute: string, value?: any) { }
+
+  customAttributeChange(subAttribute: string, value?: any) { }
+}

package/src/lib/components/elements/layout/section.component.ts

@@ -0,0 +1,31 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { PieceComponent } from './piece.component';
+
+@Component({
+  selector: 'lib-section',
+  template: `<ng-content></ng-content>`
+})
+export class SectionComponent extends PieceComponent implements OnInit {
+  @Input() section: any;
+  @Input() form: any;
+
+  ngOnInit() {
+    this.formConfig = this.section?._formConfig;
+    const mapping = this.formConfig?.sectionPropagateAttributes;
+    for (let index = 0; index < mapping.length; index++) {
+      const attrName = mapping[index].toString();
+      const attributeValue = this.section?.[attrName];
+      this.defaultProcessAttributeChange(attrName, attributeValue);
+      this.customProcessAttributeChange(attrName, attributeValue);
+    }
+    // Subscripción a cambios en atributos
+    this.section?.attributeChange.subscribe(event => {
+      const { name: attrName, value } = event;
+      this.defaultProcessAttributeChange(attrName, value);
+      this.customProcessAttributeChange(attrName, value);
+    });
+    this.start();
+  }
+
+  start() { }
+}

package/src/lib/components/elements/layout/sub-section.component.ts

@@ -0,0 +1,31 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { PieceComponent } from './piece.component';
+
+@Component({
+  selector: 'lib-subsection',
+  template: `<ng-content></ng-content>`
+})
+export class SubSectionComponent extends PieceComponent implements OnInit {
+  @Input() subSection: any;
+  @Input() form: any;
+
+  ngOnInit() {
+    this.formConfig = this.subSection?._formConfig;
+    const mapping = this.formConfig?.subSectionPropagateAttributes;
+    for (let index = 0; index < mapping.length; index++) {
+      const attrName = mapping[index].toString();
+      const attributeValue = this.subSection?.[attrName];
+      this.defaultProcessAttributeChange(attrName, attributeValue);
+      this.customProcessAttributeChange(attrName, attributeValue);
+    }
+    // Subscripción a cambios en atributos
+    this.subSection?.attributeChange.subscribe(event => {
+      const { name: attrName, value } = event;
+      this.defaultProcessAttributeChange(attrName, value);
+      this.customProcessAttributeChange(attrName, value);
+    });
+    this.start();
+  }
+
+  start() { }
+}

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

@@ -0,0 +1,50 @@
+import { Component, Input, Output, OnInit, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
+import { PieceComponent } from '../layout/piece.component';
+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 extends PieceComponent implements OnInit {
+  @Input() recordId: any;
+  @Input() recordData: any;
+  @Input() action: any;
+
+  @Output() actionSelected: EventEmitter<TableActionEvent> = new EventEmitter<TableActionEvent>();
+
+  ngOnInit() {
+    this.formConfig = this.action?._formConfig;
+    const mapping = this.formConfig?.actionPropagateAttributes;
+    for (let index = 0; index < mapping.length; index++) {
+      const attrName = mapping[index].toString();
+      const attributeValue = this.action?.[attrName];
+      this.defaultProcessAttributeChange(attrName, attributeValue);
+      this.customProcessAttributeChange(attrName, attributeValue);
+    }
+    // Subscripción a cambios en atributos
+    this.action?.attributeChange.subscribe(event => {
+      const { name: attrName, value } = event;
+      this.defaultProcessAttributeChange(attrName, value);
+      this.customProcessAttributeChange(attrName, value);
+    });
+    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,20 @@
+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;
+  @Input() column: any = null;
+
+  ngOnInit() {
+    this.start();
+  }
+
+  start() { }
+}

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

@@ -0,0 +1,86 @@
+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';
+import { ElementComponent } from '../layout/element.component';
+
+@Component({
+  selector: 'lib-table',
+  template: `<ng-content></ng-content>`,
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+
+export class LibTableComponent extends ElementComponent implements OnInit {
+  // Atributos sincronizados del objeto
+  code: any;
+  globalFilterString: string = '';
+
+  tableFieldStyles: any;
+  loaded = false;
+  selectable = false;
+  hasActions = false;
+  inlineActions: any;
+  globalActions: any;
+  selectionActions: any;
+
+  @Input() table: RecordTable | null = null;
+  @Input() visibleRecords: TableRecordData[] = [];
+  @Input() waiting: boolean = false;
+
+  ngOnInit() {
+    if (!this.table) { return; }
+    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?.tablePropagationAttributes);
+    for (let index = 0; index < mapping.length; index++) {
+      const tableAttr = mapping[index]?.[0];
+      const componentAttr = mapping[index]?.[1]?.toString() ?? '';
+      const attributeValue = this.table?.[tableAttr];
+      this.defaultProcessAttributeChange(componentAttr, attributeValue);
+      this.customProcessAttributeChange(componentAttr, attributeValue);
+    }
+    // Subscripción a cambios en atributos
+    this.table?.attributeChange.subscribe(event => {
+      const { name: attrName, value } = event;
+      this.defaultProcessAttributeChange(attrName, value);
+      this.customProcessAttributeChange(attrName, value);
+    });
+    this.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.table?.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() ?? '', false); }
+
+  override defaultProcessAttributeChange(attribute: string, value?: any): boolean {
+    try {
+      if (attribute === 'visibleRecords') {
+        this.updateTableData();
+      }
+      return super.defaultProcessAttributeChange(attribute, value);
+    } catch {
+      return false;
+    }
+  }
+
+  filterHasChanged(column, values) {
+    if (!values || values.length === 0) {
+      this.table?.removeColumnFilter(column.fieldCode);
+    } else {
+      this.table?.addColumnFilter(column.fieldCode, values);
+    }
+  }
+}