<?php
/**
 * ASISMA CRM - Documentación de la API de captación de leads (por franquiciado)
 */
$esAdmin  = SessionHelper::isAdmin();
$endpoint = APP_URL . '/api/leads';
$llave    = $franquicia && !empty($franquicia['api_key_leads']) ? $franquicia['api_key_leads'] : '';
?>
<div class="mb-8">
    <h1 class="text-3xl font-extrabold text-white tracking-tight">API de Captación de Leads</h1>
    <p class="text-slate-400 text-sm mt-1">
        Conecta tus landings: cada envío crea un lead. Por defecto los leads recorren por MARCA (entre franquiciados con la marca completa); las landings de un producto específico usan producto_id.
    </p>
</div>

<?php if ($esAdmin && $franquiciados): ?>
<div class="mb-6 flex items-center gap-3">
    <label class="text-xs font-semibold text-slate-400 uppercase tracking-wider">Franquiciado:</label>
    <select id="selFranquiciado" onchange="window.location='<?php echo APP_URL; ?>/leads/api-documentacion?franquiciado_id=' + this.value"
            class="px-3 py-2 bg-slate-950 border border-slate-800 rounded-xl text-slate-200 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
        <?php foreach ($franquiciados as $fr): ?>
            <option value="<?php echo $fr['id']; ?>" <?php echo $fr['id'] == $franquiciadoId ? 'selected' : ''; ?>>
                <?php echo htmlspecialchars($fr['nombre_fantasia']); ?>
            </option>
        <?php endforeach; ?>
    </select>
</div>
<?php endif; ?>

<?php if (!$franquicia): ?>
<div class="px-4 py-3 bg-red-500/10 border border-red-500/20 rounded-xl text-sm text-red-300">
    No se encontró la franquicia. Contacta a la matriz.
</div>
<?php else: ?>

<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
    <!-- Credenciales -->
    <div class="bg-slate-900 border border-slate-800/80 rounded-2xl p-6 shadow-xl">
        <h3 class="text-sm font-bold text-blue-400 uppercase tracking-wider mb-4 flex items-center gap-2">
            <i data-lucide="key-round" class="w-4 h-4"></i> Credenciales de <?php echo htmlspecialchars($franquicia['nombre_fantasia']); ?>
        </h3>
        <div class="space-y-3 text-sm">
            <div>
                <div class="text-xs text-slate-500 uppercase tracking-wider mb-1">Endpoint</div>
                <div class="flex items-center gap-2">
                    <code class="px-3 py-1.5 bg-slate-950 border border-slate-800 rounded-lg text-emerald-300 font-mono text-xs">POST <?php echo htmlspecialchars($endpoint); ?></code>
                    <button onclick="copiarTexto('<?php echo htmlspecialchars($endpoint); ?>', this)" class="text-slate-500 hover:text-slate-300"><i data-lucide="copy" class="w-4 h-4"></i></button>
                </div>
            </div>
            <div>
                <div class="text-xs text-slate-500 uppercase tracking-wider mb-1">Tu API key (header <code>X-API-KEY</code> o campo <code>api_key</code>)</div>
                <?php if ($llave): ?>
                <div class="flex items-center gap-2">
                    <code class="px-3 py-1.5 bg-slate-950 border border-slate-800 rounded-lg text-amber-300 font-mono text-xs break-all"><?php echo htmlspecialchars($llave); ?></code>
                    <button onclick="copiarTexto('<?php echo htmlspecialchars($llave); ?>', this)" class="text-slate-500 hover:text-slate-300"><i data-lucide="copy" class="w-4 h-4"></i></button>
                </div>
                <p class="text-[11px] text-slate-500 mt-1.5">Esta llave es privada de tu franquicia: identifica tus landings. No la publiques en el HTML del sitio — úsala desde tu servidor.</p>
                <?php else: ?>
                <div class="text-red-300 text-xs">Sin API key generada. Contacta a la matriz.</div>
                <?php endif; ?>
            </div>
            <div>
                <div class="text-xs text-slate-500 uppercase tracking-wider mb-1">Formato</div>
                <p class="text-slate-400 text-xs">JSON (<code>Content-Type: application/json</code>) o formulario (<code>application/x-www-form-urlencoded</code>).</p>
            </div>
        </div>
    </div>

    <!-- Campos -->
    <div class="bg-slate-900 border border-slate-800/80 rounded-2xl p-6 shadow-xl">
        <h3 class="text-sm font-bold text-blue-400 uppercase tracking-wider mb-4 flex items-center gap-2">
            <i data-lucide="list-checks" class="w-4 h-4"></i> Campos del body
        </h3>
        <div class="overflow-x-auto">
            <table class="w-full text-left text-xs">
                <thead>
                    <tr class="text-slate-500 uppercase tracking-wider border-b border-slate-800">
                        <th class="py-2 pr-4">Campo</th><th class="py-2 pr-4">Obligatorio</th><th class="py-2">Descripción</th>
                    </tr>
                </thead>
                <tbody class="text-slate-300">
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">rut_empresa</td><td>Sí</td><td>RUT de la empresa, con dígito verificador válido (ej: 76123456-7)</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">razon_social</td><td>Sí</td><td>Razón social de la empresa</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">nombre_empresa</td><td>Sí</td><td>Nombre de fantasía / comercial</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">nombre_contacto</td><td>Sí</td><td>Nombre de la persona de contacto</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">telefono</td><td>Sí</td><td>Teléfono / WhatsApp del contacto</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">correo</td><td>Sí</td><td>Email del contacto</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">marca_id</td><td>Sí*</td><td><b>Forma por defecto:</b> marca de la landing — el lead rota entre los franquiciados con la marca completa</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">producto_id</td><td>Sí*</td><td>Alternativa para landings de UN producto específico (obligatoria si tu franquicia vende productos sueltos)</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-slate-400" colspan="3">* Debe venir <b class="text-emerald-300">marca_id</b> O <b class="text-emerald-300">producto_id</b>; si vienen los dos, el producto manda y debe calzar con la marca.</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-emerald-300">region_id</td><td>Sí</td><td>Región del cliente (ver tabla de regiones abajo)</td></tr>
                    <tr class="border-b border-slate-800/60"><td class="py-1.5 pr-4 font-mono text-slate-400">giro</td><td>No</td><td>Giro comercial de la empresa</td></tr>
                    <tr><td class="py-1.5 pr-4 font-mono text-slate-400">notas</td><td>No</td><td>Nota inicial que queda en la bitácora del lead</td></tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

