<?php
session_start();
// Verificar si el usuario está logueado y tiene rol de admin
if (!isset($_SESSION['usuario_id']) || 
    empty($_SESSION['usuario_id']) || 
    $_SESSION['rol'] != 'admin') {
    header('Location: ../login.php');
    exit;
}

require_once '../includes/config.php';
require_once '../includes/db.php';
//require_once '../includes/theme_only.php'; // Agregar esta línea

$db = new Database();
$mensaje = '';

// Obtener configuración
$stmt = $db->query("SELECT color_principal, color_secundario, favicon, con_decimales, moneda FROM configuracion");
$config = $stmt->fetch(PDO::FETCH_ASSOC);

// Guardar valores específicos que necesitamos para formateo de números
$use_decimals = isset($config['con_decimales']) ? $config['con_decimales'] : 0;
$currency = isset($config['moneda']) ? $config['moneda'] : 'Gs.';

// Asegurar que todas las configuraciones tengan valores por defecto para evitar warnings
if (!isset($config['con_decimales'])) {
    $config['con_decimales'] = 0; // Valor por defecto: sin decimales
}

if (!isset($config['moneda'])) {
    $config['moneda'] = 'Gs.'; // Valor por defecto: Guaraníes
}

if (!isset($config['color_principal'])) {
    $config['color_principal'] = '#007bff'; // Valor por defecto: azul bootstrap
}

if (!isset($config['color_secundario'])) {
    $config['color_secundario'] = '#6c757d'; // Valor por defecto: gris bootstrap
}

if (!isset($config['favicon'])) {
    $config['favicon'] = ''; // Valor por defecto: vacío
}

// Función helper para formatear números según configuración
function formatNumber($number) {
    global $use_decimals; // Usar variable global específica en lugar de $config
    $decimals = $use_decimals ? 2 : 0;
    return number_format($number, $decimals, ',', '.');
}

function formatMoney($number) {
    global $currency; // Usar variable global específica en lugar de $config
    return formatNumber($number) . ' ' . $currency;
}

// Consultas para los filtros
$sql_filtros = [
    'vendedores' => "SELECT id, nombre FROM usuarios WHERE rol IN ('admin','vendedor') ORDER BY nombre",
    'clientes' => "SELECT id_cliente, CONCAT(nombre, ' ', COALESCE(apellidos,''), ' - ', numero_documento) as nombre_completo FROM clientes ORDER BY nombre",
    'secciones' => "SELECT id, nombre, codigo FROM secciones ORDER BY nombre",
    'subsecciones' => "SELECT id, nombre, codigo FROM subsecciones ORDER BY nombre",
    'proveedores' => "SELECT id, nombre, codigo FROM proveedores ORDER BY nombre",
    'marcas' => "SELECT id, nombre, codigo FROM marcas ORDER BY nombre",
    'productos' => "SELECT id, codigo, titulo as nombre FROM productos ORDER BY codigo"
];

// Obtener datos para los filtros
foreach ($sql_filtros as $key => $sql) {
    ${$key} = $db->query($sql)->fetchAll(PDO::FETCH_ASSOC);
}

// Procesar filtros y generar reporte
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // Construir URL con parámetros
    $params = http_build_query($_POST);
    header("Location: reporte-ventas.php?$params");
    exit;
}

// Usar $_GET en lugar de $_POST para los filtros
$filtros = $_GET;

// Inicializar variables
$ventas = [];
$total_ventas = $total_contado = $total_credito = 0;

