tuain-ng-forms-lib 14.0.0 → 14.0.2

package/src/lib/classes/forms/subsection.ts

@@ -0,0 +1,91 @@
+import { FormAction } from './action';
+import { elementTypes } from './form.constants';
+
+export class RecordFormSubSection {
+  visible: boolean;
+  _customRender: string;
+  subsectionId: string;
+  subsectionCode: string;
+  subsectionTitle: string;
+  visibleStates: string[];
+
+  subSectionElements: any[];
+  subSectionFields: any[];
+  subSectionTables: any[];
+  subSectionActions: any[];
+  elementsArray: any;
+
+  constructor(subsectionReceived, formObject) {
+    if (!subsectionReceived) { return; }
+    this._customRender = null;
+    this.visible = true;
+    this.subSectionElements = [];
+    this.subSectionFields = [];
+    this.subSectionTables = [];
+    this.subSectionActions = [];
+    this.elementsArray = {};
+    this.subsectionId = (subsectionReceived.subsectionId) ? subsectionReceived.subsectionId.toString() : '';
+    this.subsectionCode = (subsectionReceived.subsectionCode) ? subsectionReceived.subsectionCode : '';
+    this.subsectionTitle = (subsectionReceived.subsectionTitle) ? subsectionReceived.subsectionTitle : '';
+    this.visibleStates = subsectionReceived.visibleStates || [];
+    if (subsectionReceived.elements) {
+      for (const receivedElement of subsectionReceived.elements) {
+        let elementObject = null;
+        let arrayToAdd = null;
+        const { type, code } = receivedElement;
+        switch (type) {
+          case elementTypes.field:
+            elementObject = formObject.getField(code);
+            arrayToAdd = this.subSectionFields;
+            break;
+          case elementTypes.table:
+            elementObject = formObject.getTable(code);
+            arrayToAdd = this.subSectionTables;
+            break;
+          case elementTypes.action:
+            elementObject = formObject.getAction(code);
+            arrayToAdd = this.subSectionActions;
+            break;
+        }
+        if (elementObject) {
+          elementObject.elementType = type;
+          arrayToAdd.push(elementObject);
+          this.subSectionElements.push(elementObject);
+          this.elementsArray[code] = elementObject;
+        }
+      }
+    }
+  }
+
+  show() { this.visible = true; }
+  hide() { this.visible = false; }
+
+  get customRender() { return this._customRender; }
+  set customRender(customRenderName) { this._customRender = customRenderName; }
+
+  getField(name) {
+    return this.subSectionFields.find(fld => fld.name === name);
+  }
+
+  getFields() {
+    return this.subSectionFields;
+  }
+
+  getFieldNames() {
+    return this.subSectionFields.map(field => field.fieldCode);
+  }
+
+  getActions(): FormAction[] {
+    return this.subSectionActions;
+  }
+
+  getActionNames(): string[] {
+    return this.subSectionActions.map(action => action.actionCode);
+  }
+
+  viewOnState(state) {
+    return this.visibleStates.includes(state);
+  }
+
+  supportMode(state) { return this.viewOnState(state); }
+}

package/src/lib/classes/forms/table/action.ts

@@ -0,0 +1,41 @@
+export class TableAction {
+  visibleStates: string[];
+  enabledStates: string[];
+  newState: string;
+
+  actionCode: string;
+  actionTitle: string;
+  iconName: string;
+  actionType: string;
+  actionClass: string;
+  stateField: string;
+
+  backend: boolean;
+  restrictedOnField: string;
+  restrictedOnValue: string;
+  restrictedOnOperator: string;
+  customAttributes: any;
+
+  constructor(actionDefinition) {
+    this.actionCode = actionDefinition.actionCode;
+    this.actionTitle = actionDefinition.actionTitle;
+    this.iconName = actionDefinition.iconName || this.actionCode;
+    this.actionType = actionDefinition.actionType || 'STANDARD';
+    this.actionClass = actionDefinition.actionClass || 'INLINE';
+    this.newState = actionDefinition.newState;
+    this.stateField = actionDefinition.stateField || '';
+
+    this.visibleStates = actionDefinition.visibleStates || [];
+    this.enabledStates = actionDefinition.enabledStates || [];
+    this.backend = actionDefinition?.serverAction ?? false;
+    this.restrictedOnField = actionDefinition.fieldRestrictedCode || '';
+    this.restrictedOnValue = actionDefinition.valueRestricted ?? '';
+    this.restrictedOnOperator = actionDefinition.operatorRestricted || '';
+    this.customAttributes = actionDefinition?.customAttributes ?? {};
+  }
+
+  supportMode(state) { return this.viewOnState(state); }
+
+  viewOnState(state) { return this.visibleStates.includes(state); }
+  enabledOnState(state) { return this.enabledStates.includes(state); }
+}

