@guiexpert/table 1.1.18 → 1.1.21

package/src/lib/table/data/tablemodel/areamodel/abstract-area-model.ts

@@ -0,0 +1,184 @@
+import { CellRendererIf } from "../../../renderer/cell-render.if";
+import { AreaModelIf } from "./area-model.if";
+import { CheckedType } from "../../common/checked-type";
+import { ColumnDefIf } from "../column/column-def.if";
+import { AreaIdent } from "../area-ident.type";
+import { CheckboxModelIf } from "../../../checkbox/checkbox-model.if";
+import { FilterFunction } from "../../common/filter-function";
+import { SortItem } from "../../common/sort-item";
+import { HasDefaultRowHeightIf } from "./has-default-row-height-if";
+
+
+export abstract class AbstractAreaModel<T> implements AreaModelIf, HasDefaultRowHeightIf {
+
+  public rowSelectionModel: CheckboxModelIf<any> | undefined = undefined;
+  protected cellRenderers: (CellRendererIf | undefined)[];
+  protected yPositions: number[] = [];
+
+  constructor(
+    public areaIdent: AreaIdent,
+    protected columnDefs: ColumnDefIf[] = [],
+    public defaultRowHeight: number = -1
+  ) {
+    this.cellRenderers = columnDefs.map(def => def.rendererMap[areaIdent]);
+  }
+
+
+  abstract getRowCount(): number;
+
+  abstract getValueAt(rowIndex: number, columnIndex: number): any;
+
+  getTextValueAt(rowIndex: number, columnIndex: number): string {
+    // TODO date to iso aso...
+    return '' + this.getValueAt(rowIndex, columnIndex);
+  }
+
+  getTooltipAt(_rowIndex: number, _columnIndex: number): any {
+    return "";
+  };
+
+  abstract getRowHeight(rowIndex: number): number;
+
+  getCellRenderer(_rowIndex: number, columnIndex: number): CellRendererIf | undefined {
+    if (columnIndex < this.cellRenderers.length) {
+      return this.cellRenderers[columnIndex];
+    }
+    return undefined;
+  }
+
+  getColspanAt(_rowIndex: number, _columnIndex: number): number {
+    return 0;
+  }
+
+  getCustomClassesAt(_rowIndex: number, _columnIndex: number): string[] {
+    return [];
+  }
+
+  getCustomStyleAt(_rowIndex: number, _columnIndex: number): { [key: string]: string } | undefined {
+    return undefined;
+  }
+
+  getRowspanAt(_rowIndex: number, _columnIndex: number): number {
+    return 0;
+  }
+
+  getRowByIndex(_rowIndex: number): any {
+    return undefined;
+  }
+
+  isRowCheckable(_rowIndex: number): boolean {
+    return true;
+  }
+
+  isRowChecked(rowIndex: number): CheckedType | undefined {
+    const row = this.getRowByIndex(rowIndex);
+    return this.rowSelectionModel?.isRowChecked(row);
+  }
+
+  setRowChecked(rowIndex: number, checked: boolean): void {
+    if (this.rowSelectionModel) {
+      const row = this.getRowByIndex(rowIndex);
+      this.rowSelectionModel.checkRow(row, checked);
+    }
+  }
+
+  getMaxColspan(): number {
+    return 31;
+  }
+
+  getMaxRowspan(): number {
+    return 31;
+  }
+
+
+  getYPosByRowIndex(rowIndex: number): number {
+    if (this.defaultRowHeight > 0) {
+      return this.defaultRowHeight * rowIndex;
+    }
+    return this.yPositions[rowIndex];
+  }
+
+
+  init() {
+    if (!this.yPositions.length && this.getRowCount() !== undefined) {
+      if (this.defaultRowHeight === -1) {
+        this.calcYPositions();
+      }
+    }
+  }
+
+  abstract externalFilterChanged<T>(predictFn: FilterFunction<T>): void ;
+
+  isFilterable(): boolean {
+    return this.areaIdent === "body";
+  }
+
+  doSort(_sortItems: SortItem[]): boolean {
+    // do nothing
+    return false;
+  }
+
+
+  isEditable(_rowIndex: number, columnIndex: number): boolean {
+    const columnDef = this.columnDefs?.[columnIndex];
+    return columnDef?.editable?.() ?? false;
+  }
+
+  setValue(rowIndex: number, columnIndex: number, value: any): boolean {
+    const editInputPipe = this.columnDefs[columnIndex]?.editInputPipe;
+    if (editInputPipe) {
+      value = editInputPipe(value, rowIndex, columnIndex);
+    }
+    const row: T = this.getRowByIndex(rowIndex);
+    const property = this.columnDefs[columnIndex].property;
+    if (property.includes(".")) {
+      return this.setPropertyValue(row, property.split("."), value);
+    }
+
+    row[property as keyof T] = value;
+    return true;
+  }
+
+
+  isSelectable(_rowIndex: number, _columnIndex: number): boolean {
+    return true;
+  }
+
+  changeColumnOrder(sourceColumnIndex: number, targetColumnIndex: number): void {
+    //  not this! this.arrayMove(this.columnDefs...)
+    this.arrayMove(this.cellRenderers, sourceColumnIndex, targetColumnIndex);
+  }
+
+  protected setPropertyValue(o: any, props: string[], value: any): boolean {
+    const prop = props.shift();
+    if (prop) {
+      const o2 = o[prop];
+      if (o2 && props.length) {
+        return this.setPropertyValue(o2, props, value);
+
+      } else {
+        o[prop] = value;
+        return true;
+      }
+    }
+    return false;
+  }
+
+  protected arrayMove(arr: any[], fromIndex: number, toIndex: number) {
+    const element = arr.splice(fromIndex, 1)[0];
+    arr.splice(toIndex, 0, element);
+    return arr;
+  }
+
+  private calcYPositions() {
+    const rowCount = this.getRowCount();
+    this.yPositions = new Array(rowCount + 1);
+    this.yPositions[0] = 0;
+    for (let i = 0; i < rowCount; i++) {
+      this.yPositions[i + 1] = this.getRowHeight(i) + this.yPositions[i];
+    }
+  }
+
+}
+
+

