From 0d308a4b975daaf2236db214b852f457f9973dc2 Mon Sep 17 00:00:00 2001
From: pkupczyk <piotr.kupczyk@id.ethz.ch>
Date: Tue, 25 Jun 2019 18:45:39 +0200
Subject: [PATCH] SSDM-7594 : NEW openBIS UI - General Template/Infrastructure
for Tables - Visualisation/Creation/Edit - make it configurable if a column
is sortable or not
---
.../src/components/common/grid/Grid.jsx | 20 +++++++++++++------
1 file changed, 14 insertions(+), 6 deletions(-)
diff --git a/openbis_ng_ui/src/components/common/grid/Grid.jsx b/openbis_ng_ui/src/components/common/grid/Grid.jsx
index 3a085dd53ec..b97c3324685 100644
--- a/openbis_ng_ui/src/components/common/grid/Grid.jsx
+++ b/openbis_ng_ui/src/components/common/grid/Grid.jsx
@@ -61,10 +61,13 @@ class Grid extends React.Component {
constructor(props){
super(props)
+ const sortDefault = _.isFunction(props.data) ? false : true
+
this.columnsArray = props.columns.map(column => ({
...column,
label: column.label || _.upperFirst(column.field),
render: column.render || (row => _.get(row, column.field)),
+ sort: column.sort === undefined ? sortDefault : Boolean(column.sort)
}))
this.columnsMap = _.keyBy(props.columns, 'field')
@@ -99,8 +102,7 @@ class Grid extends React.Component {
}else if(!this.state.loaded){
this.setState(() => ({
loaded: true,
- objects: this.props.data,
- totalCount: this.props.data.length
+ objects: this.props.data
}))
}
}
@@ -131,9 +133,12 @@ class Grid extends React.Component {
}
handleSortChange(column){
+ if(!column.sort){
+ return
+ }
return () => {
this.setState((prevState) => ({
- sort: column,
+ sort: column.field,
sortDirection: prevState.sortDirection === 'asc' ? 'desc' : 'asc'
}), () => {
this.load()
@@ -207,16 +212,19 @@ class Grid extends React.Component {
}
const { classes } = this.props
- const { page, pageSize, filter, visibleColumns, sort, sortDirection, totalCount } = this.state
+ const { page, pageSize, filter, visibleColumns, sort, sortDirection } = this.state
let pagedObjects = null
+ let totalCount = null
if(_.isFunction(this.props.data)){
pagedObjects = this.state.objects
+ totalCount = this.state.totalCount
}else{
const filteredObjects = this.filter([...this.state.objects])
const sortedObjects = this.sort(filteredObjects)
pagedObjects = this.page(sortedObjects)
+ totalCount = filteredObjects.length
}
return (
@@ -236,9 +244,9 @@ class Grid extends React.Component {
return (
<TableCell key={column.field}>
<TableSortLabel
- active={sort === column.field}
+ active={column.sort && sort === column.field}
direction={sortDirection}
- onClick={this.handleSortChange(column.field)}
+ onClick={this.handleSortChange(column)}
>
{column.label}
</TableSortLabel>
--
GitLab