package/src/lib/classes/forms/table/column.ts

@@ -0,0 +1,91 @@
+export interface FilterDef {
+  operators: string[];
+  options: any[];
+}
+
+export interface FilterSetup {
+  fieldCode: string;
+  operator: string;
+  values: any[];
+}
+export class RecordTableColumn {
+  _formConfig: any;
+  fieldCode: string;
+  fieldTitle: string;
+  fieldType: string;
+  fieldAlignment: string;
+  fieldFormat: string;
+  visible: boolean;
+  sortable: boolean;
+  sortDirections: string[];
+  customAttributes: any;
+  // Filtros
+  filterVisible: boolean = false;
+  filterDef: FilterDef;
+  filterSetup: FilterSetup;
+
+  constructor(recTableColReceived, formConfig) {
+    this._formConfig = formConfig;
+    this.filterDef = null;
+    if (recTableColReceived) {
+      this.fieldCode = recTableColReceived.fieldCode;
+      this.fieldTitle = recTableColReceived.fieldTitle;
+      this.fieldType = recTableColReceived.fieldTypeCode || this._formConfig.fieldTypes.text;
+      const defaultTypeAlignment = (this._formConfig.tableFieldStyles[this.fieldType] != null) ? this._formConfig.tableFieldStyles[this.fieldType]['text-align'] : 'left';
+      this.fieldAlignment = (recTableColReceived.alignment != null) ? recTableColReceived.alignment.toLowerCase() : defaultTypeAlignment;
+      this.visible = recTableColReceived?.visible ?? true;
+      this.sortable = recTableColReceived?.sortable ?? false;
+      this.sortDirections = (this.sortable) ? ['ascend', 'descend'] : [null];
+      this.fieldFormat = recTableColReceived.format || '';
+      this.customAttributes = recTableColReceived?.customAttributes ?? {};
+    }
+  }
+
+  hideFilter() {
+    this.filterVisible = false;
+  }
+
+  addFilterDefinition(filterDefinition) {
+    this.filterDef = {
+      operators: filterDefinition.operators,
+      options: filterDefinition.options ?? null,
+    };
+  }
+
+  get filterDefinition() {
+    return this.filterDef;
+  }
+
+  addFilter(columnValues, operator) {
+    this.filterSetup = {
+      fieldCode: this.fieldCode,
+      operator: operator ?? this.filterDef.operators[0],
+      values: columnValues,
+    }
+  }
+
+  get filter() {
+    return this.filterSetup;
+  }
+
+  removeFilter() {
+    this.filterSetup = null;
+  }
+
+  get options() {
+    if (this.filterDef?.operators?.length === 1 && this.filterDef?.operators[0] === 'IN') {
+      return this.filterDef?.options;
+    }
+    return null;
+  }
+
+  serSortDirections(ascend: boolean, descend: boolean) {
+    this.sortDirections = [];
+    if (ascend) {
+      this.sortDirections.unshift('ascend');
+    }
+    if (descend) {
+      this.sortDirections.unshift('descend');
+    }
+  }
+}

package/src/lib/classes/forms/table/row-data.ts

