wowowowowo
This commit is contained in:
@@ -1,22 +1,50 @@
|
||||
<script setup>
|
||||
<script setup lang="ts">
|
||||
import InputError from "@/components/InputError.vue";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import AppLayout from "@/layouts/AppLayout.vue";
|
||||
import { Head, useForm } from "@inertiajs/vue3";
|
||||
import { Head, router, useForm } from "@inertiajs/vue3";
|
||||
|
||||
const props = defineProps({
|
||||
server: { type: Object, required: true },
|
||||
service: { type: Object, required: true },
|
||||
});
|
||||
const props = defineProps<{
|
||||
server: Record<string, any>;
|
||||
service: Record<string, any>;
|
||||
deployPolicies: string[];
|
||||
}>();
|
||||
|
||||
const serviceConfig = props.service.config ?? {};
|
||||
|
||||
const form = useForm({
|
||||
name: props.service.name,
|
||||
desired_replicas: props.service.desired_replicas,
|
||||
default_cpu_limit: props.service.default_cpu_limit,
|
||||
default_memory_limit_mb: props.service.default_memory_limit_mb,
|
||||
deploy_policy: props.service.deploy_policy,
|
||||
version_track: props.service.version_track,
|
||||
available_image_digest: props.service.available_image_digest ?? "",
|
||||
process_roles: props.service.process_roles?.join(", ") ?? "",
|
||||
migration_mode: serviceConfig.migration_mode ?? "",
|
||||
migration_timing: serviceConfig.migration_timing ?? "",
|
||||
migration_command: serviceConfig.migration_command ?? "",
|
||||
health_path: serviceConfig.health_path ?? "/up",
|
||||
backup_enabled: Boolean(serviceConfig.backup_enabled),
|
||||
backup_command: serviceConfig.backup_command ?? "",
|
||||
});
|
||||
|
||||
const destroyService = (): void => {
|
||||
if (!window.confirm(`Delete ${props.service.name}?`)) {
|
||||
return;
|
||||
}
|
||||
|
||||
router.delete(
|
||||
route("services.destroy", {
|
||||
organisation: props.server.organisation_id,
|
||||
server: props.server.id,
|
||||
service: props.service.id,
|
||||
}),
|
||||
);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -47,7 +75,7 @@ const form = useForm({
|
||||
]"
|
||||
>
|
||||
<form
|
||||
class="flex h-full max-w-2xl flex-1 flex-col gap-5 p-4"
|
||||
class="flex h-full max-w-4xl flex-1 flex-col gap-5 p-4"
|
||||
@submit.prevent="
|
||||
form.put(
|
||||
route('services.update', {
|
||||
@@ -58,52 +86,161 @@ const form = useForm({
|
||||
)
|
||||
"
|
||||
>
|
||||
<h2 class="text-3xl font-bold tracking-tight">Edit {{ service.name }}</h2>
|
||||
|
||||
<div class="grid gap-2">
|
||||
<Label for="name">Name</Label>
|
||||
<Input id="name" v-model="form.name" type="text" required />
|
||||
<InputError :message="form.errors.name" />
|
||||
<div>
|
||||
<h2 class="text-3xl font-bold tracking-tight">Edit {{ service.name }}</h2>
|
||||
<p class="mt-1 text-sm text-muted-foreground">
|
||||
Deployment, runtime, migration, scheduler role, and health-check defaults.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid gap-4 md:grid-cols-3">
|
||||
<div class="grid gap-2">
|
||||
<Label for="desired_replicas">Replicas</Label>
|
||||
<Input
|
||||
id="desired_replicas"
|
||||
v-model="form.desired_replicas"
|
||||
type="number"
|
||||
min="0"
|
||||
max="25"
|
||||
/>
|
||||
<InputError :message="form.errors.desired_replicas" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="default_cpu_limit">CPU</Label>
|
||||
<Input
|
||||
id="default_cpu_limit"
|
||||
v-model="form.default_cpu_limit"
|
||||
type="number"
|
||||
min="0.125"
|
||||
max="64"
|
||||
step="0.125"
|
||||
/>
|
||||
<InputError :message="form.errors.default_cpu_limit" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="default_memory_limit_mb">Memory MB</Label>
|
||||
<Input
|
||||
id="default_memory_limit_mb"
|
||||
v-model="form.default_memory_limit_mb"
|
||||
type="number"
|
||||
min="64"
|
||||
max="1048576"
|
||||
/>
|
||||
<InputError :message="form.errors.default_memory_limit_mb" />
|
||||
</div>
|
||||
</div>
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Runtime</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent class="grid gap-4">
|
||||
<div class="grid gap-2">
|
||||
<Label for="name">Name</Label>
|
||||
<Input id="name" v-model="form.name" type="text" required />
|
||||
<InputError :message="form.errors.name" />
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end">
|
||||
<div class="grid gap-4 md:grid-cols-3">
|
||||
<div class="grid gap-2">
|
||||
<Label for="desired_replicas">Replicas</Label>
|
||||
<Input
|
||||
id="desired_replicas"
|
||||
v-model="form.desired_replicas"
|
||||
type="number"
|
||||
min="0"
|
||||
max="25"
|
||||
/>
|
||||
<InputError :message="form.errors.desired_replicas" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="default_cpu_limit">CPU</Label>
|
||||
<Input
|
||||
id="default_cpu_limit"
|
||||
v-model="form.default_cpu_limit"
|
||||
type="number"
|
||||
min="0.125"
|
||||
max="64"
|
||||
step="0.125"
|
||||
/>
|
||||
<InputError :message="form.errors.default_cpu_limit" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="default_memory_limit_mb">Memory MB</Label>
|
||||
<Input
|
||||
id="default_memory_limit_mb"
|
||||
v-model="form.default_memory_limit_mb"
|
||||
type="number"
|
||||
min="64"
|
||||
max="1048576"
|
||||
/>
|
||||
<InputError :message="form.errors.default_memory_limit_mb" />
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Deployment</CardTitle>
|
||||
<CardDescription>Stateful services can track available image updates.</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent class="grid gap-4 md:grid-cols-2">
|
||||
<div class="grid gap-2">
|
||||
<Label for="deploy_policy">Deploy policy</Label>
|
||||
<select
|
||||
id="deploy_policy"
|
||||
v-model="form.deploy_policy"
|
||||
class="h-9 rounded-md border border-input bg-transparent px-3 text-sm"
|
||||
>
|
||||
<option v-for="policy in deployPolicies" :key="policy" :value="policy">
|
||||
{{ policy.replace("_", " ") }}
|
||||
</option>
|
||||
</select>
|
||||
<InputError :message="form.errors.deploy_policy" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="version_track">Version track</Label>
|
||||
<Input id="version_track" v-model="form.version_track" />
|
||||
<InputError :message="form.errors.version_track" />
|
||||
</div>
|
||||
<div class="grid gap-2 md:col-span-2">
|
||||
<Label for="available_image_digest">Available image digest</Label>
|
||||
<Input id="available_image_digest" v-model="form.available_image_digest" />
|
||||
<InputError :message="form.errors.available_image_digest" />
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Roles, Migrations & Health</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent class="grid gap-4 md:grid-cols-2">
|
||||
<div class="grid gap-2 md:col-span-2">
|
||||
<Label for="process_roles">Process roles</Label>
|
||||
<Input id="process_roles" v-model="form.process_roles" placeholder="web, scheduler" />
|
||||
<InputError :message="form.errors.process_roles" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="migration_mode">Migration mode</Label>
|
||||
<Input id="migration_mode" v-model="form.migration_mode" />
|
||||
<InputError :message="form.errors.migration_mode" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="migration_timing">Migration timing</Label>
|
||||
<Input id="migration_timing" v-model="form.migration_timing" />
|
||||
<InputError :message="form.errors.migration_timing" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="migration_command">Migration command</Label>
|
||||
<Input id="migration_command" v-model="form.migration_command" />
|
||||
<InputError :message="form.errors.migration_command" />
|
||||
</div>
|
||||
<div class="grid gap-2">
|
||||
<Label for="health_path">Health path</Label>
|
||||
<Input id="health_path" v-model="form.health_path" />
|
||||
<InputError :message="form.errors.health_path" />
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Backups</CardTitle>
|
||||
<CardDescription>
|
||||
Enabled backups can be run before guided stateful service updates.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent class="grid gap-4">
|
||||
<label class="flex items-center gap-2 text-sm">
|
||||
<input
|
||||
v-model="form.backup_enabled"
|
||||
type="checkbox"
|
||||
class="rounded border-input"
|
||||
/>
|
||||
Enable pre-update backup option
|
||||
</label>
|
||||
<InputError :message="form.errors.backup_enabled" />
|
||||
<div class="grid gap-2">
|
||||
<Label for="backup_command">Backup command</Label>
|
||||
<Input
|
||||
id="backup_command"
|
||||
v-model="form.backup_command"
|
||||
placeholder="pg_dump --format=custom app > /home/keystone/backups/pre-update.dump"
|
||||
/>
|
||||
<InputError :message="form.errors.backup_command" />
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<div class="flex flex-wrap justify-between gap-2">
|
||||
<Button type="button" variant="destructive" @click="destroyService">
|
||||
Delete service
|
||||
</Button>
|
||||
<Button type="submit" :disabled="form.processing">Save</Button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user