TIcket Page Layout

This commit is contained in:
Ruidy Nemausat 2020-03-12 23:07:39 +01:00
parent 37ce0fb547
commit f89377da3b
9 changed files with 189 additions and 214 deletions

View file

@ -28,6 +28,8 @@ namespace TicketManager.Controllers
{
return await _context.Tickets
.Include(t => t.Project)
.ThenInclude(p => p.Assignments)
.ThenInclude(a => a.User)
.Include(t => t.Files)
.Include(t => t.Activities)
.Include(t => t.Notes)
@ -42,6 +44,8 @@ namespace TicketManager.Controllers
{
var ticket = await _context.Tickets
.Include(t => t.Project)
.ThenInclude(p => p.Assignments)
.ThenInclude(a => a.User)
.Include(t => t.Files)
.Include(t => t.Activities)
.Include(t => t.Notes)

View file

@ -1,5 +1,33 @@
export class TicketVM {
public Id?: number;
import { Ticket } from "../types/Ticket";
import { Project } from "../types/Project";
import { User } from "../types/User";
public constructor() {}
export class TicketVM {
public id: number;
public title: string;
public description: string;
public creationDate: string;
public endingDate: string;
public status: string;
public impact: string;
public difficulty: string;
public category: string;
public creatorId: string;
public project: Project;
public users: User[];
public constructor(ticket: Ticket) {
this.id = ticket.id;
this.title = ticket.title;
this.description = ticket.description;
this.creationDate = ticket.creationDate;
this.endingDate = ticket.endingDate;
this.status = ticket.status;
this.impact = ticket.impact;
this.difficulty = ticket.difficulty;
this.category = ticket.category;
this.creatorId = ticket.creatorId;
this.project = ticket.project;
this.users = ticket.users;
}
}

View file

@ -1,5 +1,6 @@
import React, { FC } from "react";
import { User } from "../types/User";
import { Link } from "react-router-dom";
interface AvatarListProps {
users: User[];
@ -11,14 +12,15 @@ export const AvatarList: FC<AvatarListProps> = ({ users }) => {
) : (
<>
{users.map((user: User, i: number) => (
<img
key={i}
className="circle"
src={user.picture}
width="32vh"
height="32vh"
alt={user.fullName}
/>
<Link to={`/users/${user.id}`} key={i}>
<img
className="circle"
src={user.picture}
width="32vh"
height="32vh"
alt={user.fullName}
/>
</Link>
))}
</>
);

View file

@ -75,6 +75,7 @@ export const TicketList: FC<TicketListProps> = ({
key={t.id}
title={t.title}
remainingDays={t.endingDate}
link={`/tickets/${t.id}`}
validateTicket={async (e: MouseEvent) => {
e.preventDefault();
await put<HttpResponse<Ticket>>(

File diff suppressed because one or more lines are too long

View file

@ -8,9 +8,6 @@ import { Preloader } from "../components/Preloader";
import { get } from "../utils/http";
import { Constants } from "../utils/Constants";
import { ErrorController } from "./ErrorController";
// import { AppFile } from "../types/AppFile";
// import { Activity } from "../types/Activity";
// import { Ticket } from "../types/Ticket";
export const UserController: FC = () => {
const [isLoading, setIsLoading] = useState(true);
@ -35,79 +32,6 @@ export const UserController: FC = () => {
}
}
// const user: User = {
// id: "resldsm,dgd",
// firstName: "Ti",
// lastName: "Nyny",
// fullName: "Nilka Netty Nemo",
// presentation: "Woman of my life ❤️❤️❤️",
// creationDate: new Date().toDateString(),
// email: "dw@mail.au",
// phone: "0998765432",
// picture: require("../images/user_1.jpg"),
// projects: [
// {
// id: 1,
// title: "OP Baby",
// description: "What is it about",
// progression: 25,
// creationDate: new Date().toDateString(),
// endingDate: "2020-02-17 15:51:02.787373",
// status: "Todo",
// manager: {} as User,
// users: [] as User[],
// tickets: [] as Ticket[],
// files: [] as AppFile[],
// activities: [] as Activity[]
// }
// ],
// tickets: [
// {
// id: 1,
// title: "Client objective meeting",
// description: "Client objective meeting",
// endingDate: "2020-02-17 15:51:02.787373",
// status: "Done",
// project: {
// id: 1,
// title: "Project Title",
// description: "What is it about",
// progression: 25,
// creationDate: new Date().toDateString(),
// endingDate: "2020-02-17 15:51:02.787373",
// status: "Todo",
// manager: {} as User,
// users: [] as User[],
// tickets: [] as Ticket[],
// files: [] as AppFile[],
// activities: [] as Activity[]
// }
// },
// {
// id: 2,
// title: "Assemble Outcomes Report for client",
// description: "Assemble Outcomes Report for client",
// endingDate: "2020-02-27 15:51:02.787373",
// status: "To Do",
// project: {
// id: 1,
// title: "Project Title",
// description: "What is it about",
// progression: 25,
// creationDate: new Date().toDateString(),
// endingDate: "2020-02-17 15:51:02.787373",
// status: "Todo",
// manager: {} as User,
// users: [] as User[],
// tickets: [] as Ticket[],
// files: [] as AppFile[],
// activities: [] as Activity[]
// }
// }
// ],
// activities: []
// };
useEffect(() => {
if (id !== undefined) {
httpGetUser(id);

View file

@ -1,23 +1,20 @@
import React, { FC } from "react";
import { Header } from "../components/Header";
import { AvatarList } from "../components/AvatarList";
import { ProgressBar } from "../components/ProgressBar";
import { TicketVM } from "../VM/TicketVM";
export const TicketPage: FC = () => {
interface IProps {
viewModel: TicketVM;
}
export const TicketPage: FC<IProps> = ({ viewModel }) => {
const { title, description, users } = viewModel;
return (
<>
<Header
description="Research, ideate and present brand concepts for client consideration"
title="Brand Concept and Design"
/>
{/* <AvatarList users={["../images/user_1.jpg", "../images/user_2.jpg"]} /> */}
<ProgressBar value={60} />
{/* // <TabView>
// <ChildTicket/>
// <ChildFile/>
// <ChildActivity/>
// </TabView>
// <Notes/> */}
</>
<div className="section">
<div className="container">
<Header title={title} description={description} />
<AvatarList users={users} />
</div>
</div>
);
};

View file

@ -1,10 +1,17 @@
import { Project } from "./Project";
import { User } from "./User";
export interface Ticket {
id: number;
title: string;
description: string;
status: string;
creationDate: string;
endingDate: string;
status: string;
impact: string;
difficulty: string;
category: string;
creatorId: string;
project: Project;
users: User[];
}

View file

@ -7,13 +7,12 @@ import {
//Link, NavLink
} from "react-router-dom";
import * as creacteHistory from "history";
// import { TicketPage } from "../pages/TicketPage";
// import { HomeController } from "../controllers/HomeController";
import { ProjectController } from "../controllers/ProjectController";
import { UserController } from "../controllers/UserController";
import { TicketController } from "../controllers/TicketController";
import { NotFoundPage } from "../pages/NotFoundPage";
import { TestPage } from "../pages/TestPage";
import { UserController } from "../controllers/UserController";
// import { TicketController } from "../controllers/TicketController";
export const history = creacteHistory.createBrowserHistory();
@ -35,9 +34,9 @@ export const AppRouter = () => {
<Route path="/projects/:id">
<ProjectController />
</Route>
{/* <Route path="/tickets/:id">
<Route path="/tickets/:id">
<TicketController />
</Route> */}
</Route>
<Route path="/401">
<NotFoundPage />