Enhance VM creation request validation and UI.

- Introduced `prepareForValidation` method to handle input merging for `behind_traefik` and `devices`.
- Updated validation rules to conditionally require `subdomain` based on `behind_traefik`.
- Added custom attribute names and error messages for better user feedback.
- Improved the create VM form to dynamically show/hide subdomain fields based on the `behind_traefik` checkbox state.
- Adjusted the user selection logic to display a message when no customers are available.
This commit is contained in:
TheOnlyMace
2026-05-17 14:32:08 +02:00
parent 5b260022f8
commit e00d92a75b
3 changed files with 125 additions and 14 deletions

View File

@@ -13,30 +13,39 @@
<input name="name" value="{{ old('name') }}" required class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2">
</label>
@if($customers->isNotEmpty())
@if(auth()->user()->isAdmin())
<label class="block">
<span class="text-sm text-slate-400">Zugewiesener Kunde</span>
<select name="user_id" required class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2">
<span class="text-sm text-slate-400">Zugewiesener Benutzer</span>
<select name="user_id" class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2">
<option value=""> Mir selbst (Admin) </option>
@foreach($customers as $c)
<option value="{{ $c->id }}" @selected(old('user_id') == $c->id)>{{ $c->name }} ({{ $c->email }})</option>
@endforeach
</select>
@if($customers->isEmpty())
<p class="mt-1 text-xs text-slate-500">Noch keine Kundenkonten VM wird deinem Admin-Konto zugeordnet. Kunden unter „Benutzer“ anlegen.</p>
@endif
</label>
@endif
@php
$behindTraefik = filter_var(old('behind_traefik', '1'), FILTER_VALIDATE_BOOLEAN);
@endphp
<label class="flex items-center gap-2">
<input type="hidden" name="behind_traefik" value="0">
<input type="checkbox" name="behind_traefik" value="1" @checked(old('behind_traefik', true)) id="behind_traefik" class="rounded border-slate-600 text-cyan-500">
<input type="checkbox" name="behind_traefik" value="1" @checked($behindTraefik) id="behind_traefik" class="rounded border-slate-600 text-cyan-500">
<span class="text-sm">Hinter Traefik (Subdomain + DNS)</span>
</label>
<div id="traefik-fields">
<div id="traefik-fields" @if(!$behindTraefik) style="display:none" @endif>
<label class="block">
<span class="text-sm text-slate-400">Subdomain</span>
<span class="text-sm text-slate-400">Subdomain <span class="text-red-400">*</span></span>
<div class="mt-1 flex">
<input name="subdomain" value="{{ old('subdomain') }}" class="w-full rounded-l-lg border border-slate-700 bg-slate-800 px-3 py-2">
<input name="subdomain" id="subdomain" value="{{ old('subdomain') }}" placeholder="meine-vm"
class="w-full rounded-l-lg border border-slate-700 bg-slate-800 px-3 py-2 @error('subdomain') border-red-500 @enderror">
<span class="flex items-center rounded-r-lg border border-l-0 border-slate-700 bg-slate-800 px-3 text-sm text-slate-500">.{{ config('hosting.plesk.base_domain') }}</span>
</div>
@error('subdomain')<p class="mt-1 text-xs text-red-400">{{ $message }}</p>@enderror
<p class="mt-1 text-xs text-slate-500">Pflichtfeld bei „Hinter Traefik“ (nur a-z, 0-9, Bindestrich).</p>
</label>
</div>
@@ -90,7 +99,12 @@
<script>
const cb = document.getElementById('behind_traefik');
const fields = document.getElementById('traefik-fields');
function toggle() { fields.style.display = cb.checked ? 'block' : 'none'; }
const subdomain = document.getElementById('subdomain');
function toggle() {
const on = cb.checked;
fields.style.display = on ? 'block' : 'none';
if (subdomain) subdomain.required = on;
}
cb?.addEventListener('change', toggle);
toggle();
</script>