@extends('admin.layouts.index-template', [
    'pageTitle' => 'Órdenes',
    'items' => $orders,
    'icon' => 'shopping-cart',
    'module' => 'Órdenes',
    'createRoute' => route('admin.orders.create'),
    'indexRoute' => route('orders.index'),
    'searchPlaceholder' => 'Buscar por cliente, email o número de orden...',
    'emptyIcon' => 'shopping-cart',
    'emptyTitle' => 'No hay órdenes',
    'emptyMessage' => 'Aún no se han recibido órdenes de compra',
    'stats' => [
        'all' => [
            'label' => 'Total',
            'count' => $orders->total(),
            'color' => 'primary',
            'icon' => 'shopping-cart'
        ],
        'pending' => [
            'label' => 'Pendientes',
            'count' => \App\Models\Order::where('status', 'pending')->count(),
            'color' => 'warning',
            'icon' => 'time'
        ],
        'shipped' => [
            'label' => 'Enviadas', 
            'count' => \App\Models\Order::where('status', 'shipped')->count(),
            'color' => 'info',
            'icon' => 'ship'
        ],
        'delivered' => [
            'label' => 'Entregadas',
            'count' => \App\Models\Order::where('status', 'delivered')->count(),
            'color' => 'success',
            'icon' => 'checkbox-circle'
        ],
        'cancelled' => [
            'label' => 'Canceladas',
            'count' => \App\Models\Order::where('status', 'cancelled')->count(),
            'color' => 'danger',
            'icon' => 'close-circle'
        ],
        'today' => [
            'label' => 'Hoy',
            'count' => \App\Models\Order::whereDate('created_at', today())->count(),
            'color' => 'secondary',
            'icon' => 'calendar-event'
        ]
    ]
])

@push('css')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
@endpush

@section('action-buttons')
    <button type="button" class="btn btn-success btn-sm me-2" title="Exportar órdenes">
        <i class="ri-file-excel-line"></i> Exportar
    </button>
    <button type="button" class="btn btn-info btn-sm me-2" title="Reportes">
        <i class="ri-bar-chart-line"></i> Reportes
    </button>
@endsection

@section('filters')
    <!-- Filtro por Estado -->
    <div class="col-md-3">
        <label class="form-label small">Estado</label>
        <select name="status" class="form-select form-select-sm">
            <option value="">Todos</option>
            <option value="pending" {{ request('status') === 'pending' ? 'selected' : '' }}>Pendiente</option>
            <option value="shipped" {{ request('status') === 'shipped' ? 'selected' : '' }}>Enviado</option>
            <option value="delivered" {{ request('status') === 'delivered' ? 'selected' : '' }}>Entregado</option>
            <option value="cancelled" {{ request('status') === 'cancelled' ? 'selected' : '' }}>Cancelado</option>
        </select>
    </div>
    
    <!-- Filtro por Fecha -->
    <div class="col-md-2">
        <label class="form-label small">Período</label>
        <select name="period" class="form-select form-select-sm">
            <option value="">Todas</option>
            <option value="today" {{ request('period') === 'today' ? 'selected' : '' }}>Hoy</option>
            <option value="week" {{ request('period') === 'week' ? 'selected' : '' }}>Esta Semana</option>
            <option value="month" {{ request('period') === 'month' ? 'selected' : '' }}>Este Mes</option>
        </select>
    </div>
@endsection

@section('table-headers')
    <tr>
        <th width="80">Orden #</th>
        <th>Cliente</th>
        <th>Contacto</th>
        <th width="120">Estado</th>
        <th width="100">Total</th>
        <th width="100">Fecha</th>
        <th width="120">Acciones</th>
    </tr>
@endsection

