- In-app notifications: a bell in the top bar backed by Laravel's database
  notification channel, alongside existing e-mail notifications (same
  per-trigger toggle drives both; ticket links now correctly point into the
  recipient's own area instead of always linking to the client view).
- Drag-and-drop attachments on every upload form, plus inline image
  thumbnails in the message thread instead of a plain download link.
- Customer satisfaction (CSAT) rating: clients rate a closed ticket 1-5 stars
  with an optional comment; shown read-only to operators, surfaced as a KPI
  on the stats dashboard, and linked from the "ticket closed" e-mail.
- Saved queue views: operators can save/apply/delete named filter+sort+
  column presets in the ticket queue and mark one as their default.
- Full-text search (MySQL FULLTEXT, portable LIKE fallback) across ticket
  subject/body and reply message bodies, now also on the client's own ticket
  list.
- Stats CSV export for the currently filtered ticket set.
- Optional BookStack knowledge-base integration (off by default): suggests
  articles by category/subcategory while creating a ticket and in a separate
  sidebar for operators on an existing ticket (with a copy-link button).
  Configurable connection/SSL bypass/search-type filter, plus two
  independent per-shelf allow-lists so nothing is ever searched until an
  admin opts specific shelves in.
- Closed tickets no longer show in "Moje zgłoszenia"/"Nieprzypisane"/team
  queue tabs, only under "Zamknięte" (matching how "Otwarte" already worked).
- Wired up the Admin > About "Wersja" field to config('app.version')/VERSION
  in .env instead of a stale hardcoded string.
- Fixed: TicketService::setStatus() now checks a status's stage rather than
  the literal key 'closed' to decide whether to fire the "ticket closed"
  notification/stop the timer.
- Updated README/ARCHITECTURE/CHANGELOG/install/SECURITY docs and all three
  wiki/ role guides for the above; documented a root-vs-www-data file
  ownership gotcha in CLAUDE.md (running artisan commands via a plain
  `docker exec` can leave root-owned Blade cache files that later break
  recompilation for the www-data Apache process).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-07-22 15:18:09 +02:00
parent 4e8f17189a
commit 90fae0a4de
49 changed files with 1649 additions and 79 deletions

View File

@@ -0,0 +1,55 @@
@props(['articles', 'variant' => 'banner', 'title' => 'Może pomogą te artykuły z bazy wiedzy', 'showCopy' => false])
@php
$icons = ['book' => 'menu_book', 'chapter' => 'bookmark', 'bookshelf' => 'library_books', 'page' => 'article'];
$isSidebar = $variant === 'sidebar';
@endphp
@if (count($articles))
<div class="card" style="{{ $isSidebar ? 'padding:16px;gap:8px' : 'padding:14px;gap:10px;background:color-mix(in srgb, var(--color-accent) 6%, transparent);border-color:color-mix(in srgb, var(--color-accent) 25%, var(--color-divider))' }}">
@if ($isSidebar)
<div class="card-kicker">{{ $title }}</div>
@else
<div style="display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600">
<span class="material-symbols-outlined" style="font-size:16px">auto_awesome</span>
{{ $title }}
</div>
@endif
<div style="display:flex;flex-direction:column;gap:2px">
@foreach ($articles as $article)
<div
@if ($showCopy) x-data="{ copied: false }" @endif
style="display:flex;gap:6px;align-items:flex-start;padding:8px;border-radius:6px"
onmouseover="this.style.background='color-mix(in srgb, var(--color-accent) 8%, transparent)'"
onmouseout="this.style.background='transparent'"
>
<a
href="{{ $article['url'] }}"
target="_blank"
rel="noopener noreferrer"
style="display:flex;gap:10px;align-items:flex-start;flex:1;min-width:0;text-decoration:none;color:inherit"
>
<span class="material-symbols-outlined" style="font-size:18px;flex:none;margin-top:1px;color:var(--color-accent)">{{ $icons[$article['type']] ?? 'article' }}</span>
<span style="min-width:0;flex:1">
<span style="display:block;font-size:13px;font-weight:500;color:var(--color-accent)">{{ $article['name'] }}</span>
@if (! empty($article['book']) && $article['book'] !== $article['name'])
<span style="display:block;font-size:11px;color:color-mix(in srgb, var(--color-text) 55%, transparent);margin-top:1px">
{{ ! empty($article['shelf']) ? $article['shelf'].' > '.$article['book'] : $article['book'] }}
</span>
@endif
</span>
</a>
@if ($showCopy)
<button
type="button"
class="btn btn-secondary"
style="flex:none;font-size:11px;padding:4px 8px;white-space:nowrap"
x-on:click="navigator.clipboard.writeText(@js($article['url'])); copied = true; setTimeout(() => copied = false, 1500)"
x-text="copied ? 'Skopiowano!' : 'Kopiuj link'"
></button>
@endif
</div>
@endforeach
</div>
</div>
@endif

View File

@@ -1,9 +1,25 @@
@props(['attachment'])
<a
href="{{ \Illuminate\Support\Facades\Storage::disk('public')->url($attachment->path) }}"
target="_blank"
style="display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 10px;border:1px solid var(--color-divider);border-radius:6px;font-size:12.5px;color:inherit;text-decoration:none;background:color-mix(in srgb, var(--color-text) 5%, transparent)"
>
<span class="material-symbols-outlined" style="font-size:15px">attach_file</span>{{ $attachment->original_name }}
</a>
@php
$url = \Illuminate\Support\Facades\Storage::disk('public')->url($attachment->path);
$isImage = \Illuminate\Support\Str::startsWith($attachment->mime ?? '', 'image/');
@endphp
@if ($isImage)
<a href="{{ $url }}" target="_blank" style="display:block;margin-top:8px">
<img
src="{{ $url }}"
alt="{{ $attachment->original_name }}"
loading="lazy"
style="max-width:220px;max-height:160px;border-radius:8px;border:1px solid var(--color-divider);object-fit:cover;cursor:zoom-in;display:block"
>
</a>
@else
<a
href="{{ $url }}"
target="_blank"
style="display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 10px;border:1px solid var(--color-divider);border-radius:6px;font-size:12.5px;color:inherit;text-decoration:none;background:color-mix(in srgb, var(--color-text) 5%, transparent)"
>
<span class="material-symbols-outlined" style="font-size:15px">attach_file</span>{{ $attachment->original_name }}
</a>
@endif

View File

@@ -18,5 +18,9 @@
{{ $slot }}
@auth
<livewire:notification-bell />
@endauth
<x-profile-menu />
</div>

View File

@@ -654,6 +654,86 @@ $tabGroups = [
@endif
</form>
<form wire:submit="saveBookstackConfig" class="card" style="padding:20px;gap:14px">
<h4 style="margin:0">Baza wiedzy BookStack</h4>
<span class="text-muted" style="font-size:11.5px;margin-top:-8px">Po włączeniu, podczas tworzenia zgłoszenia klientom i operatorom podpowiadane będą pasujące artykuły z BookStack na podstawie wybranej kategorii/podkategorii.</span>
<label class="radio"><input type="checkbox" wire:model="bookstackConfig.enabled" style="position:static;opacity:1;width:auto;height:auto"><strong>Włącz integrację z BookStack</strong></label>
@if ($bookstackConfig['enabled'])
<div class="field"><label>Adres instancji BookStack</label><input class="input" placeholder="https://wiki.firma.pl" wire:model="bookstackConfig.baseUrl"></div>
<div class="field"><label>Token ID</label><input class="input" wire:model="bookstackConfig.tokenId"></div>
<div class="field"><label>Token Secret</label><input class="input" type="password" placeholder="(bez zmian jeśli puste)" wire:model="bookstackConfig.tokenSecret"></div>
<p class="text-muted" style="font-size:11.5px;margin:-4px 0 0">Token API generuje się w BookStack: Profil &rarr; Ustawienia API. Użytkownik/rola właściciela tokenu musi mieć uprawnienie „Access System API”.</p>
<div class="field"><label>Przeszukuj</label>
<select class="input" style="width:auto" wire:model="bookstackConfig.searchTypes">
<option value="both">Strony i książki</option>
<option value="page">Tylko strony</option>
<option value="book">Tylko książki</option>
</select>
</div>
<div style="display:flex;justify-content:flex-end">
<button type="button" class="btn btn-secondary" style="display:flex;align-items:center;gap:6px;font-size:12.5px" wire:click="refreshBookstackShelves" wire:loading.attr="disabled" wire:target="refreshBookstackShelves">
<span class="material-symbols-outlined" style="font-size:16px" wire:loading.class="spin" wire:target="refreshBookstackShelves">refresh</span>
Odśwież listę półek
</button>
</div>
<div class="field">
<label>Dozwolone półki podpowiedzi przy tworzeniu zgłoszenia</label>
@if (count($this->bookstackShelves))
<div style="display:flex;flex-direction:column;gap:2px;border:1px solid var(--color-divider);border-radius:8px;padding:8px">
@foreach ($this->bookstackShelves as $shelf)
<label style="display:flex;align-items:center;gap:8px;font-size:13px;font-weight:400;padding:4px 6px;border-radius:5px;cursor:pointer">
<input type="checkbox" @checked(in_array($shelf['id'], $bookstackConfig['allowedShelfIdsCreation'])) wire:click="toggleBookstackAllowedShelf('allowedShelfIdsCreation', {{ $shelf['id'] }})">
{{ $shelf['name'] }}
</label>
@endforeach
</div>
@else
<p class="text-muted" style="font-size:11.5px;margin:2px 0 0">Brak półek do wyświetlenia sprawdź, czy połączenie działa (przycisk „Testuj połączenie” niżej), albo zapisz konfigurację, żeby odświeżyć listę.</p>
@endif
<p class="text-muted" style="font-size:11.5px;margin:2px 0 0">Tylko książki/strony z zaznaczonych półek mogą pojawić się jako podpowiedzi podczas tworzenia zgłoszenia (klient, operator, formularz gościa). Jeśli żadna półka nie jest zaznaczona, podpowiedzi się nie pojawią.</p>
</div>
<div class="field">
<label>Dozwolone półki panel operatora przy zgłoszeniu</label>
@if (count($this->bookstackShelves))
<div style="display:flex;flex-direction:column;gap:2px;border:1px solid var(--color-divider);border-radius:8px;padding:8px">
@foreach ($this->bookstackShelves as $shelf)
<label style="display:flex;align-items:center;gap:8px;font-size:13px;font-weight:400;padding:4px 6px;border-radius:5px;cursor:pointer">
<input type="checkbox" @checked(in_array($shelf['id'], $bookstackConfig['allowedShelfIdsTicketView'])) wire:click="toggleBookstackAllowedShelf('allowedShelfIdsTicketView', {{ $shelf['id'] }})">
{{ $shelf['name'] }}
</label>
@endforeach
</div>
@else
<p class="text-muted" style="font-size:11.5px;margin:2px 0 0">Brak półek do wyświetlenia sprawdź, czy połączenie działa (przycisk „Testuj połączenie” niżej), albo zapisz konfigurację, żeby odświeżyć listę.</p>
@endif
<p class="text-muted" style="font-size:11.5px;margin:2px 0 0">Niezależna lista kontroluje, co widzi operator w bocznym panelu po otwarciu istniejącego zgłoszenia (link do artykułu lub przycisk kopiowania linku). Jeśli żadna półka nie jest zaznaczona, panel się nie pokaże.</p>
</div>
<label class="radio"><input type="checkbox" wire:model="bookstackConfig.showToGuests" style="position:static;opacity:1;width:auto;height:auto">Pokazuj podpowiedzi także niezalogowanym (formularz zgłoszenia na stronie głównej)</label>
<span class="text-muted" style="font-size:11.5px;margin-top:-8px">Bez zaznaczenia podpowiedzi widoczne tylko przy tworzeniu zgłoszenia przez zalogowanego klienta lub operatora.</span>
<label class="radio"><input type="checkbox" wire:model="bookstackConfig.verifySsl" style="position:static;opacity:1;width:auto;height:auto">Weryfikuj certyfikat SSL instancji BookStack</label>
<span class="text-muted" style="font-size:11.5px;margin-top:-8px">Wyłącz tylko jeśli instancja BookStack korzysta z certyfikatu self-signed / z prywatnego CA.</span>
<div style="display:flex;gap:10px;margin-top:8px;align-items:center;flex-wrap:wrap">
<button type="button" class="btn btn-secondary" wire:click="testBookstackConnection">Testuj połączenie</button>
<button type="submit" class="btn btn-primary">Zapisz</button>
@if ($bookstackTestResult === 'ok')
<div style="display:flex;align-items:center;gap:6px;color:var(--color-success)"><span class="material-symbols-outlined" style="font-size:18px">check_circle</span>Połączenie OK</div>
@elseif ($bookstackTestResult === 'error')
<div style="display:flex;align-items:center;gap:6px;color:var(--color-danger)"><span class="material-symbols-outlined" style="font-size:18px">error</span>Błąd połączenia{{ $bookstackTestMessage ? ': '.$bookstackTestMessage : '' }}</div>
@endif
</div>
@else
<button type="submit" class="btn btn-primary" style="align-self:flex-start">Zapisz</button>
@endif
</form>
</div>
@endif
@@ -667,7 +747,7 @@ $tabGroups = [
<h3 style="margin:0 0 14px">O aplikacji</h3>
<div class="card" style="padding:18px;gap:10px;max-width:420px">
<div style="display:flex;justify-content:space-between"><span class="text-muted">Aplikacja</span><span>{{ \App\Support\Settings::get('company_name') }}</span></div>
<div style="display:flex;justify-content:space-between"><span class="text-muted">Wersja</span><span>1.0.0</span></div>
<div style="display:flex;justify-content:space-between"><span class="text-muted">Wersja</span><span>{{ config('app.version') ?: '—' }}</span></div>
<div style="display:flex;justify-content:space-between"><span class="text-muted">Kontakt wsparcia</span><span>{{ config('app.author_contact') ?: '—' }}</span></div>
</div>
@endif

View File

@@ -7,9 +7,12 @@
<a href="{{ route('client.new') }}" wire:navigate class="btn btn-primary">+ Nowe zgłoszenie</a>
</div>
<div class="seg" style="align-self:flex-start">
<label class="seg-opt"><input type="radio" name="ctab" @checked($tab === 'current') wire:click="setTab('current')">Aktualne ({{ $this->currentTickets->count() }})</label>
<label class="seg-opt"><input type="radio" name="ctab" @checked($tab === 'archive') wire:click="setTab('archive')">Archiwalne ({{ $this->archiveTickets->count() }})</label>
<div style="display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap">
<div class="seg">
<label class="seg-opt"><input type="radio" name="ctab" @checked($tab === 'current') wire:click="setTab('current')">Aktualne ({{ $this->currentTickets->count() }})</label>
<label class="seg-opt"><input type="radio" name="ctab" @checked($tab === 'archive') wire:click="setTab('archive')">Archiwalne ({{ $this->archiveTickets->count() }})</label>
</div>
<input class="input" type="search" placeholder="Szukaj po numerze, temacie, treści…" wire:model.live.debounce.400ms="search" style="max-width:280px">
</div>
<div style="display:flex;flex-direction:column;gap:10px">

View File

@@ -59,6 +59,9 @@
<span class="tag tag-outline">{{ $this->selectedCategory?->name }} / {{ $this->selectedSubcategory?->name }}</span>
<button type="button" class="btn btn-ghost" style="padding:0" wire:click="backToSubcategory">Zmień</button>
</div>
<x-bookstack-suggestions :articles="$this->suggestedArticles" />
<div class="field">
<label>Temat</label>
<input class="input" wire:model="subject">
@@ -76,8 +79,16 @@
<div class="field">
<label>Załączniki</label>
<div style="border:1px dashed var(--color-divider);border-radius:8px;padding:14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px">
<div
x-data="{ dragging: false }"
@dragover.prevent="dragging = true"
@dragleave.prevent="dragging = false"
@drop.prevent="dragging = false; const input = $el.querySelector('input[type=file]'); input.files = $event.dataTransfer.files; input.dispatchEvent(new Event('change'))"
:style="{ borderColor: dragging ? 'var(--color-accent)' : undefined, background: dragging ? 'color-mix(in srgb, var(--color-accent) 8%, transparent)' : undefined }"
style="border:1px dashed var(--color-divider);border-radius:8px;padding:14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px"
>
<label class="btn btn-secondary" style="cursor:pointer">Wybierz pliki<input type="file" multiple style="display:none" wire:model="attachments"></label>
<span class="text-muted" style="font-size:12px">lub przeciągnij pliki tutaj</span>
@forelse ($attachments as $i => $file)
<span class="text-muted" style="font-size:13px;display:flex;align-items:center;gap:6px">
{{ $file->getClientOriginalName() }}

View File

@@ -63,7 +63,14 @@
<textarea class="input" placeholder="Napisz odpowiedź…" wire:model="reply"></textarea>
@error('reply') <span style="color:var(--color-danger);font-size:12px">{{ $message }}</span> @enderror
<div style="display:flex;align-items:center;gap:10px">
<div style="flex:1;min-width:0;border:1px dashed var(--color-divider);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px">
<div
x-data="{ dragging: false }"
@dragover.prevent="dragging = true"
@dragleave.prevent="dragging = false"
@drop.prevent="dragging = false; const input = $el.querySelector('input[type=file]'); input.files = $event.dataTransfer.files; input.dispatchEvent(new Event('change'))"
:style="{ borderColor: dragging ? 'var(--color-accent)' : undefined, background: dragging ? 'color-mix(in srgb, var(--color-accent) 8%, transparent)' : undefined }"
style="flex:1;min-width:0;border:1px dashed var(--color-divider);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px"
>
<label class="btn btn-secondary" style="cursor:pointer;flex:none">Załącz pliki<input type="file" multiple style="display:none" wire:model="attachments"></label>
@forelse ($attachments as $i => $file)
<span class="text-muted" style="font-size:13px;display:flex;align-items:center;gap:6px;min-width:0">
@@ -99,6 +106,34 @@
<button type="button" class="btn btn-secondary btn-block" wire:click="reopen">Otwórz ponownie</button>
@endif
</div>
<div id="csat" class="card" style="padding:16px;gap:10px">
<div class="card-kicker">Ocena obsługi</div>
@if ($ticket->hasCsatRating())
<div style="display:flex;gap:2px">
@for ($i = 1; $i <= 5; $i++)
<span class="material-symbols-outlined" style="font-size:20px;color:{{ $i <= $ticket->csat_rating ? 'var(--color-accent)' : 'var(--color-divider)' }}">star</span>
@endfor
</div>
@if ($ticket->csat_comment)
<p style="font-size:13px;margin:0;white-space:pre-wrap">{{ $ticket->csat_comment }}</p>
@endif
@elseif ($ticket->csatSubmittable())
<div style="display:flex;gap:4px" wire:key="csat-stars-{{ $csatRating }}">
@for ($i = 1; $i <= 5; $i++)
<span
class="material-symbols-outlined"
style="font-size:24px;cursor:pointer;color:{{ $csatRating && $i <= $csatRating ? 'var(--color-accent)' : 'var(--color-divider)' }}"
wire:click="$set('csatRating', {{ $i }})"
>star</span>
@endfor
</div>
@error('csatRating') <span style="color:var(--color-danger);font-size:12px">{{ $message }}</span> @enderror
<textarea class="input" placeholder="Komentarz (opcjonalnie)" wire:model="csatComment" style="min-height:60px"></textarea>
<button type="button" class="btn btn-primary btn-block" wire:click="submitCsat">Wyślij ocenę</button>
@else
<p class="text-muted" style="font-size:12px;margin:0">Ocena będzie dostępna po zamknięciu zgłoszenia.</p>
@endif
</div>
<div class="card" style="padding:16px;gap:8px">
<div class="card-kicker">Historia zmian</div>
@forelse ($ticket->histories as $h)

View File

@@ -89,6 +89,9 @@
<span class="tag tag-outline">{{ $this->selectedCategory?->name }} / {{ $this->selectedSubcategory?->name }}</span>
<button type="button" class="btn btn-ghost" style="padding:0" wire:click="backToSubcategory">Zmień</button>
</div>
<x-bookstack-suggestions :articles="$this->suggestedArticles" />
<div class="field">
<label>Temat</label>
<input class="input" placeholder="Krótki opis problemu" wire:model="subject">

View File

@@ -0,0 +1,36 @@
<div x-data="{ open: false }" @click.outside="open = false" style="position:relative;display:inline-block" wire:poll.30s="$refresh">
<button type="button" class="btn btn-secondary" @click="open = !open" style="position:relative;display:flex;align-items:center;gap:0;padding:8px">
<span class="material-symbols-outlined" style="font-size:18px">notifications</span>
@if ($this->unreadCount)
<span style="position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 3px;border-radius:8px;background:var(--color-accent);color:#fff;font-size:10px;line-height:16px;text-align:center">{{ $this->unreadCount > 9 ? '9+' : $this->unreadCount }}</span>
@endif
</button>
<div
x-show="open"
x-cloak
style="position:absolute;top:100%;right:0;margin-top:6px;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:8px;box-shadow:var(--shadow-md);width:320px;max-height:420px;overflow-y:auto;z-index:30"
>
<div style="display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--color-divider)">
<span style="font-size:12.5px;font-weight:600">Powiadomienia</span>
@if ($this->unreadCount)
<button type="button" wire:click="markAllAsRead" style="font-size:11.5px;background:none;border:none;color:var(--color-accent);cursor:pointer;padding:0">Oznacz wszystkie jako przeczytane</button>
@endif
</div>
@forelse ($this->notifications as $notification)
<a
href="{{ $notification->data['url'] ?? '#' }}"
wire:navigate
wire:click="markAsRead('{{ $notification->id }}')"
@click="open = false"
style="display:block;padding:10px 14px;text-decoration:none;color:var(--color-text);border-bottom:1px solid var(--color-divider);font-size:12.5px;{{ $notification->read_at ? 'opacity:0.6' : 'background:color-mix(in srgb, var(--color-accent) 6%, transparent)' }}"
>
<div>{{ $notification->data['message'] ?? '' }}</div>
<div style="font-size:11px;color:color-mix(in srgb, var(--color-text) 55%, transparent);margin-top:2px">{{ $notification->created_at->diffForHumans() }}</div>
</a>
@empty
<div style="padding:20px 14px;text-align:center;font-size:12.5px;color:color-mix(in srgb, var(--color-text) 55%, transparent)">Brak powiadomień</div>
@endforelse
</div>
</div>

View File

@@ -65,6 +65,9 @@
<span class="tag tag-outline">{{ $this->selectedCategory?->name }} / {{ $this->selectedSubcategory?->name }}</span>
<button type="button" class="btn btn-ghost" style="padding:0" wire:click="backToSubcategory">Zmień</button>
</div>
<x-bookstack-suggestions :articles="$this->suggestedArticles" />
<div class="field">
<label>Temat</label>
<input class="input" wire:model="subject">
@@ -82,8 +85,16 @@
<div class="field">
<label>Załączniki</label>
<div style="border:1px dashed var(--color-divider);border-radius:8px;padding:14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px">
<div
x-data="{ dragging: false }"
@dragover.prevent="dragging = true"
@dragleave.prevent="dragging = false"
@drop.prevent="dragging = false; const input = $el.querySelector('input[type=file]'); input.files = $event.dataTransfer.files; input.dispatchEvent(new Event('change'))"
:style="{ borderColor: dragging ? 'var(--color-accent)' : undefined, background: dragging ? 'color-mix(in srgb, var(--color-accent) 8%, transparent)' : undefined }"
style="border:1px dashed var(--color-divider);border-radius:8px;padding:14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px"
>
<label class="btn btn-secondary" style="cursor:pointer">Wybierz pliki<input type="file" multiple style="display:none" wire:model="attachments"></label>
<span class="text-muted" style="font-size:12px">lub przeciągnij pliki tutaj</span>
@forelse ($attachments as $i => $file)
<span class="text-muted" style="font-size:13px;display:flex;align-items:center;gap:6px">
{{ $file->getClientOriginalName() }}

View File

@@ -74,6 +74,34 @@
@endforeach
</select>
<div class="queue-filters-saved" x-data="{ open: false, adding: false }">
<button type="button" class="btn btn-secondary" @click="open = ! open" style="display:flex;align-items:center;justify-content:center;gap:6px">
<span class="material-symbols-outlined" style="font-size:18px">bookmark</span>
Zapisane widoki
</button>
<div x-show="open" x-cloak @click.outside="open = false; adding = false" style="position:absolute;top:100%;left:0;margin-top:4px;background:var(--color-surface);border:1px solid var(--color-divider);border-radius:8px;box-shadow:var(--shadow-md);z-index:30;padding:6px;min-width:220px">
@forelse ($this->savedViews as $view)
<div style="display:flex;align-items:center;gap:4px;padding:2px 2px 2px 8px;border-radius:5px;{{ $savedViewId === $view->id ? 'background:color-mix(in srgb, var(--color-accent) 12%, transparent)' : '' }}">
<button type="button" wire:click="applySavedView({{ $view->id }})" style="flex:1;min-width:0;text-align:left;background:none;border:none;cursor:pointer;padding:6px 0;font-size:13px;color:{{ $savedViewId === $view->id ? 'var(--color-accent)' : 'inherit' }};overflow:hidden;text-overflow:ellipsis;white-space:nowrap">{{ $view->name }}</button>
<span class="material-symbols-outlined" style="font-size:16px;cursor:pointer;flex:none;opacity:{{ $view->is_default ? '1' : '0.4' }};color:{{ $view->is_default ? 'var(--color-accent)' : 'inherit' }}" title="Ustaw jako domyślny" wire:click="setDefaultView({{ $view->id }})">star</span>
<span class="material-symbols-outlined" style="font-size:16px;cursor:pointer;flex:none;opacity:0.6" title="Usuń" wire:click="deleteSavedView({{ $view->id }})">delete</span>
</div>
@empty
<p class="text-muted" style="font-size:12px;margin:2px 8px">Brak zapisanych widoków.</p>
@endforelse
<div style="border-top:1px solid var(--color-divider);margin:4px 0"></div>
<template x-if="! adding">
<button type="button" class="btn btn-secondary btn-block" @click="adding = true" style="font-size:12.5px">+ Zapisz bieżące filtry…</button>
</template>
<div x-show="adding" style="display:flex;gap:6px;padding:4px 2px">
<input class="input" style="flex:1;font-size:12.5px" placeholder="Nazwa widoku" wire:model="newViewName" @keydown.enter="$wire.saveCurrentView(); adding = false">
<button type="button" class="btn btn-primary" style="flex:none;padding:6px 10px" @click="$wire.saveCurrentView(); adding = false">Zapisz</button>
</div>
</div>
</div>
<div class="queue-filters-columns" x-data="{ open: false }">
<button type="button" class="btn btn-secondary" @click="open = ! open" style="display:flex;align-items:center;justify-content:center;gap:6px">
<span class="material-symbols-outlined" style="font-size:18px">view_column</span>

View File

@@ -52,6 +52,11 @@
<option value="{{ $u->id }}">{{ $u->name }}</option>
@endforeach
</select>
<button type="button" class="btn btn-secondary" style="margin-left:auto;display:flex;align-items:center;gap:6px" wire:click="export">
<span class="material-symbols-outlined" style="font-size:18px">download</span>
Eksportuj CSV
</button>
</div>
{{-- KPI tiles --}}
@@ -85,6 +90,11 @@
</div>
<div class="stat-tile-meta">{{ $kpis['sla']['breached'] }} / {{ $kpis['sla']['total'] }} zgłoszeń</div>
</div>
<div class="stat-tile">
<div class="stat-tile-label">Ocena obsługi (CSAT)</div>
<div class="stat-tile-value">{{ $kpis['csat']['avg'] !== null ? $kpis['csat']['avg'].' / 5' : '—' }}</div>
<div class="stat-tile-meta">{{ $kpis['csat']['count'] }} ocen{{ $kpis['csat']['responseRate'] !== null ? ' · '.$kpis['csat']['responseRate'].'% odpowiedzi' : '' }}</div>
</div>
</div>
<div style="display:grid;grid-template-columns:repeat(auto-fit, minmax(340px, 1fr));gap:16px;align-items:start">

View File

@@ -2,7 +2,7 @@
<x-topbar />
<div class="page-pad" style="flex:1;padding:20px 24px;overflow:auto">
<div style="display:flex;flex-direction:column;gap:16px;max-width:1020px;margin:0 auto">
<div style="display:flex;flex-direction:column;gap:16px;max-width:1180px;margin:0 auto">
<a href="{{ route('operator.queue') }}" wire:navigate class="btn btn-ghost" style="align-self:flex-start;padding:0">&larr; Wróć do listy</a>
<div style="display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap">
@@ -96,7 +96,14 @@
@if ($addingNote)
<textarea class="input" placeholder="Dodaj notatkę widoczną tylko dla zespołu…" wire:model="noteDraft"></textarea>
<div style="display:flex;align-items:center;gap:10px">
<div style="flex:1;min-width:0;border:1px dashed var(--color-divider);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px">
<div
x-data="{ dragging: false }"
@dragover.prevent="dragging = true"
@dragleave.prevent="dragging = false"
@drop.prevent="dragging = false; const input = $el.querySelector('input[type=file]'); input.files = $event.dataTransfer.files; input.dispatchEvent(new Event('change'))"
:style="{ borderColor: dragging ? 'var(--color-accent)' : undefined, background: dragging ? 'color-mix(in srgb, var(--color-accent) 8%, transparent)' : undefined }"
style="flex:1;min-width:0;border:1px dashed var(--color-divider);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px"
>
<label class="btn btn-secondary" style="cursor:pointer;flex:none">Załącz pliki<input type="file" multiple style="display:none" wire:model="noteAttachments"></label>
@forelse ($noteAttachments as $i => $file)
<span class="text-muted" style="font-size:13px;display:flex;align-items:center;gap:6px;min-width:0">
@@ -160,7 +167,14 @@
</select>
<textarea class="input" placeholder="Napisz odpowiedź do klienta…" wire:model="reply"></textarea>
<div style="display:flex;align-items:center;gap:10px">
<div style="flex:1;min-width:0;border:1px dashed var(--color-divider);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px">
<div
x-data="{ dragging: false }"
@dragover.prevent="dragging = true"
@dragleave.prevent="dragging = false"
@drop.prevent="dragging = false; const input = $el.querySelector('input[type=file]'); input.files = $event.dataTransfer.files; input.dispatchEvent(new Event('change'))"
:style="{ borderColor: dragging ? 'var(--color-accent)' : undefined, background: dragging ? 'color-mix(in srgb, var(--color-accent) 8%, transparent)' : undefined }"
style="flex:1;min-width:0;border:1px dashed var(--color-divider);border-radius:8px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:10px"
>
<label class="btn btn-secondary" style="cursor:pointer;flex:none">Załącz pliki<input type="file" multiple style="display:none" wire:model="replyAttachments"></label>
@forelse ($replyAttachments as $i => $file)
<span class="text-muted" style="font-size:13px;display:flex;align-items:center;gap:6px;min-width:0">
@@ -190,7 +204,7 @@
</form>
</div>
<div class="aside-col" style="display:flex;flex-direction:column;gap:14px">
<div class="aside-col aside-col-wide" style="display:flex;flex-direction:column;gap:14px">
<div class="card" style="padding:16px;gap:6px">
<div style="display:flex;justify-content:space-between;align-items:flex-start;gap:8px">
<div class="card-kicker">Zgłaszający</div>
@@ -272,11 +286,27 @@
</div>
</div>
<x-bookstack-suggestions :articles="$this->suggestedArticles" variant="sidebar" title="Baza wiedzy" :show-copy="true" />
<div class="card" style="padding:16px;gap:8px">
<div class="card-kicker">SLA</div>
<div style="font-size:12.5px">{{ $ticket->slaInfo()['text'] }}</div>
</div>
@if ($ticket->hasCsatRating())
<div class="card" style="padding:16px;gap:8px">
<div class="card-kicker">Ocena obsługi</div>
<div style="display:flex;gap:2px">
@for ($i = 1; $i <= 5; $i++)
<span class="material-symbols-outlined" style="font-size:18px;color:{{ $i <= $ticket->csat_rating ? 'var(--color-accent)' : 'var(--color-divider)' }}">star</span>
@endfor
</div>
@if ($ticket->csat_comment)
<p style="font-size:12.5px;margin:0;white-space:pre-wrap">{{ $ticket->csat_comment }}</p>
@endif
</div>
@endif
<div class="card" style="padding:16px;gap:8px">
<div class="card-kicker">MONITOR CZASU PRACY</div>
<div
@@ -344,16 +374,21 @@
<span>Czas w zgłoszeniu: <strong x-text="format()"></strong></span>
<span class="material-symbols-outlined" style="font-size:16px;cursor:pointer;opacity:0.7" wire:click="startEditTimer">edit</span>
</div>
<div style="display:flex;gap:6px">
@if ($ticket->isClosed())
@if ($ticket->isClosed())
<div style="display:flex;flex-direction:column;gap:6px;align-items:flex-start">
<span style="font-size:12px;opacity:0.7">Zgłoszenie zamknięte zliczanie wstrzymane</span>
@elseif ($ticket->timer_started_at)
<button type="button" class="btn btn-secondary" wire:click="stopTimer" @click="running = false; clearInterval(tick)">Zatrzymaj</button>
@else
<button type="button" class="btn btn-secondary" wire:click="resumeTimer" @click="running = true; start()">Wznów</button>
@endif
<button type="button" class="btn btn-secondary" wire:click="resetTimer" @click="seconds = 0; running = false; clearInterval(tick)">Resetuj</button>
</div>
<button type="button" class="btn btn-secondary" wire:click="resetTimer" @click="seconds = 0; running = false; clearInterval(tick)">Resetuj</button>
</div>
@else
<div style="display:flex;gap:6px">
@if ($ticket->timer_started_at)
<button type="button" class="btn btn-secondary" wire:click="stopTimer" @click="running = false; clearInterval(tick)">Zatrzymaj</button>
@else
<button type="button" class="btn btn-secondary" wire:click="resumeTimer" @click="running = true; start()">Wznów</button>
@endif
<button type="button" class="btn btn-secondary" wire:click="resetTimer" @click="seconds = 0; running = false; clearInterval(tick)">Resetuj</button>
</div>
@endif
@endif
</div>
</div>