package/src/lib/table/data/tablemodel/areamodel/area-model-array-of-arrays.ts

@@ -0,0 +1,63 @@
+import { AbstractAreaModel } from "./abstract-area-model";
+import { AreaIdent } from "../area-ident.type";
+import { ColumnDefIf } from "../column/column-def.if";
+import { FilterFunction } from "../../common/filter-function";
+
+/**
+ * Represents a model for an area containing a two-dimensional array of data.
+ * @template T - The type of data in the array.
+ */
+export class AreaModelArrayOfArrays<T> extends AbstractAreaModel<T[][]> {
+
+  public filteredArr: T[][];
+
+  constructor(
+    public override areaIdent: AreaIdent,
+    public readonly arr: T[][],
+    public override defaultRowHeight: number,
+    protected override columnDefs: ColumnDefIf[] = []
+  ) {
+    super(areaIdent, columnDefs, defaultRowHeight);
+    this.filteredArr = [...arr];
+  }
+
+  externalFilterChanged(predictFn: FilterFunction<any>): void {
+    this.filteredArr = this.arr ? this.arr.filter(predictFn) : [];
+  }
+
+  getRowCount(): number {
+    if (this.filteredArr) {
+      return this.filteredArr.length;
+    }
+    return 0;
+  }
+
+  getValueAt(rowIndex: number, columnIndex: number): any {
+    return this.filteredArr[rowIndex][columnIndex];
+  }
+
+  override setValue(rowIndex: number, columnIndex: number, value: any): boolean {
+    const editInputPipe = this.columnDefs[columnIndex]?.editInputPipe;
+    if (editInputPipe) {
+      value = editInputPipe(value, rowIndex, columnIndex);
+    }
+    this.arr[rowIndex][columnIndex] = value;
+    return true;
+  }
+
+  override getRowByIndex(rowIndex: number): any {
+    return this.filteredArr[rowIndex];
+  }
+
+  getRowHeight(_rowIndex: number): number {
+    return this.defaultRowHeight;
+  }
+
+  override changeColumnOrder(sourceColumnIndex: number, targetColumnIndex: number): void {
+    this.filteredArr.forEach(row => this.arrayMove(row, sourceColumnIndex, targetColumnIndex));
+    super.changeColumnOrder(sourceColumnIndex, targetColumnIndex);
+  }
+
+
+}
+

