<?php
include("../db.php");

// Consultamos el estado manual actual
$query_estado = mysqli_query($conexion, "SELECT valor FROM ajustes WHERE clave = 'estado_manual'");
$res_estado = mysqli_fetch_assoc($query_estado);
$estado_actual = ($res_estado) ? $res_estado['valor'] : 'abierto';

date_default_timezone_set('America/Argentina/Buenos_Aires');
$hoy = date('Y-m-d');

if (!isset($_SESSION['rol']) || $_SESSION['rol'] !== 'admin') {
    header("Location: ../login.php?error=acceso_denegado"); 
    exit();
}

$query_ventas = "SELECT SUM(total) as total_dia FROM pedidos WHERE DATE(fecha) = '$hoy' AND estado != 'Cancelado'";
$res_ventas = mysqli_query($conexion, $query_ventas);
$data_ventas = mysqli_fetch_assoc($res_ventas);
$total_dia = $data_ventas['total_dia'] ?? 0;

$query_activos = "SELECT COUNT(*) as cant FROM pedidos WHERE estado IN ('Pendiente', 'En Cocina')";
$res_activos = mysqli_query($conexion, $query_activos);
$data_activos = mysqli_fetch_assoc($res_activos);
$cant_pedidos = $data_activos['cant'] ?? 0;

$nombres_grafico = [];
$cantidades_grafico = [];
$query_stats = "SELECT nombre_producto, cantidad_vendida FROM estadisticas_productos ORDER BY cantidad_vendida DESC LIMIT 5";
$res_stats = mysqli_query($conexion, $query_stats);
while($row = mysqli_fetch_assoc($res_stats)) {
    $nombres_grafico[] = $row['nombre_producto'];
    $cantidades_grafico[] = $row['cantidad_vendida'];
}

$query_pedidos = "SELECT p.id_pedido, p.id_usuario, u.nombre as nombre_usuario, p.total, p.estado, p.fecha 
                  FROM pedidos p 
                  LEFT JOIN usuarios u ON p.id_usuario = u.id_usuario 
                  ORDER BY p.fecha DESC LIMIT 10";
$res_pedidos = mysqli_query($conexion, $query_pedidos);

