<?php
// /views/ver_historial.php
session_start();

/* === Check de sesión === */
if (empty($_SESSION['user_id'])) {
    $_SESSION['return_to'] = $_SERVER['REQUEST_URI'] ?? '/dashboard.php';
    header('Location: login.php');
    exit;
}

include_once '../controllers/controller_historial.php';
include_once '../models/model_pedido.php';

$controller = new HistorialController();

$busqueda = $_GET['busqueda'] ?? '';
$estadoEntrega = $_GET['estado_entrega'] ?? '';
$estadoPago = $_GET['estado_pago'] ?? '';
$orden = $_GET['orden'] ?? '';
$mes = $_GET['mes'] ?? '';
$anio = $_GET['anio'] ?? '';

$anios_disponibles = $controller->obtenerAniosDisponibles();
$historial_data = $controller->obtenerHistorialConPedidos(
    $busqueda,
    $estadoEntrega,
    $estadoPago,
    $orden,
    $mes,
    $anio
);

function labelMetodoPago(?string $m): string
{
    return ($m === 'mercadopago') ? 'Mercado Pago' : 'Efectivo';
}

?>
<!doctype html>
<html lang="es">

<head>
    <meta charset="utf-8">
    <title>Historial de Pedidos</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/estilos_historial.css">
</head>