<?php
$plantillaEjemplo = array(
    'rut_empresa'     => '76123456-7',
    'razon_social'    => 'EMPRESA EJEMPLO SPA',
    'nombre_empresa'  => 'EMPRESA EJEMPLO',
    'nombre_contacto' => 'Juan Pérez',
    'telefono'        => '+56912345678',
    'correo'          => 'juan.perez@empresa.cl',
    'region_id'       => (int)($franquicia['region_id'] ?: 1)
);
?>

<?php if (!$marcasCompletas && !$productosSueltos): ?>
<div class="px-4 py-3 bg-red-500/10 border border-red-500/20 rounded-xl text-sm text-red-300 mb-6">
    Esta franquicia no tiene autorización de venta (ni marcas ni productos). La matriz debe asignarla antes de conectar landings.
</div>
<?php endif; ?>

<?php if ($marcasCompletas): ?>
<!-- Captación por MARCA: la forma por defecto -->
<div class="bg-slate-900 border border-slate-800/80 rounded-2xl p-6 shadow-xl mb-6">
    <h3 class="text-sm font-bold text-blue-400 uppercase tracking-wider mb-1 flex items-center gap-2">
        <i data-lucide="tags" class="w-4 h-4"></i> Captación por MARCA (por defecto)
    </h3>
    <p class="text-xs text-slate-500 mb-5">Un body por cada marca completa autorizada a tu franquicia. El lead entra genérico por la marca y rota solo entre los franquiciados que tienen la marca completa.</p>
    <div class="space-y-4">
        <?php foreach ($marcasCompletas as $mc):
            $ejemplo = $plantillaEjemplo;
            $ejemplo['marca_id'] = (int)$mc['id'];
            $ejemplo['notas']    = 'Lead desde landing ' . $mc['nombre'];
            $json = json_encode($ejemplo, JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT);
        ?>
        <div class="border border-slate-800 rounded-xl overflow-hidden">
            <div class="px-4 py-2.5 bg-slate-950 flex items-center justify-between">
                <div class="text-sm font-semibold text-slate-200">
                    <?php echo htmlspecialchars($mc['nombre']); ?>
                    <span class="text-xs text-slate-500 font-normal">— marca_id: <b class="text-emerald-300"><?php echo $mc['id']; ?></b> · marca completa</span>
                </div>
                <button onclick="copiarTexto(document.getElementById('body-marca-<?php echo $mc['id']; ?>').textContent, this)"
                        class="inline-flex items-center gap-1.5 text-xs font-semibold text-slate-400 hover:text-slate-200">
                    <i data-lucide="copy" class="w-3.5 h-3.5"></i> Copiar body
                </button>
            </div>
            <pre id="body-marca-<?php echo $mc['id']; ?>" class="px-4 py-3 text-xs text-slate-300 font-mono overflow-x-auto bg-slate-900"><?php echo htmlspecialchars($json); ?></pre>
        </div>
        <?php endforeach; ?>
    </div>