if ($res_pedidos) {
    $pedidos_reales = mysqli_fetch_all($res_pedidos, MYSQLI_ASSOC);
} else {
    die("Error en la consulta: " . mysqli_error($conexion));
}
?>

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Panel Admin - La Pecosa</title>
    <link rel="stylesheet" href="../css/all.min.css">
    <script src="chart.js"></script>
    <link rel="stylesheet" href="admin_style.css">
    <style>
        /* ── TOPBAR DE ACCIONES ── */
        .topbar-actions {
            position: fixed;
            top: 0;
            left: 260px;
            right: 0;
            height: 64px;
            background: #fff;
            border-bottom: 1px solid #e5e7eb;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            padding: 0 40px;
            gap: 10px;
            z-index: 100;
        }

        .topbar-fecha {
            display: flex;
            align-items: center;
            gap: 7px;
            font-size: 0.85rem;
            font-weight: 600;
            color: #4b5563;
            background: #f9fafb;
            border: 1px solid #e5e7eb;
            border-radius: 7px;
            padding: 8px 14px;
        }
        .topbar-fecha i { color: #e02828; }

        .btn-estado-abierto,
        .btn-estado-cerrado {
            display: flex;
            align-items: center;
            gap: 7px;
            padding: 8px 16px;
            border: none;
            border-radius: 7px;
            font-size: 0.85rem;
            font-weight: 700;
            cursor: pointer;
            transition: opacity 0.15s, transform 0.15s;
        }
        .btn-estado-abierto:hover,
        .btn-estado-cerrado:hover { opacity: 0.88; transform: translateY(-1px); }

        .btn-estado-abierto { background: #16a34a; color: #fff; }
        .btn-estado-cerrado { background: #e02828; color: #fff; }

        /* Bajamos el main-content para que no quede debajo de la topbar */
        .main-content { padding-top: 84px; }

        /* ── CARDS MEJORADAS ── */
        .dashboard-cards {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
            gap: 18px;
            margin-bottom: 28px;
        }

        .dash-card {
            background: #fff;
            border-radius: 12px;
            padding: 22px 24px;
            border: 1px solid #f0f0f0;
            box-shadow: 0 1px 4px rgba(0,0,0,0.04);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }
        .dash-card-label {
            font-size: 0.75rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.6px;
            color: #9ca3af;
            margin-bottom: 6px;
        }
        .dash-card-value {
            font-size: 2rem;
            font-weight: 800;
            line-height: 1;
        }
        .dash-card-value.green { color: #16a34a; }
        .dash-card-value.red   { color: #e02828; }

        .dash-card-icon {
            width: 52px;
            height: 52px;
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.3rem;
            flex-shrink: 0;
        }
        .dash-card-icon.green-bg { background: #dcfce7; color: #16a34a; }
        .dash-card-icon.red-bg   { background: #fee2e2; color: #e02828; }

        /* ── CONTENEDORES ── */
        .section-card {
            background: #fff;
            border-radius: 12px;
            border: 1px solid #f0f0f0;
            box-shadow: 0 1px 4px rgba(0,0,0,0.04);
            padding: 24px;
            margin-bottom: 24px;
        }
        .section-card-title {
            font-size: 1rem;
            font-weight: 700;
            color: #111827;
            margin-bottom: 18px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-card-title i { color: #e02828; font-size: 0.95rem; }

        /* ── TABLA ── */
        .admin-table td { font-size: 0.9rem; }
        .admin-table tr:last-child td { border-bottom: none; }
    </style>
</head>
<body>

    <!-- TOPBAR FIJA -->
    <div class="topbar-actions">

        <div class="topbar-fecha">
            <i class="fa-solid fa-calendar-days"></i>
            <?php 
                $dias = ["Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado"];
                echo $dias[date('w')] . " " . date('d/m/Y') . " · " . date('H:i') . " hs";
            ?>
        </div>

        <form action="cambiar_estado.php" method="POST" style="display:inline;">
            <?php if ($estado_actual === 'cerrado'): ?>
                <input type="hidden" name="nuevo_estado" value="abierto">
                <button type="submit" class="btn-estado-abierto">
                    <i class="fa-solid fa-lock-open"></i> Abrir local
                </button>
            <?php else: ?>
                <input type="hidden" name="nuevo_estado" value="cerrado">
                <button type="submit" class="btn-estado-cerrado">
                    <i class="fa-solid fa-lock"></i> Cerrar página
                </button>
            <?php endif; ?>
        </form>

    </div>

    <?php include("sidebar.php"); ?>

    <div class="main-content">
        
        <div class="page-header">
            <h1><i class="fa-solid fa-chart-pie"></i> Panel de estadísticas generales</h1>
        </div>

        <!-- CARDS -->
        <div class="dashboard-cards">
            <div class="dash-card">
                <div>
                    <div class="dash-card-label">Ventas de hoy</div>
                    <div class="dash-card-value green">$<?php echo number_format($total_dia, 0, ',', '.'); ?></div>
                </div>
                <div class="dash-card-icon green-bg">
                    <i class="fa-solid fa-cash-register"></i>
                </div>
            </div>

            <div class="dash-card">
                <div>
                    <div class="dash-card-label">Pedidos en espera / cocina</div>
                    <div class="dash-card-value red"><?php echo $cant_pedidos; ?></div>
                </div>
                <div class="dash-card-icon red-bg">
                    <i class="fa-solid fa-clock"></i>
                </div>
            </div>
        </div>

        <!-- GRÁFICO -->
        <div class="section-card">
            <div class="section-card-title">
                <i class="fa-solid fa-ranking-star"></i> Top 5 productos más vendidos
            </div>
            <div style="height: 260px; position: relative;">
                <canvas id="chartProductos"></canvas>
            </div>
        </div>

        <!-- TABLA -->
        <div class="section-card">
            <div class="section-card-title">
                <i class="fa-solid fa-clock-rotate-left"></i> Últimos 10 pedidos recibidos
            </div>
            
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>Nº pedido</th>
                        <th>Cliente</th>
                        <th>Productos</th>
                        <th>Total</th>
                        <th>Estado</th>
                        <th>Fecha / Hora</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach($pedidos_reales as $p): 
                        $estado_normalizado = strtolower(trim($p['estado']));
                        $clase_badge = 'badge-pendiente';
                        switch ($estado_normalizado) {
                            case 'pendiente':        $clase_badge = 'badge-pendiente'; break;
                            case 'en cocina':        $clase_badge = 'badge-cocina';    break;
                            case 'listo para retirar':
                            case 'listo':            $clase_badge = 'badge-listo';     break;
                            case 'en camino':        $clase_badge = 'badge-camino';    break;
                            case 'entregado':        $clase_badge = 'badge-entregado'; break;
                            case 'cancelado':        $clase_badge = 'badge-cancelado'; break;
                        }
                    ?>
                    <tr>
                        <td><strong>#<?php echo $p['id_pedido']; ?></strong></td>
                        <td><?php echo htmlspecialchars($p['nombre_usuario'] ?? 'Invitado (S/R)'); ?></td>
                        <td>
                            <a href="ver_detalle.php?id=<?php echo $p['id_pedido']; ?>&desde=dashboard" style="color: #e02828; text-decoration: none; font-weight: 600;">
                                <i class="fa-solid fa-eye"></i> Ver detalle
                            </a>
                        </td>
                        <td><strong>$<?php echo number_format($p['total'], 0, ',', '.'); ?></strong></td>
                        <td><span class="badge <?php echo $clase_badge; ?>"><?php echo htmlspecialchars($p['estado']); ?></span></td>
                        <td style="color: #666;"><?php echo date('d/m H:i', strtotime($p['fecha'])); ?> hs</td>
                    </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>

    </div>

    <script>
        const ctx = document.getElementById('chartProductos').getContext('2d');
        new Chart(ctx, {
            type: 'bar',
            data: {
                labels: <?php echo json_encode($nombres_grafico); ?>,
                datasets: [{
                    label: 'Unidades vendidas',
                    data: <?php echo json_encode($cantidades_grafico); ?>,
                    backgroundColor: '#e02828',
                    borderWidth: 0,
                    borderRadius: 8
                }]
            },
            options: {
                responsive: true,
                maintainAspectRatio: false,
                scales: {
                    y: { beginAtZero: true, grid: { color: '#f3f4f6' }, ticks: { color: '#9ca3af', font: { size: 12 } } },
                    x: { grid: { display: false }, ticks: { color: '#4b5563', font: { size: 12 } } }
                },
                plugins: { legend: { display: false } }
            }
        });
    </script>

</body>
</html>