/**
 * groups.js — Модуль групп и карточек договоров (Фаза 2, decoupling-final-plan.md).
 * 
 * ВЫНЕСЕНО из app.js:
 *   - loadGroupsAction()        — fetch групп, сохранить в state.groups, renderGroups
 *   - renderGroups(state)       — пересобрать ВСЕ карточки групп в diffBody
 *   - renderGroupCard(g, gi)    — чистая HTML-функция: карточка необработанной группы
 *   - renderGroupCardDone(g, gi)— чистая HTML-функция: карточка обработанной группы
 * 
 * ПАТТЕРН (decoupling-final-plan.md):
 *   renderGroups пересобирает ВСЕ карточки целиком из state.groups.
 *   Готовность группы: group.compare.status === 'done' (вместо markGroupDone).
 *   Никакого window._groupsData — всё в state.groups.
 * 
 * ЗАВИСИМОСТИ:
 *   state.js     → state (центральное состояние)
 *   app_utils.js → escHtml
 */

/**
 * loadGroupsAction() — Загрузить группы с бэкенда (Фаза 2).
 * 
 * 1. fetch /api/groups?batch=...
 * 2. Сохранить в state.groups (бывший window._groupsData)
 * 3. Вызвать renderGroups(state) — пересобрать карточки
 * 
 * Вызывается из runClassify() после успешной классификации.
 */
async function loadGroupsAction() {
  var resp = await fetch(VM_API + '/api/groups?batch=' + state.batchId);
  var data = await resp.json();
  if (!data.ok || !data.groups) return;

  // Сохраняем в центральное состояние (вместо window._groupsData)
  state.groups = data.groups;

  // Пересобрать ВСЕ карточки
  renderGroups(state);

  stepDone('stepGroups');
}

/**
 * renderGroups(state) — Пересобрать ВСЕ карточки групп (Фаза 2).
 * 
 * ПЕРЕСОБИРАЕТ весь diffBody.innerHTML заново из state.groups.
 * Никакого инкрементального обновления — всегда полная перестройка.
 * 
 * Для каждой группы:
 *   - Необработанная (group.compare.status !== 'done') → renderGroupCard()
 *   - Обработанная   (group.compare.status === 'done')  → renderGroupCardDone()
 *   - Нераспознанная (contract_number === '__unresolved__') → отдельный рендер
 */
function renderGroups(state) {
  var groups = state.groups;
  if (!groups) return;

  var diffBody = document.getElementById('diffBody');
  var diffCard = document.getElementById('diffCard');
  diffCard.style.display = 'block';

  var realGroups = groups.filter(function(g) { return g.contract_number !== '__unresolved__'; });
  var unresolvedGroup = groups.find(function(g) { return g.contract_number === '__unresolved__'; });

  // Заголовок: количество групп + нераспознанные
  var html = '<div style="font-weight:600;margin-bottom:8px;">📋 Найдено групп: ' + realGroups.length +
    (unresolvedGroup ? ' | ⚠ ' + unresolvedGroup.documents.length + ' файлов не распознано' : '') +
    '</div>';

  // Нераспознанная группа — всегда первая
  if (unresolvedGroup) {
    html += renderUnresolvedCard(unresolvedGroup);
  }

  // Карточки обычных групп
  groups.forEach(function(g, gi) {
    if (g.contract_number === '__unresolved__') return;
    if (g.compare && g.compare.status === 'done') {
      html += renderGroupCardDone(g, gi);
    } else {
      html += renderGroupCard(g, gi);
    }
  });

  diffBody.innerHTML = html;

  // Один обработчик на все кнопки сравнения (event delegation не используется —
  // кнопки пересоздаются при каждом renderGroups)
  diffBody.querySelectorAll('.cmp-btn').forEach(function(btn) {
    btn.addEventListener('click', function() {
      var gi = parseInt(this.getAttribute('data-gi'));
      runCompareForGroup(gi, this);
    });
  });

  // Обработчики сворачивания для готовых карточек
  diffBody.querySelectorAll('.cmp-header').forEach(function(header) {
    var gi = parseInt(header.getAttribute('data-gi'));
    if (isNaN(gi)) return;
    header.addEventListener('click', function() {
      var body = document.getElementById('cmpBody_' + gi);
      var arrow = document.getElementById('cmpArrow_' + gi);
      if (body) {
        if (body.style.display === 'none') {
          body.style.display = 'block';
          if (arrow) arrow.textContent = '▾';
        } else {
          body.style.display = 'none';
          if (arrow) arrow.textContent = '▸';
        }
      }
    });
  });

  lucide.createIcons();
}

/**
 * renderUnresolvedCard(group) — Чистая HTML-функция: карточка нераспознанных файлов.
 * 
 * Вход:  group — { contract_number: '__unresolved__', documents: [...] }
 * Выход: HTML-строка
 */