<body>

    <!-- Topbar -->
    <header class="topbar">
        <div class="wrap topbar-inner">
            <div class="brand">
                <span class="logo">🌮</span>
                <strong>Taquería · Admin</strong>
            </div>

            <button class="btn ghost menu-toggle" type="button" aria-expanded="false" aria-controls="topbarMenu">☰ Menú</button>

            <nav class="actions" id="topbarMenu">
                <a class="btn ghost" href="../dashboard.php">Volver al menú principal</a>
                <a class="btn ghost" href="ver_historial.php">Pedidos</a>
                <a class="btn ghost" href="ver_historial_agenda.php">Agendas</a>
                <a class="btn ghost" href="perfil.php">Usuarios</a>
                <a class="btn ghost" href="admin/config_envio.php">Config. envío</a>
                <a class="btn ghost" href="menu.php" target="_blank">Ver menú público</a>
                <form action="logout.php" method="post" style="display:inline;">
                    <button type="submit" class="btn ghost danger">Cerrar sesión</button>
                </form>
            </nav>
        </div>
    </header>

    <main class="wrap">
        <h1>Historial de Pedidos</h1>
        <button type="button" class="btn back" id="btnVolver" onclick="location.href='../dashboard.php'">Regresar</button>

        <!-- Filtros -->
        <section class="search-form">
            <form id="searchForm" action="ver_historial.php" method="GET">
                <input type="text" name="busqueda" placeholder="Nombre o teléfono"
                    value="<?= htmlspecialchars($busqueda) ?>">

                <select name="estado_entrega">
                    <option value="">Entrega (todos)</option>
                    <option value="PENDIENTE" <?= $estadoEntrega === 'PENDIENTE' ? 'selected' : '' ?>>Pendiente</option>
                    <option value="EN_PREPARACION" <?= $estadoEntrega === 'EN_PREPARACION' ? 'selected' : '' ?>>En preparación</option>
                    <option value="EN_CAMINO" <?= $estadoEntrega === 'EN_CAMINO' ? 'selected' : '' ?>>En camino</option>
                    <option value="ENTREGADO" <?= $estadoEntrega === 'ENTREGADO' ? 'selected' : '' ?>>Entregado</option>
                    <option value="CANCELADO" <?= $estadoEntrega === 'CANCELADO' ? 'selected' : '' ?>>Cancelado</option>
                </select>

                <select name="estado_pago">
                    <option value="">Pago (todos)</option>
                    <option value="PENDIENTE" <?= $estadoPago === 'PENDIENTE' ? 'selected' : '' ?>>Pago pendiente</option>
                    <option value="PAGADO" <?= $estadoPago === 'PAGADO' ? 'selected' : '' ?>>Pagado</option>
                    <option value="EFECTIVO_PENDIENTE" <?= $estadoPago === 'EFECTIVO_PENDIENTE' ? 'selected' : '' ?>>Efectivo pendiente</option>
                    <option value="RECHAZADO" <?= $estadoPago === 'RECHAZADO' ? 'selected' : '' ?>>Rechazado</option>
                </select>

                <select name="orden">
                    <option value="">Ordenar precio</option>
                    <option value="precio_desc" <?= $orden === 'precio_desc' ? 'selected' : '' ?>>De mayor precio a menor</option>
                    <option value="precio_asc" <?= $orden === 'precio_asc'  ? 'selected' : '' ?>>De menor precio a mayor</option>
                </select>

                <select name="mes">
                    <option value="">Elegir mes</option>
                    <?php
                    $meses = [
                        '1' => 'Enero',
                        '2' => 'Febrero',
                        '3' => 'Marzo',
                        '4' => 'Abril',
                        '5' => 'Mayo',
                        '6' => 'Junio',
                        '7' => 'Julio',
                        '8' => 'Agosto',
                        '9' => 'Septiembre',
                        '10' => 'Octubre',
                        '11' => 'Noviembre',
                        '12' => 'Diciembre'
                    ];
                    foreach ($meses as $k => $v):
                    ?>
                        <option value="<?= $k ?>" <?= $mes === "$k" ? 'selected' : '' ?>><?= $v ?></option>
                    <?php endforeach; ?>
                </select>

                <select name="anio">
                    <option value="">Elegir año</option>
                    <?php foreach ($anios_disponibles as $y): ?>
                        <option value="<?= (int)$y ?>" <?= ((string)$y === (string)$anio) ? 'selected' : '' ?>>
                            <?= (int)$y ?>
                        </option>
                    <?php endforeach; ?>
                </select>

                <button type="submit" class="btn primary">Buscar</button>
            </form>
        </section>


        <!-- Tarjetas -->
        <section class="historial-grid">
            <?php if (!empty($historial_data)): ?>
                <?php foreach ($historial_data as $h):
                    $ep = $h['estado_pago'] ?? 'PENDIENTE';
                    $ee = $h['estado_entrega'] ?? ($h['estado'] ?? 'PENDIENTE');
                    $wa = (int)($h['whatsapp_enviado'] ?? 0);
                    $tel = preg_replace('/\D+/', '', $h['telefono']);
                ?>
                    <article class="caja-pedido" data-id="<?= (int)$h['id_pedido'] ?>"
                        data-estado-pago="<?= htmlspecialchars($ep) ?>"
                        data-estado-entrega="<?= htmlspecialchars($ee) ?>">
                        <h3>Pedido #<?= (int)$h['id_pedido'] ?>
                            <?php if (!$wa): ?><span class="badge badge-wa-pending">Sin WhatsApp</span><?php else: ?>
                            <span class="badge badge-wa-ok">WhatsApp ✓</span><?php endif; ?>
                        </h3>
                        <p><strong>Cliente:</strong> <?= htmlspecialchars($h['nombre_cliente']) ?></p>
                        <p><strong>Teléfono:</strong>
                            <a href="tel:<?= htmlspecialchars($tel) ?>"><?= htmlspecialchars($h['telefono']) ?></a>
                            · <a href="https://wa.me/52<?= htmlspecialchars($tel) ?>" target="_blank" rel="noopener">WA cliente</a>
                        </p>
                        <p><strong>Entrega:</strong> <?= ($h['envio_dom'] == 1) ? 'Domicilio' : 'Local' ?>
                            <?php if ((float)($h['costo_envio_aplicado'] ?? 0) > 0): ?>
                                · Envío $<?= number_format((float)$h['costo_envio_aplicado'], 2) ?>
                            <?php endif; ?>
                        </p>
                        <?php if (($h['envio_dom'] ?? 0) == 1): ?>
                            <p class="truncate"><strong>Dir.:</strong> <?= htmlspecialchars($h['direccion_texto'] ?? '') ?></p>
                            <?php if (!empty($h['latitud']) && !empty($h['longitud'])): ?>
                            <p><a class="btn-link-maps" href="https://maps.google.com/?q=<?= urlencode($h['latitud'] . ',' . $h['longitud']) ?>" target="_blank">Mapa</a></p>
                            <?php endif; ?>
                        <?php endif; ?>
                        <p><strong>Total:</strong> $<?= number_format((float)$h['monto_total'], 2) ?>
                            · <?= labelMetodoPago($h['metodo_pago'] ?? 'cash') ?></p>
                        <p class="estados-row">
                            <span class="estado-badge estado-pago-<?= htmlspecialchars($ep) ?>"><?= htmlspecialchars($ep) ?></span>
                            <span class="estado-badge estado-entrega-<?= htmlspecialchars($ee) ?>"><?= htmlspecialchars($ee) ?></span>
                        </p>
                        <p><strong>Fecha:</strong> <?= htmlspecialchars($h['fecha_pedido']) ?></p>
                        <div class="card-actions">
                            <button type="button" class="btn" data-detalle="<?= (int)$h['id_pedido'] ?>">Ver detalle</button>
                            <button type="button" class="btn btn-estado" data-id="<?= (int)$h['id_pedido'] ?>">Cambiar estados</button>
                        </div>
                    </article>
                <?php endforeach; ?>
            <?php else: ?>
                <p>No se encontraron registros en el historial con los filtros aplicados.</p>
            <?php endif; ?>
        </section>
    </main>

    <div id="statusModal" class="modal modal-wide" role="dialog" aria-modal="true">
        <div class="modal-content">
            <button class="close-button" aria-label="Cerrar">×</button>
            <h2 id="modalTitle">Actualizar estados</h2>
            <p>Pedido #<span id="modalPedidoId"></span></p>
            <form id="updateStatusForm">
                <input type="hidden" id="modalInputIdPedido" name="id_pedido">
                <label for="nuevo_estado_pago">Estado de pago</label>
                <select id="nuevo_estado_pago" name="estado_pago">
                    <option value="PENDIENTE">Pendiente</option>
                    <option value="PAGADO">Pagado</option>
                    <option value="EFECTIVO_PENDIENTE">Efectivo pendiente</option>
                    <option value="RECHAZADO">Rechazado</option>
                </select>
                <label for="nuevo_estado_entrega">Estado de entrega</label>
                <select id="nuevo_estado_entrega" name="estado_entrega">
                    <option value="PENDIENTE">Pendiente</option>
                    <option value="EN_PREPARACION">En preparación</option>
                    <option value="EN_CAMINO">En camino</option>
                    <option value="ENTREGADO">Entregado</option>
                    <option value="CANCELADO">Cancelado</option>
                </select>
                <button type="submit" class="btn primary">Guardar cambios</button>
            </form>
            <p id="statusMessage"></p>
        </div>
    </div>
    <!-- Modal: Detalle del pedido -->
    <div id="detalleModal" class="modal modal-wide" role="dialog" aria-modal="true">
        <div class="modal-content modal-content-left">
            <button class="close-button" aria-label="Cerrar">×</button>
            <h2 id="detalleTitle">Detalle del pedido</h2>
            <div id="detalleResumen" class="detalle-resumen"></div>
            <div class="detalle-modal">
                <div class="table-wrap">
                    <table class="tabla-detalle" id="tablaDetalle">
                        <thead>
                            <tr>
                                <th>Producto</th>
                                <th class="num">Cant.</th>
                                <th class="num">P. Unit.</th>
                                <th class="num">Total</th>
                            </tr>
                        </thead>
                        <tbody>
                            <!-- filas dinámicas -->
                        </tbody>
                        <tfoot>
                            <tr>
                                <td colspan="3" class="total-label">Total del pedido</td>
                                <td class="num total-valor" id="tdTotalPedido">$0.00</td>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
            <!-- /TABLA -->
        </div>
    </div>



    <script src="js/historial.js"></script>
</body>

</html>