Files
keystone/resources/js/pages/services/Edit.vue

69 lines
3.0 KiB
Vue

<script setup>
import InputError from '@/components/InputError.vue';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import AppLayout from '@/layouts/AppLayout.vue';
import { Head, useForm } from '@inertiajs/vue3';
const props = defineProps({
server: { type: Object, required: true },
service: { type: Object, required: true },
});
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,
});
</script>
<template>
<Head :title="`Edit ${service.name}`" />
<AppLayout
:breadcrumbs="[
{ title: 'Servers', href: route('servers.index', { organisation: $page.props.organisation.id }) },
{ title: server.name, href: route('servers.show', { organisation: $page.props.organisation.id, server: server.id }) },
{ title: service.name, href: route('services.show', { organisation: $page.props.organisation.id, server: server.id, service: service.id }) },
{ title: 'Edit' },
]"
>
<form
class="flex h-full max-w-2xl flex-1 flex-col gap-5 p-4"
@submit.prevent="form.put(route('services.update', { organisation: $page.props.organisation.id, server: server.id, service: service.id }))"
>
<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>
<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>
<div class="flex justify-end">
<Button type="submit" :disabled="form.processing">Save</Button>
</div>
</form>
</AppLayout>
</template>