@extends('layouts.app')

@section('title', 'Category Tickets - ' . $categoryModel->name)

@section('content')
<div class="container-fluid">
    <!-- Header Section -->
    <div class="row mb-3">
        <div class="col-12">
            <div class="card border-0 shadow-sm">
                <div class="card-body py-3">
                    <div class="row align-items-center">
                        <div class="col-lg-8">
                            <div class="d-flex align-items-center">
                                <div class="mr-3">
                                    <i class="fas fa-ticket-alt fa-2x text-primary"></i>
                                </div>
                                <div>
                                    <h3 class="font-weight-bold mb-0 text-dark">Category: {{ $categoryModel->name }}</h3>
                                    <p class="mb-0 text-muted small">Tickets for {{ $user->name ?? $user->company_name ?? 'N/A' }}</p>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 text-lg-right mt-2 mt-lg-0">
                            <a href="{{ route('reseller.users.show', $user->id) }}?tab=tickets" class="btn btn-secondary">
                                <i class="fas fa-arrow-left"></i> Back to User Profile
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-lg-2 col-md-6 mb-3 stat-card">
            <div class="card bg-primary text-white w-100">
                <div class="card-body">
                    <h4>{{ $stats['total'] }}</h4>
                    <p class="mb-0">Total Tickets</p>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-6 mb-3 stat-card">
            <div class="card bg-success text-white w-100">
                <div class="card-body">
                    <h4>{{ $stats['open'] }}</h4>
                    <p class="mb-0">Open</p>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-6 mb-3 stat-card">
            <div class="card bg-warning text-white w-100">
                <div class="card-body">
                    <h4>{{ $stats['in_progress'] }}</h4>
                    <p class="mb-0">In Progress</p>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-6 mb-3 stat-card">
            <div class="card bg-info text-white w-100">
                <div class="card-body">
                    <h4>{{ $stats['resolved'] }}</h4>
                    <p class="mb-0">Resolved</p>
                </div>
            </div>
        </div>
        <div class="col-lg-2 col-md-6 mb-3 stat-card">
            <div class="card bg-secondary text-white w-100">
                <div class="card-body">
                    <h4>{{ $stats['closed'] }}</h4>
                    <p class="mb-0">Closed</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Filters -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <form method="GET" action="{{ route('reseller.users.category-tickets', ['user' => $user->id, 'category' => $categoryModel->id]) }}">
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>Search</label>
                                    <input type="text" name="search" class="form-control" value="{{ request('search') }}" placeholder="Ticket number, subject...">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>Status</label>
                                    <select name="status" class="form-control">
                                        <option value="">All</option>
                                        <option value="open" {{ request('status') == 'open' ? 'selected' : '' }}>Open</option>
                                        <option value="in_progress" {{ request('status') == 'in_progress' ? 'selected' : '' }}>In Progress</option>
                                        <option value="resolved" {{ request('status') == 'resolved' ? 'selected' : '' }}>Resolved</option>
                                        <option value="closed" {{ request('status') == 'closed' ? 'selected' : '' }}>Closed</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>Priority</label>
                                    <select name="priority" class="form-control">
                                        <option value="">All</option>
                                        <option value="low" {{ request('priority') == 'low' ? 'selected' : '' }}>Low</option>
                                        <option value="medium" {{ request('priority') == 'medium' ? 'selected' : '' }}>Medium</option>
                                        <option value="high" {{ request('priority') == 'high' ? 'selected' : '' }}>High</option>
                                        <option value="urgent" {{ request('priority') == 'urgent' ? 'selected' : '' }}>Urgent</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>&nbsp;</label>
                                    <button type="submit" class="btn btn-primary btn-block">Filter</button>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>&nbsp;</label>
                                    <a href="{{ route('reseller.users.category-tickets', ['user' => $user->id, 'category' => $categoryModel->id]) }}" class="btn btn-secondary btn-block">Reset</a>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Tickets Table -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0">Tickets ({{ $tickets->total() }})</h5>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-striped table-hover">
                            <thead class="thead-dark">
                                <tr>
                                    <th>SL</th>
                                    <th>Ticket #</th>
                                    <th>Subject</th>
                                    <th>Sub Category</th>
                                    <th>Priority</th>
                                    <th>Status</th>
                                    <th>Created At</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($tickets as $index => $ticket)
                                    @php
                                        $slNumber = ($tickets->currentPage() - 1) * $tickets->perPage() + $index + 1;
                                    @endphp
                                    <tr>
                                        <td style="text-align: center; font-weight: 600;">{{ $slNumber }}</td>
                                        <td>{{ $ticket->ticket_number }}</td>
                                        <td>{{ Str::limit($ticket->subject, 50) }}</td>
                                        <td>{{ $ticket->subcategory->name ?? 'N/A' }}</td>
                                        <td>
                                            @php
                                                $priorityColors = [
                                                    'low' => '#6c757d',
                                                    'medium' => '#17a2b8',
                                                    'high' => '#ffc107',
                                                    'urgent' => '#dc3545'
                                                ];
                                                $priorityColor = $priorityColors[$ticket->priority] ?? '#6c757d';
                                            @endphp
                                            <span style="display: inline-block; padding: 4px 12px; background-color: {{ $priorityColor }}; color: white; border-radius: 12px; font-size: 0.85em;">
                                                {{ ucfirst($ticket->priority) }}
                                            </span>
                                        </td>
                                        <td>
                                            @php
                                                $statusColors = [
                                                    'open' => '#28a745',
                                                    'in_progress' => '#ffc107',
                                                    'resolved' => '#17a2b8',
                                                    'closed' => '#6c757d',
                                                    'upstream_issues' => '#007bff',
                                                    'pop_issues' => '#fd7e14',
                                                    'transmission_issues' => '#6f42c1'
                                                ];
                                                $statusColor = $statusColors[$ticket->status] ?? '#6c757d';
                                                $statusLabel = in_array($ticket->status, ['resolved', 'closed']) ? 'Solved' : ucfirst(str_replace('_', ' ', $ticket->status));
                                            @endphp
                                            <span style="display: inline-block; padding: 4px 12px; background-color: {{ $statusColor }}; color: white; border-radius: 12px; font-size: 0.85em;">
                                                {{ $statusLabel }}
                                            </span>
                                        </td>
                                        <td>{{ $ticket->created_at->format('Y-m-d H:i:s') }}</td>
                                        <td>
                                            <a href="{{ route('reseller-tickets.show', $ticket) }}" class="btn btn-sm btn-info" title="View">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8" class="text-center">No tickets found</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                    <div class="mt-3">
                        {{ $tickets->links() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection