structure updates
This commit is contained in:
Mark Gregory
@@ -3,65 +3,87 @@
|
||||
<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">
|
||||
<div class="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
|
||||
<div>
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.28em] text-blue-200">Helpdesk workflow</p>
|
||||
<h1 class="mt-2 text-3xl font-semibold tracking-tight">Kanban board</h1>
|
||||
<p class="mt-2 max-w-3xl text-sm text-blue-100/90">Drag tickets between board columns. Boards and
|
||||
columns are configured in Helpdesk Settings.</p>
|
||||
<div class="grid gap-8 lg:grid-cols-[minmax(0,1fr)_minmax(460px,0.9fr)] lg:items-start">
|
||||
<div class="min-w-0 pt-1">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.28em] text-blue-200">
|
||||
Helpdesk workflow
|
||||
</p>
|
||||
|
||||
<h1 class="mt-2 text-3xl font-semibold tracking-tight text-white">
|
||||
Kanban board
|
||||
</h1>
|
||||
|
||||
<p class="mt-2 max-w-3xl text-sm font-normal leading-6 text-blue-100/90">
|
||||
Drag tickets between board columns. Boards and columns are configured in Helpdesk Settings.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex w-full flex-col gap-3 lg:w-auto lg:min-w-[420px]">
|
||||
<div class="flex flex-wrap justify-start gap-2 lg:justify-end">
|
||||
<a href="{{ route('helpdesk.index') }}" wire:navigate class="hd-btn hd-btn-blue">
|
||||
<i class="fa-solid fa-gauge-high" aria-hidden="true"></i>
|
||||
<span>Dashboard</span>
|
||||
</a>
|
||||
<div class="min-w-0">
|
||||
<div class="flex flex-wrap gap-2 lg:justify-end">
|
||||
<a href="{{ route('helpdesk.index') }}" wire:navigate class="hd-btn hd-btn-blue">
|
||||
<i class="fa-solid fa-gauge-high" aria-hidden="true"></i>
|
||||
<span>Dashboard</span>
|
||||
</a>
|
||||
|
||||
<a href="{{ route('helpdesk.tickets.create') }}" wire:navigate class="hd-btn hd-btn-green">
|
||||
<i class="fa-solid fa-plus" aria-hidden="true"></i>
|
||||
<span>New Ticket</span>
|
||||
</a>
|
||||
<a href="{{ route('helpdesk.tickets.create') }}" wire:navigate class="hd-btn hd-btn-green">
|
||||
<i class="fa-solid fa-plus" aria-hidden="true"></i>
|
||||
<span>New Ticket</span>
|
||||
</a>
|
||||
|
||||
<a href="{{ route('helpdesk.settings') }}" wire:navigate class="hd-btn hd-btn-amber">
|
||||
<i class="fa-solid fa-gear" aria-hidden="true"></i>
|
||||
<span>Configure boards</span>
|
||||
</a>
|
||||
<a href="{{ route('helpdesk.settings') }}" wire:navigate class="hd-btn hd-btn-amber">
|
||||
<i class="fa-solid fa-gear" aria-hidden="true"></i>
|
||||
<span>Configure boards</span>
|
||||
</a>
|
||||
|
||||
<a href="{{ route('helpdesk.tickets.index') }}" wire:navigate class="hd-btn hd-btn-blue">
|
||||
<i class="fa-solid fa-list" aria-hidden="true"></i>
|
||||
<span>List view</span>
|
||||
</a>
|
||||
<a href="{{ route('helpdesk.tickets.index') }}" wire:navigate class="hd-btn hd-btn-blue">
|
||||
<i class="fa-solid fa-list" aria-hidden="true"></i>
|
||||
<span>List view</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@if ($boards->isNotEmpty())
|
||||
<div class="hd-kanban-active-board-card">
|
||||
<div class="mt-7 grid gap-5 xl:grid-cols-[minmax(0,1fr)_minmax(220px,290px)] xl:items-end">
|
||||
<div class="min-w-0">
|
||||
<p class="hd-kanban-active-board-label">Active board</p>
|
||||
<h2 class="hd-kanban-active-board-title">{{ $board?->name ?? 'None' }}</h2>
|
||||
<p class="hd-kanban-active-board-description">
|
||||
<p class="text-xs font-semibold uppercase tracking-[0.28em] text-blue-200">
|
||||
Active board
|
||||
</p>
|
||||
|
||||
<h2 class="mt-2 text-2xl font-semibold tracking-tight text-white">
|
||||
{{ $board?->name ?? 'None' }}
|
||||
</h2>
|
||||
|
||||
<p class="mt-2 max-w-xl text-sm font-normal leading-6 text-blue-100/90">
|
||||
{{ $board?->description ?: 'Select the workflow board to display.' }}
|
||||
</p>
|
||||
|
||||
@if ($board?->owner)
|
||||
<p class="hd-kanban-active-board-owner">
|
||||
<p class="mt-3 inline-flex items-center gap-2 text-xs font-medium text-blue-200/90">
|
||||
<i class="fa-solid fa-user-shield" aria-hidden="true"></i>
|
||||
{{ $board->owner->name }}
|
||||
<span>{{ $board->owner->name }}</span>
|
||||
</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="hd-select-wrap hd-kanban-board-selector">
|
||||
<select
|
||||
class="hd-select"
|
||||
aria-label="Select Kanban board"
|
||||
onchange="window.location.href = '{{ route('helpdesk.kanban') }}?board_id=' + encodeURIComponent(this.value)"
|
||||
>
|
||||
@foreach ($boards as $availableBoard)
|
||||
<option value="{{ $availableBoard->id }}" @selected((int) $board_id === (int) $availableBoard->id)>
|
||||
{{ $availableBoard->name }}{{ $availableBoard->owner ? ' · ' . $availableBoard->owner->name : '' }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<div class="min-w-0">
|
||||
<label for="helpdesk-kanban-board-selector"
|
||||
class="mb-2 block text-xs font-semibold uppercase tracking-[0.2em] text-blue-200">
|
||||
Board
|
||||
</label>
|
||||
|
||||
<div class="hd-select-wrap !max-w-none">
|
||||
<select
|
||||
id="helpdesk-kanban-board-selector"
|
||||
class="hd-select !min-h-[2.9rem] !rounded-xl !px-4 !pr-11 !text-sm !font-semibold"
|
||||
aria-label="Select Kanban board"
|
||||
onchange="window.location.href = '{{ route('helpdesk.kanban') }}?board_id=' + encodeURIComponent(this.value)"
|
||||
>
|
||||
@foreach ($boards as $availableBoard)
|
||||
<option value="{{ $availableBoard->id }}" @selected((int) $board_id === (int) $availableBoard->id)>
|
||||
{{ $availableBoard->name }}{{ $availableBoard->owner ? ' · ' . $availableBoard->owner->name : '' }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
Reference in New Issue
Block a user