server list, logs removed, driver/plan wip

2025-03-31 12:41:09 +00:00
parent 678581b822
commit 75f2ecb7bf
14 changed files with 164 additions and 47 deletions
--- a/resources/js/pages/servers/Index.vue
+++ b/resources/js/pages/servers/Index.vue
@@ -1,6 +1,7 @@
-<script setup lang="ts">
+<script setup>
+import { Card, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
 import AppLayout from '@/layouts/AppLayout.vue';
-import { Head } from '@inertiajs/vue3';
+import { Head, Link } from '@inertiajs/vue3';

 const props = defineProps({
    servers: {
@@ -13,9 +14,28 @@ const props = defineProps({
 <template>
    <Head title="Dashboard" />

-    <AppLayout>
-        <div class="flex h-full flex-1 flex-col gap-4 rounded-xl p-4">
-            {{ servers.data }}
+    <AppLayout :breadcrumbs="[
+        {
+            title: 'Servers',
+            href: route('servers.index', {
+                organisation: $page.props.organisation.id,
+            }),
+        },
+    ]">
+        <div class="grid gap-4 rounded-xl p-4 md:grid-cols-2 lg:grid-cols-3">
+            <Card v-for="server in servers.data" :key="`server{$servers.id}`" class="w-full relative">
+                <CardHeader>
+                    <CardTitle>{{ server.name }}</CardTitle>
+                    <CardDescription
+                        ><span class="inline-block rounded-md bg-green-200 px-2 text-xs uppercase text-green-800">{{ server.status }}</span> &bull;
+                        {{ server.ipv4 || server.ipv6 }}</CardDescription
+                    >
+                </CardHeader>
+                <Link :href="route('servers.show', {
+                    organisation: $page.props.organisation.id,
+                    server: server.id,
+                })" class="absolute inset-0"></Link>
+            </Card>

            <div>@todo pagination</div>
        </div>