{% extends "base.html" %}
{% block title %}{{ t('ZATCA e-invoicing') }}{% endblock %}
{% block content %}
<div class="page-head">
  <div><h1>{{ t('ZATCA e-invoicing') }}</h1>
    <p class="muted" style="margin:4px 0 0">{{ t('Fatoora phase 2: invoices of Saudi branches are signed, given a QR code and cleared or reported to ZATCA.') }}</p></div>
  <div class="actions">
    {% if counts.pending %}<form method="post" action="{{ url_for('zatca.send') }}" class="inline"><button class="btn">{{ t('Send waiting documents') }} ({{ counts.pending }})</button></form>{% endif %}
  </div>
</div>

<div class="kpis">
  <div class="kpi"><div class="top"><span class="label">{{ t('Cleared (B2B)') }}</span></div><div class="value">{{ counts.cleared or 0 }}</div></div>
  <div class="kpi"><div class="top"><span class="label">{{ t('Reported (B2C)') }}</span></div><div class="value">{{ counts.reported or 0 }}</div></div>
  <div class="kpi {{ 'warn' if counts.pending }}"><div class="top"><span class="label">{{ t('Waiting to be sent') }}</span></div><div class="value">{{ counts.pending or 0 }}</div></div>
  <div class="kpi {{ 'bad' if counts.rejected }}"><div class="top"><span class="label">{{ t('Rejected') }}</span></div><div class="value">{{ counts.rejected or 0 }}</div></div>
</div>

<form class="card" method="post" action="{{ url_for('zatca.settings') }}">
  <h2>{{ t('Environment') }}</h2>
  <div class="grid">
    <div class="field"><label>{{ t('ZATCA environment') }}</label>
      <select name="env">{% for k, l in envs.items() %}<option value="{{ k }}" {{ 'selected' if k == env }}>{{ t(l) }}</option>{% endfor %}</select>
      <div class="help">{{ t('Sandbox: ZATCA developer portal, OTP 123345, nothing is legally issued. Simulation: test with your real VAT number. Production: live invoices. Each environment needs its own onboarding.') }}</div></div>
    <div class="field"><label>{{ t('Business category') }}</label><input name="industry" value="{{ c.zatca_industry or '' }}" placeholder="{{ t('e.g. Manufacturing') }}">
      <div class="help">{{ t('Written into the certificate request.') }}</div></div>
  </div>
  <div class="form-actions"><button class="btn">{{ t('Save') }}</button></div>
</form>

<div class="card">
  <h2>{{ t('How it works') }}</h2>
  <div class="zatca-steps">
    <div class="step"><b>1. {{ t('Branch details') }}</b>{{ t('VAT number, CR number and the national address (building number, street, district, city, postal code) of each Saudi branch.') }}</div>
    <div class="step"><b>2. {{ t('Onboard') }}</b>{{ t('Get a one-time password (OTP) in the Fatoora portal and enter it here. Lubwise creates the keys, passes the compliance checks and receives the certificate.') }}</div>
    <div class="step"><b>3. {{ t('Invoice as usual') }}</b>{{ t('Posting signs the invoice. B2B invoices are cleared by ZATCA at once; B2C invoices and POS receipts are reported within 24 hours.') }}</div>
    <div class="step"><b>4. {{ t('Corrections') }}</b>{{ t('An e-invoice cannot be changed or reset. Issue a credit note or debit note; they are e-invoiced the same way.') }}</div>
  </div>
</div>

