mailwolt/resources/views/livewire/ui/system/backup-status-card.blade.php

296 lines
15 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="glass-card p-4 rounded-2xl border border-white/10 bg-white/5"
@if($running) wire:poll.2s="refresh" @endif>
<div class="flex items-center justify-between mb-2">
<div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">
<i class="ph ph-archive-box text-white/70 text-[13px]"></i>
<span class="text-[11px] uppercase text-white/70">Backups</span>
</div>
<button wire:click="runNow"
class="px-2 py-1 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20">
Jetzt sichern
</button>
</div>
@if($running)
<div class="text-white/70 mb-2">
{{ $step === 'compress' ? 'Komprimiere …' : ($step === 'mysqldump' ? 'Datenbank exportieren …' : 'Backup läuft …') }}
<span class="float-right text-white/70">{{ $percent }}%</span>
</div>
<div class="w-full h-2 rounded-full bg-white/10 overflow-hidden mb-3">
<div class="h-2 bg-white/40" style="width: {{ $percent }}%"></div>
</div>
@endif
<div class="space-y-1 text-sm">
<div class="text-white/70">
Letztes Backup: <span class="text-white/90">{{ $lastAt ?? '' }}</span>
</div>
<div class="text-white/70">
Größe: <span class="text-white/90">{{ $lastSize ?? '' }}</span>
</div>
<div class="text-white/70">
Dauer: <span class="text-white/90">{{ $lastDuration ?? '' }}</span>
</div>
<div>
<span class="px-2 py-0.5 rounded-full border text-xs
{{ $ok === true ? 'text-emerald-300 border-emerald-400/30 bg-emerald-500/10'
: ($ok === false ? 'text-rose-300 border-rose-400/30 bg-rose-500/10'
: 'text-white/60 border-white/20 bg-white/5') }}">
{{ $ok === null ? 'unbekannt' : ($ok ? 'erfolgreich' : 'fehlgeschlagen') }}
</span>
</div>
</div>
</div>
{{--<div class="glass-card p-4 rounded-2xl border border-white/10 bg-white/5" wire:poll.2s="refresh">--}}
{{-- <div class="flex items-center justify-between mb-2">--}}
{{-- <div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">--}}
{{-- <i class="ph ph-archive-box text-white/70 text-[13px]"></i>--}}
{{-- <span class="text-[11px] uppercase text-white/70">Backups</span>--}}
{{-- </div>--}}
{{-- <button wire:click="runNow" class="px-2 py-1 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20">--}}
{{-- Jetzt sichern--}}
{{-- </button>--}}
{{-- </div>--}}
{{-- @if($running)--}}
{{-- <div class="text-white/70 mb-2">{{ $progressText }}</div>--}}
{{-- <div class="w-full h-2 rounded-full bg-white/10 overflow-hidden mb-4">--}}
{{-- <div class="h-2 bg-white/40" style="width: {{ $percent }}%"></div>--}}
{{-- </div>--}}
{{-- @endif--}}
{{-- <div class="space-y-1 text-sm">--}}
{{-- <div class="text-white/70">Letztes Backup: <span class="text-white/90">{{ $lastAt ?? '' }}</span></div>--}}
{{-- <div class="text-white/70">Größe: <span class="text-white/90">{{ $lastSize ?? '' }}</span></div>--}}
{{-- <div class="text-white/70">Dauer: <span class="text-white/90">{{ $lastDuration ?? '' }}</span></div>--}}
{{-- <div>--}}
{{-- <span class="px-2 py-0.5 rounded-full border text-xs--}}
{{-- {{ $ok === true ? 'text-emerald-300 border-emerald-400/30 bg-emerald-500/10'--}}
{{-- : ($ok === false ? 'text-rose-300 border-rose-400/30 bg-rose-500/10'--}}
{{-- : 'text-white/60 border-white/20 bg-white/5') }}">--}}
{{-- {{ $ok === null ? 'unbekannt' : ($ok ? 'erfolgreich' : 'fehlgeschlagen') }}--}}
{{-- </span>--}}
{{-- </div>--}}
{{-- </div>--}}
{{--</div>--}}
{{--<div wire:key="backup-card" wire:poll.2s="refresh"--}}
{{-- class="glass-card p-4 rounded-2xl border border-white/10 bg-white/5">--}}
{{-- <div class="flex items-center justify-between mb-2">--}}
{{-- <div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">--}}
{{-- <i class="ph ph-archive-box text-white/70 text-[13px]"></i>--}}
{{-- <span class="text-[11px] uppercase text-white/70">Backups</span>--}}
{{-- </div>--}}
{{-- <button wire:click="runNow"--}}
{{-- class="px-2 py-1 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20">--}}
{{-- Jetzt sichern--}}
{{-- </button>--}}
{{-- </div>--}}
{{-- --}}{{-- Fortschritt (sichtbar nur während run) --}}
{{-- <div class="mb-3 {{ $progressVisibleClass }}">--}}
{{-- <div class="flex items-center justify-between mb-1 text-xs text-white/70">--}}
{{-- <span>{{ $progressText }}</span>--}}
{{-- <span>{{ $progressPercent }}%</span>--}}
{{-- </div>--}}
{{-- <div class="w-full h-2 rounded bg-white/10 overflow-hidden">--}}
{{-- <div class="h-2 bg-white/40" style="width: {{ $progressPercent }}%"></div>--}}
{{-- </div>--}}
{{-- </div>--}}
{{-- --}}{{-- Infos --}}
{{-- <div class="space-y-1 text-sm">--}}
{{-- <div class="text-white/70">Letztes Backup: <span class="text-white/90">{{ $lastAt }}</span></div>--}}
{{-- <div class="text-white/70">Größe: <span class="text-white/90">{{ $lastSize }}</span></div>--}}
{{-- <div class="text-white/70">Dauer: <span class="text-white/90">{{ $lastDuration }}</span></div>--}}
{{-- <div>--}}
{{-- <span class="px-2 py-0.5 rounded-full border text-xs {{ $statusColor }}">--}}
{{-- {{ $statusText }}--}}
{{-- </span>--}}
{{-- </div>--}}
{{-- </div>--}}
{{--</div>--}}
{{--<div--}}
{{-- wire:key="backup-card"--}}
{{-- @if($running) wire:poll.1s="refresh" @endif--}}
{{-- class="glass-card p-4 rounded-2xl border border-white/10 bg-white/5"--}}
{{-->--}}
{{-- <div class="flex items-center justify-between mb-2">--}}
{{-- <div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">--}}
{{-- <i class="ph ph-archive-box text-white/70 text-[13px]"></i>--}}
{{-- <span class="text-[11px] uppercase text-white/70">Backups</span>--}}
{{-- </div>--}}
{{-- <button--}}
{{-- wire:click="runNow"--}}
{{-- class="px-2 py-1 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20 disabled:opacity-50"--}}
{{-- @disabled($running)--}}
{{-- >--}}
{{-- Jetzt sichern--}}
{{-- </button>--}}
{{-- </div>--}}
{{-- --}}{{-- Fortschritt --}}
{{-- <div class="mb-3">--}}
{{-- <div class="flex items-center justify-between mb-1 text-xs text-white/70">--}}
{{-- <span>{{ $progressText }}</span>--}}
{{-- <span>{{ $progressPercent }}%</span>--}}
{{-- </div>--}}
{{-- <div class="w-full h-2 rounded bg-white/10 overflow-hidden">--}}
{{-- <div class="h-2 bg-white/40" style="width: {{ $progressPercent }}%"></div>--}}
{{-- </div>--}}
{{-- </div>--}}
{{-- --}}{{-- Backup Infos --}}
{{-- <div class="space-y-1 text-sm">--}}
{{-- <div class="text-white/70">Letztes Backup: <span class="text-white/90">{{ $lastAt }}</span></div>--}}
{{-- <div class="text-white/70">Größe: <span class="text-white/90">{{ $lastSize }}</span></div>--}}
{{-- <div class="text-white/70">Dauer: <span class="text-white/90">{{ $lastDuration }}</span></div>--}}
{{-- <div>--}}
{{-- <span class="px-2 py-0.5 rounded-full border text-xs {{ $statusColor }}">--}}
{{-- {{ $statusText }}--}}
{{-- </span>--}}
{{-- </div>--}}
{{-- </div>--}}
{{--</div>--}}
{{--<div--}}
{{-- class="glass-card p-4 rounded-2xl border border-white/10 bg-white/5"--}}
{{-- @if($running) wire:poll.1500ms="refresh" @endif--}}
{{-->--}}
{{-- <div class="flex items-center justify-between mb-2">--}}
{{-- <div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">--}}
{{-- <i class="ph ph-archive-box text-white/70 text-[13px]"></i>--}}
{{-- <span class="text-[11px] uppercase text-white/70">Backups</span>--}}
{{-- </div>--}}
{{-- <button wire:click="runNow"--}}
{{-- @disabled($running)--}}
{{-- class="px-2 py-1 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20 disabled:opacity-50">--}}
{{-- {{ $running ? 'Läuft…' : 'Jetzt sichern' }}--}}
{{-- </button>--}}
{{-- </div>--}}
{{-- @if($running)--}}
{{-- <div class="space-y-2">--}}
{{-- <div class="flex items-center justify-between text-xs text-white/70">--}}
{{-- <span>Schritt: <span class="text-white/90">{{ $step ?? 'start' }}</span></span>--}}
{{-- <span>{{ $percent }}%</span>--}}
{{-- </div>--}}
{{-- <div class="w-full h-2 rounded-full bg-white/10 overflow-hidden">--}}
{{-- <div class="h-2 bg-white/60" style="width: {{ max(2,$percent) }}%"></div>--}}
{{-- </div>--}}
{{-- </div>--}}
{{-- @else--}}
{{-- <div class="space-y-1 text-sm">--}}
{{-- <div class="text-white/70">Letztes Backup:--}}
{{-- <span class="text-white/90">{{ $lastAt ?? '' }}</span>--}}
{{-- </div>--}}
{{-- <div class="text-white/70">Größe:--}}
{{-- <span class="text-white/90">{{ $lastSize ?? '' }}</span>--}}
{{-- </div>--}}
{{-- <div class="text-white/70">Dauer:--}}
{{-- <span class="text-white/90">{{ $lastDuration ?? '' }}</span>--}}
{{-- </div>--}}
{{-- <div>--}}
{{-- <span class="px-2 py-0.5 rounded-full border text-xs--}}
{{-- {{ $ok ? 'text-emerald-300 border-emerald-400/30 bg-emerald-500/10'--}}
{{-- : 'text-rose-300 border-rose-400/30 bg-rose-500/10' }}">--}}
{{-- {{ $ok === null ? 'unbekannt' : ($ok ? 'erfolgreich' : 'fehlgeschlagen') }}--}}
{{-- </span>--}}
{{-- </div>--}}
{{-- </div>--}}
{{-- @endif--}}
{{--</div>--}}
{{--<div--}}
{{-- @class([--}}
{{-- 'glass-card p-4 rounded-2xl border bg-white/5',--}}
{{-- 'border-white/10'--}}
{{-- ])--}}
{{-- @if($state === 'running') wire:poll.1000ms="refresh" @endif--}}
{{-->--}}
{{-- <div class="flex items-center justify-between mb-3">--}}
{{-- <div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">--}}
{{-- <i class="ph ph-archive-box text-white/70 text-[13px]"></i>--}}
{{-- <span class="text-[11px] uppercase text-white/70">Backups</span>--}}
{{-- </div>--}}
{{-- <button--}}
{{-- wire:click="runNow"--}}
{{-- class="px-3 py-1.5 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20 disabled:opacity-50"--}}
{{-- @disabled($state === 'running')--}}
{{-- >--}}
{{-- {{ $state === 'running' ? 'Läuft…' : 'Jetzt sichern' }}--}}
{{-- </button>--}}
{{-- </div>--}}
{{-- --}}{{-- Laufender Fortschritt --}}
{{-- @if($state === 'running')--}}
{{-- <div class="space-y-2">--}}
{{-- <div class="text-white/80 text-sm">Sicherung läuft…</div>--}}
{{-- <ul class="space-y-1">--}}
{{-- @foreach($steps as $k => $label)--}}
{{-- @php--}}
{{-- $done = $k === 'finish' ? false : ($k === $step ? false : (array_key_first(array_flip($steps)) !== $k && $k !== $step && $step && array_search($k, array_keys($steps)) < array_search($step, array_keys($steps))));--}}
{{-- $isCurrent = $k === $step;--}}
{{-- @endphp--}}
{{-- <li class="flex items-center gap-2 text-sm">--}}
{{-- <span class="w-2 h-2 rounded-full--}}
{{-- {{ $done ? 'bg-emerald-400' : ($isCurrent ? 'bg-amber-400 animate-pulse' : 'bg-white/20') }}"></span>--}}
{{-- <span class="{{ $done ? 'text-white/80' : ($isCurrent ? 'text-white' : 'text-white/60') }}">--}}
{{-- {{ $label }}--}}
{{-- </span>--}}
{{-- </li>--}}
{{-- @endforeach--}}
{{-- </ul>--}}
{{-- </div>--}}
{{-- @else--}}
{{-- --}}{{-- Letztes Ergebnis --}}
{{-- <div class="space-y-1 text-sm">--}}
{{-- <div class="text-white/70">Letztes Backup:--}}
{{-- <span class="text-white/90 font-medium">{{ $lastAt ?? '' }}</span>--}}
{{-- </div>--}}
{{-- <div class="text-white/70">Größe:--}}
{{-- <span class="text-white/90 font-medium">{{ $lastSize ?? '' }}</span>--}}
{{-- </div>--}}
{{-- <div class="text-white/70">Dauer:--}}
{{-- <span class="text-white/90 font-medium">{{ $lastDuration ?? '' }}</span>--}}
{{-- </div>--}}
{{-- <div class="pt-1">--}}
{{-- <span class="px-2 py-0.5 rounded-full border text-xs--}}
{{-- {{ $ok === null--}}
{{-- ? 'text-slate-300 border-slate-400/30 bg-slate-500/10'--}}
{{-- : ($ok ? 'text-emerald-300 border-emerald-400/30 bg-emerald-500/10'--}}
{{-- : 'text-rose-300 border-rose-400/30 bg-rose-500/10') }}">--}}
{{-- {{ $ok === null ? 'unbekannt' : ($ok ? 'erfolgreich' : 'fehlgeschlagen') }}--}}
{{-- </span>--}}
{{-- </div>--}}
{{-- </div>--}}
{{-- @endif--}}
{{--</div>--}}
{{--<div wire:key="storage-{{ md5($target ?? '/') }}" class="glass-card p-4 rounded-2xl border border-white/10 bg-white/5">--}}
{{-- <div class="flex items-center justify-between mb-2">--}}
{{-- <div class="inline-flex items-center gap-2 bg-white/5 border border-white/10 px-2.5 py-1 rounded-full">--}}
{{-- <i class="ph ph-archive-box text-white/70 text-[13px]"></i>--}}
{{-- <span class="text-[11px] uppercase text-white/70">Backups</span>--}}
{{-- </div>--}}
{{-- <button wire:click="runNow" class="px-2 py-1 text-xs rounded-lg border border-white/10 bg-white/5 hover:border-white/20">Jetzt sichern</button>--}}
{{-- </div>--}}
{{-- <div class="space-y-1 text-sm">--}}
{{-- <div class="text-white/70">Letztes Backup: <span class="text-white/90">{{ $lastAt ?? '' }}</span></div>--}}
{{-- <div class="text-white/70">Größe: <span class="text-white/90">{{ $lastSize ?? '' }}</span></div>--}}
{{-- <div class="text-white/70">Dauer: <span class="text-white/90">{{ $lastDuration ?? '' }}</span></div>--}}
{{-- <div>--}}
{{-- <span class="px-2 py-0.5 rounded-full border text-xs--}}
{{-- {{ $ok ? 'text-emerald-300 border-emerald-400/30 bg-emerald-500/10' : 'text-rose-300 border-rose-400/30 bg-rose-500/10' }}">--}}
{{-- {{ $ok === null ? 'unbekannt' : ($ok ? 'erfolgreich' : 'fehlgeschlagen') }}--}}
{{-- </span>--}}
{{-- </div>--}}
{{-- </div>--}}
{{--</div>--}}