@section('table-body')
    @foreach($orders as $order)
    <tr>
        <td>
            <a href="{{ route('orders.detail', $order->id) }}" class="text-primary fw-bold">
                #{{ str_pad($order->id, 6, '0', STR_PAD_LEFT) }}
            </a>
        </td>
        <td>
            <div>
                <strong>{{ $order->name }}</strong>
                <br><small class="text-muted">{{ $order->email }}</small>
            </div>
        </td>
        <td>
            <div>
                <i class="ri-phone-line text-muted"></i> {{ $order->mobile }}
                <br><small class="text-muted"><i class="ri-mail-line"></i> {{ $order->email }}</small>
            </div>
        </td>
        <td>
            @if($order->status == 'pending')
                <span class="badge bg-warning">
                    <i class="ri-time-line"></i> Pendiente
                </span>
            @elseif($order->status == 'processing')
                <span class="badge bg-primary">
                    <i class="ri-loader-4-line"></i> En Proceso
                </span>
            @elseif($order->status == 'shipped')
                <span class="badge bg-info">
                    <i class="ri-truck-line"></i> Enviado
                </span>
            @elseif($order->status == 'delivered')
                <span class="badge bg-success">
                    <i class="ri-checkbox-circle-line"></i> Entregado
                </span>
            @elseif($order->status == 'cancelled')
                <span class="badge bg-danger">
                    <i class="ri-close-circle-line"></i> Cancelado
                </span>
            @else
                <span class="badge bg-secondary">
                    <i class="ri-question-line"></i> {{ ucfirst($order->status) }}
                </span>
            @endif
        </td>
        <td>
            <strong class="text-success">${{ number_format($order->grand_total, 2) }}</strong>
        </td>
        <td>
            <small>{{ \Carbon\Carbon::parse($order->created_at)->format('d/m/Y') }}</small>
            <br><small class="text-muted">{{ \Carbon\Carbon::parse($order->created_at)->format('H:i') }}</small>
        </td>
        <td>
            <div class="d-flex gap-1">
                <a href="{{ route('orders.detail', $order->id) }}"
                   class="btn btn-sm btn-info" title="Ver Detalles">
                    <i class="ri-eye-line"></i>
                </a>

                @if($order->status == 'pending')
                    <button type="button" class="btn btn-sm btn-success"
                            onclick="updateStatus({{ $order->id }}, 'shipped')" title="Marcar como Enviado">
                        <i class="ri-truck-line"></i>
                    </button>
                    <button type="button" class="btn btn-sm btn-danger"
                            onclick="updateStatus({{ $order->id }}, 'cancelled')" title="Cancelar">
                        <i class="ri-close-line"></i>
                    </button>
                @elseif($order->status == 'shipped')
                    <button type="button" class="btn btn-sm btn-success"
                            onclick="updateStatus({{ $order->id }}, 'delivered')" title="Marcar como Entregado">
                        <i class="ri-check-line"></i>
                    </button>
                @endif

                <a href="#" onclick="printOrder({{ $order->id }})"
                   class="btn btn-sm btn-secondary" title="Imprimir">
                    <i class="ri-printer-line"></i>
                </a>
            </div>
        </td>
    </tr>
    @endforeach
@endsection

@push('js')
<script>
function updateStatus(orderId, status) {
    let statusText = '';
    let statusColor = '';
    
    switch(status) {
        case 'shipped':
            statusText = 'enviado';
            statusColor = '#17a2b8';
            break;
        case 'delivered':
            statusText = 'entregado';
            statusColor = '#28a745';
            break;
        case 'cancelled':
            statusText = 'cancelado';
            statusColor = '#dc3545';
            break;
    }
    
    Swal.fire({
        title: '¿Estás seguro?',
        text: `¿Deseas marcar la orden #${orderId} como ${statusText}?`,
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: statusColor,
        cancelButtonColor: '#6c757d',
        confirmButtonText: `Sí, marcar como ${statusText}`,
        cancelButtonText: 'Cancelar'
    }).then((result) => {
        if (result.isConfirmed) {
            $.ajax({
                url: `/admin/orders/${orderId}/status`,
                type: 'PUT',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    status: status
                },
                success: function(response) {
                    if (response.status) {
                        Swal.fire(
                            '¡Actualizado!',
                            `La orden ha sido marcada como ${statusText}.`,
                            'success'
                        ).then(() => {
                            location.reload();
                        });
                    } else {
                        Swal.fire(
                            'Error',
                            response.message || 'Hubo un error al actualizar el estado.',
                            'error'
                        );
                    }
                },
                error: function() {
                    Swal.fire(
                        'Error',
                        'Hubo un error al procesar la solicitud.',
                        'error'
                    );
                }
            });
        }
    });
}

function printOrder(orderId) {
    window.open(`{{ url('/admin/orders') }}/${orderId}/print`, '_blank');
}
</script>
@endpush