</div>
<?php endif; ?>

<?php if ($productosSueltos): ?>
<!-- Captación por PRODUCTO: para los productos sueltos autorizados -->
<div class="bg-slate-900 border border-slate-800/80 rounded-2xl p-6 shadow-xl mb-6">
    <h3 class="text-sm font-bold text-blue-400 uppercase tracking-wider mb-1 flex items-center gap-2">
        <i data-lucide="package" class="w-4 h-4"></i> Captación por PRODUCTO específico
    </h3>
    <p class="text-xs text-slate-500 mb-5">Tu franquicia vende estos productos sueltos (sin la marca completa): las landings de estos productos DEBEN mandar el producto_id — los leads genéricos por marca no te llegan.</p>
    <div class="space-y-4">
        <?php foreach ($productosSueltos as $p):
            $ejemplo = $plantillaEjemplo;
            $ejemplo['producto_id'] = (int)$p['id'];
            $ejemplo['notas']       = 'Lead desde landing ' . $p['nombre'];
            $json = json_encode($ejemplo, JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT);
        ?>
        <div class="border border-slate-800 rounded-xl overflow-hidden">
            <div class="px-4 py-2.5 bg-slate-950 flex items-center justify-between">
                <div class="text-sm font-semibold text-slate-200">
                    <?php echo htmlspecialchars($p['nombre']); ?>
                    <span class="text-xs text-slate-500 font-normal">
                        — producto_id: <b class="text-emerald-300"><?php echo $p['id']; ?></b> · marca <?php echo htmlspecialchars($p['marca_nombre']); ?>
                    </span>
                </div>
                <button onclick="copiarTexto(document.getElementById('body-prod-<?php echo $p['id']; ?>').textContent, this)"
                        class="inline-flex items-center gap-1.5 text-xs font-semibold text-slate-400 hover:text-slate-200">
                    <i data-lucide="copy" class="w-3.5 h-3.5"></i> Copiar body
                </button>
            </div>
            <pre id="body-prod-<?php echo $p['id']; ?>" class="px-4 py-3 text-xs text-slate-300 font-mono overflow-x-auto bg-slate-900"><?php echo htmlspecialchars($json); ?></pre>
        </div>
        <?php endforeach; ?>
    </div>
</div>
<?php endif; ?>

<!-- Ejemplo cURL -->
<?php if ($llave && ($marcasCompletas || $productosSueltos)):
    $curlBody = $plantillaEjemplo;
    if ($marcasCompletas) {
        $curlBody['marca_id'] = (int)$marcasCompletas[0]['id'];
    } else {
        $curlBody['producto_id'] = (int)$productosSueltos[0]['id'];
    }
?>
<div class="bg-slate-900 border border-slate-800/80 rounded-2xl p-6 shadow-xl mb-6">
    <div class="text-xs text-slate-500 uppercase tracking-wider mb-2">Ejemplo cURL completo</div>
    <pre class="px-4 py-3 text-xs text-slate-300 font-mono overflow-x-auto bg-slate-950 border border-slate-800 rounded-xl">curl -X POST '<?php echo htmlspecialchars($endpoint); ?>' \
  -H 'Content-Type: application/json' \
  -H 'X-API-KEY: <?php echo htmlspecialchars($llave); ?>' \
  -d '<?php echo json_encode($curlBody, JSON_UNESCAPED_UNICODE); ?>'</pre>
</div>
<?php endif; ?>

<!-- Región del franquiciado -->
<div class="bg-slate-900 border border-slate-800/80 rounded-2xl p-6 shadow-xl">
    <h3 class="text-sm font-bold text-blue-400 uppercase tracking-wider mb-4 flex items-center gap-2">
        <i data-lucide="map-pin" class="w-4 h-4"></i> Tu región (region_id)
    </h3>
    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-2 text-xs text-slate-300">
        <?php foreach ($regiones as $r): ?>
        <div class="px-3 py-1.5 bg-slate-950 border border-slate-800 rounded-lg">
            <b class="text-emerald-300"><?php echo $r['id']; ?></b> — <?php echo htmlspecialchars($r['nombre']); ?>
        </div>
        <?php endforeach; ?>
    </div>
    <p class="text-[11px] text-slate-500 mt-3">Tus landings captan leads de tu zona: usa siempre este <code>region_id</code> en el body.</p>
    <p class="text-[11px] text-slate-500 mt-4">
        Respuestas: <code>201</code> lead creado y rotado · <code>200 duplicado:true</code> la empresa o el teléfono ya tienen un lead activo (no se duplica) · <code>422</code> datos inválidos (revisa <code>errores</code>) · <code>401</code> API key inválida.
    </p>
</div>

<?php endif; ?>
