Add export to grid.

ironmansoftware · Jun 20, 2019 · f405740 · f405740
1 parent 68c91dd
commit f405740
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 5 deletions.
diff --git a/src/UniversalDashboard.Materialize/Components/ud-grid.jsx b/src/UniversalDashboard.Materialize/Components/ud-grid.jsx
@@ -192,6 +192,27 @@ export default class UdGrid extends React.Component {
 
     onExportData() {
 
+        var csv = '';
+        this.state.data.forEach(x => {
+            for(var propertyName in x) {
+                var property = x[propertyName];
+                if (property == null) continue;
+
+                csv += property + ",";
+            }
+            csv = csv.substr(0, csv.length - 1) + "\r\n";
+        })
+
+        var element = document.createElement('a');
+        element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(csv));
+        element.setAttribute('download', 'export.csv');
+
+        element.style.display = 'none';
+        document.body.appendChild(element);
+
+        element.click();
+
+        document.body.removeChild(element);
     }
 
     render() {
@@ -303,7 +324,13 @@ export default class UdGrid extends React.Component {
                     >
                         {rowDefinition}
                     </Griddle>,
-                    <GridToolbar activePage={this.state.currentPage} totalPages={Math.ceil(this.state.recordCount / this.state.pageSize)} onPageChanged={this.onPageChanged.bind(this)}/>]
+                    <GridToolbar 
+                        activePage={this.state.currentPage} 
+                        totalPages={Math.ceil(this.state.recordCount / this.state.pageSize)} 
+                        onPageChanged={this.onPageChanged.bind(this)}
+                        onExportData={this.onExportData.bind(this)}
+                        noExport={this.props.noExport}
+                        />]
                      : <div>No results found</div>}
                 </div>
 
@@ -335,7 +362,7 @@ class GridToolbar extends React.Component {
         }
 
         return (
-            <Row><Button icon={<UdIcon icon="Download" />} style={{display: 'inline-block', float: 'right', marginTop: '15x'}} onClick={this.onExportData.bind(this)} />{pagination}</Row>
+            <Row><Button icon={<UdIcon icon="Download" />} style={{display: this.props.noExport ? 'none' : 'inline-block', float: 'right', marginTop: '15px'}} onClick={this.props.onExportData} />{pagination}</Row>
         )
     }
 }

diff --git a/src/UniversalDashboard.Materialize/Scripts/grid.ps1 b/src/UniversalDashboard.Materialize/Scripts/grid.ps1
@@ -37,7 +37,9 @@ function New-UDGrid {
         [Parameter()]
 	    [Switch]$AutoRefresh,
 	    [Parameter()]
-        [int]$RefreshInterval = 5
+        [int]$RefreshInterval = 5,
+        [Parameter()]
+        [Switch]$NoExport 
     )
 
     End {
@@ -73,6 +75,7 @@ function New-UDGrid {
             noFilter = $NoFilter.IsPresent
             autoRefresh = $AutoRefresh.IsPresent
             refreshInterval = $RefreshInterval
+            noExport = $NoExport.IsPresent
         }
     }
 }
diff --git a/src/UniversalDashboard.Materialize/Tests/grid.tests.ps1 b/src/UniversalDashboard.Materialize/Tests/grid.tests.ps1
@@ -343,8 +343,6 @@ Describe "Grid" {
 
         Set-TestDashboard -Dashboard $dashboard
 
-        Wait-Debugger
-
         It "should not page when NoPaging set" {
             $Element = Find-SeElement -Id "NoPagingGrid" -Driver $Driver
             $Element = Find-SeElement -ClassName "griddle-row" -Driver $Element[0]