{% extends "base.html" %}
{% block title %}Приёмка — C5{% endblock %}
{% block header %}Приёмка{% endblock %}
{% block content %}
<div id="doc" class="card"><div class="loading">Загрузка…</div></div>
{% endblock %}
{% block scripts %}
<script>
  const DOC_ID = {{ doc_id }};

  // Запоминаем выбранные ячейки: item_id -> {id, address, location_id, ...}
  const picked = {};

  (async () => {
    if (!Auth.require()) return;
    const root = document.getElementById('doc');
    try {
      const doc = await api('/documents/' + DOC_ID);

      root.innerHTML = '';
      root.append(
        h('div', { class: 'row-title' }, doc.contractor || ('#' + DOC_ID)),
        h('div', { class: 'row-sub' }, 'статус: ' + doc.status),
      );

      const form = h('form', { id: 'acceptForm' });
      let hasAnyPending = false;

      for (const it of doc.items) {
        if (it.pending <= 0) continue;
        hasAnyPending = true;

        const row = h('div', { class: 'item' });
        row.append(
          h('div', { class: 'item-name' }, it.name || it.sku || ('#' + it.item_id)),
          h('div', { class: 'item-sub' },
            'заказано ' + it.qty + ' · принято ' + it.accepted_qty
            + ' · осталось ' + it.pending),
        );

        const qtyIn = h('input', {
          type: 'number', min: '0', max: String(it.pending),
          value: String(it.pending),
          name: 'qty_' + it.item_id, inputmode: 'numeric',
        });

        // Комбобокс выбора ячейки
        const pickText = h('span',
          { class: 'cell-picker-text cell-picker-empty' },
          'Не выбрана');
        const pickBtn = h('div', {
          class: 'cell-picker',
          onclick: () => {
            pickCell({
              title: 'Ячейка для: ' + (it.name || it.sku || ('#' + it.item_id)),
              selectedId: picked[it.item_id] && picked[it.item_id].id,
              initialQuery: '',
              onPick: (cell) => {
                picked[it.item_id] = cell;
                pickText.textContent = cell.address
                  + ' · ' + (cell.location_name || cell.location || ('склад ' + cell.location_id));
                pickText.classList.remove('cell-picker-empty');
              },
            });
          },
        }, pickText, h('span', { class: 'cell-picker-arrow' }, '›'));

        row.append(
          h('label', { class: 'field' }, h('span', {}, 'Принять'), qtyIn),
          h('label', { class: 'field' }, h('span', {}, 'Ячейка'), pickBtn),
        );
        form.append(row);
      }

      if (!hasAnyPending) {
        root.append(h('div', { class: 'empty' }, 'Все позиции уже приняты'));
        return;
      }

      const submit = h('button',
        { class: 'btn btn-primary', type: 'submit' }, 'Провести приёмку');
      form.append(submit);
      root.append(form);

      form.addEventListener('submit', async (e) => {
        e.preventDefault();
        const rows = [];
        for (const it of doc.items) {
          if (it.pending <= 0) continue;
          const qEl = form.querySelector('[name="qty_' + it.item_id + '"]');
          if (!qEl) continue;
          const q = parseInt(qEl.value, 10) || 0;
          if (q <= 0) continue;
          const c = picked[it.item_id];
          if (!c) {
            toast('Выберите ячейку для позиции «' + (it.name || it.sku) + '»', 'warn');
            return;
          }
          rows.push({
            item_id:     it.item_id,
            qty:         q,
            location_id: c.location_id,
            cell_id:     c.id,
          });
        }
        if (!rows.length) {
          toast('Заполните хотя бы одну строку', 'warn');
          return;
        }
        submit.disabled = true;
        try {
          await api('/documents/' + DOC_ID + '/accept', {
            method: 'POST',
            body: JSON.stringify(rows),
          });
          toast('Приёмка проведена', 'ok');
          setTimeout(() => { location.href = '/m/accept'; }, 800);
        } catch (ex) {
          toast(ex.message, 'err');
        } finally {
          submit.disabled = false;
        }
      });
    } catch (e) {
      root.innerHTML = '';
      root.append(h('div', { class: 'error' }, e.message));
    }
  })();
</script>
{% endblock %}