@@ -0,0 +1,118 @@
+import { RecordTableColumn } from './column';
+import { operators } from '../form.constants';
+
+export class TableRecordData {
+  recordId: string;
+  selected: boolean;
+  recordData: any = {};
+
+  constructor(recordReceived, recordDefinition: RecordTableColumn[], selectionFieldName = null) {
+    const { tableRecordId, recordData } = recordReceived;
+    this.recordId = tableRecordId;
+    this.selected = false;
+    this.recordData = {};
+    if (!recordDefinition || recordDefinition.length === 0 || !recordData || recordData.length === 0) {
+      return;
+    }
+    const fieldNames = recordDefinition.map(column => column.fieldCode);
+    if (Array.isArray(recordData)) {
+      const rawRecordData = recordData.filter(fieldData => fieldData.fieldCode && fieldNames.includes(fieldData.fieldCode));
+      rawRecordData.forEach(fieldData => {
+        const { fieldCode, fieldValue } = fieldData;
+        const fieldDef = recordDefinition.find(column => column.fieldCode === fieldCode);
+        this.recordData[fieldCode] = fieldValue ?? '';
+        if (fieldCode === selectionFieldName) {
+          this.selected = fieldValue;
+        }
+      });
+    } else {
+      const fields = Object.keys(recordData);
+      fields.forEach(fieldCode => {
+        const fieldValue = recordData[fieldCode];
+        const fieldDef = recordDefinition.find(column => column.fieldCode === fieldCode);
+        this.recordData[fieldCode] = fieldValue ?? '';
+      });
+    }
+  }
+
+  toggleSelect() { this.selected = !this.selected; }
+  select() { this.selected = true; }
+  unselect() { this.selected = false; }
+
+  get recordIdKey() {
+    return (typeof this.recordId === 'object')
+      ? JSON.stringify(this.recordId) : this.recordId;
+  }
+
+  getFieldValue(fieldCode): any {
+    return (fieldCode && this.recordData) ? this.recordData[fieldCode] : null;
+  }
+
+  hasPattern(words, columnObj) {
+    if (!words || words.length === 0) {
+      return true;
+    }
+    for (const fieldCode in this.recordData) {
+      const columnDef = columnObj?.[fieldCode];
+      if (columnDef && columnDef?.visible && this.recordData.hasOwnProperty(fieldCode)) {
+        for (const word of words) {
+          const term = word.toUpperCase();
+          let fieldValue;
+          if (columnDef.fieldType.toUpperCase().includes('DATE')) {
+            fieldValue = this.recordData[fieldCode].substring(0,16);
+          }else {
+            fieldValue = this.recordData[fieldCode];
+          }
+            if (fieldValue.toString().toUpperCase().includes(term)) {
+              return true;
+            }
+        }
+      }
+    }
+    return false;
+  }
+
+  hasCondition(columnFilters) {
+    if (!columnFilters || columnFilters.length === 0) {
+      return true;
+    }
+    for (const condition of columnFilters) {
+      const { fieldCode, operator, values } = condition;
+      if (this.recordData.hasOwnProperty(fieldCode)) {
+        const fieldValue = this.recordData[fieldCode];
+        const stringValue = fieldValue.toString().toUpperCase();
+        if (operator === operators.G && fieldValue <= values[0]) {
+          return false;
+        }
+        if (operator === operators.L && fieldValue >= values[0]) {
+          return false;
+        }
+        if (operator === operators.GE && fieldValue < values[0]) {
+          return false;
+        }
+        if (operator === operators.LE && fieldValue > values[0]) {
+          return false;
+        }
+        if (operator === operators.IN && !values.includes(fieldValue)) {
+          return false;
+        }
+        if (operator === operators.EQ) {
+          return fieldValue === values[0];
+        }
+        if (operator === operators.NEQ && fieldValue === values[0]) {
+          return false;
+        }
+        if (operator === operators.HAS && !stringValue.includes(values[0].toString().toUpperCase())) {
+          return false;
+        }
+        if (operator === operators.NOTHAS && stringValue.includes(values[0].toString().toUpperCase())) {
+          return false;
+        }
+        if (operator === operators.BETWEEN && (fieldValue < values[0] || fieldValue > values[1])) {
+          return false;
+        }
+      }
+    }
+    return true;
+  }
+}