// Si hay filtros, generar el reporte
if (!empty($filtros)) {
    $where = [];
    $params = [];
    
    // Filtros de fecha y hora
    if (!empty($filtros['hora_inicio']) && !empty($filtros['fecha_inicio'])) {
        $fecha_hora_inicio = $filtros['fecha_inicio'] . ' ' . $filtros['hora_inicio'];
        $where[] = "vi.created_at >= :fecha_hora_inicio";
        $params[':fecha_hora_inicio'] = $fecha_hora_inicio;
    }
    
    if (!empty($filtros['hora_fin']) && !empty($filtros['fecha_fin'])) {
        $fecha_hora_fin = $filtros['fecha_fin'] . ' ' . $filtros['hora_fin'];
        $where[] = "vi.created_at <= :fecha_hora_fin";
        $params[':fecha_hora_fin'] = $fecha_hora_fin;
    }
    
    // Otros filtros
    $filtros_simples = [
        'vendedor_id' => 'vi.vendedor_id',
        'cliente_id' => 'vi.cliente_id',
        'seccion_id' => 'p.id_seccion',
        'subseccion_id' => 'p.id_subseccion',
        'proveedor_id' => 'p.id_proveedor',
        'marca_id' => 'p.id_marca',
        'producto_id' => 'vi.producto_id',
        'tipo_venta' => 'vi.tipo_venta',
        'estado' => 'vi.estado'
    ];
    
    foreach ($filtros_simples as $post_key => $campo) {
        if (!empty($filtros[$post_key])) {
            $where[] = "$campo = :$post_key";
            $params[":$post_key"] = $filtros[$post_key];
        }
    }
    
    // Consulta principal
    $sql = "SELECT 
                vi.*,
                p.codigo as producto_codigo,
                p.titulo as producto_nombre,
                p.precio_compra,
                CONCAT(c.nombre, ' ', COALESCE(c.apellidos,''), ' - ', c.numero_documento) as cliente_nombre_completo,
                u.nombre as vendedor_nombre,
                us.nombre as usuario_nombre,
                s.nombre as seccion_nombre,
                s.codigo as seccion_codigo,
                ss.nombre as subseccion_nombre,
                ss.codigo as subseccion_codigo,
                pr.nombre as proveedor_nombre,
                pr.codigo as proveedor_codigo,
                m.nombre as marca_nombre,
                m.codigo as marca_codigo
            FROM venta_items vi
            LEFT JOIN productos p ON vi.producto_id = p.id
            LEFT JOIN clientes c ON vi.cliente_id = c.id_cliente
            LEFT JOIN usuarios u ON vi.vendedor_id = u.id
            LEFT JOIN usuarios us ON vi.usuario_id = us.id
            LEFT JOIN secciones s ON p.id_seccion = s.id
            LEFT JOIN subsecciones ss ON p.id_subseccion = ss.id
            LEFT JOIN proveedores pr ON p.id_proveedor = pr.id
            LEFT JOIN marcas m ON p.id_marca = m.id
            " . (!empty($where) ? " WHERE " . implode(" AND ", $where) : "") . "
            ORDER BY vi.created_at DESC";
            
    $stmt = $db->prepare($sql);
    $stmt->execute($params);
    $ventas = $stmt->fetchAll(PDO::FETCH_ASSOC);
    
    // Calcular totales
    foreach ($ventas as $venta) {
        $total_ventas += $venta['subtotal'];
        if ($venta['tipo_venta'] == 'contado') {
            $total_contado += $venta['subtotal'];
        } else {
            $total_credito += $venta['subtotal'];
        }
    }
}

// Antes del DOCTYPE, agregar:
//echo getThemeCSS();
require_once '../includes/header.php';

