<?php
require_once __DIR__ . '/../src/db.php';
require_once __DIR__ . '/../src/helpers.php';

require_login();
if (($_SESSION['tipo'] ?? '') !== 'operador') { header('Location:/arapiraca/vereador.php'); exit; }

/* ==== Filtros ==== */
/* valores possíveis:
   - abertas:            sem qualquer vínculo
   - vinculadas:         possuem vínculo finalizado e não têm vínculos abertos
   - nao_finalizadas:    possuem pelo menos um vínculo aberto (aguardando/inativa/arapiraca_aberta)
   - todas:              todas
*/
$filtro = $_GET['f'] ?? 'abertas';
$q      = trim($_GET['q'] ?? '');
$msg    = $_GET['msg'] ?? null;

/* ==== Listas auxiliares ==== */
$tipos_pre = ['Indicação','Requerimento','Projeto de Lei','Ordem do Dia','Decreto Legislativo','Moção', 'Parecer'];

/* vereadores (mantido p/ compatibilidade em outras partes) */
$vereadores = $pdo->query("
  SELECT id, nome, COALESCE(partido,'') AS partido
  FROM usuarios
  WHERE tipo_usuario='vereador' AND ativo=1
  ORDER BY nome
")->fetchAll();

/* autores (vereadores + proponentes) para o multi-select do modal */
$autores = $pdo->query("
  SELECT id, nome, COALESCE(partido,'') AS partido, tipo_usuario
  FROM usuarios
  WHERE tipo_usuario IN ('vereador','proponente') AND ativo=1
  ORDER BY nome
")->fetchAll();

$sessoes_ativas = $pdo->query("
  SELECT id, numero, tipo, DATE_FORMAT(data_sessao,'%d/%m/%Y') AS data_fmt
  FROM sessoes
  WHERE status='ativa'
  ORDER BY data_sessao DESC, id DESC
")->fetchAll();

/* ==== Lista de matérias ==== */
$params = [];
$where  = [];

/* Filtros de acordo com a sua regra */
if ($filtro === 'abertas') {
  // sem qualquer linha em sessao_materias
  $where[] = "NOT EXISTS (SELECT 1 FROM sessao_materias ss WHERE ss.materia_id = m.id)";
} elseif ($filtro === 'vinculadas') {
  // têm finalizada E não têm vínculos abertos
  $where[] =
    "EXISTS (SELECT 1 FROM sessao_materias ss WHERE ss.materia_id = m.id AND ss.status = 'finalizada')
     AND NOT EXISTS (SELECT 1 FROM sessao_materias ss2 WHERE ss2.materia_id = m.id AND ss2.status IN ('aguardando','inativa','votacao_aberta'))";
} elseif ($filtro === 'nao_finalizadas') {
  // pelo menos um vínculo aberto
  $where[] =
    "EXISTS (SELECT 1 FROM sessao_materias ss WHERE ss.materia_id = m.id AND ss.status IN ('aguardando','inativa','votacao_aberta'))";
}

if ($q !== '') {
  $where[] = "(m.titulo LIKE :q OR m.numero LIKE :q OR m.tipo LIKE :q OR u.nome LIKE :q)";
  $params[':q'] = "%$q%";
}

/* Status calculado para exibição (por linha):
   0 = Aberta (sem vínculos)
   1 = Vinculada (não finalizada) -> existe pelo menos 1 vínculo aberto
   2 = Vinculada (finalizada)     -> existe finalizada e não há vínculos abertos
*/
$sql = "
  SELECT
    m.id, m.numero, m.ano, m.tipo, m.titulo, m.descricao, m.anexo_pdf,
    u.nome AS autor_nome, u.partido AS autor_partido,
    CASE
      WHEN NOT EXISTS (SELECT 1 FROM sessao_materias x WHERE x.materia_id=m.id) THEN 0
      WHEN EXISTS (SELECT 1 FROM sessao_materias x WHERE x.materia_id=m.id AND x.status IN ('aguardando','inativa','votacao_aberta')) THEN 1
      WHEN EXISTS (SELECT 1 FROM sessao_materias x WHERE x.materia_id=m.id AND x.status='finalizada') THEN 2
      ELSE 0
    END AS vinculo_state
  FROM materias m
  LEFT JOIN usuarios u ON u.id = m.autor_id
";
if ($where) $sql .= " WHERE ".implode(' AND ',$where);
$sql .= " ORDER BY m.ano DESC, CAST(m.numero AS UNSIGNED) ASC, m.id DESC";

$st = $pdo->prepare($sql);
$st->execute($params);
$lista = $st->fetchAll();
?>
<!doctype html>
<html lang="pt-br">
<head>
<meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="/arapiraca/assets/style.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
<title>Matérias</title>
<style>
  :root{
    --bg-grad-a:#eef2ff; --bg-grad-b:#f5f3ff; --card-bg:#ffffff;
    --border:#e5e7eb; --text:#0f172a; --muted:#64748b;
    --brand:#2563eb; --brand-2:#1d4ed8; --brand-3:#dbeafe;
    --amber:#f59e0b; --amber-2:#d97706; --amber-3:#fff7ed;
    --red:#ef4444; --red-2:#dc2626;
    --shadow: 0 10px 30px rgba(2,6,23,.06);
  }

  body{
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
    background:
      radial-gradient(1200px 600px at 10% -10%, var(--bg-grad-a), transparent),
      radial-gradient(1200px 600px at 110% 0%, var(--bg-grad-b), transparent),
      #f8fafc;
    color: var(--text);
    min-height: 100vh;
  }

  .header{
    position:sticky; top:0; z-index:10;
    background:rgba(255,255,255,.86);
    border-bottom:1px solid var(--border);
    backdrop-filter: blur(8px);
  }
  .header-inner{
    max-width:1200px; margin:0 auto; padding:12px 16px;
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  }
  .header-inner .grow{ flex:1 1 auto; }
  .title{ font-weight:800; font-size:1.15rem; }

  .btn{
    display:inline-flex; align-items:center; gap:8px;
    background:var(--brand); color:#fff; border-radius:12px;
    padding:.6rem .95rem; font-weight:800; border:0; cursor:pointer;
    box-shadow:var(--shadow); transition:.15s; text-decoration:none;
  }
  .btn:hover{ background:var(--brand-2); transform: translateY(-1px); }
  .btn.outline{ background:#fff; color:var(--brand); border:1px solid var(--brand); }
  .btn.outline:hover{ background:var(--brand-3); }

  .chip{ display:inline-flex; align-items:center; gap:8px; border-radius:9999px; padding:.52rem .9rem; font-weight:800; border:1px solid transparent; text-decoration:none; cursor:pointer; transition:.15s; }
  .chip i{ font-size:.95rem; }
  .chip.sm{ padding:.46rem .8rem; font-size:.95rem; }
  .chip.blue-outline{ background:#fff; color:var(--brand-2); border-color:var(--brand-2); }
  .chip.blue-outline:hover{ background:var(--brand-3); }
  .chip.blue-solid{ background:var(--brand); color:#fff; border-color:var(--brand); }
  .chip.blue-solid:hover{ background:var(--brand-2); }
  .chip.amber{ background:var(--amber); color:#fff; border-color:var(--amber); }
  .chip.amber:hover{ background:var(--amber-2); }
  .chip.red{ background:var(--red); color:#fff; border-color:var(--red); }
  .chip.red:hover{ background:var(--red-2); }
  .chip.gray{ background:#fff; color:#111827; border-color:var(--border); }
  .chip.gray:hover{ background:#f8fafc; }

  .wrap{ max-width:1200px; margin:18px auto; padding:0 16px; }
  .card{ background:#fff; border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow); }
  .card .hd{ padding:14px 16px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .card .bd{ padding:0; }
  .left{ display:flex; align-items:center; gap:10px; }
  .chip-title{ font-weight:800; color:#0f172a; }
  .tabs{ display:flex; align-items:center; gap:14px; color:#334155; flex-wrap:wrap; }
  .tabs a{ text-decoration:none; font-weight:800; color:#64748b; }
  .tabs a.active{ color:#111827; }

  .search{
    display:flex; gap:8px; align-items:center; flex:1 1 480px; min-width:0;
  }
  .search input{
    flex:1 1 auto; min-width:0; width:100%;
    border:2px solid var(--border); border-radius:10px; padding:.6rem .75rem; font-size:1rem; outline:none;
  }
  .search input:focus{ border-color: var(--brand); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }

  .table{ width:100%; border-collapse:collapse; }
  .table th, .table td{ padding:.72rem .7rem; border-bottom:1px solid var(--border); text-align:left; vertical-align: top; }
  .table thead th{ background:#f8fafc; color:#334155; font-size:.9rem; }
  .muted{ color:var(--muted); }
  .toast{ position:fixed; right:16px; bottom:16px; background:#111827; color:#fff; padding:.7rem .9rem; border-radius:10px; box-shadow:var(--shadow); display:none; }
  .toast.show{ display:block; }

  input, select, textarea{ border:2px solid var(--border); border-radius:10px; padding:.6rem .75rem; font-size:1rem; outline:none; }
  input:focus, select:focus, textarea:focus{ border-color: var(--brand); box-shadow: 0 0 0 3px rgba(37,99,235,.12); }

  .modal{ position:fixed; inset:0; display:none; z-index:40; }
  .modal.open{ display:block; }
  .modal .overlay{ position:absolute; inset:0; background: rgba(15, 23, 42, .45); backdrop-filter: blur(2px); }
  .modal .card{ position:relative; z-index:41; max-width:920px; margin: 5vh auto; background:#fff; border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow); }
  .modal .hd{ padding:16px 18px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
  .modal .bd{ padding:16px 18px; max-height: 72vh; overflow:auto; }
  .close{ background:transparent; border:0; font-size:22px; cursor:pointer; color:#0f172a; line-height:1; }

  .form-row{ display:grid; grid-template-columns: 2fr 1fr; gap:12px; }
  .form-row2{ display:grid; grid-template-columns: repeat(3,1fr); gap:12px; margin-top:12px; }
  @media (max-width: 720px){
    .form-row, .form-row2{ grid-template-columns: 1fr; }
    .header-inner{ gap:10px; }
    .search{ order:3; width:100%; }
    .title{ order:1; }
    #btnNova{ order:4; }
  }
  label{ font-weight:800; font-size:.9rem; color:#1f2937; display:block; margin-bottom:6px; }
  textarea{ min-height:120px; }

  @media (max-width: 800px){
    .table thead{ display:none; }
    .table, .table tbody, .table tr, .table td{ display:block; width:100%; }
    .table tr{ border-bottom:1px solid var(--border); padding:.6rem .7rem; }
    .table td{ border:0; padding:.45rem 0; }
    .table td[data-label]::before{
      content: attr(data-label) ": ";
      font-weight:800; color:#475569; display:inline-block; min-width: 140px;
    }
    .table td .chip, .table td .btn{ margin-top:6px; }
  }
</style>
</head>
<body>

<header class="header">
  <div class="header-inner">
    <a class="btn outline" href="/arapiraca/admin.php"><i class="fa fa-arrow-left"></i> Voltar</a>
    <div class="title">Matérias</div>
    <div class="grow"></div>

    <form method="get" action="/arapiraca/admin_materias.php" class="search">
      <input type="hidden" name="f" value="<?= h($filtro) ?>">
      <input name="q" value="<?= h($q) ?>" placeholder="Buscar por título, nº, tipo ou autor">
      <button class="btn" type="submit"><i class="fa fa-magnifying-glass"></i> Buscar</button>
    </form>

    <a class="btn" id="btnNova"><i class="fa fa-plus"></i> Nova matéria</a>
  </div>
</header>

<div class="wrap">
  <?php if($msg): ?><div class="toast show" id="toast"><?=h($msg)?></div><?php endif; ?>
  <div class="toast" id="toastDyn"></div>

  <div class="card">
    <div class="hd">
      <div class="left"><span class="chip-title"><i class="fa fa-list"></i> Lista</span></div>
      <div class="tabs">
        <span>Exibindo:</span>
        <a href="?f=abertas&q=<?=urlencode($q)?>"            class="<?= $filtro==='abertas'?'active':'' ?>">Abertas</a>
        <a href="?f=vinculadas&q=<?=urlencode($q)?>"          class="<?= $filtro==='vinculadas'?'active':'' ?>">Vinculadas (finalizadas)</a>
        <a href="?f=nao_finalizadas&q=<?=urlencode($q)?>"     class="<?= $filtro==='nao_finalizadas'?'active':'' ?>">Não finalizadas</a>
        <a href="?f=todas&q=<?=urlencode($q)?>"               class="<?= $filtro==='todas'?'active':'' ?>">Todas</a>
      </div>
    </div>

    <div class="bd">
      <table class="table" id="tbl">
        <thead>
          <tr>
            <th style="width:110px">Nº / Ano</th>
            <th style="width:160px">Tipo</th>
            <th>Título</th>
            <th style="width:230px">Propositor</th>
            <th style="width:160px">Status</th>
            <th style="width:420px">Ações</th>
          </tr>
        </thead>
        <tbody>
        <?php if(!$lista): ?>
          <tr><td colspan="6" class="muted">Nenhuma matéria encontrada.</td></tr>
        <?php else: foreach($lista as $r): ?>
          <?php
            $state = (int)$r['vinculo_state']; // 0 aberta, 1 não finalizada, 2 finalizada
            $statusTxt = [
              0 => 'Aberta',
              1 => 'Vinculada (não finalizada)',
              2 => 'Vinculada (finalizada)'
            ][$state] ?? '—';
          ?>
          <tr
            data-id="<?= (int)$r['id'] ?>"
            data-state="<?= (int)$state ?>"
            data-numero="<?= h($r['numero']) ?>"
            data-ano="<?= h($r['ano']) ?>"
            data-tipo="<?= h($r['tipo']) ?>"
            data-titulo="<?= h($r['titulo']) ?>"
            data-descricao="<?= h($r['descricao']) ?>"
            data-autor_nome="<?= h($r['autor_nome']) ?>"
            data-anexo="<?= h($r['anexo_pdf'] ?? '') ?>"
          >
            <td data-label="Nº / Ano"><?= h($r['numero']) ?>/<?= (int)$r['ano'] ?></td>
            <td data-label="Tipo"><?= h($r['tipo']) ?></td>
            <td data-label="Título">
              <?= h($r['titulo']) ?>
              <?php if (!empty($r['anexo_pdf'])): ?>
                <a href="<?= h($r['anexo_pdf']) ?>" target="_blank" title="Abrir anexo PDF" style="margin-left:6px">
                  <i class="fa fa-paperclip"></i>
                </a>
              <?php endif; ?>
            </td>
            <td data-label="Propositor"><?= $r['autor_nome'] ? h($r['autor_nome']).($r['autor_partido']?' — '.h($r['autor_partido']):'') : '—' ?></td>
            <td data-label="Status"><span class="js-status"><?= h($statusTxt) ?></span></td>
            <td data-label="Ações">
              <div class="row-actions" style="display:flex; gap:10px; flex-wrap:wrap">
                <?php if($state===0): ?>
                  <a class="chip sm blue-solid js-link-act"
                     data-act="vincular"
                     data-url="/arapiraca/actions.php?op=mat_vincular&id=<?= (int)$r['id'] ?>">
                    <i class="fa fa-link"></i> Vincular
                  </a>
                <?php elseif($state===1): ?>
                  <a class="chip sm amber js-link-act"
                     data-act="desvincular"
                     data-url="/arapiraca/actions.php?op=mat_desvincular&id=<?= (int)$r['id'] ?>">
                    <i class="fa fa-link-slash"></i> Desvincular
                  </a>
                <?php else: ?>
                  <span class="chip sm gray" title="Somente vínculos finalizados">
                    <i class="fa fa-circle-info"></i> Já vinculada (finalizada)
                  </span>
                <?php endif; ?>

                <button class="chip sm blue-outline btn-edit" type="button">
                  <i class="fa fa-pen"></i> Editar
                </button>

                <a class="chip sm red" href="/arapiraca/actions.php?op=mat_excluir&id=<?= (int)$r['id'] ?>"
                   onclick="return confirm('Excluir esta matéria?');">
                  <i class="fa fa-trash"></i> Excluir
                </a>
              </div>
            </td>
          </tr>
        <?php endforeach; endif; ?>
        </tbody>
      </table>
    </div>
  </div>
</div>

<!-- ============ MODAL: NOVA/EDITAR MATÉRIA ============ -->
<div class="modal" id="modalMat" aria-hidden="true" role="dialog" aria-modal="true">
  <div class="overlay" data-close></div>
  <div class="card" role="document" aria-labelledby="modalTitleMateria">
    <div class="hd">
      <h3 id="modalTitleMateria" style="margin:0"><i class="fa fa-file-circle-plus"></i> <span id="modalTitleText">Nova matéria</span></h3>
      <button class="close" type="button" aria-label="Fechar" data-close>&times;</button>
    </div>
    <div class="bd">
      <form method="post" action="/arapiraca/actions.php?op=mat_salvar" enctype="multipart/form-data" id="formMat">
        <input type="hidden" name="id" id="m_id">
        <!-- compat. com backend -->
        <input type="hidden" name="autor_id" id="m_autor_hidden">

        <div class="form-row">
          <div>
            <label>Título</label>
            <input name="titulo" id="m_titulo" required>
          </div>
          <div>
            <label>Tipo</label>
            <select name="tipo" id="m_tipo">
              <?php foreach($tipos_pre as $t): ?>
                <option value="<?= h($t) ?>"><?= h($t) ?></option>
              <?php endforeach; ?>
            </select>
          </div>
        </div>

        <div class="form-row2">
          <div>
            <label>Número</label>
            <input name="numero" id="m_numero">
          </div>
          <div>
            <label>Ano</label>
            <input type="number" name="ano" id="m_ano" value="<?= (int)date('Y') ?>">
          </div>
          <div>
            <!-- multi-select de proponentes -->
            <label>Proponentes (vereador/proponente)</label>
            <select id="m_autores" name="autor_ids[]" multiple size="6" required title="Segure Ctrl/Cmd para múltiplos">
              <?php foreach($autores as $a): ?>
                <?php $tag = (strtolower($a['tipo_usuario'])==='proponente') ? ' — PROPONENTE' : ''; ?>
                <option value="<?= (int)$a['id'] ?>">
                  <?= h($a['nome']) ?><?= $a['partido'] ? ' — '.h($a['partido']) : '' ?><?= $tag ?>
                </option>
              <?php endforeach; ?>
            </select>
            <div class="muted" style="font-size:.9rem;margin-top:6px">
              O <strong>primeiro</strong> selecionado será o autor principal; os demais entram como <em>coautores</em> ao final da descrição.
            </div>
          </div>
        </div>

        <label style="margin-top:12px">Descrição (ementa / artigos)</label>
        <textarea name="descricao" id="m_descricao" placeholder="Resumo/ementa ou o texto da proposição..."></textarea>

        <!-- Upload PDF -->
        <div style="margin-top:12px">
          <label>Anexo (PDF)</label>
          <input type="file" name="anexo_pdf" id="m_pdf" accept="application/pdf,.pdf">
          <div class="muted" style="font-size:.9rem;margin-top:4px">Opcional. Somente PDF, até 10&nbsp;MB.</div>
        </div>

        <div class="form-row" style="margin-top:12px">
          <div>
            <label>Vincular à sessão (opcional)</label>
            <select name="sessao_id" id="m_sessao">
              <option value="0" selected>— Sem sessão (apenas cadastrar)</option>
              <?php foreach($sessoes_ativas as $s): ?>
                <option value="<?= (int)$s['id'] ?>">#<?= (int)$s['id'] ?> — <?= h($s['tipo']) ?> nº <?= h($s['numero']) ?> — <?= h($s['data_fmt']) ?></option>
              <?php endforeach; ?>
            </select>
            <div class="muted" style="font-size:.9rem;margin-top:6px">Se escolher uma sessão ativa, criaremos o vínculo (status “aguardando”).</div>
          </div>
          <div></div>
        </div>

        <div style="margin-top:16px; display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap">
          <button class="chip sm gray" type="button" data-close><i class="fa fa-xmark"></i> Cancelar</button>
          <button class="chip sm blue-solid" type="submit">
            <i class="fa fa-save"></i> Salvar
          </button>
        </div>
      </form>
    </div>
  </div>
</div>

<script>
const toast = document.getElementById('toast'); if (toast){ setTimeout(()=> toast.remove(), 2500); }
const toastDyn = document.getElementById('toastDyn');
function showToast(msg){ if(!toastDyn) return; toastDyn.textContent = msg; toastDyn.classList.add('show'); setTimeout(()=>toastDyn.classList.remove('show'), 2000); }

function wireModal(modalEl, opener){
  const closeEls = modalEl.querySelectorAll('[data-close], .overlay');
  function open(){ modalEl.classList.add('open'); modalEl.setAttribute('aria-hidden','false'); document.body.style.overflow='hidden'; }
  function close(){ modalEl.classList.remove('open'); modalEl.setAttribute('aria-hidden','true'); document.body.style.overflow=''; }
  opener?.addEventListener('click', open);
  closeEls.forEach(el => el.addEventListener('click', close));
  document.addEventListener('keydown', (e)=>{ if (e.key==='Escape' && modalEl.classList.contains('open')) close(); });
  return { open, close };
}

const modal = document.getElementById('modalMat');
const btnNova = document.getElementById('btnNova');
const m = wireModal(modal, btnNova);

/* util para limpar multi-select */
function clearMulti(sel){ [...sel.options].forEach(o => o.selected = false); }

/* abrir NOVA */
btnNova?.addEventListener('click', () => {
  document.getElementById('modalTitleText').textContent = 'Nova matéria';
  document.getElementById('m_id').value = '';
  document.getElementById('m_titulo').value = '';
  document.getElementById('m_numero').value = '';
  document.getElementById('m_ano').value = new Date().getFullYear();
  document.getElementById('m_descricao').value = '';
  document.getElementById('m_sessao').value = '0';
  const tipoSel = document.getElementById('m_tipo'); if (tipoSel) tipoSel.selectedIndex = 0;
  document.getElementById('m_autor_hidden').value = '';
  clearMulti(document.getElementById('m_autores'));
  m.open();
});

/* EDITAR (preenche pelos data-*) */
document.querySelectorAll('.btn-edit').forEach(btn=>{
  btn.addEventListener('click', e=>{
    const tr = e.currentTarget.closest('tr');
    if (!tr) return;

    document.getElementById('modalTitleText').textContent = 'Editar matéria';
    document.getElementById('m_id').value       = tr.dataset.id || '';
    document.getElementById('m_titulo').value   = tr.dataset.titulo || '';
    document.getElementById('m_numero').value   = tr.dataset.numero || '';
    document.getElementById('m_ano').value      = tr.dataset.ano || new Date().getFullYear();
    document.getElementById('m_descricao').value= tr.dataset.descricao || '';
    document.getElementById('m_sessao').value   = '0';

    const tipoSel = document.getElementById('m_tipo');
    [...tipoSel.options].forEach(o => { o.selected = (o.value === (tr.dataset.tipo||'')); });

    // Seleciona o autor principal no multi (não temos coautores salvos)
    const autoresSel = document.getElementById('m_autores');
    clearMulti(autoresSel);
    let found = false;
    const autorNome = (tr.dataset.autor_nome||'').trim();
    if (autorNome) {
      [...autoresSel.options].forEach(o => {
        if (!found && o.textContent.trim().startsWith(autorNome)) { o.selected = true; found = true; }
      });
    }
    document.getElementById('m_autor_hidden').value = ''; // será definido no submit

    m.open();
  });
});

/* antes de enviar, define autor_id (primeiro selecionado) e monta coautores na descrição */
document.getElementById('formMat').addEventListener('submit', function(ev){
  const sel = document.getElementById('m_autores');
  const hidden = document.getElementById('m_autor_hidden');
  const desc = document.getElementById('m_descricao');

  const chosen = [...sel.options].filter(o => o.selected).map(o => ({id:o.value, label:o.textContent.trim()}));
  if (chosen.length === 0) {
    ev.preventDefault();
    alert('Selecione ao menos um proponente.');
    sel.focus();
    return false;
  }

  hidden.value = chosen[0].id;

  if (chosen.length > 1) {
    const coautores = chosen.slice(1).map(x => x.label.replace(/\s*—\s*PROPONENTE$/i,'')).join('; ');
    const marker = 'Coautores:';
    let txt = desc.value || '';
    txt = txt.replace(/\n{0,2}Coautores:\s*[^\n]*$/i, '');
    desc.value = (txt ? (txt + "\n\n") : '') + marker + ' ' + coautores;
  }
});

/* ===================== AJAX vincular / desvincular ===================== */
const STATUS_TXT = {
  0: 'Aberta',
  1: 'Vinculada (não finalizada)',
  2: 'Vinculada (finalizada)'
};

function renderActionsForState(id, state){
  if (state === 0){
    return `<a class="chip sm blue-solid js-link-act" data-act="vincular" data-url="/arapiraca/actions.php?op=mat_vincular&id=${id}">
              <i class="fa fa-link"></i> Vincular
            </a>`;
  } else if (state === 1){
    return `<a class="chip sm amber js-link-act" data-act="desvincular" data-url="/arapiraca/actions.php?op=mat_desvincular&id=${id}">
              <i class="fa fa-link-slash"></i> Desvincular
            </a>`;
  }
  return `<span class="chip sm gray" title="Somente vínculos finalizados">
            <i class="fa fa-circle-info"></i> Já vinculada (finalizada)
          </span>`;
}

function setRowState(tr, state){
  tr.dataset.state = String(state);
  const id = tr.dataset.id;
  const statusEl = tr.querySelector('.js-status');
  const actionsBox = tr.querySelector('.row-actions');
  if (statusEl) statusEl.textContent = STATUS_TXT[state] || '—';
  if (actionsBox){
    const other = [...actionsBox.children].filter(n => !n.classList.contains('js-link-act') && !(n.matches('span.chip.gray')));
    actionsBox.innerHTML = renderActionsForState(id, state);
    other.forEach(n => actionsBox.appendChild(n));
  }
}

document.addEventListener('click', async (ev) => {
  const a = ev.target.closest('.js-link-act');
  if (!a) return;
  ev.preventDefault();

  const tr = a.closest('tr');
  if (!tr) return;

  const act = a.dataset.act; // 'vincular' | 'desvincular'
  const url = a.dataset.url; // /arapiraca/actions.php?op=...
  if (!url) return;

  a.style.opacity = '.6'; a.style.pointerEvents = 'none';

  try{
    const finalUrl = url + (url.includes('?') ? '&' : '?') + 'ajax=1';
    const r = await fetch(finalUrl, { method:'GET', credentials:'same-origin', cache:'no-store' });

    let newState = null;
    const ct = r.headers.get('content-type') || '';
    if (ct.includes('application/json')) {
      const data = await r.json().catch(()=>null);
      if (data && data.ok && typeof data.state !== 'undefined') newState = Number(data.state);
      else if (data && data.ok) newState = (act === 'vincular') ? 1 : 0;
      else if (data && data.msg){ throw new Error(data.msg); }
    } else {
      // fallback otimista
      newState = (act === 'vincular') ? 1 : 0;
    }

    setRowState(tr, newState);
    showToast(act === 'vincular' ? 'Vinculado com sucesso.' : 'Desvinculado com sucesso.');
  }catch(e){
    console.error(e);
    alert('Não foi possível completar a ação agora. Tente novamente.');
  }finally{
    a.style.opacity = ''; a.style.pointerEvents = '';
  }
});
</script>

</body>
</html>
