mirror of
https://github.com/franjsco/tick3t
synced 2025-06-05 22:19:18 +02:00
new table component
This commit is contained in:
@ -1,15 +1,8 @@
|
||||
import React, { Component } from 'react';
|
||||
import {
|
||||
Card,
|
||||
CardBody,
|
||||
CardTitle,
|
||||
CardText,
|
||||
Col,
|
||||
Row,
|
||||
Table
|
||||
} from 'reactstrap';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
import './ViewTicket.css';
|
||||
import Card from '../../components/Card';
|
||||
import Table from '../../components/Table';
|
||||
|
||||
class ViewTicket extends Component {
|
||||
constructor(props) {
|
||||
@ -17,6 +10,7 @@ class ViewTicket extends Component {
|
||||
|
||||
this.state = {
|
||||
data: {},
|
||||
error: '',
|
||||
isLoading: false,
|
||||
};
|
||||
}
|
||||
@ -48,7 +42,11 @@ class ViewTicket extends Component {
|
||||
const { data, isLoading, error } = this.state;
|
||||
|
||||
if (error) {
|
||||
return <p>{error.message}</p>
|
||||
return (
|
||||
<Card title="Error">
|
||||
<p>{error.message}</p>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
|
||||
if (isLoading) {
|
||||
@ -56,53 +54,13 @@ class ViewTicket extends Component {
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Card className="text-center shadow-sm p-3 mb-5 bg-white rounded">
|
||||
<CardBody>
|
||||
<CardTitle><h5>View Ticket</h5></CardTitle>
|
||||
<CardText>
|
||||
<Row>
|
||||
<Col sm="12" md={{ size: 8, offset: 2 }}>
|
||||
<Table bordered id="table-ticket-info">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colSpan={2}>Ticket-ID: {data.id }</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td className="font-weight-bold text-right">Status</td>
|
||||
<td>{data.status}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="font-weight-bold text-right">Creation Date</td>
|
||||
<td>{data.createdAt}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="font-weight-bold text-right">Update Date</td>
|
||||
<td>{data.updateAt}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="font-weight-bold text-right">Created By</td>
|
||||
<td>{`${data.firstName} ${data.lastName}`}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="font-weight-bold text-right">Type</td>
|
||||
<td>{ data.type }</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="font-weight-bold text-right">Subject</td>
|
||||
<td>{ data.subject }</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</Table>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
</CardText>
|
||||
</CardBody>
|
||||
<Card
|
||||
align="center"
|
||||
title="View Ticket"
|
||||
>
|
||||
<Table data={data} />
|
||||
<Link to="/">Go to home</Link>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user