Files

79 lines
5.3 KiB
PHP

<x-layouts::app :title="__('Legacy Tickets')">
<div class="hd-helpdesk-surface hd-mobile-ready space-y-6">
<div class="overflow-hidden rounded-3xl border border-zinc-200 bg-white shadow-sm dark:border-zinc-700 dark:bg-zinc-900">
<div class="bg-gradient-to-br from-slate-950 via-slate-900 to-blue-950 px-6 py-7 text-white">
<p class="text-xs font-semibold uppercase tracking-[0.28em] text-blue-200">Legacy System</p>
<h1 class="mt-2 text-3xl font-semibold tracking-tight">Legacy Tickets</h1>
<p class="mt-2 text-sm text-blue-100/90">Historical tickets from the previous Helpdesk. These records are read-only.</p>
</div>
</div>
<div class="rounded-2xl border border-zinc-200 bg-white p-4 shadow-sm dark:border-zinc-700 dark:bg-zinc-900">
<form class="grid gap-3 md:grid-cols-[1fr_260px_auto]" method="GET">
<input class="hd-ticket-search" type="search" name="search" value="{{ $search }}" placeholder="Search reference, subject or requester">
<select class="hd-select" name="category"><option value="">All legacy categories</option>@foreach($categories as $category)<option value="{{ $category->legacy_id }}" @selected($selectedCategory === $category->legacy_id)>{{ $category->name }}</option>@endforeach</select>
<button class="hd-btn hd-btn-blue" type="submit"><i class="fa-solid fa-magnifying-glass"></i><span>Search</span></button>
</form>
</div>
<div class="overflow-hidden rounded-2xl border border-zinc-200 bg-white shadow-sm dark:border-zinc-700 dark:bg-zinc-900">
<div class="overflow-x-auto"><table class="w-full text-left text-sm"><thead class="border-b border-zinc-200 bg-zinc-50 text-xs uppercase text-zinc-500 dark:border-zinc-700 dark:bg-zinc-800/60"><tr><th class="px-5 py-3">Reference</th><th class="px-5 py-3">Subject</th><th class="px-5 py-3">Category</th><th class="px-5 py-3">Status</th><th class="px-5 py-3">Requester</th><th class="px-5 py-3">Created</th></tr></thead><tbody class="divide-y divide-zinc-200 dark:divide-zinc-800">@forelse($tickets as $ticket)
<tr class="transition-colors dark:hover:bg-zinc-800/30">
<td class="px-5 py-4"><a class="font-semibold text-blue-600 hover:underline" href="{{ route('helpdesk.legacy.tickets.show', $ticket) }}" wire:navigate>{{ $ticket->reference ?: '#'.$ticket->legacy_id }}</a></td><td class="px-5 py-4 font-medium">{{ $ticket->subject }}</td><td class="px-5 py-4">{{ $ticket->category_name ?: '—' }}</td><td class="px-5 py-4">{{ $ticket->status_name ?: '—' }}</td><td class="px-5 py-4">{{ $ticket->requester_name ?: '—' }}</td><td class="px-5 py-4 text-zinc-500">{{ $ticket->legacy_created_at?->format('d M Y H:i') ?: '—' }}</td></tr>@empty<tr><td class="px-5 py-10 text-center text-zinc-500" colspan="6">No legacy tickets have been imported.</td></tr>@endforelse</tbody></table></div>
@if($tickets->hasPages())
<div class="flex items-center justify-between border-t border-zinc-800 px-5 py-4">
{{-- Previous --}}
@if($tickets->onFirstPage())
<span
class="inline-flex cursor-not-allowed items-center rounded-lg border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm font-medium text-zinc-600"
>
<i class="fa-solid fa-chevron-left mr-2 text-xs"></i>
Previous
</span>
@else
<a
href="{{ $tickets->previousPageUrl() }}"
class="inline-flex items-center rounded-lg border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm font-medium text-zinc-300 transition hover:border-zinc-600 hover:bg-zinc-800 hover:text-white"
wire:navigate
>
<i class="fa-solid fa-chevron-left mr-2 text-xs"></i>
Previous
</a>
@endif
{{-- Page information --}}
<div class="text-sm text-zinc-500">
Page
<span class="font-semibold text-zinc-300">
{{ $tickets->currentPage() }}
</span>
of
<span class="font-semibold text-zinc-300">
{{ $tickets->lastPage() }}
</span>
</div>
{{-- Next --}}
@if($tickets->hasMorePages())
<a
href="{{ $tickets->nextPageUrl() }}"
class="inline-flex items-center rounded-lg border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm font-medium text-zinc-300 transition hover:border-zinc-600 hover:bg-zinc-800 hover:text-white"
wire:navigate
>
Next
<i class="fa-solid fa-chevron-right ml-2 text-xs"></i>
</a>
@else
<span
class="inline-flex cursor-not-allowed items-center rounded-lg border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm font-medium text-zinc-600"
>
Next
<i class="fa-solid fa-chevron-right ml-2 text-xs"></i>
</span>
@endif
</div>
@endif
</div>
</div>
</x-layouts::app>