function renderUnresolvedCard(group) {
  var docsHtml = group.documents.map(function(d) {
    // Определить причину, почему файл не попал ни в одну группу
    var reason = '';
    if (d.parent_number) {
      reason = ' — нет базового договора №' + escHtml(d.parent_number);
    } else if (d.classify_status === 'failed') {
      reason = ' — ошибка классификации: ' + escHtml(d.error_message || '?');
    } else if (!d.doc_type || d.doc_type === 'other') {
      reason = ' — тип не определён';
    } else {
      reason = ' — нет matching-договора';
    }
    return '<div style="padding:2px 0;">' +
      '<span style="color:var(--muted);">[' + escHtml(d.doc_type || '?') + ']</span> ' +
      escHtml(d.filename) +
      (d.doc_date ? ' <span style="color:var(--muted);">' + escHtml(d.doc_date) + '</span>' : '') +
      '<span style="color:var(--destructive);font-size:11px;">' + reason + '</span>' +
      '</div>';
  }).join('');

  return '<div style="border:1px solid var(--destructive);border-radius:6px;padding:10px;margin-bottom:8px;">' +
    '<div style="font-weight:600;margin-bottom:6px;">❓ Не распознано (' + group.documents.length + ' файлов)</div>' +
    '<div style="font-size:12px;">' + docsHtml + '</div>' +
    '<div style="font-size:11px;color:var(--muted);margin-top:4px;">Загрузите недостающие базовые договоры для этих номеров.</div>' +
    '</div>';
}

/**
 * renderGroupCard(group, gi) — Чистая HTML-функция: необработанная группа (Фаза 2).
 * 
 * Показывает: номер договора, контрагента, список документов, кнопку «Сравнить».
 * Если группа в процессе сравнения (group.compare.status === 'running') — кнопка disabled.
 * 
 * Вход:  group — элемент state.groups
 *        gi    — индекс группы (для data-gi атрибута кнопки)
 * Выход: HTML-строка
 */
function renderGroupCard(group, gi) {
  var isRunning = group.compare && group.compare.status === 'running';

  var html = '<div style="border:1px solid var(--brand-gray);border-radius:6px;padding:10px;margin-bottom:8px;">' +
    '<div class="cmp-header" style="font-weight:600;margin-bottom:6px;">' +
    '📄 Договор №' + escHtml(group.contract_number || '?') + ' — ' + escHtml(group.counterparty || 'контрагент не определён') +
    '</div>' +
    '<div style="font-size:12px;">' +
    group.documents.map(function(d) {
      var typeLabel = {contract: 'договор', supplement: 'допсоглашение', specification: 'спецификация'}[d.doc_type] || d.doc_type;
      return '<div style="padding:2px 0;">' +
        '<span style="color:var(--muted);">' + escHtml(typeLabel || '?') + '</span> ' +
        escHtml(d.filename) +
        (d.zip_source ? ' <span style="color:var(--brand-gray);font-size:10px;">[' + escHtml(d.zip_source) + ']</span>' : '') +
        (d.doc_date ? ' <span style="color:var(--muted);">' + escHtml(d.doc_date) + '</span>' : '') +
        '</div>';
    }).join('') + '</div>' +
    '<button class="btn btn-primary cmp-btn" style="margin-top:6px;font-size:12px;height:28px;" data-gi="' + gi + '"' +
    (isRunning ? ' disabled' : '') + '>▶ Сравнить эту группу</button>' +
    '</div>';

  return html;
}

/**
 * renderGroupCardDone(group, gi) — Чистая HTML-функция: обработанная группа (Фаза 2).
 * 
 * Показывает: ✓ Готово (время), список документов (кликабельные — раскрывают секции),
 * тело сравнения (cmpBody) — сворачивается по клику на заголовок.
 * 
 * Вход:  group — элемент state.groups (group.compare.status === 'done')
 *        gi    — индекс группы
 * Выход: HTML-строка
 * 
 * ЗАМЕНЯЕТ удалённую markGroupDone().
 * Готовность определяется по group.compare.status, а не по наличию кнопки.
 */
function renderGroupCardDone(group, gi) {
  var time = group.compare.totalTime || '?с';
  var bodyHTML = group.compare.bodyHTML || '';

  var html = '<div style="border:1px solid var(--brand-gray);border-radius:6px;padding:10px;margin-bottom:8px;">' +
    '<div class="cmp-header" style="font-weight:600;margin-bottom:6px;cursor:pointer;" data-gi="' + gi + '">' +
    '<span class="cmp-arrow" id="cmpArrow_' + gi + '" style="font-size:10px;margin-right:4px;">▾</span>' +
    '📄 Договор №' + escHtml(group.contract_number || '?') + ' — ' + escHtml(group.counterparty || 'контрагент не определён') +
    ' <span style="font-weight:400;color:var(--green);font-size:11px;">✓ Готово (' + time + ')</span>' +
    '</div>' +
    '<div style="font-size:12px;">' +
    group.documents.map(function(d, di) {
      var typeLabel = {contract: 'договор', supplement: 'допсоглашение', specification: 'спецификация'}[d.doc_type] || d.doc_type;
      return '<div style="padding:2px 0;cursor:pointer;" onclick="var b=document.querySelectorAll(\'#cmpBody_' + gi + ' .diff-section-body\');if(b[' + di + '])b[' + di + '].style.display=b[' + di + '].style.display===\'none\'?\'block\':\'none\';">' +
        '<span style="color:var(--muted);">' + escHtml(typeLabel || '?') + '</span> ' +
        escHtml(d.filename) +
        (d.zip_source ? ' <span style="color:var(--brand-gray);font-size:10px;">[' + escHtml(d.zip_source) + ']</span>' : '') +
        (d.doc_date ? ' <span style="color:var(--muted);">' + escHtml(d.doc_date) + '</span>' : '') +
        '</div>';
    }).join('') + '</div>' +
    '<div class="cmp-body" id="cmpBody_' + gi + '" style="margin-top:8px;">' + bodyHTML + '</div>' +
    '</div>';

  return html;
}