servicedesk/src/resources/views/livewire/landing.blade.php

<div style="flex:1;display:flex;flex-direction:column">
    <x-topbar>
        <a href="{{ url('/login') }}" wire:navigate class="btn btn-secondary" style="font-size:12px;padding:6px 12px;text-decoration:none">Zaloguj się</a>
    </x-topbar>

    <div class="page-pad" style="flex:1;display:flex;justify-content:center;padding:48px 20px 80px">
        <div style="width:100%;max-width:640px;display:flex;flex-direction:column;gap:28px">

            @if ($this->submittedTicket)
                <div class="card elev-md" style="padding:32px;gap:14px;text-align:left">
                    <span class="tag tag-accent" style="align-self:flex-start">Zgłoszenie przyjęte</span>
                    <h2 style="margin:0">Zgłoszenie {{ $this->submittedTicket->displayNumber() }} zostało utworzone</h2>
                    <p class="text-muted" style="margin:0">Zapisz numer zgłoszenia i adres e-mail — będziesz mógł/mogła sprawdzić status, kontaktując się z zespołem wsparcia. Aktualizacje będziemy wysyłać na Twój adres e-mail.</p>
                    <div class="hr"></div>
                    <div style="display:flex;flex-direction:column;gap:4px;font-size:14px">
                        <div><strong>Numer zgłoszenia:</strong> {{ $this->submittedTicket->displayNumber() }}</div>
                        <div><strong>Temat:</strong> {{ $this->submittedTicket->subject }}</div>
                        <div><strong>Kategoria:</strong> {{ $this->submittedTicket->categoryLabel() }}</div>
                        <div><strong>Zgłaszający:</strong> {{ $this->submittedTicket->email }}</div>
                        <div><strong>Status:</strong> <span style="{{ $this->submittedTicket->statusStyle() }}">{{ $this->submittedTicket->statusLabel() }}</span></div>
                        <div><strong>Priorytet:</strong> <span style="{{ $this->submittedTicket->priorityStyle() }}">{{ $this->submittedTicket->priorityLabel() }}</span></div>
                        <div><strong>Data zgłoszenia:</strong> {{ $this->submittedTicket->created_at->format('d.m.Y H:i') }}</div>
                    </div>

                    @if ($this->submittedTicket->customer_id)
                        <div class="hr"></div>
                        <p class="text-muted" style="margin:0;font-size:13px">Ten adres e-mail ma już konto w systemie — zaloguj się, aby śledzić postęp zgłoszenia online, otrzymywać powiadomienia w panelu i odpowiadać bezpośrednio w rozmowie.</p>
                        <a href="{{ route('login', ['redirect' => route('client.ticket', $this->submittedTicket)]) }}" wire:navigate class="btn btn-primary" style="align-self:flex-start;text-decoration:none">Zaloguj się i przejdź do zgłoszenia</a>
                    @endif

                    <button class="btn btn-secondary" style="align-self:flex-start" wire:click="resetForm">Utwórz kolejne zgłoszenie</button>
                </div>
            @else
                <div style="display:flex;flex-direction:column;gap:8px">
                    <h1 style="margin:0">Jak możemy pomóc?</h1>
                    <p class="text-muted" style="margin:0;font-size:15px">Utwórz zgłoszenie bez logowania — podaj adres e-mail, na który wyślemy aktualizacje.</p>
                </div>

                <div class="card" style="padding:16px 20px">
                    <div class="field" style="margin:0">
                        <label>Adres e-mail</label>
                        <input class="input" type="email" placeholder="ty@firma.pl" wire:model="email">
                        @error('email') <span style="color:var(--color-danger);font-size:12px">{{ $message }}</span> @enderror
                    </div>
                </div>

                <div style="display:flex;align-items:flex-start;justify-content:center;padding:4px 8px;gap:0">
                    @foreach (['Dział', 'Kategoria', 'Szczegóły'] as $i => $label)
                        @php $n = $i + 1; @endphp
                        <div style="display:flex;align-items:center;flex:none">
                            <div class="wizard-step" style="display:flex;flex-direction:column;align-items:center;gap:6px">
                                <div style="width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;flex:none;border:1.5px solid {{ $n < $step ? 'var(--color-accent)' : ($n === $step ? 'var(--color-accent)' : 'var(--color-divider)') }};background:{{ $n < $step ? 'var(--color-accent-700)' : 'transparent' }};color:{{ $n < $step ? 'var(--color-accent-100)' : ($n === $step ? 'var(--color-accent)' : 'color-mix(in srgb, var(--color-text) 50%, transparent)') }}">{{ $n }}</div>
                                <div style="font-size:11px;text-align:center;color:{{ $n <= $step ? 'var(--color-text)' : 'color-mix(in srgb, var(--color-text) 50%, transparent)' }}">{{ $label }}</div>
                            </div>
                            @if (! $loop->last)
                                <div class="wizard-connector" style="height:1px;margin:15px 8px 0;background:{{ $n < $step ? 'var(--color-accent)' : 'var(--color-divider)' }}"></div>
                            @endif
                        </div>
                    @endforeach
                </div>

                @if ($step === 1)
                    <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px">
                        @foreach ($this->categories as $category)
                            <div class="card elev-sm" style="padding:20px;gap:10px;cursor:pointer" wire:click="selectCategory({{ $category->id }})">
                                <div style="width:40px;height:40px;border-radius:50%;background:var(--color-accent-700);color:var(--color-accent-100);display:flex;align-items:center;justify-content:center;font-size:16px">{{ mb_strtoupper(mb_substr($category->name, 0, 1)) }}</div>
                                <span class="card-title">{{ $category->name }}</span>
                                <p class="card-body">{{ $category->description }}</p>
                                <span class="card-meta">{{ $category->subcategories->count() }} podkategorie</span>
                            </div>
                        @endforeach
                    </div>
                @elseif ($step === 2)
                    <div style="display:flex;flex-direction:column;gap:10px">
                        <button type="button" class="btn btn-ghost" style="align-self:flex-start;padding:0" wire:click="backToCategory">&larr; Zmień kategorię</button>
                        @foreach ($this->selectedCategory?->subcategories ?? [] as $sub)
                            <div class="card elev-sm" style="padding:16px;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;cursor:pointer" wire:click="selectSubcategory({{ $sub->id }})">
                                <div>
                                    <div style="font-weight:500">{{ $sub->name }}</div>
                                    <div class="card-meta">{{ $sub->description }}</div>
                                </div>
                                <span class="text-muted" style="font-size:18px">&rarr;</span>
                            </div>
                        @endforeach
                    </div>
                @elseif ($step === 3)
                    <form wire:submit="submit" class="card elev-md" style="padding:24px;gap:16px">
                        <div style="display:flex;justify-content:space-between;align-items:center">
                            <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>

                        <div wire:init="loadSuggestedArticles">
                            <x-bookstack-suggestions :articles="$this->suggestedArticles" />
                        </div>

                        <div class="field">
                            <label>Temat</label>
                            <input class="input" placeholder="Krótki opis problemu" wire:model="subject">
                            @error('subject') <span style="color:var(--color-danger);font-size:12px">{{ $message }}</span> @enderror
                        </div>
                        <div class="field">
                            <label>Treść</label>
                            <textarea class="input" placeholder="Opisz problem — im więcej szczegółów, tym szybciej pomożemy" wire:model="body"></textarea>
                            @error('body') <span style="color:var(--color-danger);font-size:12px">{{ $message }}</span> @enderror
                        </div>

                        @foreach ($this->selectedSubcategory?->customFields ?? [] as $field)
                            <x-custom-field-input :field="$field" wire-model="customValues" />
                        @endforeach

                        <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">
                                <label class="btn btn-secondary" style="cursor:pointer">Wybierz 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">
                                        {{ $file->getClientOriginalName() }}
                                        <span class="material-symbols-outlined" style="font-size:16px;cursor:pointer;opacity:0.7" wire:click="removeAttachment({{ $i }})">close</span>
                                    </span>
                                @empty
                                    <span class="text-muted" style="font-size:13px">Brak plików</span>
                                @endforelse
                            </div>
                            @error('attachments') <span style="color:var(--color-danger);font-size:12px">{{ $message }}</span> @enderror
                        </div>
                        <button class="btn btn-primary btn-block" type="submit">Wyślij zgłoszenie</button>
                    </form>
                @endif
            @endif
        </div>
    </div>
</div>