<?php

declare(strict_types=1);

require_once __DIR__ . '/init.php';

if (!tiene_permiso('gestionar_plantillas')) {
    $expectsJson = isset($_REQUEST['action']) || Security::expectsJson();
    if ($expectsJson) {
        Security::json(['success' => false, 'message' => 'No tienes permiso para gestionar plantillas.'], 403);
    }
    $_SESSION['flash_message'] = ['type' => 'error', 'text' => 'No tienes permiso para ver esta página.'];
    header('Location: index.php');
    exit;
}

const AFENIXX_TEMPLATE_TYPES = [
    'suscripcion' => 'Administradores y suscripciones',
    'cliente' => 'Clientes y usuarios finales',
];

const AFENIXX_TEMPLATE_USES = [
    'vencimiento' => ['label' => 'Vencimiento de cuentas', 'icon' => 'fa-calendar-xmark', 'description' => 'Avisos sobre cuentas próximas a vencer o vencidas.'],
    'cliente_general' => ['label' => 'Gestión de clientes', 'icon' => 'fa-user-group', 'description' => 'Entrega de ID, accesos e información general al cliente.'],
    'revendedor_renovar' => ['label' => 'Revendedor · renovar', 'icon' => 'fa-arrows-rotate', 'description' => 'Solicitud o recordatorio de renovación para cuentas asignadas.'],
    'revendedor_vencido' => ['label' => 'Revendedor · vencida', 'icon' => 'fa-triangle-exclamation', 'description' => 'Notificación cuando una cuenta del revendedor ya venció.'],
    'promocion' => ['label' => 'Promoción comercial', 'icon' => 'fa-bullhorn', 'description' => 'Campañas y ofertas enviadas desde Suscriptores.'],
];

/** @return string[] */
function afenixx_template_variables(string $use): array
{
    $common = ['{nombre_cliente}', '{correo}', '{plataforma}', '{vencimiento}'];
    return match ($use) {
        'promocion' => ['{nombre_cliente}', '{nombre_plan}', '{fecha_fin}'],
        'cliente_general' => ['{nombre_cliente}', '{correo}', '{id_consulta}', '{plataforma}', '{vencimiento}'],
        'vencimiento', 'revendedor_renovar', 'revendedor_vencido' => $common,
        default => $common,
    };
}

$action = trim((string) ($_POST['action'] ?? ''));
if ($action !== '') {
    Security::headers(true);
    Security::requireCsrf();

    if ($action === 'guardar_plantilla') {
        $id = filter_input(INPUT_POST, 'id', FILTER_VALIDATE_INT) ?: null;
        $name = trim((string) ($_POST['nombre_plantilla'] ?? ''));
        $message = trim((string) ($_POST['mensaje'] ?? ''));
        $type = trim((string) ($_POST['tipo_plantilla'] ?? ''));
        $use = trim((string) ($_POST['modulo_uso'] ?? ''));

        if ($name === '' || $message === '') {
            Security::json(['success' => false, 'message' => 'El nombre y el mensaje son obligatorios.'], 422);
        }
        if (!isset(AFENIXX_TEMPLATE_TYPES[$type])) {
            Security::json(['success' => false, 'message' => 'Selecciona un público válido para la plantilla.'], 422);
        }
        if (!isset(AFENIXX_TEMPLATE_USES[$use])) {
            Security::json(['success' => false, 'message' => 'Selecciona un módulo de uso válido.'], 422);
        }
        if (mb_strlen($name, 'UTF-8') > 120 || mb_strlen($message, 'UTF-8') > 3000) {
            Security::json(['success' => false, 'message' => 'El nombre o el mensaje supera la longitud permitida.'], 422);
        }

        if ($id) {
            $stmt = $pdo->prepare('UPDATE plantillas_whatsapp SET nombre_plantilla = ?, mensaje = ?, tipo_plantilla = ?, modulo_uso = ? WHERE id = ?');
            $stmt->execute([$name, $message, $type, $use, $id]);
            Security::json(['success' => true, 'message' => 'Plantilla actualizada correctamente.']);
        }

        $stmt = $pdo->prepare('INSERT INTO plantillas_whatsapp (nombre_plantilla, mensaje, tipo_plantilla, modulo_uso) VALUES (?, ?, ?, ?)');
        $stmt->execute([$name, $message, $type, $use]);
        Security::json(['success' => true, 'message' => 'Plantilla creada correctamente.']);
    }

    if ($action === 'eliminar_plantilla') {
        $id = filter_input(INPUT_POST, 'id', FILTER_VALIDATE_INT);
        if (!$id) {
            Security::json(['success' => false, 'message' => 'La plantilla seleccionada no es válida.'], 422);
        }
        $stmt = $pdo->prepare('DELETE FROM plantillas_whatsapp WHERE id = ?');
        $stmt->execute([$id]);
        if ($stmt->rowCount() === 0) {
            Security::json(['success' => false, 'message' => 'La plantilla ya no existe.'], 404);
        }
        Security::json(['success' => true, 'message' => 'Plantilla eliminada correctamente.']);
    }

    Security::json(['success' => false, 'message' => 'Acción no reconocida.'], 400);
}

