83 lines
1.8 KiB
JavaScript

/**
*
* TableRow
*
*/
import React from 'react';
import _ from 'lodash';
import styles from './styles.scss';
class TableRow extends React.Component {
constructor(props) {
super(props);
this.handleClick = this.handleClick.bind(this);
}
/**
* Return a formatted value according to the
* data type and value stored in database
*
* @param type {String} Data type
* @param value {*} Value stored in database
* @returns {*}
*/
getDisplayedValue(type, value) {
switch (type) {
case 'string':
return !_.isEmpty(value) ? value.toString() : '-';
case 'integer':
return !_.isEmpty(value) ? value.toString() : '-';
case 'boolean':
return !_.isEmpty(value) ? value.toString() : '-';
default:
return '-';
}
}
// Redirect to the edit page
handleClick() {
this.context.router.history.push(this.props.destination);
}
render() {
// Generate cells
const cells = this.props.headers.map((header, i) => (
<td key={i}>
{this.getDisplayedValue(
header.type,
this.props.record[header.name]
)}
</td>
));
// Add actions cell.
cells.push(
<td key='action' className={styles.actions}>
<i className="fa fa-pencil" aria-hidden="true"></i>
<i className="fa fa-trash" aria-hidden="true"></i>
</td>
);
return (
<tr className={styles.tableRow} onClick={() => this.handleClick(this.props.destination)}>
{cells}
</tr>
);
}
}
TableRow.contextTypes = {
router: React.PropTypes.object.isRequired,
};
TableRow.propTypes = {
destination: React.PropTypes.string.isRequired,
headers: React.PropTypes.array.isRequired,
record: React.PropTypes.object.isRequired,
};
export default TableRow;