{% extends "base.html" %}
{% from "_macros.html" import cost_centre_select with context %}
{% block title %}{{ v.number or t('Expense voucher') }}{% endblock %}
{% block content %}
<div class="page-head"><div><small><a href="{{ url_for('pettycash.fund', fid=f.id) }}">{{ nm(f) }}</a></small>
  <h1>{{ v.number or t('New expense voucher') }}</h1>
  <small>{{ t('Cash in the fund') }}: {{ balance|money(cur) }} {{ cur }} · {{ t('Dr each expense (and Input VAT) / Cr Petty Cash') }}</small></div></div>
<form method="post" class="card">
  <div class="grid">
    <div class="field"><label>{{ t('Date') }} *</label><input type="date" name="date" value="{{ v.date }}" required></div>
    <div class="field"><label>{{ t('Paid to') }}</label><input name="payee" value="{{ v.payee or '' }}" placeholder="{{ t('e.g. Panda, taxi, courier') }}"></div>
    <div class="field wide"><label>{{ t('Notes') }}</label><input name="notes" value="{{ v.notes or '' }}"></div>
  </div>
  <table style="margin-top:14px" id="pc-lines" data-tab-add="#pc-add">
    <thead><tr><th>{{ t('Expense account') }}</th><th>{{ t('Description') }}</th><th>{{ t('Receipt no.') }}</th><th class="num">{{ t('Amount before VAT') }}</th><th>{{ t('VAT') }}</th>{% if cost_centres %}<th>{{ t('Cost Centre') }}</th>{% endif %}</tr></thead>
    <tbody>
    {% for ln in lines %}
      <tr><td><select name="account_id"><option value=""></option>{% for a in accounts %}<option value="{{ a.id }}" {{ 'selected' if ln.account_id == a.id }}>{{ a.code }} {{ nm(a) }}</option>{% endfor %}</select></td>
        <td><input name="description" value="{{ ln.description or '' }}"></td><td><input name="receipt_ref" value="{{ ln.receipt_ref or '' }}" style="width:110px"></td>
        <td><input name="amount" class="num" inputmode="decimal" value="{{ ln.amount|plain if ln.amount else '' }}" style="width:120px"></td>
        <td><select name="tax_id"><option value="">{{ t('No VAT') }}</option>{% for tx in taxes %}<option value="{{ tx.id }}" {{ 'selected' if (ln.tax_id if ln.account_id else default_tax) == tx.id }}>{{ nm(tx) }}</option>{% endfor %}</select></td>
        {% if cost_centres %}<td><select name="cost_centre_id"><option value=""></option>{% for c in cost_centres %}<option value="{{ c.id }}" {{ 'selected' if ln.cost_centre_id == c.id }}>{{ c.code }}</option>{% endfor %}</select></td>{% endif %}</tr>
    {% endfor %}
    </tbody>
  </table>
  <button type="button" class="btn ghost small" id="pc-add" style="margin-top:8px" onclick="var b=document.querySelector('#pc-lines tbody'), r=b.rows[b.rows.length-1].cloneNode(true); r.querySelectorAll('input').forEach(function(i){i.value='';}); r.querySelectorAll('select').forEach(function(s){s.value='';}); b.appendChild(r); var f=r.querySelector('.cb-input')||r.querySelector('input'); setTimeout(function(){ (r.querySelector('.cb-input')||f).focus(); },0);">+ {{ t('Add line') }}</button>
  <div class="form-actions">
    <button class="btn" name="action" value="post">{{ t('Save & Post') }}</button>
    <button class="btn ghost" name="action" value="draft">{{ t('Save as Draft') }}</button>
    <a class="btn ghost" href="{{ url_for('pettycash.fund', fid=f.id) }}">{{ t('Cancel') }}</a>
  </div>
</form>
{% endblock %}