{% extends "base.html" %}
{% block title %}{{ t(info.label) }}{% endblock %}
{% from "_macros.html" import project_field with context %}
{% block content %}
{% set cur_branch = (doc.branch_id if doc else default_branch)|string %}
<div class="page-head">
  <div><small><a href="{{ url_for('procurement.' ~ kind ~ '_list') }}">{{ t(info.title) }}</a></small>
  <h1>{{ doc.number if doc else t('New ' ~ info.label) }}</h1></div>
</div>
<form method="post" class="card">
  <div class="grid">
    <div class="field"><label>{{ t('Branch') }} *</label>
      <select name="branch_id" id="branch" required>
        {% for b in branches.values() %}<option value="{{ b.id }}" {{ 'selected' if b.id|string == cur_branch }}>{{ b.code }} — {{ nm(b) }}</option>{% endfor %}
      </select></div>
    {% if kind == 'mr' and has('inventory') %}
    <div class="field"><label>{{ t('Warehouse') }}</label>
      <select name="warehouse_id" data-branch-filter="#branch">
        {% for w in warehouses %}<option value="{{ w.id }}" data-branch="{{ w.branch_id }}" {{ 'selected' if doc and doc.warehouse_id == w.id }}>{{ w.code }} — {{ nm(w) }}</option>{% endfor %}
      </select></div>
    {% endif %}
    {{ project_field(projects, doc.project_id if doc else project_pre, t('Stock issued on this request is charged to the project. The project manager approves first.') if kind == 'mr' else None) }}
    <div class="field"><label>{{ t('Department') }}</label><input name="department" value="{{ doc.department or '' if doc else '' }}" placeholder="{{ t('e.g. Operations') }}"></div>
    <div class="field"><label>{{ t('Date') }} *</label><input type="date" name="date" value="{{ doc.date if doc else today }}" required></div>
    <div class="field"><label>{{ t('Required by') }}</label><input type="date" name="required_date" value="{{ doc.required_date or '' if doc else required }}"></div>
    <div class="field wide"><label>{{ t('Purpose') if kind == 'mr' else t('Justification') }}</label>
      <textarea name="{{ 'purpose' if kind == 'mr' else 'justification' }}">{{ (doc.purpose if kind == 'mr' else doc.justification) or '' if doc else '' }}</textarea></div>
  </div>
  <h2 style="margin-top:22px">{{ t('Lines') }}</h2>
  <div style="overflow-x:auto">
  <table class="lines" data-lines data-mode="adjust" data-add="#add-line">
    <thead><tr><th style="width:28%">{{ t('Product') }}</th><th>{{ t('Description') }}</th><th class="num" style="width:10%">{{ t('Qty') }}</th>
      {% if kind == 'pr' %}<th class="num" style="width:13%">{{ t('Estimated Price') }}</th><th style="width:20%">{{ t('Suggested Vendor') }}</th>{% endif %}<th></th></tr></thead>
    <tbody>
      {% macro line_row(ln, tpl=False) %}
      <tr class="{{ 'tpl' if tpl }}">
        <td><select name="product_id" {{ 'disabled' if tpl }}><option value=""></option>
          {% for p in products %}<option value="{{ p.id }}" data-desc="{{ nm(p) }}" data-price="{{ p.purchase_price|plain }}" {{ 'selected' if ln and ln.product_id == p.id }}>{{ p.code ~ ' ' if p.code }}{{ nm(p) }}</option>{% endfor %}</select></td>
        <td><input name="description" value="{{ ln.description or '' if ln else '' }}" {{ 'disabled' if tpl }}></td>
        <td><input name="quantity" class="num" inputmode="decimal" value="{{ ('%g' % ln.quantity) if ln else 1 }}" {{ 'disabled' if tpl }}></td>
        {% if kind == 'pr' %}
        <td><input name="est_price" class="num" inputmode="decimal" value="{{ ln.est_price|plain if ln else '' }}" {{ 'disabled' if tpl }}></td>
        <td><select name="vendor_id" {{ 'disabled' if tpl }}><option value=""></option>
          {% for v in vendors %}<option value="{{ v.id }}" {{ 'selected' if ln and ln.vendor_id == v.id }}>{{ nm(v) }}</option>{% endfor %}</select></td>
        {% endif %}
        <td><button type="button" class="del">×</button></td>
      </tr>
      {% endmacro %}
      {{ line_row(none, True) }}
      {% for ln in lines %}{{ line_row(ln) }}{% endfor %}
    </tbody>
  </table>
  </div>
  <button type="button" class="btn ghost small" id="add-line" style="margin-top:10px">+ {{ t('Add line') }}</button>
  <div class="form-actions">
    <button class="btn" name="action" value="submit">{{ t('Save & Submit for Approval') }}</button>
    <button class="btn ghost" name="action" value="draft">{{ t('Save as Draft') }}</button>
    <a class="btn ghost" href="{{ url_for('procurement.' ~ kind ~ '_view', doc_id=doc.id) if doc else url_for('procurement.' ~ kind ~ '_list') }}">{{ t('Cancel') }}</a>
  </div>
</form>
{% endblock %}
{% block scripts %}
<script>
document.addEventListener('change', function (e) {
  if (!e.target.matches('select[name=product_id]')) return;
  var o = e.target.selectedOptions[0], tr = e.target.closest('tr');
  if (!o || !o.value) return;
  var d = tr.querySelector('[name=description]'); if (d && !d.value) d.value = o.dataset.desc;
  var p = tr.querySelector('[name=est_price]'); if (p && !p.value) p.value = o.dataset.price;
});
</script>
{% endblock %}