CluPilotCloud/resources/views/livewire/admin/maintenance.blade.php

109 lines
8.0 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<div class="space-y-6">
<div class="animate-rise">
<h1 class="text-2xl font-semibold tracking-tight text-ink">{{ __('maintenance.title') }}</h1>
<p class="mt-1 text-sm text-muted">{{ __('maintenance.subtitle') }}</p>
</div>
<div class="grid grid-cols-1 gap-6 lg:grid-cols-[1fr_340px] lg:items-start">
{{-- Windows list --}}
<div class="overflow-hidden rounded-xl border border-line bg-surface shadow-xs animate-rise [animation-delay:60ms]">
@if ($windows->isEmpty())
<p class="p-8 text-center text-sm text-muted">{{ __('maintenance.empty') }}</p>
@else
<div class="overflow-x-auto">
<table class="w-full text-sm">
<thead>
<tr class="border-b border-line bg-surface-2 text-left text-xs uppercase tracking-wide text-faint">
<th class="px-4 py-3 font-semibold">{{ __('maintenance.col_window') }}</th>
<th class="px-4 py-3 font-semibold">{{ __('maintenance.col_when') }}</th>
<th class="px-4 py-3 font-semibold">{{ __('maintenance.col_impact') }}</th>
<th class="px-4 py-3 font-semibold">{{ __('maintenance.col_state') }}</th>
<th class="px-4 py-3 text-right font-semibold">{{ __('maintenance.col_actions') }}</th>
</tr>
</thead>
<tbody>
@foreach ($windows as $w)
@php $tone = ['draft' => 'info', 'upcoming' => 'provisioning', 'active' => 'warning', 'completed' => 'active', 'cancelled' => 'suspended'][$w['state']] ?? 'info'; @endphp
<tr wire:key="mw-{{ $w['uuid'] }}" class="border-b border-line last:border-0 hover:bg-surface-hover">
<td class="px-4 py-3 font-medium text-ink">{{ $w['title'] }}</td>
<td class="px-4 py-3 text-xs text-body">{{ $w['starts_at']->isoFormat('DD.MM. HH:mm') }} {{ $w['ends_at']->isoFormat('HH:mm') }}</td>
<td class="px-4 py-3 font-mono text-xs text-muted">{{ __('maintenance.impact', ['hosts' => $w['hosts'], 'customers' => $w['affected']]) }}</td>
<td class="px-4 py-3"><x-ui.badge :status="$tone">{{ __('maintenance.state_'.$w['state']) }}</x-ui.badge></td>
<td class="px-4 py-3 text-right">
<div class="inline-flex gap-1.5">
@if ($w['is_draft'])
<button type="button" wire:click="publishExisting('{{ $w['uuid'] }}')" class="rounded-md border border-line px-2.5 py-1.5 text-xs font-semibold text-body hover:border-accent-border hover:text-accent-text">{{ __('maintenance.publish') }}</button>
@endif
@if ($w['notifiable'])
<button type="button" wire:click="resend('{{ $w['uuid'] }}')" class="rounded-md border border-line px-2.5 py-1.5 text-xs font-semibold text-body hover:border-accent-border hover:text-accent-text">{{ __('maintenance.notify_again') }}</button>
@endif
@if ($w['cancellable'])
<button type="button" wire:click="cancel('{{ $w['uuid'] }}')" class="rounded-md border border-line px-2.5 py-1.5 text-xs font-semibold text-muted hover:border-danger hover:text-danger">{{ __('maintenance.cancel') }}</button>
@endif
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
@endif
</div>
{{-- Create form --}}
<form wire:submit="publish" class="space-y-4 rounded-xl border border-line bg-surface p-5 shadow-xs animate-rise [animation-delay:120ms]">
<h2 class="font-semibold text-ink">{{ __('maintenance.new_title') }}</h2>
<x-ui.input name="title" wire:model="title" :label="__('maintenance.field_title')" />
<div>
<label class="text-sm font-medium text-body" for="publicDescription">{{ __('maintenance.field_public') }}</label>
<textarea id="publicDescription" wire:model="publicDescription" rows="2" class="mt-1.5 w-full rounded-md border border-line-strong bg-surface px-3 py-2 text-sm text-ink"></textarea>
</div>
<div>
<label class="text-sm font-medium text-body" for="internalNotes">{{ __('maintenance.field_internal') }}</label>
<textarea id="internalNotes" wire:model="internalNotes" rows="2" class="mt-1.5 w-full rounded-md border border-line-strong bg-surface px-3 py-2 text-sm text-ink"></textarea>
</div>
<div class="grid grid-cols-1 gap-3 sm:grid-cols-2">
<div>
<label class="text-sm font-medium text-body" for="startsAt">{{ __('maintenance.field_start') }}</label>
<input id="startsAt" type="datetime-local" wire:model="startsAt" class="mt-1.5 w-full rounded-md border border-line-strong bg-surface px-3 py-2 text-sm text-ink" />
@error('startsAt')<p class="mt-1 text-xs text-danger">{{ $message }}</p>@enderror
</div>
<div>
<label class="text-sm font-medium text-body" for="endsAt">{{ __('maintenance.field_end') }}</label>
<input id="endsAt" type="datetime-local" wire:model="endsAt" class="mt-1.5 w-full rounded-md border border-line-strong bg-surface px-3 py-2 text-sm text-ink" />
@error('endsAt')<p class="mt-1 text-xs text-danger">{{ $message }}</p>@enderror
</div>
</div>
<div>
<p class="text-sm font-medium text-body">{{ __('maintenance.field_hosts') }}</p>
@error('hostIds')<p class="mt-1 text-xs text-danger">{{ $message }}</p>@enderror
<div class="mt-1.5 max-h-48 space-y-3 overflow-y-auto rounded-md border border-line p-3">
@foreach ($datacenters as $dc)
@php $dcHosts = $hosts->where('datacenter', $dc->code); @endphp
@if ($dcHosts->isNotEmpty())
<div>
<p class="text-xs font-semibold uppercase tracking-wide text-faint">{{ $dc->name }}</p>
<div class="mt-1 space-y-1">
@foreach ($dcHosts as $host)
<label class="flex items-center gap-2 text-sm text-body">
<input type="checkbox" wire:model="hostIds" value="{{ $host->id }}" class="rounded border-line-strong text-accent-active" />
<span class="font-mono">{{ $host->name }}</span>
</label>
@endforeach
</div>
</div>
@endif
@endforeach
</div>
</div>
<div class="flex flex-wrap justify-end gap-2">
<x-ui.button variant="secondary" type="button" wire:click="saveDraft" wire:loading.attr="disabled" wire:target="saveDraft">{{ __('maintenance.save_draft') }}</x-ui.button>
<x-ui.button variant="primary" type="submit" wire:loading.attr="disabled" wire:target="publish">{{ __('maintenance.publish_notify') }}</x-ui.button>
</div>
<p class="text-xs text-faint">{{ __('maintenance.mail_note') }}</p>
</form>
</div>
</div>