@extends('layouts.admin')

@section('title', 'Staff Management')

@section('content')
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
    <h1 class="h2">Staff Management</h1>
    @can('staff.create')
        <div class="btn-toolbar mb-2 mb-md-0">
            <a href="{{ route('admin.users.create') }}" class="btn btn-primary">
                <i class="bi bi-person-plus"></i> Add Staff Member
            </a>
        </div>
    @endcan
</div>

<!-- Sales KPI Cards -->
<div class="row g-4 mb-4">
    <div class="col-md-6 col-lg-3">
        <div class="card text-center">
            <div class="card-body">
                <h5 class="card-title text-muted mb-2">
                    <i class="bi bi-calendar-day"></i> Today Sales
                </h5>
                <h2 class="mb-0 text-primary">₹{{ number_format($todaySales, 2) }}</h2>
                <small class="text-muted">All Staff Combined</small>
            </div>
        </div>
    </div>
    <div class="col-md-6 col-lg-3">
        <div class="card text-center">
            <div class="card-body">
                <h5 class="card-title text-muted mb-2">
                    <i class="bi bi-calendar-week"></i> This Week Sales
                </h5>
                <h2 class="mb-0 text-info">₹{{ number_format($thisWeekSales, 2) }}</h2>
                <small class="text-muted">All Staff Combined</small>
            </div>
        </div>
    </div>
    <div class="col-md-6 col-lg-3">
        <div class="card text-center">
            <div class="card-body">
                <h5 class="card-title text-muted mb-2">
                    <i class="bi bi-calendar-month"></i> This Month Sales
                </h5>
                <h2 class="mb-0 text-success">₹{{ number_format($thisMonthSales, 2) }}</h2>
                <small class="text-muted">All Staff Combined</small>
            </div>
        </div>
    </div>
    <div class="col-md-6 col-lg-3">
        <div class="card text-center">
            <div class="card-body">
                <h5 class="card-title text-muted mb-2">
                    <i class="bi bi-cart-check"></i> Orders / Avg Value
                </h5>
                <h2 class="mb-0 text-warning">{{ number_format($thisMonthOrders) }}</h2>
                <small class="text-muted">Avg: ₹{{ number_format($avgOrderValue, 2) }}</small>
            </div>
        </div>
    </div>
</div>

<!-- Staff List with Sales Statistics -->
<div class="card">
    <div class="card-body pb-0">
        <div class="table-responsive">
            <table class="table table-hover mb-0">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Staff Number</th>
                        <th>Name</th>
                        <th>Mobile</th>
                        <th>Email</th>
                        <th>Roles</th>
                        <th>Total Sales</th>
                        <th>Total Orders</th>
                        <th>Avg Order Value</th>
                        <th>Last Sale</th>
                        <th>Status</th>
                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($staffWithStats as $staffData)
                        @php
                            $user = $staffData['user'];
                        @endphp
                        <tr>
                            <td>#{{ $user->id }}</td>
                            <td>
                                @if($user->staff_number)
                                    <span class="badge bg-info">{{ $user->staff_number }}</span>
                                @else
                                    <span class="text-muted">-</span>
                                @endif
                            </td>
                            <td>{{ $user->name }}</td>
                            <td>{{ $user->mobile }}</td>
                            <td>{{ $user->email ?? '-' }}</td>
                            <td>
                                @foreach($user->roles as $role)
                                    <span class="badge bg-{{ $role->name === 'admin' ? 'danger' : ($role->name === 'staff' ? 'warning' : 'primary') }}">
                                        {{ ucfirst($role->name) }}
                                    </span>
                                @endforeach
                            </td>
                            <td>
                                <strong class="text-success">₹{{ number_format($staffData['total_sales'], 2) }}</strong>
                            </td>
                            <td>
                                <span class="badge bg-primary">{{ $staffData['total_orders'] }}</span>
                            </td>
                            <td>
                                ₹{{ number_format($staffData['avg_order_value'], 2) }}
                            </td>
                            <td>
                                @if($staffData['last_order_date'])
                                    {{ \Carbon\Carbon::parse($staffData['last_order_date'])->format('M d, Y') }}
                                @else
                                    <span class="text-muted">No sales</span>
                                @endif
                            </td>
                            <td>
                                @if($user->banned_at)
                                    <span class="badge bg-danger">
                                        <i class="bi bi-ban"></i> Banned
                                    </span>
                                @else
                                    <span class="badge bg-success">
                                        <i class="bi bi-check-circle"></i> Active
                                    </span>
                                @endif
                            </td>
                            <td>
                                @can('staff.update')
                                <a href="{{ route('admin.users.edit', $user->id) }}" class="btn btn-sm btn-primary">
                                    <i class="bi bi-person-gear"></i> Manage
                                </a>
                                @endcan
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="12" class="text-center text-muted py-4">
                                <i class="bi bi-inbox" style="font-size: 2rem;"></i>
                                <p class="mt-2">No staff members found.</p>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        <!-- Pagination - Right Aligned -->
        <div class="pagination-wrapper">
            <div class="d-flex justify-content-end align-items-center gap-3 flex-wrap">
                <div class="pagination-info-text">
                    Showing <strong>{{ $users->firstItem() ?? 0 }}</strong>–<strong>{{ $users->lastItem() ?? 0 }}</strong> 
                    of <strong>{{ $users->total() }}</strong> customers
                </div>
                @if($users->hasPages())
                <div class="pagination-controls">
                    {{ $users->links('vendor.pagination.admin-categories') }}
                </div>
                @endif
            </div>
        </div>
    </div>
</div>
@endsection
