@cdmx/wappler_ag_grid 0.9.5 → 0.9.7

package/README.md

@@ -200,6 +200,7 @@ The "Total Row Footer" feature allows you to define and display a footer row in
 Configuration includes:
 - **Columns To Count**: Specify the columns you want to count in the footer row. Separate column names with commas.
 - **Columns To Sum**: Specify the columns you want to calculate the sum of in the footer row. Separate column names with commas.
+- **Fixed Footer**: Enables fixed footer totals row. (Default: false)
 
 ---
 

package/app_connect/components.hjson

@@ -1163,7 +1163,9 @@
               "display": "fieldset",
               "show": [
                 "columnsToCount",
-                "columnsToSum"
+                "columnsToSum",
+                "enableFixedFooter",
+                "fixedFooterBottomPadding",
               ],
               "noChangeOnHide": true,
               "groupEnabler": true,
@@ -1171,6 +1173,7 @@
               "children": [
                     {
                       "name": "columnsToCount",
+                      "attributeStartsWith": "dmx-bind",
                       "attribute": "columns_to_count",
                       "title": "Columns to Count",
                       "type": "grid",
@@ -1205,6 +1208,24 @@
                   "title": "Columns To Sum",
                   "type": "text",
                   "initDisplay": "none"
+                },
+                {
+                  "name": "enableFixedFooter",
+                  "attribute": "dmx-bind:fixed_footer",
+                  "title": "Fixed Footer",
+                  "type": "boolean",
+                  "initDisplay": "none",
+                  "defaultValue": false,
+                  "help": "Enables Fixed Total Row Footer"
+                },
+                {
+                  "name": "fixedFooterBottomPadding",
+                  "attribute": "dmx-bind:fixed_footer_bottom_padding",
+                  "title": "Fixed Footer Bottom Padding",
+                  "type": "number",
+                  "initDisplay": "none",
+                  "defaultValue": 10,
+                  "help": "Fixed Footer Bottom Padding"
                 }
               ]
             }

package/dmx-ag-grid.js

@@ -61,6 +61,8 @@ dmx.Component('ag-grid', {
     fixed_top_offset: { type: Number, default: 80 },
     fixed_horizontal_scroll: { type: Boolean, default: false },
     fixed_horizontal_scroll_width: { type: Number, default: 80 },
+    fixed_footer: { type: Boolean, default: false },
+    fixed_footer_bottom_padding: { type: Number, default: 10 },
     timezone: {type: String, default: '' },
     cell_click_event: {type: Boolean, default: false },
     row_click_event: {type: Boolean, default: false },
@@ -1216,7 +1218,7 @@ dmx.Component('ag-grid', {
     if ((options.columns_to_sum && options.columns_to_sum.split(',').length > 0) || (options.columns_to_count.length > 0)) {
       let columnsToSum = options.columns_to_sum ? options.columns_to_sum.split(',') : [];
       let columnsToCount = options.columns_to_count;
-
+      
       gridConfig.onFilterChanged = function (e) {
         totalRow(e.api, columnsToSum, columnsToCount);
       };
@@ -1272,6 +1274,34 @@ dmx.Component('ag-grid', {
         }
       });
     }
+    if (options.fixed_footer) {
+      window.addEventListener('scroll', function () {
+        if (gridDiv.scrollTop >= (gridDiv.scrollHeight - gridDiv.clientHeight)) {
+          const footerRow = document.querySelector('.ag-row-pinned');
+          const footerRowDiv = document.querySelector('.ag-floating-bottom.ag-selectable');
+          if (footerRow) {
+            footerRow.classList.remove('ag-row-pinned');
+            footerRow.classList.add('ag-row-even');
+            footerRow.style.position = 'fixed';
+            footerRow.style.bottom = options.fixed_footer_bottom_padding+'px';
+            footerRow.style.borderTop = '1px solid #ccc';
+            footerRow.style.borderBottom = '1px solid #ccc';
+            footerRowDiv.style.height = '0px';
+            footerRowDiv.style.minHeight = '0px';
+          }
+          const bottomViewport = document.querySelector('.ag-floating-bottom-viewport');
+          if (bottomViewport) {
+            bottomViewport.style.position = 'fixed';
+            bottomViewport.style.bottom = '0';
+          }
+        } else {
+          const footerRow = document.querySelector('.fixed-footer-row');
+          if (footerRow) {
+            footerRow.classList.add('ag-row-pinned'); 
+          }
+        }
+      });
+    }
     exportSelectedRows = () => {
       const selectedRows = gridConfig.api.getSelectedRows();
       this.set('selectedRows', selectedRows);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@cdmx/wappler_ag_grid",
-    "version": "0.9.5",
+    "version": "0.9.7",
     "type": "module",
     "description": "App Connect module for AG Grid Table Generation.",
     "license": "MIT",