mirror of
https://github.com/rjNemo/ticket_manager
synced 2026-06-06 00:36:39 +00:00
ticket page view done
This commit is contained in:
parent
f89377da3b
commit
b2bbc08e1e
2 changed files with 61 additions and 2 deletions
|
|
@ -2,18 +2,77 @@ import React, { FC } from "react";
|
|||
import { Header } from "../components/Header";
|
||||
import { AvatarList } from "../components/AvatarList";
|
||||
import { TicketVM } from "../VM/TicketVM";
|
||||
import { getRemainingdays } from "../utils/methods";
|
||||
import { Link } from "react-router-dom";
|
||||
|
||||
interface IProps {
|
||||
viewModel: TicketVM;
|
||||
}
|
||||
|
||||
export const TicketPage: FC<IProps> = ({ viewModel }) => {
|
||||
const { title, description, users } = viewModel;
|
||||
const {
|
||||
title,
|
||||
description,
|
||||
users,
|
||||
endingDate,
|
||||
project,
|
||||
status,
|
||||
category,
|
||||
impact,
|
||||
difficulty
|
||||
} = viewModel;
|
||||
const daysToEnd: number = getRemainingdays(endingDate);
|
||||
let notes: string = "";
|
||||
|
||||
return (
|
||||
<div className="section">
|
||||
<div className="container">
|
||||
<Header title={title} description={description} />
|
||||
<AvatarList users={users} />
|
||||
|
||||
<div className="row section">
|
||||
<div className="col s9">
|
||||
<h5>
|
||||
<b>In project: </b>{" "}
|
||||
<Link to={`/projects/${project.id}`}>{project.title}</Link>
|
||||
</h5>
|
||||
</div>
|
||||
<div className="col s3">
|
||||
<i className="left material-icons">timer</i>
|
||||
<span>Due in {daysToEnd} days</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="section white center">
|
||||
<div className="chip">
|
||||
<span className="indigo-text">Status: </span> {status}
|
||||
{/* <i className="close material-icons">close</i> */}
|
||||
</div>
|
||||
|
||||
<div className="chip">
|
||||
<span className="orange-text">Category: </span> {category}
|
||||
{/* <i className="close material-icons">close</i> */}
|
||||
</div>
|
||||
|
||||
<div className="chip">
|
||||
<span className="green-text">Impact: </span> {impact}
|
||||
{/* <i className="close material-icons">close</i> */}
|
||||
</div>
|
||||
|
||||
<div className="chip">
|
||||
<span className="red-text">Difficulty: </span> {difficulty}
|
||||
{/* <i className="close material-icons">close</i> */}
|
||||
</div>
|
||||
|
||||
{/* <textarea
|
||||
id="notes"
|
||||
className="materialize-textarea validate"
|
||||
value={notes}
|
||||
// onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>
|
||||
// setDescription(e.target.value)
|
||||
// }
|
||||
></textarea> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -58,5 +58,5 @@ const headers: Headers = new Headers({
|
|||
Accept: "application/json",
|
||||
"Content-Type": "application/json",
|
||||
Authorization:
|
||||
"Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6Ik1UWkNSRFEzUkRnd1FUQXlNRFExTmtOQ09UQXlSamhGTURaRU1Ea3pNRGxHUkRrelFqZENSZyJ9.eyJpc3MiOiJodHRwczovL2Rldi1meWpydm9oeC5hdXRoMC5jb20vIiwic3ViIjoiR3dlZTlGUnN3ejNWNE5vZFVRTjJIcjJyQjJTMDI1UmZAY2xpZW50cyIsImF1ZCI6Imh0dHBzOi8vbG9jYWxob3N0OjUwMDEvYXBpL1YxLyIsImlhdCI6MTU4NDAzNzQyMCwiZXhwIjoxNTg0MTIzODIwLCJhenAiOiJHd2VlOUZSc3d6M1Y0Tm9kVVFOMkhyMnJCMlMwMjVSZiIsImd0eSI6ImNsaWVudC1jcmVkZW50aWFscyJ9.hbn9fRaMYZuvapjCWB0cvwWlEZ6oDoN8nPN8cSkX720VNHYg4JxwVRf4wnf5nOMLUUEIbUudmkBeCZSeW87SQUi41rEHnB9xDXxbVTiEkmyy1yiZUdsDc9Z_hi1nCzKtrbTRmSA6Uo8aHFF2hBGK2_QUcY6hx3Dqx3OYeNbAVx0xjp5OV4XvhVqA9TH3PP_OziJ9NtZAgGzn8pBRlbuTP0ZXL4pXvbcDNcnInx8r5xT_YYxdGqWBgpSqTrfv5t0fUrnjr4ICW49zSBHhA2Nee456c-hlijJ6ufsFcbqegsN7DkFcpWysrY943bIqXJK9XhZlFnz7kBK2nf8culwtmw"
|
||||
"Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6Ik1UWkNSRFEzUkRnd1FUQXlNRFExTmtOQ09UQXlSamhGTURaRU1Ea3pNRGxHUkRrelFqZENSZyJ9.eyJpc3MiOiJodHRwczovL2Rldi1meWpydm9oeC5hdXRoMC5jb20vIiwic3ViIjoiR3dlZTlGUnN3ejNWNE5vZFVRTjJIcjJyQjJTMDI1UmZAY2xpZW50cyIsImF1ZCI6Imh0dHBzOi8vbG9jYWxob3N0OjUwMDEvYXBpL1YxLyIsImlhdCI6MTU4NDE5ODQ4MCwiZXhwIjoxNTg0Mjg0ODgwLCJhenAiOiJHd2VlOUZSc3d6M1Y0Tm9kVVFOMkhyMnJCMlMwMjVSZiIsImd0eSI6ImNsaWVudC1jcmVkZW50aWFscyJ9.I1D49ILGBLhnq9biIA0y6Ra93zTKRDJI_rfGvU05MtT1zkI1ZliX9P-7LyKeWBv8tPonB6gT12lJiai_GHBET8kKbXNqwfVvDJ3eqYK-TtTqfL65RfWL9tQfQybHbfuF9M0oiXMqWMqmsc5Umpp4a3bLTQgwkUEKxcdMm84L7zoaqMycns4mFojWpQJKfPa64oZFDIXYy6hPDXcX50Djuk1m-aqMhtpmqkZvPfwEjvtEtGGCTOJHV7uugn3r8Wk4HX02ShrV676GICE1Yw7eHufAbY7yvHz3ImZ1cfEVrRbbijPA2vogXd5RmqNyindDDlT1Y_C80U0DyvhS7P7apQ"
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue