sergio/saladeaula.digital
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

finish timeline

Browse Source
This commit is contained in:
Sérgio Rafael Siqueira
2025-12-15 10:00:33 -03:00
parent 54f8f843df
commit d02e35cc8e
2 changed files with 88 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
apps/admin.saladeaula.digital/app/routes/_.$orgid.enrollments.$id.submitted/route.tsx
View File

@@ -90,8 +90,7 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
</BreadcrumbList>
</Breadcrumb>
{/*<Await resolve={data} errorElement={<NotFound />}>*/}
<Await resolve={data}>
<Await resolve={data} errorElement={<NotFound />}>
{({ enrolled, scheduled, sk, created_by }) => {
const succeed = enrolled?.filter(
({ status }) => status === 'success'
@@ -197,12 +196,12 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
<CardFooter>
<ul
className="grid lg:grid-cols-2 gap-x-2.5 text-muted-foreground text-sm
className="lg:flex gap-2.5 text-muted-foreground text-sm
*:flex *:gap-1 *:items-center"
>
<li>
<CalendarIcon className="size-3.5" />
{formatted.format(new Date(sk))}
{datetime.format(new Date(sk))}
</li>
<li>
<UserIcon className="size-3.5" /> {created_by.name}
@@ -219,7 +218,7 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
)
}
const formatted = new Intl.DateTimeFormat('pt-BR', {
const datetime = new Intl.DateTimeFormat('pt-BR', {
day: '2-digit',
month: '2-digit',
year: 'numeric',

102
apps/admin.saladeaula.digital/app/routes/_.$orgid.scheduled/route.tsx
View File

@@ -1,12 +1,27 @@
import type { Route } from './+types/route'
import { EllipsisIcon } from 'lucide-react'
import {
BanIcon,
CalendarIcon,
EllipsisIcon,
PlusIcon,
UserIcon
} from 'lucide-react'
import { DateTime } from 'luxon'
import { Fragment, Suspense } from 'react'
import { Await } from 'react-router'
import { Skeleton } from '@repo/ui/components/skeleton'
import { request as req } from '@repo/util/request'
import { Button } from '@repo/ui/components/ui/button'
import {
Empty,
EmptyContent,
EmptyDescription,
EmptyHeader,
EmptyMedia,
EmptyTitle
} from '@repo/ui/components/ui/empty'
import { Skeleton } from '@repo/ui/components/skeleton'
import { Card, CardContent } from '@repo/ui/components/ui/card'
import {
Item,
@@ -17,7 +32,7 @@ import {
ItemSeparator,
ItemTitle
} from '@repo/ui/components/ui/item'
import { Button } from '@repo/ui/components/ui/button'
import { Link } from 'react-router'
export function meta({}: Route.MetaArgs) {
return [{ title: 'Matrículas agendadas' }]
@@ -52,34 +67,85 @@ export default function Route({
<Await resolve={scheduled}>
{({ items }) => {
const scheduled = grouping(items)
if (scheduled.length === 0) {
return (
<Empty className="border border-dashed">
<EmptyHeader>
<EmptyMedia variant="icon">
<BanIcon />
</EmptyMedia>
<EmptyTitle>Nenhum agendamento ainda</EmptyTitle>
<EmptyDescription>
Agende a matrícula dos seus colaboradores de forma rápida e
organizada.
</EmptyDescription>
</EmptyHeader>
<EmptyContent>
<Button asChild>
<Link to="../enrollments/add">
<PlusIcon /> Agendar
</Link>
</Button>
</EmptyContent>
</Empty>
)
}
return (
<div className="space-y-5 lg:max-w-4xl mx-auto">
{grouping(items).map(([run_at, items]) => (
<div className="grid grid-cols-5 gap-2.5">
{scheduled.map(([run_at, items], index) => (
<div className="grid lg:grid-cols-5 gap-2.5" key={index}>
<div>
{DateTime.fromISO(run_at)
.setLocale('pt-BR')
.toFormat('cccc, dd LLL yyyy')}
</div>
<Card className="col-span-4">
<CardContent>
<ItemGroup>
{items.map(({ user, course, scheduled_at }, index) => (
<Fragment key={index}>
<Item>
<ItemContent>
<ItemTitle>{course.name}</ItemTitle>
<ItemDescription>{user.name}</ItemDescription>
</ItemContent>
<ItemActions>
{items.map(
(
{ user, course, created_by, scheduled_at },
index
) => (
<Fragment key={index}>
<Item>
<ItemContent>
<ItemTitle>{course.name}</ItemTitle>
<ItemDescription>{user.name}</ItemDescription>
{/*<ItemDescription>*/}
<div className="mt-1">
<ul
className="lg:flex gap-2.5 text-muted-foreground text-sm
*:flex *:gap-1 *:items-center"
>
<li>
<CalendarIcon className="size-3.5" />{' '}
{datetime.format(
new Date(scheduled_at)
)}
</li>
<li>
<UserIcon className="size-3.5" />{' '}
{created_by.name}
</li>
</ul>
</div>
</ItemContent>
{/*<ItemActions>
<Button variant="ghost" size="icon-sm">
<EllipsisIcon />
</Button>
</ItemActions>
</Item>
{index !== items.length - 1 && <ItemSeparator />}
</Fragment>
))}
</ItemActions>*/}
</Item>
{index !== items.length - 1 && <ItemSeparator />}
</Fragment>
)
)}
</ItemGroup>
</CardContent>
</Card>