Skip to content
GitLab
Commit 3910f7de authored by Paulo Avila's avatar Paulo Avila
Browse files

melhoria na exibição das tarefas

parent 7264ecf5
Hide whitespace changes
Inline Side-by-side
src/components/tasks/task-board.tsx
View file @ 3910f7de
import { Pencil } from "lucide-react"; import { CalendarClock, CalendarPlus, Pencil } from "lucide-react";
import { TASK_STATUSES } from "@/lib/constants"; import { TASK_STATUSES } from "@/lib/constants";
import type { Subtask, Task, WorkspaceMember } from "@/lib/data"; import type { Subtask, Task, WorkspaceMember } from "@/lib/data";
import { formatDate } from "@/lib/dates"; import { formatDate } from "@/lib/dates";
...@@ -97,9 +97,28 @@ export function TaskBoard({ ...@@ -97,9 +97,28 @@ export function TaskBoard({
` (${task.SubtaskDone}/${task.SubtaskCount})`} ` (${task.SubtaskDone}/${task.SubtaskCount})`}
</span> </span>
</div> </div>
<div className="flex items-center justify-between text-xs text-muted-foreground"> <div className="space-y-1 text-xs text-muted-foreground">
<span>{task.AssigneeName ?? "Sem responsável"}</span> <div>{task.AssigneeName ?? "Sem responsável"}</div>
<span>{formatDate(task.DueDate)}</span> <div className="flex flex-wrap items-center gap-x-3 gap-y-1">
{task.StartDate && (
<span
className="flex items-center gap-1"
title="Início"
>
<CalendarPlus className="h-3 w-3" />
{formatDate(task.StartDate)}
</span>
)}
{task.DueDate && (
<span
className="flex items-center gap-1"
title="Vencimento"
>
<CalendarClock className="h-3 w-3" />
{formatDate(task.DueDate)}
</span>
)}
</div>
</div> </div>
{editable ? ( {editable ? (
<TaskStatusSelect <TaskStatusSelect
......
src/components/tasks/task-table.tsx
View file @ 3910f7de
...@@ -28,7 +28,7 @@ import { TaskProgress } from "./task-progress"; ...@@ -28,7 +28,7 @@ import { TaskProgress } from "./task-progress";
import { TaskProgressEditor } from "./task-progress-editor"; import { TaskProgressEditor } from "./task-progress-editor";
import { TaskStatusSelect } from "./task-status-select"; import { TaskStatusSelect } from "./task-status-select";
const COLUMN_COUNT = 6; const COLUMN_COUNT = 7;
export function TaskTable({ export function TaskTable({
tasks, tasks,
...@@ -108,26 +108,29 @@ export function TaskTable({ ...@@ -108,26 +108,29 @@ export function TaskTable({
))} ))}
</div> </div>
<div className="overflow-hidden rounded-xl border bg-card"> <div>
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow className="border-b bg-muted/40 hover:bg-muted/40"> <TableRow className="border-b border-border hover:bg-transparent">
<TableHead className="text-xs font-semibold uppercase tracking-wider text-muted-foreground"> <TableHead className="w-full text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">
Tarefa Tarefa
</TableHead> </TableHead>
<TableHead className="text-xs font-semibold uppercase tracking-wider text-muted-foreground"> <TableHead className="whitespace-nowrap text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">
Status Status
</TableHead> </TableHead>
<TableHead className="text-xs font-semibold uppercase tracking-wider text-muted-foreground"> <TableHead className="whitespace-nowrap text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">
Progresso Progresso
</TableHead> </TableHead>
<TableHead className="text-xs font-semibold uppercase tracking-wider text-muted-foreground"> <TableHead className="whitespace-nowrap text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">
Responsável Responsável
</TableHead> </TableHead>
<TableHead className="text-xs font-semibold uppercase tracking-wider text-muted-foreground"> <TableHead className="whitespace-nowrap text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">
Início
</TableHead>
<TableHead className="whitespace-nowrap text-[11px] font-semibold uppercase tracking-wider text-muted-foreground">
Vencimento Vencimento
</TableHead> </TableHead>
<TableHead className="w-[90px]" /> <TableHead className="w-[80px]" />
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
...@@ -225,16 +228,14 @@ export function TaskTable({ ...@@ -225,16 +228,14 @@ export function TaskTable({
<span className="text-sm text-muted-foreground">—</span> <span className="text-sm text-muted-foreground">—</span>
)} )}
</TableCell> </TableCell>
<TableCell className="py-3">
<span className="text-sm text-muted-foreground">
{formatDate(task.StartDate)}
</span>
</TableCell>
<TableCell className="py-3"> <TableCell className="py-3">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span <span className="text-sm text-muted-foreground">
className="text-sm text-muted-foreground"
title={
task.StartDate
? `Início: ${formatDate(task.StartDate)}`
: undefined
}
>
{formatDate(task.DueDate)} {formatDate(task.DueDate)}
</span> </span>
<DueBadge dueDate={task.DueDate} status={task.Status} /> <DueBadge dueDate={task.DueDate} status={task.Status} />
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment