franjsco
/
tick3t
mirror of https://github.com/franjsco/tick3t
1
0
Fork 0
Code Issues Releases Wiki Activity

add Table component

This commit is contained in:
frab1t 2019-05-08 16:18:01 +02:00
parent 164c055e7c
commit 2826262b35
1 changed files with 71 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
src/components/Table.js Normal file
View File

@ -0,0 +1,71 @@
import React, { Component } from 'react';
import {
Col,
Row,
Table as TableBootstrap
} from 'reactstrap';
import './Table.css'
class Table extends Component {
constructor(props) {
super(props);
this.state = {};
}
render() {
let data = this.props.data;
return (
<Row>
<Col sm="12" md={{ size: 10, offset: 1 }}>
<TableBootstrap bordered id="table-ticket-info" className="bg-white">
<thead>
<tr>
<th colSpan={2}>Ticket Info</th>
</tr>
</thead>
<tbody>
<tr>
<td className="font-weight-bold text-right td-key">id</td>
<td className="td-value text-left">{data.id}</td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">status</td>
<td className="td-value text-left">{data.status}</td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">created</td>
<td className="td-value text-left">{data.createdAt}</td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">updated</td>
<td className="td-value text-left">{data.updateAt}</td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">created by</td>
<td className="td-value text-left"><p>{`${data.firstName} ${data.lastName} (${data.email})`}</p></td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">type</td>
<td className="td-value text-left">{data.type}</td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">subject</td>
<td className="td-value text-left">{data.subject}</td>
</tr>
<tr>
<td className="font-weight-bold text-right td-key">message</td>
<td className="td-value text-left">{data.message}</td>
</tr>
</tbody>
</TableBootstrap>
</Col>
</Row>
);
}
}
export default Table;