{% extends "base.html" %}
{% block title %}{{ lc.number if lc and lc.number else t('New Landed Cost') }}{% endblock %}
{% block content %}
{% set bsel = (lc.branch_id if lc else default_branch)|string %}
<div class="page-head"><div><small><a href="{{ url_for('inventory.landed_costs') }}">{{ t('Landed Costs') }}</a></small>
  <h1>{{ lc.number if lc and lc.number else t('New Landed Cost') }}</h1>
  <small>{{ t('The charges are shared over the chosen receipts. The part for goods still in stock is added to their cost; the part for goods already sold goes to cost of goods sold.') }}</small></div></div>
<form method="post" class="card">
  <div class="grid">
    <div class="field"><label>{{ t('Branch') }} *</label>
      <select name="branch_id" id="lc-branch" required>{% for b in branches.values() %}<option value="{{ b.id }}" {{ 'selected' if b.id|string == bsel }}>{{ b.code }} — {{ nm(b) }}</option>{% endfor %}</select></div>
    <div class="field"><label>{{ t('Date') }} *</label><input type="date" name="date" value="{{ lc.date if lc and lc.date else today }}" required></div>
    <div class="field"><label>{{ t('Split by') }}</label>
      <select name="method"><option value="value">{{ t('Value') }}</option><option value="quantity" {{ 'selected' if lc and lc.method == 'quantity' }}>{{ t('Quantity') }}</option></select></div>
    <div class="field wide"><label>{{ t('Notes') }}</label><input name="notes" value="{{ lc.notes or '' if lc else '' }}" placeholder="{{ t('e.g. Sea freight and customs for container MSKU1234567') }}"></div>
  </div>

  <h2 style="margin-top:22px">{{ t('Charges') }}</h2>
  <table class="lines" data-lines data-mode="adjust" data-add="#add-charge">
    <thead><tr><th>{{ t('Description') }}</th><th style="width:38%">{{ t('Account') }}</th><th class="num" style="width:18%">{{ t('Amount') }}</th><th></th></tr></thead>
    <tbody>
      <tr class="tpl">
        <td><input name="description" disabled placeholder="{{ t('Freight') }}"></td>
        <td><select name="account_id" disabled>{% for a in accounts %}<option value="{{ a.id }}" {{ 'selected' if a.id == clearing }}>{{ a.code }} {{ nm(a) }}</option>{% endfor %}</select></td>
        <td><input name="amount" class="num" inputmode="decimal" disabled></td>
        <td><button type="button" class="del">×</button></td>
      </tr>
      {% for c in charges %}
      <tr>
        <td><input name="description" value="{{ c.description or '' }}"></td>
        <td><select name="account_id">{% for a in accounts %}<option value="{{ a.id }}" {{ 'selected' if a.id == c.account_id }}>{{ a.code }} {{ nm(a) }}</option>{% endfor %}</select></td>
        <td><input name="amount" class="num" inputmode="decimal" value="{{ c.amount|plain }}"></td>
        <td><button type="button" class="del">×</button></td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  <button type="button" class="btn ghost small" id="add-charge" style="margin-top:10px">+ {{ t('Add line') }}</button>
  <p class="muted"><small>{{ t('The account is where the charge was booked, normally the landed costs clearing account used on the freight or customs bill.') }}</small></p>

  <h2 style="margin-top:22px">{{ t('Receipts') }}</h2>
  <table>
    <thead><tr><th style="width:36px"></th><th>{{ t('Number') }}</th><th>{{ t('Vendor') }}</th><th>{{ t('Source Document') }}</th><th>{{ t('Date') }}</th><th class="num">{{ t('Value') }}</th></tr></thead>
    <tbody id="lc-receipts">
    {% for r in receipts %}
      <tr data-branch="{{ r.branch_id }}">
        <td><input type="checkbox" name="picking_id" value="{{ r.id }}" {{ 'checked' if r.id in chosen }}></td>
        <td><b>{{ r.number }}</b></td><td>{{ nm({'name_en': r.pname_en, 'name_ar': r.pname_ar}) if r.pname_en else '' }}</td>
        <td>{{ r.onumber or '' }}</td><td class="num">{{ r.date }}</td>
        <td class="num">{{ (r.value or 0)|money(branches[r.branch_id].currency) }}</td>
      </tr>
    {% else %}<tr><td class="empty" colspan="6">{{ t('No validated receipts yet.') }}</td></tr>{% endfor %}
    </tbody>
  </table>
  <div class="form-actions">
    <button class="btn" name="action" value="validate">{{ t('Save and Add to Cost') }}</button>
    <button class="btn ghost" name="action" value="save">{{ t('Save Draft') }}</button>
    <a class="btn ghost" href="{{ url_for('inventory.landed_costs') }}">{{ t('Cancel') }}</a>
  </div>
</form>
{% endblock %}
{% block scripts %}
<script>
(function () {
  var b = document.getElementById('lc-branch');
  function show() {
    document.querySelectorAll('#lc-receipts tr[data-branch]').forEach(function (tr) {
      var on = tr.dataset.branch === b.value;
      tr.hidden = !on;
      if (!on) tr.querySelector('input').checked = false;
    });
  }
  b.addEventListener('change', show);
  show();
})();
</script>
{% endblock %}