Implement Keystone environment deployments
This commit is contained in:
@@ -1,9 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent } from '@/components/ui/card';
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||
import AppLayout from '@/layouts/AppLayout.vue';
|
||||
import { Head, Link, WhenVisible } from '@inertiajs/vue3';
|
||||
import { AppWindowIcon, ServerIcon, UserIcon } from 'lucide-vue-next';
|
||||
import { AppWindowIcon, GitBranchIcon, ServerIcon, ShieldCheckIcon, UserIcon } from 'lucide-vue-next';
|
||||
import { ref, watch } from 'vue';
|
||||
|
||||
defineProps({
|
||||
@@ -15,6 +16,14 @@ defineProps({
|
||||
type: Array,
|
||||
required: false,
|
||||
},
|
||||
registries: {
|
||||
type: Array,
|
||||
required: false,
|
||||
},
|
||||
sourceProviders: {
|
||||
type: Array,
|
||||
required: false,
|
||||
},
|
||||
});
|
||||
|
||||
const tabValue = ref(new URL(window.location.href).hash?.replace('#', '') || 'dashboard');
|
||||
@@ -92,6 +101,58 @@ watch(
|
||||
</div>
|
||||
</TabsContent>
|
||||
<TabsContent value="settings">
|
||||
<WhenVisible data="registries">
|
||||
<template #fallback> Loading... </template>
|
||||
<div class="mt-4 flex items-center justify-between gap-3">
|
||||
<h3 class="text-2xl font-bold tracking-tight">Registries</h3>
|
||||
<Button
|
||||
:as="Link"
|
||||
:href="
|
||||
route('registries.create', {
|
||||
organisation: organisation.id,
|
||||
})
|
||||
"
|
||||
>
|
||||
Add
|
||||
</Button>
|
||||
</div>
|
||||
<div class="border-muted-background divide-y-muted-background mb-6 max-w-96 divide-y rounded-md border">
|
||||
<div v-for="registry in registries" :key="registry.id" class="flex items-center gap-2 px-2 py-1">
|
||||
<ShieldCheckIcon class="size-4 text-muted-foreground" />
|
||||
{{ registry.name }}
|
||||
<span class="ml-auto text-xs uppercase text-muted-foreground">{{ registry.type }}</span>
|
||||
</div>
|
||||
<div v-if="!registries?.length" class="px-2 py-1 text-sm text-muted-foreground">No registries configured</div>
|
||||
</div>
|
||||
</WhenVisible>
|
||||
<WhenVisible data="sourceProviders">
|
||||
<template #fallback> Loading... </template>
|
||||
<div class="mb-6">
|
||||
<div class="flex items-center justify-between gap-3">
|
||||
<h3 class="text-2xl font-bold tracking-tight">Source Providers</h3>
|
||||
<Button
|
||||
:as="Link"
|
||||
:href="
|
||||
route('source-providers.create', {
|
||||
organisation: organisation.id,
|
||||
})
|
||||
"
|
||||
>
|
||||
Add
|
||||
</Button>
|
||||
</div>
|
||||
<div class="border-muted-background divide-y-muted-background max-w-96 divide-y rounded-md border">
|
||||
<div v-for="sourceProvider in sourceProviders" :key="sourceProvider.id" class="flex items-center gap-2 px-2 py-1">
|
||||
<GitBranchIcon class="size-4 text-muted-foreground" />
|
||||
{{ sourceProvider.name }}
|
||||
<span class="ml-auto text-xs uppercase text-muted-foreground">{{ sourceProvider.type }}</span>
|
||||
</div>
|
||||
<div v-if="!sourceProviders?.length" class="px-2 py-1 text-sm text-muted-foreground">
|
||||
No source providers configured
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</WhenVisible>
|
||||
<WhenVisible data="providers">
|
||||
<template #fallback> Loading... </template>
|
||||
<h3 class="mt-4 text-2xl font-bold tracking-tight">Server Providers</h3>
|
||||
|
||||
Reference in New Issue
Block a user