{% extends "base.html" %}
{% block title %}{{ t('New Transfer') }}{% endblock %}
{% block content %}
<div class="page-head"><div><small><a href="{{ url_for('transfers.index') }}">{{ t('Inter-branch Transfers') }}</a></small>
  <h1>{{ t('New Transfer') }}</h1></div></div>
<form method="post" class="card" style="max-width:900px">
  <div class="grid">
    <div class="field"><label>{{ t('Date') }} *</label><input type="date" name="date" id="date" value="{{ d.date }}" required></div>
    <div class="field"><label>{{ t('Reference') }}</label><input name="ref" value="{{ d.ref or '' }}"></div>
  </div>
  <div class="grid" style="margin-top:18px">
    <div>
      <h2>{{ t('From') }}</h2>
      <div class="field"><label>{{ t('Branch') }}</label>
        <select name="from_branch" id="from_branch">{% for b in branches.values() %}<option value="{{ b.id }}" data-cur="{{ b.currency }}" data-rate="{{ rates[b.currency] or '' }}" {{ 'selected' if d.from_branch|string == b.id|string }}>{{ b.code }} — {{ nm(b) }} ({{ b.currency }})</option>{% endfor %}</select></div><br>
      <div class="field"><label>{{ t('Bank / Cash Journal') }}</label>
        <select name="from_journal" data-branch-filter="#from_branch">{% for j in journals %}<option value="{{ j.id }}" data-branch="{{ j.branch_id }}" {{ 'selected' if d.from_journal|string == j.id|string }}>{{ j.code }} — {{ nm(j) }}</option>{% endfor %}</select></div><br>
      <div class="field"><label>{{ t('Amount sent') }} *</label><input name="amount_from" id="amount_from" class="num" inputmode="decimal" value="{{ d.amount_from or '' }}" required></div>
    </div>
    <div>
      <h2>{{ t('To') }}</h2>
      <div class="field"><label>{{ t('Branch') }}</label>
        <select name="to_branch" id="to_branch">{% for b in branches.values() %}<option value="{{ b.id }}" data-cur="{{ b.currency }}" data-rate="{{ rates[b.currency] or '' }}" {{ 'selected' if (d.to_branch|string == b.id|string) or (not d.to_branch and loop.index == 2) }}>{{ b.code }} — {{ nm(b) }} ({{ b.currency }})</option>{% endfor %}</select></div><br>
      <div class="field"><label>{{ t('Bank / Cash Journal') }}</label>
        <select name="to_journal" data-branch-filter="#to_branch">{% for j in journals %}<option value="{{ j.id }}" data-branch="{{ j.branch_id }}" {{ 'selected' if d.to_journal|string == j.id|string }}>{{ j.code }} — {{ nm(j) }}</option>{% endfor %}</select></div><br>
      <div class="field"><label>{{ t('Amount received') }}</label><input name="amount_to" id="amount_to" class="num" inputmode="decimal" value="{{ d.amount_to or '' }}">
        <div class="help">{{ t('Filled from exchange rates when currencies differ; adjust to the actual amount received.') }}</div></div>
    </div>
  </div>
  <div class="form-actions"><button class="btn">{{ t('Post Transfer') }}</button><a class="btn ghost" href="{{ url_for('transfers.index') }}">{{ t('Cancel') }}</a></div>
</form>
{% endblock %}
{% block scripts %}
<script>
(function () {
  var a = document.getElementById('amount_from'), b = document.getElementById('amount_to');
  var fb = document.getElementById('from_branch'), tb = document.getElementById('to_branch');
  var touched = false;
  b.addEventListener('input', function () { touched = true; });
  function update() {
    if (touched) return;
    var fo = fb.selectedOptions[0], to = tb.selectedOptions[0];
    var v = parseFloat((a.value || '').replace(/,/g, ''));
    if (isNaN(v)) { b.value = ''; return; }
    var rf = parseFloat(fo.dataset.rate), rt = parseFloat(to.dataset.rate);
    b.value = (fo.dataset.cur === to.dataset.cur || !rf || !rt) ? v.toFixed(2) : (v * rf / rt).toFixed(2);
  }
  [a, fb, tb].forEach(function (e) { e.addEventListener('input', update); e.addEventListener('change', update); });
})();
</script>
{% endblock %}