package/src/lib/table/data/tablemodel/areamodel/area-model-cell-groups.ts

@@ -0,0 +1,236 @@
+import { AreaIdent } from '../area-ident.type';
+import { ColumnDefIf } from '../column/column-def.if';
+import { AreaModelIf } from './area-model.if';
+import { CellGroupIf } from '../cellgroup/cell-group.if';
+import { CheckboxModelIf } from '../../../checkbox/checkbox-model.if';
+import { SortItem } from '../../common/sort-item';
+import { FilterFunction } from '../../common/filter-function';
+import { CellRendererIf } from '../../../renderer/cell-render.if';
+import { CheckedType } from '../../common/checked-type';
+import { CellgroupFactory } from '../cellgroup/cellgroup-factory';
+import { CellGroupExt } from '../cellgroup/cell-group-ext';
+import { CellGroupExtCellRenderer } from '../../../renderer/cell-group-ext-cell-renderer';
+import { MouseTargetData } from '../../event/mouse-target-data';
+import { HeaderGroupOptionsIf } from '../../options/header-group-options.if';
+import { HeaderGroupOptions } from '../../options/header-group-options';
+
+// TODO next steps:   fix this model
+export class AreaModelCellGroups implements AreaModelIf {
+
+  public gammaCells = true;
+
+  public rowSelectionModel: CheckboxModelIf<any> | undefined;
+  public arr: (CellGroupExt | null | undefined)[][] = [];
+
+  private groupExts: CellGroupExt[] = [];
+  private cellGroupExtCellRenderer;
+
+  constructor(
+    public readonly areaIdent: AreaIdent = 'header',
+    readonly groups: CellGroupIf[],
+    public columnDefs: ColumnDefIf[] = [],
+    public readonly defaultRowHeight: number,
+    private headerGroupOptions: HeaderGroupOptionsIf = new HeaderGroupOptions()
+  ) {
+    this.cellGroupExtCellRenderer = new CellGroupExtCellRenderer(this.headerGroupOptions);
+    this.groupExts = CellgroupFactory.buildGroupExts(groups);
+    this.init();
+  }
+
+  init(){
+    // console.info(this.groupExts);
+    // console.info(this.getAllLeafs());
+    // console.info(this.getMaxRowCount());
+    for (const g of this.groupExts) {
+      g.log(this.getMaxRowCount());
+      // console.info(g.getAllRowCounts(g));
+    }
+    this.arr = this.buildArray();
+
+    if (!this.columnDefs?.length && this.areaIdent === 'header') {
+      this.columnDefs = CellgroupFactory.buildColumnDefs(this.groups);
+      // console.info('this.columnDefs', this.columnDefs);
+    }
+  }
+
+  getAllLeafs(): CellGroupExt[] {
+    const flatten = CellgroupFactory.flattenGroupExts(this.groupExts);
+    return flatten.filter(ge => !ge.children);
+  }
+
+  getMaxRowCount(): number {
+    const allLeafs = this.getAllLeafs();
+    if (allLeafs?.length) {
+      return 1 + Math.max(...allLeafs.map(c => c.getParentCount(c)));
+    }
+    return 0;
+  }
+
+  buildArray(): (CellGroupExt | null | undefined)[][] {
+    // // console.info('');
+    const flatten = CellgroupFactory.flattenGroupExts(this.groupExts);
+    // // console.info("flat", flatten);
+
+    // const maxCol = flatten.length;
+    const maxRow = 1 + Math.max(...flatten.map(c => c.rowIndex));
+    // console.info('max  row/col:', maxRow + '/' + maxCol);
+
+    const sb: string[] = [];
+    CellgroupFactory.iterateThrowColumns(sb, this.groupExts);
+    // console.info(sb);
+
+    const arrs = Array.from(Array(maxRow).keys()).map((_r) => []);
+    const ret = CellgroupFactory.buildArrayOfArrays(flatten, arrs);
+    console.table(ret);
+
+    /*
+
+Gold                                                Hohenwarte
+Gold AB              Gold CD                        HOH AB                      HOH CD
+Gold A     Gold B    Gold C   Gold D    Gold Sum    HOH Loc    HOH A    HOH B   HOH C    HOH D
+
+*/
+    return ret;
+  }
+
+  changeColumnOrder(_sourceColumnIndex: number, _targetColumnIndex: number): void {
+    // skip
+  }
+
+  doSort(_sortItems: SortItem[]): boolean {
+    return false;
+  }
+
+  externalFilterChanged<T>(_predictFn: FilterFunction<T>): void {
+    // skip
+  }
+
+  getCellRenderer(_rowIndex: number, _columnIndex: number): CellRendererIf | undefined {
+    return this.cellGroupExtCellRenderer;
+  }
+
+  getColspanAt(rowIndex: number, columnIndex: number): number {
+    // let ret = 1;
+    //
+    // if (this.getValueAt(rowIndex, columnIndex)){
+    //   const maxCol = this.arr[0].length;
+    //   while (ret< maxCol && this.getValueAt(rowIndex, columnIndex + ret)===null){
+    //     ret++;
+    //   }
+    // }
+    // return ret;
+
+    const val = this.getValueAt(rowIndex, columnIndex);
+    if (val) {
+      return val.getColumnCount();
+    }
+    return 0;
+  }
+
+  getCustomClassesAt(_rowIndex: number, _columnIndex: number): string[] {
+    return [];
+  }
+
+  getCustomStyleAt(_rowIndex: number, _columnIndex: number): { [p: string]: string } | undefined {
+    return undefined;
+  }
+
+  getMaxColspan(): number {
+    return 12;
+  }
+
+  getMaxRowspan(): number {
+    return 12;
+  }
+
+  getRowByIndex(_rowIndex: number): any {
+    return undefined;
+  }
+
+  getRowCount(): number {
+    if (this.arr) {
+      return this.arr.length;
+    }
+    return 0;
+  }
+
+
+  getRowspanAt(rowIndex: number, columnIndex: number): number {
+    // TODO
+    const cge: CellGroupExt | null | undefined = this.getValueAt(rowIndex, columnIndex);
+    if (cge) {
+      const maxRowCount = this.getRowCount();
+      return cge.getRowSpan(cge, maxRowCount);
+    }
+    return 0;
+  }
+
+  getTooltipAt(_rowIndex: number, _columnIndex: number): any {
+    // TODO
+    return '';
+  }
+
+  getValueAt(rowIndex: number, columnIndex: number): any {
+    return this.arr[rowIndex][columnIndex];
+  }
+
+  getTextValueAt(rowIndex: number, columnIndex: number): string {
+    return '' + this.getValueAt(rowIndex, columnIndex);
+  }
+
+  getYPosByRowIndex(_rowIndex: number): number {
+    // TODO
+    return 0;
+  }
+
+
+  getRowHeight(_rowIndex: number): number {
+    return this.defaultRowHeight;
+  }
+
+  isEditable(_rowIndex: number, _columnIndex: number): boolean {
+    return false;
+  }
+
+  isFilterable(): boolean {
+    return false;
+  }
+
+  isRowCheckable(_rowIndex: number): boolean {
+    return false;
+  }
+
+  isRowChecked(_rowIndex: number): CheckedType | undefined {
+    return undefined;
+  }
+
+  isSelectable(_rowIndex: number, _columnIndex: number): boolean {
+    return false;
+  }
+
+  setRowChecked(_rowIndex: number, _checked: boolean): void {
+    // skipped
+  }
+
+  setValue(_rowIndex: number, _columnIndex: number, _value: any): boolean {
+    return false;
+  }
+
+  toggleHeaderGroup(mouseTargetData: MouseTargetData) {
+    const cellGroup: (CellGroupExt | null | undefined) = this.arr[mouseTargetData.rowIdx][mouseTargetData.colIdx];
+    if (cellGroup?.toggle && cellGroup.visibility !== 'always') {
+      cellGroup.closed = !cellGroup.closed;
+
+      this.init();
+      //this.groupExts = CellgroupFactory.buildGroupExts(this.groups);
+
+      // this.columnDefs = CellgroupFactory.buildColumnDefs(this.groups);
+      // this.arr = this.buildArray();
+      
+      // console.info('columnDefs', this.columnDefs);
+      // console.info('toggled', cellGroup);
+      // console.info('columnDefs 2', CellgroupFactory.buildColumnDefs(this.groups));
+    }
+    return CellgroupFactory.buildColumnDefs(this.groupExts);
+  }
+}