$errorMessage = '';
try {
    $templates = $pdo->query('SELECT id, nombre_plantilla, mensaje, tipo_plantilla, modulo_uso FROM plantillas_whatsapp ORDER BY modulo_uso, nombre_plantilla')->fetchAll(PDO::FETCH_ASSOC);
} catch (Throwable $e) {
    error_log('[gestionar_plantillas] ' . $e->getMessage());
    $errorMessage = 'No se pudieron cargar las plantillas de WhatsApp.';
    $templates = [];
}

$typeCounts = ['suscripcion' => 0, 'cliente' => 0];
$promotionCount = 0;
foreach ($templates as $template) {
    $type = (string) ($template['tipo_plantilla'] ?? '');
    if (isset($typeCounts[$type])) $typeCounts[$type]++;
    if (($template['modulo_uso'] ?? '') === 'promocion') $promotionCount++;
}

$titulo_pagina = 'Gestionar Plantillas de WhatsApp';
require_once __DIR__ . '/admin_header.php';
require_once __DIR__ . '/includes/superadmin_ui_helpers.php';
?>
<div class="sa-page sa-communication-page">
<?php
sa_render_module_hero([
    'icon' => 'fa-brands fa-whatsapp',
    'eyebrow' => 'CATÁLOGO DE COMUNICACIÓN',
    'title' => 'Plantillas',
    'description' => 'Organiza las plantillas de WhatsApp disponibles para suscripciones, clientes, renovaciones y promociones.',
    'count' => count($templates),
    'action' => ['label' => 'Nueva plantilla', 'icon' => 'fa-plus', 'attrs' => 'id="openTemplateModal"'],
]);
sa_render_summary_cards([
    ['label' => 'Plantillas registradas', 'value' => count($templates), 'icon' => 'fa-message', 'hint' => 'Biblioteca total'],
    ['label' => 'Para suscripciones', 'value' => $typeCounts['suscripcion'], 'icon' => 'fa-id-card', 'tone' => 'is-blue', 'hint' => 'Renovaciones y avisos'],
    ['label' => 'Para clientes', 'value' => $typeCounts['cliente'], 'icon' => 'fa-user-group', 'tone' => 'is-green', 'hint' => 'Entregas y consultas'],
    ['label' => 'Promociones', 'value' => $promotionCount, 'icon' => 'fa-bullhorn', 'tone' => 'is-amber', 'hint' => 'Campañas comerciales'],
]);
?>