{% for br in branches %}{% set b = br.b %}
<div class="card" id="b{{ b.id }}">
  <div style="display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px">
    <h2 style="margin:0">{{ b.code }} — {{ nm(b) }}</h2>
    {% if b.zatca_enabled %}<span class="badge st-posted">{{ t('E-invoicing on') }}</span>{% elif not br.saudi %}<span class="badge">{{ t('Not a Saudi branch') }}</span>{% else %}<span class="badge st-warn">{{ t('E-invoicing off') }}</span>{% endif %}
  </div>
  {% if br.saudi %}
  <form method="post" action="{{ url_for('zatca.branch', bid=b.id) }}">
    <div class="grid">
      <div class="field"><label>{{ t('VAT Number') }}</label><input name="vat_no" value="{{ b.vat_no or '' }}" inputmode="numeric" maxlength="15" placeholder="3xxxxxxxxxxxxx3"></div>
      <div class="field"><label>{{ t('CR Number') }}</label><input name="cr_no" value="{{ b.cr_no or '' }}" placeholder="{{ c.cr_no or '' }}">
        <div class="help">{{ t('Empty = the company CR number.') }}</div></div>
      <div class="field"><label>{{ t('Building number') }}</label><input name="building_no" value="{{ b.building_no or '' }}" inputmode="numeric" maxlength="4"></div>
      <div class="field"><label>{{ t('Street') }}</label><input name="street" value="{{ b.street or '' }}"></div>
      <div class="field"><label>{{ t('District') }}</label><input name="district" value="{{ b.district or '' }}"></div>
      <div class="field"><label>{{ t('City') }}</label><input name="city" value="{{ b.city or '' }}"></div>
      <div class="field"><label>{{ t('Postal code') }}</label><input name="postal_code" value="{{ b.postal_code or '' }}" inputmode="numeric" maxlength="5"></div>
      <div class="field"><label>{{ t('Additional number') }}</label><input name="additional_no" value="{{ b.additional_no or '' }}" inputmode="numeric" maxlength="4"></div>
    </div>
    {% if br.problems %}<div class="flash error">{{ icon('alert') }}<span>{{ t('Still needed') }}: {{ br.problems|join('; ') }}</span></div>{% endif %}
    <div class="form-actions">
      <label style="display:inline-flex;gap:8px;align-items:center;margin-inline-end:auto"><input type="checkbox" name="enabled" value="1" {{ 'checked' if b.zatca_enabled }}> {{ t('E-invoice this branch\'s customer invoices and POS receipts') }}</label>
      <button class="btn">{{ t('Save') }}</button>
    </div>
  </form>

  <h3 style="margin-top:20px">{{ t('E-invoicing units') }}</h3>
  <p class="muted" style="margin-top:0">{{ t('Each unit has its own certificate and invoice counter. The branch unit signs back-office invoices and, unless a register has its own, POS receipts.') }}</p>
  <table>
    <thead><tr><th>{{ t('Unit') }}</th><th>{{ t('Status') }}</th><th class="num">{{ t('Invoices signed') }}</th><th>{{ t('Certificate valid until') }}</th><th></th></tr></thead>
    <tbody>
    {% for u in br.units %}
      <tr id="u{{ u.id }}"><td><b>{{ u.name }}</b><br><small class="muted">{{ u.serial }}</small></td>
        <td>{% if u.state == 'active' %}<span class="badge st-posted">{{ t('Active') }}</span>{% elif u.state == 'compliance' %}<span class="badge st-warn">{{ t('Compliance checks') }}</span>{% else %}<span class="badge st-warn">{{ t('Not onboarded') }}</span>{% endif %}
          {% if u.last_error %}<div class="neg" style="max-width:420px;white-space:normal"><small>{{ u.last_error }}</small></div>{% endif %}</td>
        <td class="num">{{ u.icv }}</td><td>{{ u.cert_expiry or '—' }}</td>
        <td class="num">
          {% if u.state != 'active' %}
          <form method="post" action="{{ url_for('zatca.onboard', uid=u.id) }}" class="inline" style="display:inline-flex;gap:6px">
            <input name="otp" inputmode="numeric" placeholder="{{ t('OTP') }}" value="{{ '123345' if env == 'sandbox' else '' }}" style="width:110px" aria-label="{{ t('OTP') }}">
            <button class="btn">{{ t('Onboard') }}</button></form>
          {% else %}
          <form method="post" action="{{ url_for('zatca.revoke', uid=u.id) }}" class="inline" data-confirm="{{ t('Stop using this unit? Its certificate will no longer sign invoices.') }}"><button class="btn ghost">{{ t('Stop using') }}</button></form>
          {% endif %}</td></tr>
    {% else %}<tr><td colspan="5" class="empty">{{ t('No unit yet.') }}</td></tr>{% endfor %}
    </tbody>
  </table>
  <form method="post" action="{{ url_for('zatca.unit_new') }}" class="form-actions" style="justify-content:flex-start">
    <input type="hidden" name="branch_id" value="{{ b.id }}">
    {% if br.registers %}<select name="register_id" aria-label="{{ t('Register') }}"><option value="">{{ t('Branch unit') }}</option>{% for r in br.registers %}<option value="{{ r.id }}">{{ t('POS register') }}: {{ r.name }}</option>{% endfor %}</select>{% endif %}
    <button class="btn ghost">{{ icon('plus') }} {{ t('Add unit') }}</button>
  </form>
  {% else %}
  <p class="muted">{{ t('ZATCA e-invoicing applies to branches in Saudi Arabia (SAR).') }}</p>
  {% endif %}
