@extends('layouts.master')

@section('content')
@php
    $rola    = auth()->user()->rola->nazwa;
    $prefix  = match ($rola) {
        'Administrator' => 'admin',
        'Moderator'     => 'moderator',
        'Serwisant'     => 'serwisant',
        default         => 'admin'
    };
    $current = request()->route()->getName();
@endphp

<style>
  /* --- Glass container --- */
  .glass-box {
    backdrop-filter: blur(12px);
    background: rgba(255,255,255,0.7);
    border: 1px solid rgba(255,255,255,0.4);
    border-radius: 20px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.1);
    transition: background .3s, border-color .3s;
    display: flex;
    flex-direction: column;
  }
  body.dark-mode .glass-box {
    background: rgba(30,30,40,0.6);
    border: 1px solid rgba(255,255,255,0.1);
  }

  /* --- Table styling inside glass --- */
  .glass-box .table th {
    background-color: #e3f2fd;
    color: #0d47a1;
  }
  body.dark-mode .glass-box .table th {
    background-color: #2a2a2a;
    color: #bbdefb;
  }
  body.dark-mode .glass-box .table td {
    background-color: #1f1f1f;
    color: #f1f1f1;
  }
  .glass-box .table-hover tbody tr:hover {
    background-color: #d6e4ff;
    cursor: pointer;
  }
  body.dark-mode .glass-box .table-hover tbody tr:hover {
    background-color: #2c3e50;
  }

  /* --- Button group active state --- */
  .btn-group .btn.active {
    background-color: #1a237e;
    color: #fff;
    border-color: #1a237e;
  }
  body.dark-mode .btn-group .btn.active {
    background-color: #90caf9;
    color: #000;
    border-color: #90caf9;
  }
</style>

<main class="d-flex flex-column" style="flex:1">
  <div class="container py-4 d-flex flex-column" style="flex:1">
    <div class="glass-box p-4" style="flex:1">
      <div class="d-flex justify-content-between align-items-center flex-wrap mb-4 flex-shrink-0">
        <h2 class="fw-bold mb-3 mb-md-0">Lista zgłoszeń</h2>
        <div class="btn-group">
          <a href="{{ route($prefix . '.tickets') }}"
             class="btn btn-outline-primary {{ $current === $prefix . '.tickets' ? 'active' : '' }}">
            Otwarte
          </a>
          <a href="{{ route($prefix . '.tickets.closed') }}"
             class="btn btn-outline-primary {{ $current === $prefix . '.tickets.closed' ? 'active' : '' }}">
            Zamknięte
          </a>
          <a href="{{ route($prefix . '.tickets.deleted') }}"
             class="btn btn-outline-danger {{ $current === $prefix . '.tickets.deleted' ? 'active' : '' }}">
            Usunięte
          </a>
        </div>
      </div>

      <div class="table-responsive flex-fill overflow-auto">
        <table class="table table-hover text-center align-middle mb-0">
          <thead>
            <tr>
              <th>Nr</th><th>Data</th><th>Firma</th><th>Temat</th>
              <th>Status</th><th>Priorytet</th><th>Od</th><th>Pracownik</th>
              @if(in_array($rola, ['Administrator','Moderator']))
                <th>Akcje</th>
              @endif
            </tr>
          </thead>
          <tbody>
            @forelse($tickets as $ticket)
              <tr onclick="window.location='{{ route($prefix . '.tickets.show', $ticket) }}'">
                <td>#{{ $ticket->id }}</td>
                <td>{{ $ticket->created_at->format('Y-m-d') }}</td>
                <td>{{ $ticket->company ?? 'Nieznana' }}</td>
                <td>{{ $ticket->subject }}</td>
                <td>
                  @if($ticket->status)
                    <span class="badge" style="background: {{ $ticket->status->kolor }}; color:#fff;">
                      {{ $ticket->status->nazwa }}
                    </span>
                  @else
                    <span class="badge bg-secondary">Brak</span>
                  @endif
                </td>
                <td>
                  @switch($ticket->priority)
                    @case('Krytyczny')
                      <span class="text-danger fw-bold">Krytyczny</span>@break
                    @case('Wysoki')
                      <span class="text-warning fw-semibold">Wysoki</span>@break
                    @default
                      <span class="text-muted">{{ $ticket->priority }}</span>
                  @endswitch
                </td>
                <td>{{ $ticket->name }}</td>
                <td>
                  @if($ticket->assignedUser)
                    {{ $ticket->assignedUser->name }} {{ $ticket->assignedUser->surname }}
                  @else
                    <span class="text-muted">Brak</span>
                  @endif
                </td>
                @if(in_array($rola, ['Administrator','Moderator']))
                  <td class="flex-shrink-0">
                    <div class="d-flex justify-content-center gap-2">
                      <button class="btn btn-info btn-sm" data-bs-toggle="modal"
                              data-bs-target="#assignModal{{ $ticket->id }}"
                              onclick="event.stopPropagation()">
                        Przypisz
                      </button>
                      @if($ticket->zamkniety || $ticket->usuniety)
                        <form action="{{ route($prefix . '.tickets.restore', $ticket) }}" method="POST"
                              onsubmit="return confirm('Przywrócić zgłoszenie?')"
                              onclick="event.stopPropagation()">
                          @csrf
                          <button class="btn btn-success btn-sm">Przywróć</button>
                        </form>
                      @else
                        <form action="{{ route($prefix . '.tickets.destroy', $ticket) }}" method="POST"
                              onsubmit="return confirm('Usunąć zgłoszenie?')"
                              onclick="event.stopPropagation()">
                          @csrf @method('DELETE')
                          <button class="btn btn-danger btn-sm">Usuń</button>
                        </form>
                      @endif
                    </div>
                  </td>
                @endif
              </tr>
            @empty
              <tr>
                <td colspan="{{ in_array($rola, ['Administrator','Moderator']) ? 9 : 8 }}" class="text-muted">
                  Brak zgłoszeń do wyświetlenia.
                </td>
              </tr>
            @endforelse
          </tbody>
        </table>
      </div>

      <div class="d-flex justify-content-center flex-shrink-0 mt-4">
        {{ $tickets->links() }}
      </div>
    </div>
  </div>
