@sankhyalabs/ezui 1.1.161 → 1.2.0-beta.1

package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js

@@ -3,8 +3,7 @@ import { Grid } from "ag-grid-community";
 import gridTerms from "./i18n/pt-BR.js";
 import getHeaderColumnTemplate from "./template/HeaderColumnTemplate.js";
 import DataSource from "./DataSource";
-import { ApplicationContext, DataType } from "@sankhyalabs/core";
-import { SortMode, UserInterface } from "@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata";
+import { ApplicationContext, DataType, SortMode, UserInterface } from "@sankhyalabs/core";
 import { NumberUtils, StringUtils } from "@sankhyalabs/core";
 export default class AgGridController {
   constructor(enterprise) {
@@ -14,8 +13,6 @@ export default class AgGridController {
     this.BLOCK_LOAD_DEBOUNCE = 400;
     this._menuItems = [];
     this._idAttribName = "__record__id__";
-    this._isFirstRecordOfPage = true;
-    this._isLastRecordOfPage = false;
     this._enterprise = enterprise;
   }
   getSort() {
@@ -38,23 +35,21 @@ export default class AgGridController {
       LicenseManager.setLicenseKey(ApplicationContext.getContextValue("__EZUI__GRID_LICENSE__"));
       this._columnStateChangeCallback = options.onColumnStateChange;
       this._selectionChangeCallback = options.onSelectionChange;
-      this._paginationChangeCallback = options.onPaginationChange;
       this._doubleClickCallBack = options.onDoubleClick;
       this._multipleSelection = options.allowMultipleSelection;
-      this._pageSize = options.pageSize;
-      this._serverURL = options.serverURL;
       this._dataUnit = options.dataUnit;
       if (this._dataUnit) {
         this._dataUnit.sortingProvider = this;
       }
-      this._dataSource = new DataSource(this._dataUnit, this._serverURL);
+      this._dataSource = new DataSource(this._dataUnit, this, options);
       this._gridOptions = {
         localeText: gridTerms,
         rowModelType: "serverSide",
-        serverSideStoreType: "partial",
+        serverSideSortOnServer: true,
         rowSelection: this._multipleSelection ? "multiple" : "single",
         serverSideDatasource: this._dataSource,
         sortingOrder: ['desc', 'asc', null],
+        columnDefs: this._colDefs,
         blockLoadDebounceMillis: this.BLOCK_LOAD_DEBOUNCE,
         getRowNodeId: this._dataUnit ? (params) => typeof params === "string" ? params : params[this._idAttribName] : undefined,
         getMainMenuItems: (params) => {
@@ -66,15 +61,9 @@ export default class AgGridController {
           }));
           return items;
         },
-        //FIXME: Existe um bug no PartialStore.prototype.destroyAllBlocks do ag-grid, pois
-        //apesar de destruir os blocos, mantém a variável "blockHeights" com o tamanho antigo
-        //dos blocos, então, quando removemos uma linha, a altura do bloco não é recalculada.
-        //Descobri que setando manualmente a altura das linhas, apesar do bloco ficar com 
-        //tamanho errado, isso afeta menos o componente.
         getRowHeight: this.getRowHeight.bind(this)
       };
       this.setOptionsEvents(this._gridOptions);
-      this.setOptionsPagination(this._gridOptions);
       this.setOptionsSupress(this._gridOptions);
       if (this._enterprise) {
         this._grid = new EnterpriseGrid(container, this._gridOptions);
@@ -82,7 +71,6 @@ export default class AgGridController {
       else {
         this._grid = new Grid(container, this._gridOptions);
       }
-      this._lastPageStatus = this.getPaginationStatus();
       //Atualiza estado da seleção inicial
       this.onSelectionChange();
       this._gridOptions.api.setHeaderHeight(this.getRowHeight());
@@ -98,24 +86,11 @@ export default class AgGridController {
     opt.onColumnMoved = e => this.onCallStateChange("columnMoved", e);
     opt.onColumnVisible = e => this.onCallStateChange("visibleChange", e);
     opt.onSelectionChanged = () => this.onSelectionChange();
-    opt.onPaginationChanged = () => this.onPaginationChange();
     opt.onRowDoubleClicked = evt => this.onRowDoubleClick(evt);
     opt.onDragStopped = evt => this.onCallStateChange("columnMovedEnd", evt);
   }
-  syncSelection() {
-    if (this._dataUnit) {
-      this.selectRows(this._dataUnit.getSelection());
-    }
-  }
-  setOptionsPagination(opt) {
-    opt.pagination = (this._pageSize > -1);
-    opt.paginationPageSize = this._pageSize;
-    opt.cacheBlockSize = this._pageSize;
-    opt.maxBlocksInCache = 1;
-  }
   setOptionsSupress(opt) {
     opt.suppressDragLeaveHidesColumns = true;
-    opt.suppressPaginationPanel = true;
     opt.suppressMenuHide = true;
   }
   setData(data) {
@@ -128,15 +103,11 @@ export default class AgGridController {
     if (this._grid === undefined) {
       throw new Error("Erro interno: Grid ainda não inicializado.");
     }
-    this._dataSource.setLocalRefresh(true);
-    this._gridOptions.api.refreshServerSideStore({ purge: true });
   }
   updateRows() {
     if (this._grid === undefined) {
       throw new Error("Erro interno: Grid ainda não inicializado.");
     }
-    this._dataSource.setLocalRefresh(true);
-    this._gridOptions.api.refreshServerSideStore({ purge: true });
   }
   selectRows(rowIds) {
     if (this._grid === undefined) {
@@ -155,7 +126,7 @@ export default class AgGridController {
     if (this._grid === undefined) {
       throw new Error("Erro interno: Grid ainda não inicializado.");
     }
-    this._gridOptions.api.refreshServerSideStore({ purge: true });
+    this._gridOptions.api.refreshServerSide({ purge: true });
   }
   changeValues(changes, rowIds) {
     if (this._grid === undefined) {
@@ -188,15 +159,12 @@ export default class AgGridController {
     if (this._grid === undefined) {
       throw new Error("Erro interno: Grid ainda não inicializado.");
     }
-    this._gridOptions.api.refreshServerSideStore({ purge: false });
+    this._gridOptions.api.refreshServerSide({ purge: false });
   }
   setColumnsDef(cols, showCheckSelection) {
-    if (this._grid === undefined) {
-      throw new Error("Erro interno: Grid ainda não inicializado.");
-    }
-    const colDefs = [];
+    const newColDefs = [];
     if (showCheckSelection) {
-      colDefs.push({
+      newColDefs.push({
         colId: this.CHECK_BOX_COL_ID,
         headerName: "",
         checkboxSelection: true,
@@ -209,9 +177,12 @@ export default class AgGridController {
       });
     }
     cols.forEach(c => {
-      colDefs.push(this.buildColDef(c));
+      newColDefs.push(this.buildColDef(c));
     });
-    this._gridOptions.api.setColumnDefs(colDefs);
+    this._colDefs = newColDefs;
+    if (this._gridOptions) {
+      this._gridOptions.api.setColumnDefs(this._colDefs);
+    }
   }
   getColumnsDef() {
     if (this._grid === undefined) {
@@ -281,96 +252,21 @@ export default class AgGridController {
   addColumnMenuItem(item) {
     this._menuItems.push(item);
   }
-  nextPage() {
-    this._lastPageStatus = this.getPaginationStatus();
-    this._gridOptions.api.paginationGoToNextPage();
-  }
-  previousPage() {
-    this._lastPageStatus = this.getPaginationStatus();
-    this._gridOptions.api.paginationGoToPreviousPage();
-  }
-  goToPage(page) {
-    this._gridOptions.api.paginationGoToPage(page);
-  }
   quickFilter(term) {
-    this._dataSource.setQuickFilter(term, this._gridOptions.columnApi
-      .getAllColumns()
-      .filter(col => col.isVisible() && ![this.CHECK_BOX_COL_ID, this.RECORD_ARCHIVE_COL_ID].includes(col.getColId()))
-      .map(col => col.getColId()));
-    this.goToPage(0);
-    this._gridOptions.api.refreshServerSideStore({ purge: true });
-  }
-  isLastOfPage() {
-    return this._isLastRecordOfPage;
-  }
-  isFirstOfPage() {
-    return this._isFirstRecordOfPage;
-  }
-  previousRecord() {
-    const pagination = this.getPaginationStatus();
-    if (this._isFirstRecordOfPage && pagination.hasPrevious) {
-      this.previousPage();
-    }
-    else {
-      if (this._dataUnit) {
-        this._dataUnit.previousRecord();
-      }
-      else {
-        const node = this._gridOptions.api.getSelectedNodes()[0];
-        this.setSelectedIndex(node.rowIndex - 1);
-      }
-    }
-  }
-  nextRecord() {
-    const pagination = this.getPaginationStatus();
-    if (this._isLastRecordOfPage && pagination.hasNext) {
-      this.nextPage();
-    }
-    else {
-      if (this._dataUnit) {
-        this._dataUnit.nextRecord();
-      }
-      else {
-        const node = this._gridOptions.api.getSelectedNodes()[0];
-        this.setSelectedIndex(node.rowIndex + 1);
-      }
-    }
-  }
-  selectFirstRow() {
-    this._dataUnit.selectFirst();
-  }
-  hasPreviousRecord() {
-    const pagination = this.getPaginationStatus();
-    if (this._isFirstRecordOfPage) {
-      return pagination.hasPrevious;
-    }
-    else {
-      if (this._dataUnit) {
-        return this._dataUnit.hasPrevious();
-      }
-      else {
-        return pagination.hasPrevious || this._gridOptions.api.getSelectedRows()[0].rowIndex > 0;
-      }
-    }
-  }
-  hasNextRecord() {
-    const pagination = this.getPaginationStatus();
-    if (this._isLastRecordOfPage) {
-      return pagination.hasNext;
+    if (term) {
+      const quickFilter = {
+        term,
+        fields: this._gridOptions.columnApi
+          .getColumns()
+          .filter(col => col.isVisible() && ![this.CHECK_BOX_COL_ID, this.RECORD_ARCHIVE_COL_ID].includes(col.getColId()))
+          .map(col => col.getColId())
+      };
+      this._dataSource.quickFilter = quickFilter;
     }
     else {
-      if (this._dataUnit) {
-        return this._dataUnit.hasNext() || this.getPaginationStatus().hasNext;
-      }
-      else {
-        const api = this._gridOptions.api;
-        return pagination.hasNext || api.getSelectedRows()[0].rowIndex < api.getDisplayedRowCount();
-      }
+      this._dataSource.quickFilter = undefined;
     }
   }
-  selectLastRow() {
-    this._dataUnit.selectLast();
-  }
   setSelectedIndex(index) {
     var _a;
     (_a = this._gridOptions.api.getDisplayedRowAtIndex(index)) === null || _a === void 0 ? void 0 : _a.setSelected(true);
@@ -464,49 +360,12 @@ export default class AgGridController {
     return false;
   }
   onSelectionChange() {
-    const selectedNodes = this._gridOptions.api.getSelectedNodes();
-    if (selectedNodes.length > 0) {
-      this._isFirstRecordOfPage = selectedNodes[0].rowIndex === this._gridOptions.api.getFirstDisplayedRow();
-      this._isLastRecordOfPage = selectedNodes[0].rowIndex === this._gridOptions.api.getLastDisplayedRow();
-    }
     if (this._selectionChangeCallback) {
       this._selectionChangeCallback({
-        selection: this._gridOptions.api.getSelectedRows(),
-        isFirstOfPage: this._isFirstRecordOfPage,
-        isLastOfPage: this._isLastRecordOfPage
+        selection: this._gridOptions.api.getSelectedRows()
       });
     }
   }
-  onPaginationChange() {
-    var _a, _b;
-    const currentPageStatus = this.getPaginationStatus();
-    if (((_a = this._lastPageStatus) === null || _a === void 0 ? void 0 : _a.currentPage) != (currentPageStatus === null || currentPageStatus === void 0 ? void 0 : currentPageStatus.currentPage)) {
-      ((_b = this._lastPageStatus) === null || _b === void 0 ? void 0 : _b.currentPage) < (currentPageStatus === null || currentPageStatus === void 0 ? void 0 : currentPageStatus.currentPage) ? this.selectFirstRow() : this.selectLastRow();
-    }
-    this.syncSelection();
-    if (this._paginationChangeCallback) {
-      if (this._gridOptions.api) {
-        this._paginationChangeCallback(currentPageStatus);
-      }
-    }
-  }
-  getPaginationStatus() {
-    const api = this._gridOptions.api;
-    const currentPage = api.paginationGetCurrentPage();
-    const isLastPage = api.paginationGetTotalPages() === (currentPage + 1);
-    const pageSize = api.paginationGetPageSize();
-    const totalRows = api.paginationGetRowCount();
-    const pageStart = currentPage * pageSize + 1;
-    const pageEnd = Math.min(totalRows, (currentPage + 1) * pageSize);
-    return {
-      hasPrevious: currentPage > 0,
-      hasNext: !isLastPage,
-      currentPage: currentPage + 1,
-      pageStart,
-      pageEnd,
-      totalRows
-    };
-  }
   onRowDoubleClick(evt) {
     if (this._doubleClickCallBack) {
       this._doubleClickCallBack(evt.data);

package/dist/collection/components/ez-grid/controller/ag-grid/DataSource.js

@@ -1,56 +1,83 @@
-import Server from "./mock/Server";
+import { Action, ObjectUtils } from "@sankhyalabs/core";
 export default class DataSource {
-  constructor(dataUnit, serverURL) {
+  constructor(dataUnit, controller, options) {
+    this.RECORD_ARCHIVE = "__RECORD_ARCHIVE__";
+    this.duObserver = (action) => {
+      switch (action.type) {
+        case Action.METADATA_LOADED:
+          this._controller.setColumnsDef(this.buildColumnDefs(), true);
+          break;
+        case Action.LOADING_DATA:
+          this._waitingForLoad = true;
+          this._controller.refresh();
+          break;
+        case Action.DATA_LOADED:
+          this._waitingForLoad = false;
+          this.callbackGetRows(this._lastLoadingParams);
+          if (this._options) {
+            this._options.onPaginationChange(this._dataUnit.getPaginationInfo());
+          }
+          break;
+        case Action.RECORDS_REMOVED:
+        case Action.DATA_SAVED:
+        case Action.EDITION_CANCELED:
+        case Action.DATA_CHANGED:
+          this._controller.refresh();
+          break;
+        case Action.SELECTION_CHANGED:
+        case Action.NEXT_SELECTED:
+        case Action.PREVIOUS_SELECTED:
+          this._controller.selectRows(this._dataUnit.getSelection());
+          break;
+      }
+    };
     this._dataUnit = dataUnit;
-    this._serverURL = serverURL;
+    this._controller = controller;
+    this._controller.setColumnsDef(this.buildColumnDefs(), true);
+    this._options = options;
+    this._dataUnit.subscribe(this.duObserver);
   }
   getRows(params) {
-    if (this._useMockedServer) {
-      if (this._mockedServer === undefined) {
-        this.loadData()
-          .then(data => {
-          this._mockedServer = new Server(data.rowData);
-          params.success(this._mockedServer.getData(params.request));
-        })
-          .catch(() => params.fail());
-      }
-      else {
-        params.success(this._mockedServer.getData(params.request));
-      }
+    if (this.needReload(params)) {
+      this._lastLoadingParams = params;
+      this._dataUnit.loadData(this.quickFilter);
     }
     else {
-      this.loadData({ limit: params.api.paginationGetPageSize(), offset: params.request.startRow, quickFilter: this._quickFilter })
-        .then(data => params.success(data))
-        .catch(() => params.fail());
+      this._lastLoadingParams = params;
+      if (!this._waitingForLoad) {
+        this.callbackGetRows(params);
+      }
     }
   }
-  loadData(page) {
-    return new Promise((resolve, reject) => {
-      if (this._dataUnit) {
-        if (this._localRefresh && this._lastPageResponse) {
-          resolve({ rowCount: (this._lastPageResponse.rowCount + Math.max((this._dataUnit.records.length - this._lastPageResponse.rowData.length), 0)), rowData: this._dataUnit.records });
-          this._localRefresh = false;
-        }
-        else {
-          this._dataUnit.loadData(page).then(pageRes => {
-            this._lastPageResponse = { rowData: this._dataUnit.records, rowCount: pageRes ? pageRes.total : 0 };
-            resolve(this._lastPageResponse);
-          });
-        }
-      }
-      else {
-        fetch(this._serverURL)
-          .then(response => {
-          response.json().then(rowData => resolve({ rowData }));
-        })
-          .catch(() => reject());
-      }
-    });
+  needReload(currentLoading) {
+    if (this._lastLoadingParams) {
+      return ObjectUtils.objectToString(currentLoading.request) != ObjectUtils.objectToString(this._lastLoadingParams.request);
+    }
+    return false;
+  }
+  callbackGetRows(params) {
+    if (params) {
+      params.success({ rowData: this._dataUnit.records });
+    }
   }
-  setQuickFilter(term, fields) {
-    this._quickFilter = { term, fields };
+  destroy() {
+    this._dataUnit.unsubscribe(this.duObserver);
   }
-  setLocalRefresh(localREfresh) {
-    this._localRefresh = localREfresh;
+  buildColumnDefs() {
+    const columnDefs = [];
+    if (this._dataUnit.metadata) {
+      this._dataUnit.metadata.fields.forEach(f => {
+        var _a;
+        if (f.visible !== false && f.name !== this.RECORD_ARCHIVE) {
+          const props = new Map();
+          const properties = this._dataUnit.getField(f.name).properties;
+          for (const value in properties) {
+            props.set(value, properties[value]);
+          }
+          columnDefs.push({ label: f.label, name: f.name, userInterface: f.userInterface, options: (_a = this._dataUnit.getField(f.name).properties) === null || _a === void 0 ? void 0 : _a.options, props });
+        }
+      });
+    }
+    return columnDefs;
   }
 }

package/dist/collection/components/ez-grid/controller/ag-grid/template/HeaderColumnTemplate.js

@@ -2,10 +2,10 @@ const HeaderColumnTemplate = `<div class="ag-cell-label-container" role="present
     <span ref="eMenu" class="ag-header-icon ag-header-cell-menu-button" aria-hidden="true"></span>
     <div ref="eLabel" class="ag-header-cell-label" role="presentation" unselectable="on">
         <span ref="eText" class="ag-header-cell-text" unselectable="on"></span>
-        <span ref="eFilter" class="ag-header-icon ag-header-label-icon ag-filter-icon" aria-hidden="true"></span>
-        <span ref="eSortAsc" class="ag-header-icon ag-header-label-icon ag-sort-ascending-icon" aria-hidden="true"></span>
-        <span ref="eSortDesc" class="ag-header-icon ag-header-label-icon ag-sort-descending-icon" aria-hidden="true"></span>
-        <span ref="eSortNone" class="ag-header-icon ag-header-label-icon ag-sort-none-icon" aria-hidden="true"></span>
+        <span ref="eFilter" class="ag-header-icon ag-header-label-icon ag-filter-icon ag-hidden" aria-hidden="true"></span>
+        <span ref="eSortAsc" class="ag-header-icon ag-header-label-icon ag-sort-ascending-icon ag-hidden" aria-hidden="true"></span>
+        <span ref="eSortDesc" class="ag-header-icon ag-header-label-icon ag-sort-descending-icon ag-hidden" aria-hidden="true"></span>
+        <span ref="eSortNone" class="ag-header-icon ag-header-label-icon ag-sort-none-icon ag-hidden" aria-hidden="true"></span>
     </div>
 </div>`;