<?php if ($errorMessage !== ''): ?><div class="sa-alert sa-alert--danger"><i class="fas fa-triangle-exclamation"></i><div><?= sa_e($errorMessage) ?></div></div><?php endif; ?>
<style>
#templateTable th.is-actions-col,
#templateTable td.is-actions-col{width:132px;min-width:132px;max-width:132px;text-align:center;}
#templateTable td.is-actions-col{padding-left:8px;padding-right:8px;}
#templateTable td.is-actions-col .sa-record-actions{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-wrap:nowrap;white-space:nowrap;min-width:112px;}
#templateTable td.is-actions-col .sa-icon-action{flex:0 0 34px;margin:0;}
#templateTable .sa-preview-column{width:22%;max-width:280px;}
#templateTable .sa-preview-column .sa-message-content-preview{max-width:280px;-webkit-line-clamp:2;line-height:1.38;}
</style>
<section class="sa-records-panel">
    <header class="sa-records-panel__header"><div class="sa-records-panel__heading"><span class="sa-records-panel__icon"><i class="fab fa-whatsapp"></i></span><div><h2>Biblioteca de plantillas</h2><p>Busca por nombre o contenido y filtra por público o módulo donde se utiliza.</p></div></div></header>
    <div class="sa-records-filters sa-template-filters">
        <div class="sa-filter-field"><label for="templateSearch"><i class="fas fa-magnifying-glass"></i> Buscar</label><div class="sa-filter-control"><i class="fas fa-magnifying-glass"></i><input id="templateSearch" type="search" placeholder="Nombre, módulo o contenido"></div></div>
        <div class="sa-filter-field"><label for="templateType"><i class="fas fa-users"></i> Público</label><select id="templateType"><option value="">Todos</option><?php foreach (AFENIXX_TEMPLATE_TYPES as $key => $label): ?><option value="<?= sa_e($key) ?>"><?= sa_e($label) ?></option><?php endforeach; ?></select></div>
        <div class="sa-filter-field"><label for="templateUse"><i class="fas fa-layer-group"></i> Uso</label><select id="templateUse"><option value="">Todos</option><?php foreach (AFENIXX_TEMPLATE_USES as $key => $use): ?><option value="<?= sa_e($key) ?>"><?= sa_e($use['label']) ?></option><?php endforeach; ?></select></div>
        <div class="sa-filter-field"><label for="templatePerPage"><i class="fas fa-list-ol"></i> Mostrar</label><select id="templatePerPage"><option value="100">100 registros</option><option value="200">200 registros</option><option value="400">400 registros</option><option value="all">Todos</option></select></div>
        <div class="sa-filter-actions"><button type="button" id="clearTemplateFilters" class="sa-btn sa-btn--secondary"><i class="fas fa-eraser"></i> Limpiar</button></div>
    </div>
    <div class="sa-records-counter-row"><span><?= count($templates) ?> plantillas registradas</span><div id="templateSummary" class="sa-records-counter"></div></div>
    <div class="sa-records-table-wrap">
        <table id="templateTable" class="sa-records-table">
            <thead><tr><th>Plantilla</th><th>Público</th><th>Módulo de uso</th><th class="sa-preview-column">Vista del mensaje</th><th class="is-center is-actions-col">Acciones</th></tr></thead>
            <tbody>
            <?php foreach ($templates as $template): ?>
                <?php $useKey = (string) ($template['modulo_uso'] ?? ''); $use = AFENIXX_TEMPLATE_USES[$useKey] ?? ['label' => 'Sin definir', 'icon' => 'fa-circle-question', 'description' => '']; $typeKey = (string) ($template['tipo_plantilla'] ?? ''); ?>
                <tr data-af-row data-type="<?= sa_e($typeKey) ?>" data-use="<?= sa_e($useKey) ?>" data-search="<?= sa_e($template['nombre_plantilla'] . ' ' . $template['mensaje'] . ' ' . $use['label'] . ' ' . (AFENIXX_TEMPLATE_TYPES[$typeKey] ?? '')) ?>">
                    <td><span class="sa-table-primary"><i class="fab fa-whatsapp sa-text-whatsapp"></i> <?= sa_e($template['nombre_plantilla']) ?></span><span class="sa-table-secondary"><?= count(afenixx_template_variables($useKey)) ?> variables disponibles</span></td>
                    <td><span class="sa-badge <?= $typeKey === 'cliente' ? 'sa-badge--success' : 'sa-badge--blue' ?>"><i class="fas <?= $typeKey === 'cliente' ? 'fa-user-group' : 'fa-id-card' ?>"></i><?= sa_e(AFENIXX_TEMPLATE_TYPES[$typeKey] ?? 'Sin definir') ?></span></td>
                    <td><span class="sa-table-primary"><i class="fas <?= sa_e($use['icon']) ?>"></i> <?= sa_e($use['label']) ?></span><span class="sa-table-secondary"><?= sa_e($use['description']) ?></span></td>
                    <td class="sa-preview-column"><span class="sa-message-content-preview" title="<?= sa_e($template['mensaje']) ?>"><?= sa_e($template['mensaje']) ?></span></td>
                    <td class="is-center is-actions-col"><div class="sa-record-actions"><button type="button" class="sa-icon-action sa-icon-action--edit js-edit-template" data-template='<?= sa_e(json_encode($template, JSON_UNESCAPED_UNICODE | JSON_HEX_APOS | JSON_HEX_QUOT)) ?>' title="Editar plantilla"><i class="fas fa-pen"></i></button><button type="button" class="sa-icon-action sa-icon-action--view js-preview-template" data-template='<?= sa_e(json_encode($template, JSON_UNESCAPED_UNICODE | JSON_HEX_APOS | JSON_HEX_QUOT)) ?>' title="Vista previa"><i class="fas fa-eye"></i></button><button type="button" class="sa-icon-action sa-icon-action--delete js-delete-template" data-id="<?= (int) $template['id'] ?>" data-name="<?= sa_e($template['nombre_plantilla']) ?>" title="Eliminar plantilla"><i class="fas fa-trash"></i></button></div></td>
                </tr>
            <?php endforeach; ?>
            </tbody>
        </table>
        <div id="templateEmpty" class="sa-inline-empty" hidden><i class="fab fa-whatsapp"></i><strong>No hay plantillas que coincidan</strong><span>Prueba otros filtros o crea una nueva plantilla.</span></div>
    </div>
    <footer class="sa-records-footer"><span class="sa-records-footer__note">Las plantillas organizan mensajes reutilizables para renovaciones, clientes y comunicaciones operativas.</span><div id="templatePagination" class="sa-pagination"></div></footer>
