88 lines
6.3 KiB
PHP
88 lines
6.3 KiB
PHP
<div class="p-5 sm:p-6">
|
|
<div class="flex items-start gap-3.5">
|
|
<span class="grid h-10 w-10 shrink-0 place-items-center rounded-md border border-accent/30 bg-accent/10 text-accent-text">
|
|
<x-icon name="server" class="h-5 w-5" />
|
|
</span>
|
|
<div class="min-w-0 flex-1">
|
|
<h2 class="font-display text-base font-semibold text-ink">Server hinzufügen</h2>
|
|
<p class="mt-1 text-sm leading-relaxed text-ink-2">Neuen Host in die Flotte aufnehmen und den SSH-Zugang im verschlüsselten Tresor hinterlegen.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4 space-y-3">
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">Name</label>
|
|
<input wire:model="name" type="text" placeholder="z. B. Prod-Web-01" maxlength="120"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
@error('name')<p class="mt-1 flex items-center gap-1.5 font-mono text-[11px] text-offline"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p>@enderror
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 gap-3 sm:grid-cols-3">
|
|
<div class="sm:col-span-2">
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">IP/Host</label>
|
|
<input wire:model="ip" type="text" placeholder="10.10.90.10 oder host.example.com"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
@error('ip')<p class="mt-1 flex items-center gap-1.5 font-mono text-[11px] text-offline"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p>@enderror
|
|
</div>
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">SSH-Port</label>
|
|
<input wire:model="sshPort" type="number" min="1" max="65535" placeholder="22"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
@error('sshPort')<p class="mt-1 flex items-center gap-1.5 font-mono text-[11px] text-offline"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p>@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">Benutzer</label>
|
|
<input wire:model="username" type="text" placeholder="root"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
@error('username')<p class="mt-1 flex items-center gap-1.5 font-mono text-[11px] text-offline"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p>@enderror
|
|
</div>
|
|
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">Authentifizierung</label>
|
|
<select wire:model.live="authType"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 text-sm text-ink focus:border-accent/40 focus:outline-none">
|
|
<option value="password">Passwort</option>
|
|
<option value="key">Privater Schlüssel</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">{{ $authType === 'key' ? 'Privater Schlüssel (PEM)' : 'Passwort' }}</label>
|
|
@if ($authType === 'key')
|
|
<textarea wire:model="secret" rows="4" placeholder="-----BEGIN OPENSSH PRIVATE KEY-----"
|
|
class="w-full rounded-md border border-line bg-inset px-3 py-2.5 font-mono text-xs text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none"></textarea>
|
|
@else
|
|
<input wire:model="secret" type="password" placeholder="••••••••"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
@endif
|
|
@error('secret')<p class="mt-1 flex items-center gap-1.5 font-mono text-[11px] text-offline"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p>@enderror
|
|
</div>
|
|
|
|
@if ($authType === 'key')
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">Passphrase (optional)</label>
|
|
<input wire:model="passphrase" type="password" placeholder="leer = keine"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
</div>
|
|
@endif
|
|
|
|
<div>
|
|
<label class="mb-1 block font-mono text-[11px] uppercase tracking-wider text-ink-3">Zugangs-Name (optional)</label>
|
|
<input wire:model="credentialName" type="text" placeholder="z. B. Root-Login · Deploy-User" maxlength="120"
|
|
class="h-9 w-full rounded-md border border-line bg-inset px-3 font-mono text-sm text-ink placeholder:text-ink-4 focus:border-accent/40 focus:outline-none" />
|
|
@error('credentialName')<p class="mt-1 flex items-center gap-1.5 font-mono text-[11px] text-offline"><x-icon name="alert" class="h-3.5 w-3.5 shrink-0" />{{ $message }}</p>@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-6 flex items-center justify-end gap-2">
|
|
<x-btn variant="secondary" wire:click="$dispatch('closeModal')">Abbrechen</x-btn>
|
|
<x-btn variant="primary" wire:click="save" wire:target="save" wire:loading.attr="disabled">
|
|
<x-icon name="plus" class="h-3.5 w-3.5" wire:loading.remove wire:target="save" />
|
|
<svg wire:loading wire:target="save" class="h-3.5 w-3.5 animate-spin" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" aria-hidden="true"><path d="M21 12a9 9 0 1 1-6.219-8.56" stroke-linecap="round" /></svg>
|
|
Hinzufügen
|
|
</x-btn>
|
|
</div>
|
|
</div>
|