// Restaurar nuestras variables específicas después de incluir header.php
// ya que header.php redefine $config
global $use_decimals, $currency;
?>
<!DOCTYPE html>
<html lang="es">
<head>
<?php
    // Modo oscuro
    require_once '../includes/dark_mode.php';
    ?>
    <meta name="color-scheme" content="light dark">
    <?php echo getDarkModeStyles(); ?>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Reporte de Ventas</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet" />
    <?php if (!empty($config['favicon'])): ?>
        <link rel="shortcut icon" href="../uploads/config/<?php echo $config['favicon']; ?>" type="image/x-icon">
    <?php endif; ?>
    <style>
        .btn-primary {
            background-color: <?php echo $config['color_principal']; ?> !important;
            border-color: <?php echo $config['color_principal']; ?> !important;
        }
        .btn-secondary {
            background-color: <?php echo $config['color_secundario']; ?> !important;
            border-color: <?php echo $config['color_secundario']; ?> !important;
        }
        .titulo-principal {
            color: <?php echo $config['color_principal']; ?>;
        }

        /* Nuevo estilo para el foco de los controles */
        .form-control:focus,
        .form-select:focus,
        .select2-container--bootstrap-5 .select2-selection:focus,
        .select2-container--bootstrap-5.select2-container--focus .select2-selection {
            border-color: <?php echo $config['color_principal']; ?> !important;
            box-shadow: 0 0 0 0.25rem <?php echo $config['color_principal']; ?>40 !important; /* 40 = 25% opacidad en hexadecimal */
        }

        /* Ajustar color de foco para Select2 */
        .select2-container--bootstrap-5.select2-container--open .select2-selection {
            border-color: <?php echo $config['color_principal']; ?> !important;
        }

        .select2-container--bootstrap-5 .select2-dropdown .select2-results__option--highlighted{
            background-color: <?php echo $config['color_principal']; ?> !important;
        }

        /* Espaciado para botones */
        .form-actions {
            margin-top: 1.5rem;
            gap: 0.5rem;
            display: flex;
            flex-wrap: wrap;
        }
        
        @media (max-width: 768px) {
            .form-actions {
                flex-direction: column;
            }
            .form-actions .btn {
                width: 100%;
                margin-bottom: 0.5rem;
            }
        }

        /* Estilos para la tabla */
        @media (min-width: 992px) {
            /* Ancho de columnas */
            .table th:nth-child(6), 
            .table td:nth-child(6) {  /* Columna Producto */
                width: 20%;
                min-width: 200px;
            }
            
            /* Ajustar otras columnas */
            .table th, 
            .table td {
                white-space: nowrap;
            }
        }

        /* Convertir color HEX a RGB y agregar transparencia */
        .form-control:focus,
        .form-select:focus,
        .select2-container--bootstrap-5 .select2-selection:focus,
        .select2-container--bootstrap-5.select2-container--focus .select2-selection {
            border-color: <?php echo $config['color_principal']; ?>;
            box-shadow: 0 0 0 0.25rem <?php echo $config['color_principal']; ?>40; /* 40 = 25% opacidad */
        }

        /* Ajustar color de foco para Select2 */
        .select2-container--bootstrap-5.select2-container--open .select2-selection {
            border-color: <?php echo $config['color_principal']; ?>;
        }

        .select2-container--bootstrap-5 .select2-dropdown .select2-results__option--highlighted{
            background-color: <?php echo $config['color_principal']; ?>;
        }
    </style>
