<?php
// Depto de Engenharia e Automação - Master Automação - Autor: Derlivon Silva
$nomeEmpresa = trim((string)($config['nome_empresa'] ?? ($config['empresa'] ?? '')));
$uri = parse_url($_SERVER['REQUEST_URI'] ?? '/', PHP_URL_PATH);

// Detecta IP local do servidor (se acessado por localhost, sugere LAN)
function detectarIpLocal(): array {
    $ips = [];
    if (function_exists('gethostbyname') && function_exists('gethostname')) {
        $local = @gethostbyname(gethostname());
        if ($local && $local !== '127.0.0.1') $ips[] = $local;
    }
    // Em Windows pega via ipconfig
    if (PHP_OS_FAMILY === 'Windows') {
        $out = @shell_exec('ipconfig 2>nul');
        if ($out && preg_match_all('/IPv4[^:]*:\s*(\d+\.\d+\.\d+\.\d+)/', $out, $m)) {
            foreach ($m[1] as $ip) {
                if ($ip !== '127.0.0.1' && !in_array($ip, $ips, true)) $ips[] = $ip;
            }
        }
    }
    return $ips;
}
$ipsLocais = detectarIpLocal();
?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title><?= \App\Core\View::e($titulo ?? 'Links — Cozinha') ?></title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
<style>
:root{
  --bg:#0a0e14; --bg2:#10151c; --card:#1a2230; --border:#2a3340;
  --txt:#f1f5f9; --muted:#94a3b8; --accent:#6366F1;
  --verde:#10b981; --azul:#3b82f6; --laranja:#f59e0b;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--txt);font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;min-height:100vh}
a{color:var(--accent);text-decoration:none}

.kds-topbar{display:flex;align-items:center;gap:1rem;padding:.85rem 1.2rem;background:var(--bg2);border-bottom:2px solid var(--border);position:sticky;top:0;z-index:50}
.kds-logo{display:flex;align-items:center;gap:.6rem;font-size:1.3rem;font-weight:800;color:var(--accent)}
.kds-logo i{font-size:1.6rem}
.kds-empresa{font-size:1rem;color:var(--muted);flex:1}
.kds-relogio{font-size:1.1rem;font-weight:700;font-variant-numeric:tabular-nums}

.kds-tabs{display:flex;gap:.3rem;padding:0 1.2rem;background:#131922;border-bottom:1px solid var(--border);overflow-x:auto}
.kds-tab{padding:.85rem 1.2rem;color:var(--muted);font-size:.95rem;border-bottom:3px solid transparent;white-space:nowrap;display:inline-flex;align-items:center;gap:.4rem}
.kds-tab:hover{color:var(--txt)}
.kds-tab.ativa{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}

.kds-conteudo{padding:1.5rem 1.2rem;max-width:1400px;margin:0 auto}
.kds-titulo{font-size:1.5rem;font-weight:700;display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.kds-subtitulo{color:var(--muted);font-size:.92rem;margin-bottom:1.5rem;max-width:760px}

.kds-secao{margin-bottom:2rem}
.kds-secao h2{
  font-size:1.05rem;color:var(--accent);font-weight:700;letter-spacing:.5px;
  text-transform:uppercase;margin-bottom:.9rem;
  display:flex;align-items:center;gap:.5rem
}
.kds-secao h2 i{font-size:1.2rem}

.kds-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:1rem}

.kds-link{
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:1.1rem;display:flex;flex-direction:column;gap:.7rem;
  border-left:4px solid var(--accent);transition:border-color .2s
}
.kds-link.cozinha{ border-left-color:#10b981 }
.kds-link.garcom { border-left-color:#f59e0b }
.kds-link.gestor { border-left-color:#6366F1 }
.kds-link.bi     { border-left-color:#3b82f6 }

.kds-link-head{display:flex;align-items:center;gap:.6rem}
.kds-link-icone{
  width:42px;height:42px;border-radius:10px;
  background:rgba(99,102,241,.18);color:var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;flex-shrink:0
}
.kds-link.cozinha .kds-link-icone{ background:rgba(16,185,129,.18); color:#10b981 }
.kds-link.garcom  .kds-link-icone{ background:rgba(245,158,11,.18); color:#f59e0b }
.kds-link.bi      .kds-link-icone{ background:rgba(59,130,246,.18); color:#3b82f6 }
.kds-link-titulo{font-size:1.05rem;font-weight:700;line-height:1.2}
.kds-link-desc{font-size:.83rem;color:var(--muted);line-height:1.3;margin-top:.2rem}

.kds-link-url-box{
  display:flex;gap:.4rem;align-items:stretch;
  background:#0d141d;border:1px solid var(--border);border-radius:8px;
  padding:.4rem .55rem;font-family:monospace;font-size:.85rem;
}
.kds-link-url{flex:1;color:#cbd5e1;word-break:break-all;line-height:1.4;display:flex;align-items:center}
.kds-link-copiar{
  background:var(--accent);color:#fff;border:none;border-radius:6px;
  padding:.45rem .75rem;font-weight:700;cursor:pointer;font-size:.85rem;
  display:inline-flex;align-items:center;gap:.3rem
}
.kds-link-copiar:hover{filter:brightness(1.1)}

.kds-link-qrwrap{
  background:#fff;padding:.5rem;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  min-height:170px
}
.kds-link-qr{width:160px;height:160px;image-rendering:pixelated}

.kds-link-abrir{
  background:transparent;border:1px solid var(--border);color:var(--muted);
  border-radius:6px;padding:.45rem .8rem;font-size:.85rem;
  display:inline-flex;align-items:center;gap:.3rem;text-decoration:none
}
.kds-link-abrir:hover{color:var(--txt);background:rgba(255,255,255,.05)}

.kds-host-box{
  background:rgba(99,102,241,.08);border:1px solid var(--border);border-left:4px solid var(--accent);
  border-radius:10px;padding:.9rem 1rem;margin-bottom:1.5rem;
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap
}
.kds-host-box i{font-size:1.5rem;color:var(--accent)}
.kds-host-info{flex:1;min-width:200px}
.kds-host-titulo{font-weight:700;font-size:.95rem;margin-bottom:.2rem}
.kds-host-detalhe{font-size:.85rem;color:var(--muted);font-family:monospace}
.kds-host-ips{display:flex;gap:.4rem;flex-wrap:wrap}
.kds-host-ips code{background:#0d141d;padding:.3rem .6rem;border-radius:6px;font-size:.85rem;color:#cbd5e1;border:1px solid var(--border)}

.kds-toast{
  position:fixed;bottom:1.2rem;left:50%;transform:translateX(-50%) translateY(100px);
  background:var(--verde);color:#000;padding:.85rem 1.5rem;border-radius:10px;
  font-size:1rem;font-weight:700;box-shadow:0 8px 24px rgba(0,0,0,.4);
  transition:transform .25s ease-out;z-index:200;display:flex;align-items:center;gap:.5rem
}
.kds-toast.show{transform:translateX(-50%) translateY(0)}

.kds-rodape{text-align:center;padding:.6rem;font-size:.7rem;color:#475569;border-top:1px solid var(--border);background:#070a0e;margin-top:2rem}
</style>
</head>
<body>

<div class="kds-topbar">
    <div class="kds-logo"><i class="bi bi-fire"></i><span>Cozinha</span></div>
    <div class="kds-empresa"><?= \App\Core\View::e($nomeEmpresa) ?></div>
    <div class="kds-relogio" id="kdsRelogio">--:--:--</div>
</div>

<div class="kds-tabs">
    <a class="kds-tab" href="/cozinha/menu"><i class="bi bi-house-fill"></i> Início</a>
    <a class="kds-tab <?= $uri==='/cozinha'?'ativa':'' ?>" href="/cozinha"><i class="bi bi-display"></i> Painel da Cozinha</a>
    <a class="kds-tab <?= $uri==='/cozinha/avisos'?'ativa':'' ?>" href="/cozinha/avisos"><i class="bi bi-bell"></i> Avisos pro Garçom</a>
    <a class="kds-tab <?= $uri==='/cozinha/relatorio'?'ativa':'' ?>" href="/cozinha/relatorio"><i class="bi bi-stopwatch"></i> Tempo de Preparo</a>
    <a class="kds-tab <?= $uri==='/cozinha/links'?'ativa':'' ?>" href="/cozinha/links"><i class="bi bi-link-45deg"></i> Links e QR Code</a>
    <a class="kds-tab <?= $uri==='/cozinha/config'?'ativa':'' ?>" href="/cozinha/config"><i class="bi bi-sliders"></i> Configurar</a>
</div>

<div class="kds-conteudo">

    <div class="kds-titulo"><i class="bi bi-link-45deg"></i> Links e Endereços</div>
    <div class="kds-subtitulo">
        Use os QR Codes pra apontar tablet e TV pros endereços certos — não precisa decorar nada. Cada cartão tem botão pra copiar a URL.
    </div>

    <div class="kds-host-box">
        <i class="bi bi-hdd-network-fill"></i>
        <div class="kds-host-info">
            <div class="kds-host-titulo">Servidor deste BI</div>
            <div class="kds-host-detalhe">Acessando agora: <code id="kdsHostAtual">—</code></div>
        </div>
        <?php if ($ipsLocais): ?>
        <div class="kds-host-info">
            <div class="kds-host-titulo">IPs deste computador na rede</div>
            <div class="kds-host-ips">
                <?php foreach ($ipsLocais as $ip): ?>
                    <code><?= \App\Core\View::e($ip) ?></code>
                <?php endforeach; ?>
            </div>
        </div>
        <?php endif; ?>
    </div>

    <div class="kds-secao">
        <h2><i class="bi bi-egg-fried"></i> Operação da Cozinha</h2>
        <div class="kds-grid" id="gridOperacao"></div>
    </div>

    <div class="kds-secao">
        <h2><i class="bi bi-person-vcard-fill"></i> Gestão</h2>
        <div class="kds-grid" id="gridGestao"></div>
    </div>

    <div class="kds-secao">
        <h2><i class="bi bi-phone-fill"></i> Celular de cada garçom (1 QR Code por pessoa)</h2>
        <div style="background:rgba(245,158,11,.08);border-left:3px solid #f59e0b;padding:.7rem 1rem;border-radius:6px;color:#cbd5e1;font-size:.9rem;margin-bottom:1rem">
            <b>Como funciona:</b> cada garçom escaneia <b>o seu</b> QR Code uma vez. A página fica salva no celular dele. Quando a cozinha tocar Pronto num prato que <b>ele</b> lançou, o celular dele vibra+apita — não precisa olhar TV de balcão.
        </div>
        <div id="gridGarcons" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.7rem">
            <div style="grid-column:1/-1;text-align:center;padding:2rem;color:var(--muted)">Carregando garçons do ERP…</div>
        </div>
    </div>

</div>

<div class="kds-toast" id="kdsToast"><i class="bi bi-check-circle-fill"></i><span id="kdsToastTxt">URL copiada</span></div>

<div class="kds-rodape">
    Fire Sistemas &middot; Premium Express BI v<?= \App\Core\View::e(\App\Core\Versao::ATUAL) ?> &middot; Links
</div>

<script>
'use strict';
const base = window.location.protocol + '//' + window.location.host;
document.getElementById('kdsHostAtual').textContent = base;

const z = n => String(n).padStart(2,'0');
function tickRelogio(){
    const d = new Date();
    document.getElementById('kdsRelogio').textContent = z(d.getHours())+':'+z(d.getMinutes())+':'+z(d.getSeconds());
}
setInterval(tickRelogio, 1000); tickRelogio();

const LINKS = {
    operacao: [
        {
            classe: 'cozinha', icone: 'bi-display',
            titulo: 'Painel da Cozinha',
            desc: 'Tablet na cozinha. Cards de pedidos com cronômetro vivo e botão Pronto.',
            path: '/cozinha'
        },
        {
            classe: 'garcom', icone: 'bi-bell-fill',
            titulo: 'Avisos pro Garçom',
            desc: 'TV ou tablet no balcão de saída. Mostra "Mesa X — pra João" com bipe.',
            path: '/cozinha/avisos'
        }
    ],
    gestao: [
        {
            classe: 'gestor', icone: 'bi-stopwatch',
            titulo: 'Relatório de Tempo de Preparo',
            desc: 'Gerente vê quanto cada prato demorou e ranking dos garçons.',
            path: '/cozinha/relatorio'
        },
        {
            classe: 'gestor', icone: 'bi-sliders',
            titulo: 'Configurar Cozinha',
            desc: 'Ajustar tempos de alerta e quais grupos vão pra fila.',
            path: '/cozinha/config'
        }
    ],
    // BI removido daqui — acesso só pra gestor via sidebar do Premium Express BI
};

function escape(s){
    if (s === null || s === undefined) return '';
    return String(s).replace(/[&<>"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'})[c]);
}

function cardHtml(item){
    const url = base + item.path;
    const qrUrl = 'https://api.qrserver.com/v1/create-qr-code/?size=200x200&margin=10&data=' + encodeURIComponent(url);
    return `
        <div class="kds-link ${item.classe}">
            <div class="kds-link-head">
                <div class="kds-link-icone"><i class="bi ${item.icone}"></i></div>
                <div>
                    <div class="kds-link-titulo">${escape(item.titulo)}</div>
                    <div class="kds-link-desc">${escape(item.desc)}</div>
                </div>
            </div>
            <div class="kds-link-qrwrap"><img class="kds-link-qr" src="${qrUrl}" alt="QR Code" loading="lazy"></div>
            <div class="kds-link-url-box">
                <span class="kds-link-url">${escape(url)}</span>
                <button class="kds-link-copiar" onclick="copiar('${url.replace(/'/g,"\\'")}', this)" title="Copiar"><i class="bi bi-clipboard"></i> Copiar</button>
            </div>
            <a class="kds-link-abrir" href="${url}" target="_blank"><i class="bi bi-box-arrow-up-right"></i> Abrir nesta tela</a>
        </div>
    `;
}

function renderSecao(arrayItens, gridId){
    document.getElementById(gridId).innerHTML = arrayItens.map(cardHtml).join('');
}

renderSecao(LINKS.operacao, 'gridOperacao');
renderSecao(LINKS.gestao,   'gridGestao');

async function carregarGarcons(){
    try {
        const r = await fetch('/api/cozinha/garcons', { credentials:'same-origin' });
        const j = await r.json();
        const grid = document.getElementById('gridGarcons');
        if (!j.garcons || !j.garcons.length) {
            grid.innerHTML = '<div style="grid-column:1/-1;text-align:center;padding:2rem;color:var(--muted)">Nenhum garçom cadastrado no ERP</div>';
            return;
        }
        grid.innerHTML = j.garcons.map(g => {
            const url = base + '/cozinha/meu?garcom=' + encodeURIComponent(g.NOME);
            const qrUrl = 'https://api.qrserver.com/v1/create-qr-code/?size=180x180&margin=8&data=' + encodeURIComponent(url);
            return `
                <div style="background:#1a2230;border:1px solid #2a3340;border-left:3px solid #10b981;border-radius:10px;padding:.7rem;display:flex;flex-direction:column;align-items:center;gap:.5rem">
                    <div style="font-weight:700;font-size:.92rem;text-align:center;color:#fff">${escape(g.NOME)}</div>
                    <div style="background:#fff;padding:.3rem;border-radius:6px"><img src="${qrUrl}" alt="QR" style="width:140px;height:140px;display:block" loading="lazy"></div>
                    <button onclick="copiar('${url.replace(/'/g,"\\'")}')" style="background:transparent;border:1px solid #2a3340;color:#94a3b8;border-radius:6px;padding:.3rem .6rem;font-size:.78rem;cursor:pointer"><i class="bi bi-clipboard"></i> Copiar URL</button>
                </div>
            `;
        }).join('');
    } catch(e) {
        document.getElementById('gridGarcons').innerHTML = '<div style="grid-column:1/-1;text-align:center;padding:2rem;color:#ef4444">Falha: ' + escape(e.message) + '</div>';
    }
}
carregarGarcons();

function toast(msg){
    const t = document.getElementById('kdsToast');
    document.getElementById('kdsToastTxt').textContent = msg;
    t.classList.add('show');
    setTimeout(()=>t.classList.remove('show'), 1800);
}

function copiar(url, btn){
    if (navigator.clipboard) {
        navigator.clipboard.writeText(url).then(() => {
            toast('URL copiada!');
            if (btn) {
                const orig = btn.innerHTML;
                btn.innerHTML = '<i class="bi bi-check2"></i> Copiado';
                setTimeout(() => { btn.innerHTML = orig; }, 1200);
            }
        }).catch(() => fallbackCopiar(url));
    } else {
        fallbackCopiar(url);
    }
}
function fallbackCopiar(url){
    const ta = document.createElement('textarea');
    ta.value = url; ta.style.position='fixed'; ta.style.left='-9999px';
    document.body.appendChild(ta); ta.select();
    try { document.execCommand('copy'); toast('URL copiada!'); } catch(e) { toast('Falha — copie manualmente'); }
    document.body.removeChild(ta);
}
window.copiar = copiar;
</script>

</body>
</html>