</section>
</div>

<div id="templateModal" class="af-modal-backdrop" aria-hidden="true">
    <section class="af-modal af-modal-lg sa-communication-modal sa-template-modal" role="dialog" aria-modal="true" aria-labelledby="templateModalTitle">
        <header class="af-modal-head sa-communication-modal__head">
            <div class="af-modal-title"><span class="af-modal-icon sa-modal-icon--whatsapp"><i class="fab fa-whatsapp"></i></span><div><h2 id="templateModalTitle">Nueva plantilla</h2><p id="templateModalDescription">Configura el destino y redacta el mensaje en una sola vista.</p></div></div>
            <button type="button" class="af-modal-close" data-af-close aria-label="Cerrar"><i class="fas fa-xmark"></i></button>
        </header>
        <form id="templateForm">
            <?= Security::csrfField() ?><input type="hidden" name="action" value="guardar_plantilla"><input type="hidden" name="id" id="templateId">
            <div class="af-modal-body sa-communication-modal__body">
                <div class="sa-editor-layout sa-editor-layout--template">
                    <section class="sa-editor-panel">
                        <div class="sa-editor-section-title"><span><i class="fas fa-sliders"></i></span><div><strong>Configuración de la plantilla</strong><small>Identifica el mensaje y define dónde estará disponible.</small></div></div>
                        <div class="sa-editor-fields-grid">
                            <div class="full"><label class="af-label" for="templateName"><i class="fas fa-tag"></i> Nombre de la plantilla *</label><input id="templateName" name="nombre_plantilla" class="af-control" maxlength="120" required placeholder="Ejemplo: Aviso profesional de vencimiento"></div>
                            <div class="full"><label class="af-label" for="templateTypeField"><i class="fas fa-users"></i> Público *</label><select id="templateTypeField" name="tipo_plantilla" class="af-control" required><?php foreach (AFENIXX_TEMPLATE_TYPES as $key => $label): ?><option value="<?= sa_e($key) ?>"><?= sa_e($label) ?></option><?php endforeach; ?></select><span class="af-help">Selecciona quién recibirá el mensaje.</span></div>
                            <div class="full"><label class="af-label" for="templateUseField"><i class="fas fa-layer-group"></i> Módulo de uso *</label><select id="templateUseField" name="modulo_uso" class="af-control" required><?php foreach (AFENIXX_TEMPLATE_USES as $key => $use): ?><option value="<?= sa_e($key) ?>"><?= sa_e($use['label']) ?></option><?php endforeach; ?></select><span id="templateUseHelp" class="af-help"></span></div>
                            <div class="full sa-editor-message-field"><label class="af-label" for="templateMessage"><i class="fas fa-align-left"></i> Mensaje *</label><textarea id="templateMessage" name="mensaje" class="af-control" rows="8" maxlength="3000" required placeholder="Escribe un mensaje claro, breve y profesional..."></textarea><div class="sa-field-meta"><span id="templateVariables"></span><span id="templateCharacters">0 / 3000</span></div></div>
                        </div>
                    </section>
                    <aside class="sa-editor-preview-panel">
                        <div class="sa-editor-section-title"><span><i class="fas fa-eye"></i></span><div><strong>Vista previa</strong><small>Así se verá el contenido preparado para WhatsApp.</small></div></div>
                        <div class="sa-phone-preview">
                            <div class="sa-phone-preview__bar"><span><i class="fab fa-whatsapp"></i> WhatsApp</span><i class="fas fa-ellipsis-vertical"></i></div>
                            <div class="sa-live-preview sa-whatsapp-preview"><div id="templatePreview" class="sa-live-preview__content"></div></div>
                        </div>
                    </aside>
                </div>
            </div>
            <footer class="af-modal-footer sa-communication-modal__footer"><button type="button" class="af-btn af-btn-secondary" data-af-close>Cancelar</button><button type="submit" class="af-btn af-btn-primary"><i class="fas fa-floppy-disk"></i> Guardar plantilla</button></footer>
        </form>
    </section>
