<?php
// /views/ver_historial_agenda.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_agenda.php';
$controller = new HistorialAgendaController();

$nombre_o_telefono = $_GET['nombre_o_telefono'] ?? '';
$fecha = $_GET['fecha'] ?? '';
$estado = $_GET['estado'] ?? '';
$mes = $_GET['mes'] ?? '';
$anio = $_GET['anio'] ?? '';
$orden = $_GET['orden'] ?? '';

$historial_data = $controller->obtenerHistorialAgendaConDatos(
    $nombre_o_telefono,
    $fecha,
    $estado,
    $mes,
    $anio,
    $orden
);

$anios_disponibles = $controller->obtenerAniosAgendaDisponibles();
?>
<!doctype html>
<html lang="es">
<head>
    <meta charset="utf-8">
    <title>Historial de Agenda</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/estilos_historial_agenda.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="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 Agenda</h1>
        <button type="button" class="btn back" onclick="location.href='../dashboard.php'">Regresar</button>

        <!-- Filtros -->
        <section class="search-form">
            <form id="searchFormAgenda" action="ver_historial_agenda.php" method="GET">
                <input type="text" name="nombre_o_telefono" placeholder="Nombre o teléfono" value="<?= htmlspecialchars($nombre_o_telefono) ?>">
                <select name="estado">
                    <option value="">Todos los estados</option>
                    <option value="RESERVADO" <?= $estado === 'RESERVADO' ? 'selected' : '' ?>>Reservado</option>
                    <option value="COMPLETADO" <?= $estado === 'COMPLETADO' ? 'selected' : '' ?>>Completado</option>
                    <option value="CANCELADO" <?= $estado === 'CANCELADO' ? 'selected' : '' ?>>Cancelado</option>
                </select>
                <select name="orden">
                    <option value="">Ordenar por…</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="">Todos los meses</option>
                    <option value="1" <?= $mes === '1' ? 'selected' : '' ?>>Enero</option>
                    <option value="2" <?= $mes === '2' ? 'selected' : '' ?>>Febrero</option>
                    <option value="3" <?= $mes === '3' ? 'selected' : '' ?>>Marzo</option>
                    <option value="4" <?= $mes === '4' ? 'selected' : '' ?>>Abril</option>
                    <option value="5" <?= $mes === '5' ? 'selected' : '' ?>>Mayo</option>
                    <option value="6" <?= $mes === '6' ? 'selected' : '' ?>>Junio</option>
                    <option value="7" <?= $mes === '7' ? 'selected' : '' ?>>Julio</option>
                    <option value="8" <?= $mes === '8' ? 'selected' : '' ?>>Agosto</option>
                    <option value="9" <?= $mes === '9' ? 'selected' : '' ?>>Septiembre</option>
                    <option value="10" <?= $mes === '10' ? 'selected' : '' ?>>Octubre</option>
                    <option value="11" <?= $mes === '11' ? 'selected' : '' ?>>Noviembre</option>
                    <option value="12" <?= $mes === '12' ? 'selected' : '' ?>>Diciembre</option>
                </select>
                <select name="anio">
                    <option value="">Todos los años</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 $a): ?>
                    <article class="caja-pedido" data-id="<?= htmlspecialchars($a['id_agenda']) ?>">
                        <h3>ID de Agenda: <?= htmlspecialchars($a['id_agenda']) ?></h3>
                        <p><strong>Nombre del Cliente:</strong> <?= htmlspecialchars($a['nombre_cliente']) ?></p>
                        <p><strong>Teléfono:</strong> <?= htmlspecialchars($a['telefono']) ?></p>
                        <p><strong>Dirección:</strong> <?= htmlspecialchars($a['direccion_texto']) ?></p>
                        <p><strong>Fecha del Evento:</strong> <span class="fecha-evento"><?= htmlspecialchars($a['fecha_evento']) ?></span></p>
                        <p><strong>Hora del Evento:</strong> <?= htmlspecialchars($a['hora_evento']) ?></p>
                        <p><strong>Anticipo:</strong> $<span class="anticipo-valor"><?= number_format((float)$a['anticipo'], 2, '.', '') ?></span></p>
                        <p><strong>Falta por Pagar:</strong> $<span class="falta-pagar-valor"><?= number_format((float)$a['falta_por_pagar'], 2, '.', '') ?></span></p>
                        <p><strong>Estado:</strong>
                            <span class="estado-display estado-<?= htmlspecialchars($a['estado']) ?>">
                                <?= htmlspecialchars($a['estado']) ?>
                            </span>
                        </p>
                        <?php if (!empty($a['notas'])): ?>
                            <p><strong>Notas:</strong> <?= htmlspecialchars($a['notas']) ?></p>
                        <?php endif; ?>
                        <!-- Acciones -->
                        <div class="card-actions">
                            <?php if ($a['estado'] === 'RESERVADO' && (float)$a['falta_por_pagar'] > 0): ?>
                                <button type="button" class="btn primary btn-registrar-anticipo"
                                        data-id="<?= htmlspecialchars($a['id_agenda']) ?>"
                                        data-falta="<?= number_format((float)$a['falta_por_pagar'], 2, '.', '') ?>"
                                        aria-label="Registrar anticipo para la agenda <?= htmlspecialchars($a['id_agenda']) ?>">
                                    Registrar Anticipo
                                </button>
                            <?php endif; ?>
                            <button type="button" class="btn btn-agenda" data-id="<?= htmlspecialchars($a['id_agenda']) ?>">
                                Cambiar estado / fecha
                            </button>
                        </div>
                    </article>
                <?php endforeach; ?>
            <?php else: ?>
                <p>No se encontraron registros en el historial con los filtros aplicados.</p>
            <?php endif; ?>
        </section>
    </main>

    <!-- Modal: Estado/Fecha -->
    <div id="statusModal" class="modal" role="dialog" aria-modal="true" aria-labelledby="modalTitle">
        <div class="modal-content">
            <button class="close-button" aria-label="Cerrar">×</button>
            <h2 id="modalTitle">Estado y Fecha de la Agenda</h2>
            <p>ID de Agenda: <span id="modalAgendaId"></span></p>
            <p>Estado Actual: <span id="modalEstadoActual"></span></p>
            <p>Fecha Actual: <span id="modalFechaActual"></span></p>
            <form id="updateStatusForm">
                <input type="hidden" id="modalInputIdAgenda" name="id_agenda">
                <label for="nuevo_estado">Nuevo Estado:</label>
                <select id="nuevo_estado" name="estado">
                    <option value="RESERVADO">Reservado</option>
                    <option value="COMPLETADO">Completado</option>
                    <option value="CANCELADO">Cancelado</option>
                </select>
                <label for="nueva_fecha">Nueva Fecha:</label>
                <input type="date" id="nueva_fecha" name="fecha" min="<?= date('Y-m-d') ?>">
                <button type="submit" class="btn primary">Guardar Cambios</button>
            </form>
            <p id="statusMessage"></p>
        </div>
    </div>

    <!-- Modal: Registrar Anticipo -->
    <div id="anticipoModal" class="modal" role="dialog" aria-modal="true" aria-labelledby="anticipoTitle">
        <div class="modal-content">
            <button class="close-button" aria-label="Cerrar">×</button>
            <h2 id="anticipoTitle">Registrar Anticipo</h2>
            <p>ID de Agenda: <span id="modalAnticipoId"></span></p>
            <p>Monto Pendiente: $<span id="modalFaltaPagar"></span></p>
            <form id="registrarAnticipoForm">
                <input type="hidden" id="modalInputIdAnticipo" name="id_agenda">
                <label for="monto_anticipo">Monto del pago:</label>
                <input type="number" step="0.01" id="monto_anticipo" name="monto_pago" min="0.01" required>
                <button type="submit" class="btn primary">Confirmar</button>
            </form>
            <p id="anticipoMessage"></p>
        </div>
    </div>

    <script src="js/historial_agenda.js"></script>
</body>
</html>