package/src/lib/table/data/tablemodel/areamodel/area-model-hidden.ts

@@ -0,0 +1,126 @@
+import { AreaModelIf } from "./area-model.if";
+import { CellRendererIf } from "../../../renderer/cell-render.if";
+import { CheckedType } from "../../common/checked-type";
+import { CheckboxModelIf } from "../../../checkbox/checkbox-model.if";
+import { FilterFunction } from "../../common/filter-function";
+import { SortItem } from "../../common/sort-item";
+import { AreaIdent } from "../area-ident.type";
+
+/**
+ * An invisible model, which is used internally for hiding a header.
+ */
+export class AreaModelHidden implements AreaModelIf {
+
+  rowSelectionModel: CheckboxModelIf<any> | undefined = undefined;
+
+  constructor(
+    public areaIdent: AreaIdent = "body"
+  ) {
+  }
+
+  getRowCount(): number {
+    return 0;
+  }
+
+  getValueAt(_rowIndex: number, _columnIndex: number): any {
+    return "";
+  }
+
+
+  getTextValueAt(_rowIndex: number, _columnIndex: number): string {
+    return "";
+  }
+
+
+  getCellRenderer(_rowIndex: number, _columnIndex: number): CellRendererIf | undefined {
+    return undefined;
+  }
+
+  getRowHeight(_rowIndex: number): number {
+    return 0;
+  }
+
+  getColspanAt(_rowIndex: number, _columnIndex: number): number {
+    return 0;
+  }
+
+  getCustomClassesAt(_rowIndex: number, _columnIndex: number): string[] {
+    return [];
+  }
+
+  getCustomStyleAt(_rowIndex: number, _columnIndex: number): { [key: string]: string } | undefined {
+    return undefined;
+  }
+
+  getRowspanAt(_rowIndex: number, _columnIndex: number): number {
+    return 0;
+  }
+
+  getRowByIndex(_idx: number): any {
+    return undefined;
+  }
+
+  isRowCheckable(_rowIndex: number): boolean {
+    return false;
+  }
+
+  isRowChecked(_rowIndex: number): CheckedType | undefined {
+    return undefined;
+  }
+
+  setRowChecked(_rowIndex: number, _checked: boolean): void {
+    // nothing
+  }
+
+  getTooltipAt(_rowIndex: number, _columnIndex: number): any {
+    return "";
+  }
+
+  getMaxColspan(): number {
+    return 0;
+  }
+
+  getMaxRowspan(): number {
+    return 0;
+  }
+
+
+  getYPosByRowIndex(_rowIndex: number): number {
+    return 0;
+  }
+
+  init(): void {
+    // nothing
+  }
+
+  externalFilterChanged(_predictFn: FilterFunction<any>): void {
+    // nothing
+  }
+
+  isFilterable(): boolean {
+    return false;
+  }
+
+  doSort(_sortItems: SortItem[]): boolean {
+    // do nothing
+    return false;
+  }
+
+  isEditable(_rowIndex: number, _columnIndex: number): boolean {
+    return false;
+  }
+
+  setValue(_rowIndex: number, _columnIndex: number, _value: string): boolean {
+    return false;
+  }
+
+  isSelectable(_rowIndex: number, _columnIndex: number): boolean {
+    return false;
+  }
+
+  changeColumnOrder(_sourceColumnIndex: number, _targetColumnIndex: number): void {
+    // skip
+  }
+
+}
+

package/src/lib/table/data/tablemodel/areamodel/area-model-object-array-with-columndefs.ts

@@ -0,0 +1,28 @@
+import { AreaModelObjectArray } from "./area-model-object-array";
+import { ColumnDefIf } from "../column/column-def.if";
+import { AreaIdent } from "../area-ident.type";
+
+/**
+ * Represents an array of objects with column definitions for an area model.
+ *
+ * @template T - The type of objects in the array.
+ */
+export class AreaModelObjectArrayWithColumndefs<T> extends AreaModelObjectArray<T> {
+
+
+  constructor(
+    public override areaIdent: AreaIdent,
+    protected override rows: T[],
+    protected override readonly columnDefs: ColumnDefIf[],
+    public override defaultRowHeight: number
+  ) {
+    super(
+      areaIdent,
+      rows,
+      defaultRowHeight,
+      columnDefs
+    );
+  }
+
+}
+