</div>
{% endfor %}

<form class="card" method="post" action="{{ url_for('zatca.taxes') }}">
  <h2>{{ t('VAT categories') }}</h2>
  <p class="muted" style="margin-top:0">{{ t('Zero-rated, exempt and out-of-scope sales must state the reason ZATCA accepts.') }}</p>
  <table>
    <thead><tr><th>{{ t('Tax') }}</th><th class="num">{{ t('Rate %') }}</th><th>{{ t('Category') }}</th><th>{{ t('Exemption reason') }}</th></tr></thead>
    <tbody>{% for tx in taxes %}{% set cat = tx.zatca_category or ('S' if tx.rate > 0 else 'Z') %}
      <tr><td>{{ nm(tx) }}</td><td class="num">{{ '%g' % tx.rate }}</td>
        <td><select name="cat_{{ tx.id }}" aria-label="{{ t('Category') }}">{% for k, l in categories.items() %}<option value="{{ k }}" {{ 'selected' if k == cat }}>{{ k }} · {{ t(l) }}</option>{% endfor %}</select></td>
        <td><select name="reason_{{ tx.id }}" aria-label="{{ t('Exemption reason') }}"><option value="">—</option>{% for k, l in reasons.items() %}<option value="{{ k }}" {{ 'selected' if k == (tx.zatca_reason_code or ('VATEX-SA-32' if cat == 'Z' else '')) }}>{{ k }} · {{ l }}</option>{% endfor %}</select></td></tr>
    {% endfor %}</tbody>
  </table>
  <div class="form-actions"><button class="btn">{{ t('Save') }}</button></div>
</form>

<div class="card flush">
  <div class="card-h" style="display:flex;align-items:center;gap:10px;padding:14px 16px;flex-wrap:wrap">
    <h2 style="margin:0">{{ t('E-invoices') }}</h2><span style="flex:1"></span>
    <div class="tabs" style="margin:0">{% for k, l in [('attention', 'Needs attention'), ('cleared', 'Cleared'), ('reported', 'Reported'), ('all', 'All')] %}
      <a href="{{ url_for('zatca.index', status=k) }}" class="{{ 'active' if status == k }}">{{ t(l) }}</a>{% endfor %}</div>
  </div>
  <table>
    <thead><tr><th>{{ t('Document') }}</th><th>{{ t('Type') }}</th><th>{{ t('Unit') }}</th><th>{{ t('Signed at') }}</th><th class="num">{{ t('Total') }}</th><th>{{ t('Status') }}</th><th></th></tr></thead>
    <tbody>
    {% for d in docs %}
      <tr><td><a href="{{ url_for('invoices.view', inv_id=d.record_id) if d.model == 'invoice' else url_for('pos.receipt', oid=d.record_id) }}"><b>{{ d.number }}</b></a></td>
        <td>{{ t('Standard (B2B)') if d.subtype == 'standard' else t('Simplified (B2C)') }} · {{ t({'invoice': 'Invoice', 'credit': 'Credit Note', 'debit': 'Debit Note', 'prepayment': 'Advance invoice'}[d.doc_type]) }}</td>
        <td>{{ d.unit_name }}</td><td>{{ d.issued_at|replace('T', ' ') }}</td><td class="num">{{ d.total|money(d.currency) }}</td>
        <td>{% set st = {'cleared': 'st-posted', 'reported': 'st-posted', 'pending': 'st-warn', 'rejected': 'st-cancelled'}[d.status] %}<span class="badge {{ st }}">{{ t(d.status|capitalize) }}</span>
          {% if d.msgs.errors %}<div class="neg" style="white-space:normal;max-width:380px"><small>{{ d.msgs.errors|join('; ') }}</small></div>{% endif %}
          {% if d.warnings %}<small class="muted">{{ d.warnings }} {{ t('warning(s)') }}</small>{% endif %}</td>
        <td class="num" style="white-space:nowrap"><a class="btn ghost" href="{{ url_for('zatca.xml', doc_id=d.id) }}">XML</a>
          {% if d.status == 'pending' %}<form method="post" action="{{ url_for('zatca.send_one', doc_id=d.id) }}" class="inline"><button class="btn">{{ t('Send') }}</button></form>{% endif %}</td></tr>
    {% else %}<tr><td colspan="7" class="empty">{{ t('Nothing here.') }}</td></tr>{% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}