community/device-mgt-core
1
0
Fork 0
mirror of https://repository.entgra.net/community/device-mgt-core.git synced 2025-10-06 02:01:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added extra features to data table.

Browse Source
This commit is contained in:
Menaka Jayawardena 2017-08-28 12:14:34 +05:30
parent 39925efacf
commit c389a5ec50
2 changed files with 22 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTable.js
View File

@ -20,6 +20,7 @@ import PropTypes from 'prop-types';
import React, {Component} from 'react'; import React, {Component} from 'react';
import DataTableRow from './DataTableRow'; import DataTableRow from './DataTableRow';
import DataTableHeader from './DataTableHeader'; import DataTableHeader from './DataTableHeader';
import RaisedButton from 'material-ui/RaisedButton';
import {Table, TableBody, TableHeader, TableRow} from 'material-ui/Table'; import {Table, TableBody, TableHeader, TableRow} from 'material-ui/Table';
/** /**
@ -73,7 +74,14 @@ class DataTable extends Component {
render() { render() {
const {data, headers} = this.state; const {data, headers} = this.state;
if (data.length > 0) {
let noDataContent = null;
if (this.props.noDataMessage.type === 'button') {
noDataContent = <div><RaisedButton label={this.props.noDataMessage.text}/></div>
}
if (data) {
return (<Table return (<Table
selectable={ false }> selectable={ false }>
<TableHeader displaySelectAll={ false } <TableHeader displaySelectAll={ false }
@ -87,12 +95,15 @@ class DataTable extends Component {
</TableHeader> </TableHeader>
<TableBody> <TableBody>
{data.map((dataItem) =>{ {data.map((dataItem) =>{
return (<DataTableRow key={dataItem.id} dataItem={dataItem} handleClick={this._handleRowClick.bind(this)}/>) return (<DataTableRow key={dataItem.id}
dataItem={dataItem}
handleClick={this._handleRowClick.bind(this)}/>)
})} })}
</TableBody> </TableBody>
</Table>)} </Table>)
}
return (<div>No apps</div>); return (<div>{noDataContent}</div>);
} }
} }
@ -101,7 +112,8 @@ DataTable.prototypes = {
data: PropTypes.arrayOf(Object), data: PropTypes.arrayOf(Object),
headers: PropTypes.arrayOf(Object), headers: PropTypes.arrayOf(Object),
sortData: PropTypes.func, sortData: PropTypes.func,
handleRowClick: PropTypes.func handleRowClick: PropTypes.func,
noDataMessage: PropTypes.object
}; };
export default DataTable; export default DataTable;

6
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTableRow.js
View File

@ -37,6 +37,9 @@ class DataTableRow extends Component {
this.setState({dataItem: this.props.dataItem}) this.setState({dataItem: this.props.dataItem})
} }
/**
* Triggers the click event on the data table row.
* */
_handleClick() { _handleClick() {
this.props.handleClick(this.state.dataItem.id); this.props.handleClick(this.state.dataItem.id);
} }
@ -47,7 +50,8 @@ class DataTableRow extends Component {
<TableRow onClick={this._handleClick.bind(this)} > <TableRow onClick={this._handleClick.bind(this)} >
{Object.keys(dataItem).map((key) => { {Object.keys(dataItem).map((key) => {
if (key !== 'id') { if (key !== 'id') {
return <TableRowColumn style={{alignItems: 'center'}} key={key}>{dataItem[key]}</TableRowColumn> return <TableRowColumn style={{alignItems: 'center'}}
key={key}>{dataItem[key]}</TableRowColumn>
} else { } else {
return <TableRowColumn/> return <TableRowColumn/>
} }