mirror of
https://github.com/rjNemo/ticket_manager
synced 2026-06-06 00:36:39 +00:00
TIcket Page Layout
This commit is contained in:
parent
37ce0fb547
commit
f89377da3b
9 changed files with 189 additions and 214 deletions
|
|
@ -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)
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -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
|
|
@ -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);
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -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[];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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 />
|
||||
|
|
|
|||
Loading…
Reference in a new issue