mirror of
https://github.com/SecurityBrewery/catalyst.git
synced 2025-12-11 01:32:46 +01:00
feat: mobile ui (#1096)
This commit is contained in:
@@ -3,10 +3,11 @@ import OpenTasks from '@/components/dashboard/OpenTasks.vue'
|
||||
import OpenTickets from '@/components/dashboard/OpenTickets.vue'
|
||||
import TicketOverTime from '@/components/dashboard/TicketOverTime.vue'
|
||||
import TicketTypes from '@/components/dashboard/TicketTypes.vue'
|
||||
import ColumnBody from '@/components/layout/ColumnBody.vue'
|
||||
import ColumnBodyContainer from '@/components/layout/ColumnBodyContainer.vue'
|
||||
import ColumnHeader from '@/components/layout/ColumnHeader.vue'
|
||||
import TwoColumn from '@/components/layout/TwoColumn.vue'
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
|
||||
import { ScrollArea } from '@/components/ui/scroll-area'
|
||||
import { Separator } from '@/components/ui/separator'
|
||||
|
||||
import { ExternalLink } from 'lucide-vue-next'
|
||||
|
||||
@@ -46,96 +47,91 @@ onMounted(() => {
|
||||
|
||||
<template>
|
||||
<TwoColumn>
|
||||
<div class="flex h-screen flex-1 flex-col">
|
||||
<div class="flex h-14 min-h-14 items-center bg-background px-4 py-2">
|
||||
<h1 class="text-xl font-bold">Dashboard</h1>
|
||||
</div>
|
||||
<Separator class="shrink-0" />
|
||||
<ScrollArea>
|
||||
<div
|
||||
class="m-auto grid max-w-7xl grid-cols-1 grid-rows-[100px_100px_100px_100px] gap-4 p-4 md:grid-cols-2 md:grid-rows-[100px_100px] xl:grid-cols-4 xl:grid-rows-[100px]"
|
||||
>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('tasks') }}</CardTitle>
|
||||
<CardDescription>Tasks</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('tickets') }}</CardTitle>
|
||||
<CardDescription>Tickets</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('users') }}</CardTitle>
|
||||
<CardDescription>Users</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle></CardTitle>
|
||||
<CardDescription></CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle> Catalyst</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent class="flex flex-1 flex-col gap-1">
|
||||
<a
|
||||
href="https://catalyst-soar.com/docs/category/catalyst-handbook"
|
||||
target="_blank"
|
||||
class="flex items-center rounded border p-2 text-blue-500 hover:bg-accent"
|
||||
>
|
||||
Open Catalyst Handbook
|
||||
<ExternalLink class="ml-2 h-4 w-4" />
|
||||
</a>
|
||||
<a
|
||||
href="/_/"
|
||||
target="_blank"
|
||||
class="flex items-center rounded border p-2 text-blue-500 hover:bg-accent"
|
||||
>
|
||||
Open Admin Interface
|
||||
<ExternalLink class="ml-2 h-4 w-4" />
|
||||
</a>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle> Tickets by Type</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<TicketTypes />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card class="xl:col-span-2">
|
||||
<CardHeader>
|
||||
<CardTitle>Tickets Per Week</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<TicketOverTime />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card class="xl:col-span-2">
|
||||
<CardHeader>
|
||||
<CardTitle>Your Open Tickets</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<OpenTickets />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card class="xl:col-span-2">
|
||||
<CardHeader>
|
||||
<CardTitle>Your Open Tasks</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<OpenTasks />
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</ScrollArea>
|
||||
</div>
|
||||
<ColumnHeader title="Dashboard" />
|
||||
<ColumnBody>
|
||||
<ColumnBodyContainer
|
||||
class="grid grid-cols-1 grid-rows-[100px_100px_100px_100px] md:grid-cols-2 md:grid-rows-[100px_100px] xl:grid-cols-4 xl:grid-rows-[100px]"
|
||||
>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('tasks') }}</CardTitle>
|
||||
<CardDescription>Tasks</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('tickets') }}</CardTitle>
|
||||
<CardDescription>Tickets</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('users') }}</CardTitle>
|
||||
<CardDescription>Users</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>{{ count('reactions') }}</CardTitle>
|
||||
<CardDescription>Reactions</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle> Catalyst</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent class="flex flex-1 flex-col gap-1">
|
||||
<a
|
||||
href="https://catalyst.security-brewery.com/docs/category/catalyst-handbook"
|
||||
target="_blank"
|
||||
class="flex items-center rounded border p-2 text-blue-500 hover:bg-accent"
|
||||
>
|
||||
Open Catalyst Handbook
|
||||
<ExternalLink class="ml-2 h-4 w-4" />
|
||||
</a>
|
||||
<a
|
||||
href="/_/"
|
||||
target="_blank"
|
||||
class="flex items-center rounded border p-2 text-blue-500 hover:bg-accent"
|
||||
>
|
||||
Open Admin Interface
|
||||
<ExternalLink class="ml-2 h-4 w-4" />
|
||||
</a>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle> Tickets by Type</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<TicketTypes />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card class="xl:col-span-2">
|
||||
<CardHeader>
|
||||
<CardTitle>Tickets Per Week</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<TicketOverTime />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card class="xl:col-span-2">
|
||||
<CardHeader>
|
||||
<CardTitle>Your Open Tickets</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<OpenTickets />
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card class="xl:col-span-2">
|
||||
<CardHeader>
|
||||
<CardTitle>Your Open Tasks</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<OpenTasks />
|
||||
</CardContent>
|
||||
</Card>
|
||||
</ColumnBodyContainer>
|
||||
</ColumnBody>
|
||||
</TwoColumn>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user