</main>

{{-- Modale przypisania --}}
@foreach($tickets as $ticket)
  <div class="modal fade" id="assignModal{{ $ticket->id }}" tabindex="-1"
       aria-labelledby="assignModalLabel{{ $ticket->id }}" aria-hidden="true"
       data-bs-backdrop="static">
    <div class="modal-dialog">
      <form method="POST" action="{{ route($prefix . '.tickets.assign', $ticket) }}"
            class="modal-content">
        @csrf
        <div class="modal-header">
          <h5 class="modal-title" id="assignModalLabel{{ $ticket->id }}">Przypisz pracownika</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal"
                  aria-label="Zamknij" onclick="event.stopPropagation()"></button>
        </div>
        <div class="modal-body">
          <div class="mb-3">
            <label for="user_id_{{ $ticket->id }}" class="form-label">
              Wybierz pracownika:
            </label>
            <select name="user_id" id="user_id_{{ $ticket->id }}"
                    class="form-select" required
                    onclick="event.stopPropagation()">
              <option value="" disabled selected>-- wybierz --</option>
              @foreach($users as $user)
                <option value="{{ $user->id }}">
                  {{ $user->name }} {{ $user->surname }} ({{ $user->email }})
                </option>
              @endforeach
            </select>
          </div>
          <div class="form-check" onclick="event.stopPropagation()">
            <input class="form-check-input" type="checkbox" name="send_email"
                   value="1" id="sendEmail{{ $ticket->id }}" checked>
            <label class="form-check-label" for="sendEmail{{ $ticket->id }}">
              Wyślij e-mail z powiadomieniem
            </label>
          </div>
        </div>
        <div class="modal-footer">
          <button type="submit" class="btn btn-success"
                  onclick="event.stopPropagation()">Zapisz</button>
          <button type="button" class="btn btn-secondary"
                  data-bs-dismiss="modal"
                  onclick="event.stopPropagation()">Anuluj</button>
        </div>
      </form>
    </div>
  </div>
@endforeach
@endsection