</head>
<body>
    <div class="container mt-4">
        <?php if (isset($_GET['mensaje'])): ?>
            <div class="alert alert-<?php echo $_GET['tipo'] ?? 'info'; ?> alert-dismissible fade show" role="alert">
                <?php echo htmlspecialchars(urldecode($_GET['mensaje'])); ?>
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        <?php endif; ?>
        
        <div class="d-flex align-items-center mb-3">

            <h2 class="titulo-principal h3 mb-0">Reporte de Ventas</h2>
        </div>

        <!-- Formulario de filtros -->
        <div class="card mb-4">
            <div class="card-body">
                <form method="POST" id="reportForm" action="reporte-ventas.php">
                    <div class="row g-3">
                        <!-- Filtros de fecha/hora -->
                        <div class="col-md-3">
                            <label>Fecha Inicio:</label>
                            <input type="date" name="fecha_inicio" class="form-control" value="<?= $filtros['fecha_inicio'] ?? '' ?>">
                        </div>
                        <div class="col-md-2">
                            <label>Hora Inicio:</label>
                            <input type="time" name="hora_inicio" class="form-control" value="<?= $filtros['hora_inicio'] ?? '' ?>">
                        </div>
                        <div class="col-md-3">
                            <label>Fecha Fin:</label>
                            <input type="date" name="fecha_fin" class="form-control" value="<?= $filtros['fecha_fin'] ?? '' ?>">
                        </div>
                        <div class="col-md-2">
                            <label>Hora Fin:</label>
                            <input type="time" name="hora_fin" class="form-control" value="<?= $filtros['hora_fin'] ?? '' ?>">
                        </div>
                        
                        <!-- Filtros de personal -->
                        <div class="col-md-4">
                            <label>Vendedor:</label>
                            <select name="vendedor_id" class="form-control">
                                <option value="">Todos los vendedores</option>
                                <?php foreach ($vendedores as $vendedor): ?>
                                    <option value="<?= $vendedor['id'] ?>" <?= (isset($filtros['vendedor_id']) && $filtros['vendedor_id'] == $vendedor['id']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($vendedor['nombre']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        
                        <div class="col-md-4">
                            <label>Cliente:</label>
                            <select name="cliente_id" class="form-control">
                                <option value="">Todos los clientes</option>
                                <?php foreach ($clientes as $cliente): ?>
                                    <option value="<?= $cliente['id_cliente'] ?>" <?= (isset($filtros['cliente_id']) && $filtros['cliente_id'] == $cliente['id_cliente']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($cliente['nombre_completo']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <!-- Filtros de clasificación -->
                        <div class="col-md-4">
                            <label>Sección:</label>
                            <select name="seccion_id" class="form-control" id="seccion_id">
                                <option value="">Todas</option>
                                <?php foreach ($secciones as $seccion): ?>
                                    <option value="<?= $seccion['id'] ?>" <?= (isset($filtros['seccion_id']) && $filtros['seccion_id'] == $seccion['id']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($seccion['codigo'] . ' - ' . $seccion['nombre']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="col-md-4">
                            <label>Subsección:</label>
                            <select name="subseccion_id" class="form-control" id="subseccion_id">
                                <option value="">Todas</option>
                                <?php foreach ($subsecciones as $subseccion): ?>
                                    <option value="<?= $subseccion['id'] ?>" <?= (isset($filtros['subseccion_id']) && $filtros['subseccion_id'] == $subseccion['id']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($subseccion['codigo'] . ' - ' . $subseccion['nombre']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="col-md-4">
                            <label>Proveedor:</label>
                            <select name="proveedor_id" class="form-control">
                                <option value="">Todos</option>
                                <?php foreach ($proveedores as $proveedor): ?>
                                    <option value="<?= $proveedor['id'] ?>" <?= (isset($filtros['proveedor_id']) && $filtros['proveedor_id'] == $proveedor['id']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($proveedor['codigo'] . ' - ' . $proveedor['nombre']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="col-md-4">
                            <label>Marca:</label>
                            <select name="marca_id" class="form-control">
                                <option value="">Todas</option>
                                <?php foreach ($marcas as $marca): ?>
                                    <option value="<?= $marca['id'] ?>" <?= (isset($filtros['marca_id']) && $filtros['marca_id'] == $marca['id']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($marca['codigo'] . ' - ' . $marca['nombre']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="col-md-4">
                            <label>Producto:</label>
                            <select name="producto_id" class="form-control producto-select">
                                <option value="">Todos</option>
                                <?php foreach ($productos as $producto): ?>
                                    <option value="<?= $producto['id'] ?>" <?= (isset($filtros['producto_id']) && $filtros['producto_id'] == $producto['id']) ? 'selected' : '' ?>>
                                        <?= htmlspecialchars($producto['codigo'] . ' - ' . $producto['nombre']) ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="col-md-4">
                            <label>Tipo de Venta:</label>
                            <select name="tipo_venta" class="form-control">
                                <option value="">Todos</option>
                                <option value="contado" <?= (isset($filtros['tipo_venta']) && $filtros['tipo_venta'] == 'contado') ? 'selected' : '' ?>>Contado</option>
                                <option value="credito" <?= (isset($filtros['tipo_venta']) && $filtros['tipo_venta'] == 'credito') ? 'selected' : '' ?>>Crédito</option>
                            </select>
                        </div>
                    </div>

                    <div class="form-actions">
                        <button type="submit" class="btn btn-primary">Generar Reporte</button>
                        <?php if (!empty($ventas)): ?>
                            <button type="button" class="btn btn-secondary" onclick="exportToPDF()">Exportar PDF</button>
                        <?php endif; ?>
                    </div>
                </form>
            </div>
        </div>

        <?php if (!empty($ventas)): ?>
            <!-- Resumen de totales -->
            <div class="card mb-4">
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-4">
                            <h5>Total Ventas: <?= formatNumber($total_ventas) ?> Gs.</h5>
                        </div>
                        <div class="col-md-4">
                            <h5>Total Contado: <?= formatNumber($total_contado) ?> Gs.</h5>
                        </div>
                        <div class="col-md-4">
                            <h5>Total Crédito: <?= formatNumber($total_credito) ?> Gs.</h5>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Tabla de resultados -->
            <div class="table-responsive">
                <table id="ventasTable" class="table table-striped">
                    <thead>
                        <tr>
                            <th>Fecha/Hora</th>
                            <th>Venta ID</th>
                            <th>Cliente</th>
                            <th>Vendedor</th>
                            <th>Producto</th>
                            <th>Sección</th>
                            <th>Subsección</th>
                            <th>Marca</th>
                            <th>Proveedor</th>
                            <th>Cant.</th>
                            <th>Precio</th>
                            <th>Subtotal</th>
                            <th>Tipo</th>
                            <th>Cuotas</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($ventas as $venta): ?>
                        <tr>
                            <td><?= date('d/m/Y H:i', strtotime($venta['created_at'])) ?></td>
                            <td><?= $venta['venta_id'] ?></td>
                            <td><?= htmlspecialchars($venta['cliente_nombre_completo']) ?></td>
                            <td><?= htmlspecialchars($venta['vendedor_nombre']) ?></td>
                            <td><?= htmlspecialchars($venta['producto_codigo'] . ' - ' . $venta['producto_nombre']) ?></td>
                            <td><?= htmlspecialchars($venta['seccion_codigo'] . ' - ' . $venta['seccion_nombre']) ?></td>
                            <td><?= htmlspecialchars($venta['subseccion_codigo'] . ' - ' . $venta['subseccion_nombre']) ?></td>
                            <td><?= htmlspecialchars($venta['marca_codigo'] . ' - ' . $venta['marca_nombre']) ?></td>
                            <td><?= htmlspecialchars($venta['proveedor_codigo'] . ' - ' . $venta['proveedor_nombre']) ?></td>
                            <td><?= $venta['cantidad'] ?></td>
                            <td><?= formatMoney($venta['precio_unitario']) ?></td>
                            <td><?= formatMoney($venta['subtotal']) ?></td>
                            <td><?= ucfirst($venta['tipo_venta']) ?></td>
                            <td><?= $venta['cantidad_cuotas'] ?></td>
                        </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>

            <!-- Añadir sección de gráficos -->
            <div class="row mt-4">
                <!-- Gráfico de Ventas por Tipo -->
                <div class="col-md-6 mb-4">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Ventas por Tipo</h5>
                            <canvas id="ventasPorTipo"></canvas>
                        </div>
                    </div>
                </div>

                <!-- Gráfico de Top 10 Productos -->
                <div class="col-md-6 mb-4">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Top 10 Productos Vendidos</h5>
                            <canvas id="topProductos"></canvas>
                        </div>
                    </div>
                </div>

                <!-- Gráfico de Ventas por Día -->
                <div class="col-md-12 mb-4">
                    <div class="card">
                        <div class="card-body">
                            <h5 class="card-title">Evolución de Ventas</h5>
                            <canvas id="ventasPorDia"></canvas>
                        </div>
                    </div>
                </div>
            </div>
        <?php endif; ?>
    </div>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap5.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script>
        // Verificar que Chart.js se haya cargado correctamente
        console.log('Chart.js loaded:', typeof Chart !== 'undefined');
        $(document).ready(function() {
            $('#ventasTable').DataTable({
                language: {
                    search: "Buscar:",
                    lengthMenu: "Mostrar _MENU_ registros por página",
                    zeroRecords: "No se encontraron registros",
                    info: "Mostrando _START_ a _END_ de _TOTAL_ registros",
                    infoEmpty: "Mostrando 0 a 0 de 0 registros",
                    infoFiltered: "(filtrados de _MAX_ registros totales)",
                    paginate: {
                        first: "Primero",
                        last: "Último",
                        next: "Siguiente",
                        previous: "Anterior"
                    }
                },
                pageLength: 25,
                order: [[0, 'desc']]
            });

            $('.producto-select').select2({
                theme: 'bootstrap-5',
                width: '100%',
                placeholder: 'Buscar por código o nombre...',
                allowClear: true,
                language: {
                    noResults: function() {
                        return "No se encontraron resultados";
                    },
                    searching: function() {
                        return "Buscando...";
                    }
                }
            });

            <?php if (!empty($ventas)): ?>
                // Depuración para verificar datos
                console.log('Datos disponibles para gráficos:');
                console.log('Total de ventas:', <?= count($ventas) ?>);
                
                const ventasPorTipo = {
                    contado: <?= $total_contado ?>,
                    credito: <?= $total_credito ?>
                };
                console.log('Ventas por tipo:', ventasPorTipo);

                <?php
                // Modificar el cálculo de productos vendidos
                $productosVendidos = [];
                foreach ($ventas as $venta) {
                    $key = mb_substr($venta['producto_codigo'] . ' - ' . $venta['producto_nombre'], 0, 30) . '...';
                    if (!isset($productosVendidos[$key])) {
                        $productosVendidos[$key] = [
                            'cantidad' => 0,
                            'monto' => 0
                        ];
                    }
                    $productosVendidos[$key]['cantidad'] += $venta['cantidad'];
                    $productosVendidos[$key]['monto'] += $venta['subtotal'];
                }

                // Ordenar por monto total
                uasort($productosVendidos, function($a, $b) {
                    return $b['monto'] - $a['monto'];
                });

                // Tomar solo los primeros 10
                $top10Productos = array_slice($productosVendidos, 0, 10, true);
                
                // Separar datos para el gráfico
                $productoLabels = array_keys($top10Productos);
                $productoCantidades = array_column($top10Productos, 'cantidad');
                $productoMontos = array_column($top10Productos, 'monto');
                
                // Depuración para verificar datos
                ?>
                console.log('Top 10 productos:', <?= json_encode($top10Productos) ?>);
                console.log('Labels:', <?= json_encode($productoLabels) ?>);
                console.log('Cantidades:', <?= json_encode($productoCantidades) ?>);
                console.log('Montos:', <?= json_encode($productoMontos) ?>);

                <?php
                $ventasPorDia = [];
                foreach ($ventas as $venta) {
                    $fecha = date('Y-m-d', strtotime($venta['created_at']));
                    if (!isset($ventasPorDia[$fecha])) {
                        $ventasPorDia[$fecha] = 0;
                    }
                    $ventasPorDia[$fecha] += $venta['subtotal'];
                }
                ksort($ventasPorDia);
                ?>
                
                console.log('Ventas por día:', <?= json_encode($ventasPorDia) ?>);

                try {
                    new Chart(document.getElementById('ventasPorTipo'), {
                        type: 'pie',
                        data: {
                            labels: ['Contado', 'Crédito'],
                            datasets: [{
                                data: [ventasPorTipo.contado, ventasPorTipo.credito],
                                backgroundColor: ['#007bff', '#6c757d']
                            }]
                        },
                        options: {
                            aspectRatio: 2, // Forzar relación de aspecto
                            maintainAspectRatio: true,
                            plugins: {
                                legend: {
                                    position: 'bottom'
                                }
                            }
                        }
                    });
                } catch (error) {
                    console.error('Error al crear gráfico de Ventas por Tipo:', error);
                }

                try {
                    new Chart(document.getElementById('topProductos'), {
                        type: 'bar',
                        data: {
                            labels: <?= json_encode($productoLabels) ?>,
                            datasets: [
                                {
                                    label: 'Cantidad Vendida',
                                    data: <?= json_encode($productoCantidades) ?>,
                                    backgroundColor: '#007bff',
                                    yAxisID: 'y'
                            },
                            {
                                label: 'Monto Total (<?= $currency ?>)',
                                data: <?= json_encode($productoMontos) ?>,
                                backgroundColor: '#6c757d',
                                type: 'line',
                                yAxisID: 'y1'
                            }
                        ]
                    },
                    options: {
                        aspectRatio: 2, // Mismo aspect ratio que el gráfico de tipo pie
                        maintainAspectRatio: true,
                        responsive: true,
                        interaction: {
                            mode: 'index',
                            intersect: false,
                        },
                        scales: {
                            y: {
                                type: 'linear',
                                display: true,
                                position: 'left',
                                title: {
                                    display: true,
                                    text: 'Cantidad'
                                }
                            },
                            y1: {
                                type: 'linear',
                                display: true,
                                position: 'right',
                                title: {
                                    display: true,
                                    text: 'Monto Total'
                                },
                                grid: {
                                    drawOnChartArea: false
                                }
                            }
                        },
                        plugins: {
                            title: {
                                display: true,
                                text: 'Top 10 Productos más Vendidos por Monto'
                            },
                            legend: {
                                position: 'bottom'
                            }
                        }
                    }
                });
                } catch (error) {
                    console.error('Error al crear gráfico de Top 10 Productos:', error);
                }

                try {
                    new Chart(document.getElementById('ventasPorDia'), {
                        type: 'line',
                    data: {
                        labels: <?= json_encode(array_keys($ventasPorDia)) ?>,
                        datasets: [{
                            label: 'Total Ventas',
                            data: <?= json_encode(array_values($ventasPorDia)) ?>,
                            borderColor: '#007bff',
                            tension: 0.1
                        }]
                    },
                    options: {
                        scales: {
                            y: {
                                beginAtZero: true
                            }
                        }
                    }
                });
                } catch (error) {
                    console.error('Error al crear gráfico de Evolución de Ventas:', error);
                }
            <?php else: ?>
                console.log('No hay datos disponibles para mostrar los gráficos.');
                
                // Mostrar mensaje en los contenedores de gráficos
                function showNoDataMessage(containerId, message) {
                    const container = document.getElementById(containerId);
                    if (container) {
                        // Limpiar el contenedor
                        container.getContext('2d').clearRect(0, 0, container.width, container.height);
                        
                        // Dibujar mensaje
                        const ctx = container.getContext('2d');
                        ctx.font = '14px Arial';
                        ctx.fillStyle = '#666';
                        ctx.textAlign = 'center';
                        ctx.fillText(message, container.width/2, container.height/2);
                    }
                }
                
                // Ejecutar después de que la página esté completamente cargada
                window.addEventListener('load', function() {
                    showNoDataMessage('ventasPorTipo', 'No hay datos disponibles para mostrar este gráfico');
                    showNoDataMessage('topProductos', 'No hay datos disponibles para mostrar este gráfico');
                    showNoDataMessage('ventasPorDia', 'No hay datos disponibles para mostrar este gráfico');
                });
            <?php endif; ?>
        });

        async function getChartImage(chartId) {
            return new Promise((resolve) => {
                const canvas = document.getElementById(chartId);
                resolve(canvas.toDataURL());
            });
        }

        async function exportToPDF() {
            try {
                // Capturar las imágenes de los gráficos
                const chartImages = {
                    ventas_tipo: await getChartImage('ventasPorTipo'),
                    top_productos: await getChartImage('topProductos'),
                    ventas_dia: await getChartImage('ventasPorDia')
                };

                // Crear formulario temporal
                const form = document.createElement('form');
                form.method = 'POST';
                form.action = 'exportar-pdf.php';
                form.target = '_blank';

                // Añadir los parámetros actuales
                const params = new URLSearchParams(window.location.search);
                params.forEach((value, key) => {
                    const input = document.createElement('input');
                    input.type = 'hidden';
                    input.name = key;
                    input.value = value;
                    form.appendChild(input);
                });

                // Añadir las imágenes de los gráficos
                Object.entries(chartImages).forEach(([key, value]) => {
                    const input = document.createElement('input');
                    input.type = 'hidden';
                    input.name = 'chart_' + key;
                    input.value = value;
                    form.appendChild(input);
                });

                // Agregar al documento, enviar y remover
                document.body.appendChild(form);
                form.submit();
                document.body.removeChild(form);
            } catch (error) {
                console.error('Error al exportar:', error);
                alert('Hubo un error al generar el PDF');
            }
        }
    </script>
</body>
</html>