</div>

<script>
document.addEventListener('DOMContentLoaded', () => {
    const uses = <?= json_encode(AFENIXX_TEMPLATE_USES, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>;
    const types = <?= json_encode(AFENIXX_TEMPLATE_TYPES, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES) ?>;
    const variablesByUse = <?= json_encode(array_map('afenixx_template_variables', array_keys(AFENIXX_TEMPLATE_USES)), JSON_UNESCAPED_UNICODE) ?>;
    const useKeys = <?= json_encode(array_keys(AFENIXX_TEMPLATE_USES)) ?>;
    const variablesMap = Object.fromEntries(useKeys.map((key, index) => [key, variablesByUse[index]]));
    const samples = {'{nombre_cliente}':'María','{nombre_plan}':'Plan Premium','{fecha_fin}':'31/12/2026','{correo}':'cliente@correo.com','{id_consulta}':'CLIE-A1B2C3D4','{plataforma}':'Netflix','{vencimiento}':'22/07/2026'};

    const list = new AfenixAdmin.UnifiedList({table:'#templateTable',search:'#templateSearch',perPage:'#templatePerPage',filters:[{selector:'#templateType',data:'type'},{selector:'#templateUse',data:'use'}],summary:'#templateSummary',pagination:'#templatePagination',empty:'#templateEmpty'});
    document.getElementById('clearTemplateFilters')?.addEventListener('click',()=>{document.getElementById('templateSearch').value='';document.getElementById('templateType').value='';document.getElementById('templateUse').value='';document.getElementById('templatePerPage').value='100';list.currentPage=1;list.render();});

    const modal = new AfenixAdmin.ModalController('#templateModal');
    const form = document.getElementById('templateForm');
    const message = document.getElementById('templateMessage');
    const useField = document.getElementById('templateUseField');
    const renderPreview = () => {
        const key = useField.value;
        const variables = variablesMap[key] || [];
        document.getElementById('templateUseHelp').textContent = uses[key]?.description || '';
        document.getElementById('templateVariables').innerHTML = variables.length ? `<strong>Variables:</strong> ${variables.map(v=>`<code>${v}</code>`).join(' ')}` : 'Sin variables especiales.';
        let text = message.value || 'Escribe el mensaje para visualizarlo aquí.';
        variables.forEach(variable => { text = text.split(variable).join(samples[variable] || variable); });
        document.getElementById('templatePreview').textContent = text;
        document.getElementById('templateCharacters').textContent = `${message.value.length} / 3000`;
    };
    message.addEventListener('input',renderPreview); useField.addEventListener('change',renderPreview);

    const openForm = (template = null, trigger = null) => {
        form.reset(); document.getElementById('templateId').value='';
        document.getElementById('templateModalTitle').textContent = template ? 'Editar plantilla' : 'Nueva plantilla';
        document.getElementById('templateModalDescription').textContent = template ? 'Actualiza la configuración y revisa el resultado antes de guardar.' : 'Configura el destino y redacta el mensaje en una sola vista.';
        if(template){document.getElementById('templateId').value=template.id||'';document.getElementById('templateName').value=template.nombre_plantilla||'';document.getElementById('templateTypeField').value=template.tipo_plantilla||'suscripcion';useField.value=template.modulo_uso||'cliente_general';message.value=template.mensaje||'';}else{document.getElementById('templateTypeField').value='suscripcion';useField.value='cliente_general';}
        renderPreview(); modal.open(trigger);
    };
    document.getElementById('openTemplateModal')?.addEventListener('click',(event)=>openForm(null,event.currentTarget));

    document.getElementById('templateTable')?.addEventListener('click',async(event)=>{
        const edit=event.target.closest('.js-edit-template');
        const preview=event.target.closest('.js-preview-template');
        const del=event.target.closest('.js-delete-template');
        if(edit){openForm(JSON.parse(edit.dataset.template),edit);return;}
        if(preview){
            const data=JSON.parse(preview.dataset.template);
            const vars=variablesMap[data.modulo_uso]||[];
            let text=data.mensaje||'';
            vars.forEach(v=>{text=text.split(v).join(samples[v]||v);});
            const safe=value=>String(value??'').replace(/[&<>"']/g,m=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#039;'}[m]));
            const useLabel=uses[data.modulo_uso]?.label||'Uso general';
            const typeLabel=types[data.tipo_plantilla]||'Público general';
            await Swal.fire({
                title:data.nombre_plantilla || 'Vista previa de plantilla',
                html:`<div class="sa-swal-preview-card"><div class="sa-swal-preview-meta"><span><i class="fas fa-users"></i>${safe(typeLabel)}</span><span><i class="fas fa-layer-group"></i>${safe(useLabel)}</span></div><div class="sa-swal-message-preview"><div>${safe(text).replace(/\n/g,'<br>')}</div></div></div>`,
                showConfirmButton:true,
                confirmButtonText:'Cerrar vista previa',
                customClass:{popup:'sa-preview-swal',confirmButton:'sa-preview-swal__button'},
                buttonsStyling:false
            });
            return;
        }
        if(del){const confirm=await Swal.fire({title:'¿Eliminar plantilla?',html:`Se eliminará <strong>${del.dataset.name}</strong>.`,text:'Dejará de aparecer en los módulos que la utilizan.',icon:'warning',showCancelButton:true,confirmButtonText:'Sí, eliminar',cancelButtonText:'Cancelar',confirmButtonColor:'#dc2626'});if(!confirm.isConfirmed)return;try{const body=new URLSearchParams({action:'eliminar_plantilla',id:del.dataset.id,_csrf:<?= json_encode(Security::csrfToken()) ?>});const result=await AfenixAdmin.request('gestionar_plantillas.php',{method:'POST',headers:{'Content-Type':'application/x-www-form-urlencoded','X-Requested-With':'XMLHttpRequest'},body});await Swal.fire('Plantilla eliminada',result.message,'success');location.reload();}catch(error){Swal.fire('No se pudo eliminar',error.message,'error');}}
    });

    form.addEventListener('submit',async(event)=>{event.preventDefault();const submit=form.querySelector('button[type="submit"]');submit.disabled=true;Swal.fire({title:'Guardando plantilla…',text:'Validando contenido y variables.',allowOutsideClick:false,didOpen:()=>Swal.showLoading()});try{const result=await AfenixAdmin.request('gestionar_plantillas.php',{method:'POST',body:new FormData(form),headers:{'X-Requested-With':'XMLHttpRequest'}});modal.clean();modal.close(true);await Swal.fire('Plantilla guardada',result.message,'success');location.reload();}catch(error){Swal.fire('No se pudo guardar',error.message,'error');}finally{submit.disabled=false;}});
});
</script>
<?php require_once __DIR__ . '/admin_footer.php'; ?>
