ruidy/ticket_manager
1
0
Fork 0
mirror of https://github.com/rjNemo/ticket_manager synced 2026-06-06 00:36:39 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

horizontal card done

Browse source
This commit is contained in:
Ruidy Nemausat 2020-02-10 10:44:17 +01:00
parent ed237a6342
commit 1113e283b4
3 changed files with 35 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
client/src/components/HorizontalCard.tsx
View file

@ -1,4 +1,4 @@
import React, { FC } from "react"; import React, { FC, MouseEvent } from "react";
import { AvatarList } from "./AvatarList"; import { AvatarList } from "./AvatarList";
interface IProps { interface IProps {
@ -7,6 +7,8 @@ interface IProps {
tasksDone?: number; tasksDone?: number;
remainingDays?: number; remainingDays?: number;
avatars: string[]; avatars: string[];
validateTicket: (event: MouseEvent) => void;
archiveTicket: (event: MouseEvent) => void;
} }
export const HorizontalCard: FC<IProps> = ({ export const HorizontalCard: FC<IProps> = ({
@ -14,23 +16,38 @@ export const HorizontalCard: FC<IProps> = ({
tasksDone, tasksDone,
tasksTotalCount, tasksTotalCount,
remainingDays, remainingDays,
avatars avatars,
archiveTicket,
validateTicket
}) => { }) => {
return ( return (
<div className="col s12"> <div className="col s12">
<div className="card horizontal"> <div className="card horizontal">
<div className="card-stacked"> <div className="card-stacked">
<div className="card-content"> <div className="card-content">
<h6>{title}</h6>
<AvatarList avatars={avatars} />
<div className="row"> <div className="row">
<i className="left material-icons">playlist_add_check</i> <div className="card-title">
<span> <h6>{title}</h6>
{tasksDone}/{tasksTotalCount} </div>
</span> <span>Due {remainingDays} days</span>
{/* <AvatarList avatars={avatars} /> */}
<div className="right"> <div className="right">
<span>Due {remainingDays} days</span> {/* <i className=" material-icons">playlist_add_check</i>
<span>
{" "}
{tasksDone}/{tasksTotalCount}
</span> */}
<a>
<i className="material-icons" onClick={validateTicket}>
check
</i>
</a>
<a>
<i className="material-icons" onClick={archiveTicket}>
archive
</i>
</a>
</div> </div>
</div> </div>
</div> </div>

4
client/src/components/TabRouter.tsx
View file

@ -2,7 +2,7 @@ import React, { FC } from "react";
import { TabRouterHeader } from "./TabRouterHeader"; import { TabRouterHeader } from "./TabRouterHeader";
import { TicketList } from "./TicketList"; import { TicketList } from "./TicketList";
import { Ticket } from "../types/Ticket"; import { Ticket } from "../types/Ticket";
import { Switch, Route, useRouteMatch } from "react-router-dom"; import { Switch, Route, useRouteMatch, Redirect } from "react-router-dom";
interface IProps { interface IProps {
tickets: Ticket[]; tickets: Ticket[];
@ -26,6 +26,8 @@ export const TabRouter: FC<IProps> = ({
<div className="row"> <div className="row">
<TabRouterHeader /> <TabRouterHeader />
<Redirect from={url} to={`${url}/tickets`} />
<Route path={`${url}/tickets`}> <Route path={`${url}/tickets`}>
<TicketList <TicketList
tickets={tickets} tickets={tickets}

5
client/src/components/TicketList.tsx
View file

@ -18,6 +18,9 @@ export const TicketList: FC<TicketListProps> = ({
remainingDays, remainingDays,
avatars avatars
}) => { }) => {
const archiveTicket = () => {};
const validateTicket = () => {};
return ( return (
<div className="col s12"> <div className="col s12">
<div className="row valign-wrapper"> <div className="row valign-wrapper">
@ -38,6 +41,8 @@ export const TicketList: FC<TicketListProps> = ({
tasksTotalCount={tasksTotalCount} tasksTotalCount={tasksTotalCount}
remainingDays={remainingDays} remainingDays={remainingDays}
avatars={avatars} avatars={avatars}
validateTicket={validateTicket}
archiveTicket={archiveTicket}
/> />
</li> </li>
))} ))}