Skip to content
Snippets Groups Projects
Commit 62d61cf7 authored by esikkala's avatar esikkala
Browse files
parents 032b34ce f52968ee
No related branches found
No related tags found
No related merge requests found
...@@ -2120,6 +2120,11 @@ ...@@ -2120,6 +2120,11 @@
"hoek": "4.2.1" "hoek": "4.2.1"
} }
}, },
"bootstrap": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.1.1.tgz",
"integrity": "sha512-SpiDSOcbg4J/PjVSt4ny5eY6j74VbVSjROY4Fb/WIUXBV9cnb5luyR4KnPvNoXuGnBK1T+nJIWqRsvU3yP8Mcg=="
},
"brace-expansion": { "brace-expansion": {
"version": "1.1.11", "version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
...@@ -5391,7 +5396,8 @@ ...@@ -5391,7 +5396,8 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
...@@ -5432,7 +5438,8 @@ ...@@ -5432,7 +5438,8 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
...@@ -5442,7 +5449,8 @@ ...@@ -5442,7 +5449,8 @@
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
...@@ -5534,7 +5542,7 @@ ...@@ -5534,7 +5542,7 @@
"dev": true, "dev": true,
"optional": true, "optional": true,
"requires": { "requires": {
"safer-buffer": "2.1.2" "safer-buffer": "^2.1.0"
} }
}, },
"ignore-walk": { "ignore-walk": {
...@@ -5559,7 +5567,8 @@ ...@@ -5559,7 +5567,8 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
...@@ -5571,8 +5580,9 @@ ...@@ -5571,8 +5580,9 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "1.0.1" "number-is-nan": "^1.0.0"
} }
}, },
"isarray": { "isarray": {
...@@ -5592,12 +5602,14 @@ ...@@ -5592,12 +5602,14 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.2.4", "version": "2.2.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "5.1.1", "safe-buffer": "5.1.1",
"yallist": "3.0.2" "yallist": "3.0.2"
...@@ -5616,6 +5628,7 @@ ...@@ -5616,6 +5628,7 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
...@@ -5661,8 +5674,8 @@ ...@@ -5661,8 +5674,8 @@
"dev": true, "dev": true,
"optional": true, "optional": true,
"requires": { "requires": {
"abbrev": "1.1.1", "abbrev": "1",
"osenv": "0.1.5" "osenv": "^0.1.4"
} }
}, },
"npm-bundled": { "npm-bundled": {
...@@ -5677,8 +5690,8 @@ ...@@ -5677,8 +5690,8 @@
"dev": true, "dev": true,
"optional": true, "optional": true,
"requires": { "requires": {
"ignore-walk": "3.0.1", "ignore-walk": "^3.0.1",
"npm-bundled": "1.0.3" "npm-bundled": "^1.0.1"
} }
}, },
"npmlog": { "npmlog": {
...@@ -5696,7 +5709,8 @@ ...@@ -5696,7 +5709,8 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
...@@ -5708,6 +5722,7 @@ ...@@ -5708,6 +5722,7 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1.0.2" "wrappy": "1.0.2"
} }
...@@ -5730,8 +5745,8 @@ ...@@ -5730,8 +5745,8 @@
"dev": true, "dev": true,
"optional": true, "optional": true,
"requires": { "requires": {
"os-homedir": "1.0.2", "os-homedir": "^1.0.0",
"os-tmpdir": "1.0.2" "os-tmpdir": "^1.0.0"
} }
}, },
"path-is-absolute": { "path-is-absolute": {
...@@ -5793,7 +5808,8 @@ ...@@ -5793,7 +5808,8 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.1", "version": "5.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
...@@ -5829,6 +5845,7 @@ ...@@ -5829,6 +5845,7 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "1.1.0", "code-point-at": "1.1.0",
"is-fullwidth-code-point": "1.0.0", "is-fullwidth-code-point": "1.0.0",
...@@ -5848,6 +5865,7 @@ ...@@ -5848,6 +5865,7 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "2.1.1" "ansi-regex": "2.1.1"
} }
...@@ -5891,12 +5909,14 @@ ...@@ -5891,12 +5909,14 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.2", "version": "3.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
} }
} }
}, },
...@@ -11538,6 +11558,26 @@ ...@@ -11538,6 +11558,26 @@
"section-iterator": "2.0.0" "section-iterator": "2.0.0"
} }
}, },
"react-data-grid": {
"version": "4.0.7",
"resolved": "https://registry.npmjs.org/react-data-grid/-/react-data-grid-4.0.7.tgz",
"integrity": "sha512-iSZVKkLiYMDz76iEEjavTNCX0f5X5FG4g8O4yT6CQk314EAOgQZpmzRqv5AfjYvFu+FmWQBQkieqldaqkQbj5w=="
},
"react-data-grid-addons": {
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/react-data-grid-addons/-/react-data-grid-addons-4.0.8.tgz",
"integrity": "sha512-wpAj3PgqEAMn42dTIshoHaPhg9MpqqTGTQLnNOqPJxCnnjPJGpGcCrwDJNlhXzJoG9yrwx5YckVd7yYKHkCzQA==",
"requires": {
"react-data-grid": "^4.0.8"
},
"dependencies": {
"react-data-grid": {
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/react-data-grid/-/react-data-grid-4.0.8.tgz",
"integrity": "sha512-APlFLSG6UKRHXE162yH+Rnn3J+i+rX2n7WCHKbQrYgzW57v9i+72gGrE22iLC2h/kPsGs40JcZmW3OOkRqkPxA=="
}
}
},
"react-dom": { "react-dom": {
"version": "16.4.0", "version": "16.4.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.4.0.tgz", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.4.0.tgz",
...@@ -12525,7 +12565,7 @@ ...@@ -12525,7 +12565,7 @@
"dev": true, "dev": true,
"optional": true, "optional": true,
"requires": { "requires": {
"minimatch": "3.0.4" "minimatch": "^3.0.4"
} }
}, },
"inflight": { "inflight": {
......
import React from 'react';
import PropTypes from 'prop-types';
import ReactDataGrid from 'react-data-grid';
import { Toolbar, Data, Filters } from 'react-data-grid-addons';
const { MultiSelectFilter } = Filters;
const { Selectors } = Data;
import 'bootstrap/dist/css/bootstrap.css';
class DataGrid extends React.Component {
constructor(props, context) {
super(props, context);
this._columns = [
{
key: 'label',
name: 'Name',
sortable: true,
filterable: true,
},
{
key: 'typeLabel',
name: 'Type',
sortable: true,
filterable: true,
filterRenderer: MultiSelectFilter
},
{
key: 'broaderAreaLabel',
name: 'Area',
sortable: true,
filterable: true,
filterRenderer: MultiSelectFilter
},
{
key: 'source',
name: 'Source',
sortable: true,
filterable: true,
filterRenderer: MultiSelectFilter
},
];
this.state = {
rows: this.props.data,
sortColumn: null,
sortDirection: null
};
}
getRows = () => {
return Selectors.getRows(this.state);
};
getSize = () => {
return this.getRows().length;
};
rowGetter = (rowIdx) => {
const rows = this.getRows();
return rows[rowIdx];
};
handleGridSort = (sortColumn, sortDirection) => {
this.setState({ sortColumn: sortColumn, sortDirection: sortDirection });
};
handleFilterChange = (filter) => {
let newFilters = Object.assign({}, this.state.filters);
if (filter.filterTerm) {
newFilters[filter.column.key] = filter;
} else {
delete newFilters[filter.column.key];
}
this.setState({ filters: newFilters });
};
getValidFilterValues = (columnId) => {
let values = this.state.rows.map(r => r[columnId]);
return values.filter((item, i, a) => { return i === a.indexOf(item); });
};
onClearFilters = () => {
this.setState({ filters: {} });
};
render() {
return (
<ReactDataGrid
onGridSort={this.handleGridSort}
enableCellSelect={true}
columns={this._columns}
rowGetter={this.rowGetter}
rowsCount={this.getSize()}
toolbar={<Toolbar enableFilter={true}/>}
onAddFilter={this.handleFilterChange}
getValidFilterValues={this.getValidFilterValues}
onClearFilters={this.onClearFilters} />);
}
}
DataGrid.propTypes = {
data: PropTypes.array.isRequired,
};
export default DataGrid;
...@@ -18,8 +18,9 @@ import Tab from '@material-ui/core/Tab'; ...@@ -18,8 +18,9 @@ import Tab from '@material-ui/core/Tab';
import IntegrationAutosuggest from '../components/IntegrationAutosuggest'; import IntegrationAutosuggest from '../components/IntegrationAutosuggest';
import LeafletMap from '../components/LeafletMap'; import LeafletMap from '../components/LeafletMap';
import Message from '../components/Message'; import Message from '../components/Message';
import SimpleTable from '../components/SimpleTable'; // import SimpleTable from '../components/SimpleTable';
//import DataTable from '../components/DataTable'; //import DataTable from '../components/DataTable';
import DataGrid from '../components/DataGrid';
import { import {
updateQuery, updateQuery,
...@@ -33,7 +34,7 @@ import { ...@@ -33,7 +34,7 @@ import {
getGeoJSON getGeoJSON
} from '../actions'; } from '../actions';
const drawerWidth = 700; const drawerWidth = 800;
const styles = theme => ({ const styles = theme => ({
root: { root: {
...@@ -154,7 +155,7 @@ let MapApp = (props) => { ...@@ -154,7 +155,7 @@ let MapApp = (props) => {
fetchResults={props.fetchResults} fetchResults={props.fetchResults}
/> />
{props.search.results.length > 0 && {props.search.results.length > 0 &&
<SimpleTable data={props.search.results} /> <DataGrid data={props.search.results} />
} }
</Drawer> </Drawer>
); );
......
...@@ -10,6 +10,18 @@ ...@@ -10,6 +10,18 @@
.leaflet-container { .leaflet-container {
height: 100%; height: 100%;
} }
.react-grid-Main{
height: 100%;
}
.react-grid-Container{
height: 100%;
}
.react-grid-Grid{
min-height: 100% !important;
}
.react-grid-Canvas{
height: 100% !important;
}
body { body {
margin:0; margin:0;
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment