{% extends "base.html" %}
{% set editable = rpt.status == 'draft' %}
{% block title %}{{ rpt.title }} — CCL Expense Reporter{% endblock %}
{% block content %}
<section class="page-head">
  <div>
    <h1>{{ rpt.title }}</h1>
    <p class="muted">{{ SITES[rpt.site]['label'] }} · {{ rpt.user.name }}
      · mileage <span class="mono">${{ '%.3f'|format(rate) }}/mile</span>
      · <span class="pill {{ rpt.status }}">{{ rpt.status }}</span></p>
  </div>
  <div class="actions">
    <a class="btn" href="{{ url_for('main.export_xlsx', report_id=rpt.id) }}">Export .xlsx</a>
    {% if editable %}
    <form method="post" action="{{ url_for('main.submit_report', report_id=rpt.id) }}">
      <input type="hidden" name="_csrf" value="{{ csrf_token }}">
      <button class="btn primary" type="submit">Submit report</button>
    </form>
    <form method="post" action="{{ url_for('main.delete_report', report_id=rpt.id) }}"
          onsubmit="return confirm('Delete this draft report and its receipts?')">
      <input type="hidden" name="_csrf" value="{{ csrf_token }}">
      <button class="btn danger" type="submit">Delete draft</button>
    </form>
    {% elif current_user.is_admin %}
    <form method="post" action="{{ url_for('main.reopen_report', report_id=rpt.id) }}">
      <input type="hidden" name="_csrf" value="{{ csrf_token }}">
      <button class="btn" type="submit">Reopen for editing</button>
    </form>
    {% endif %}
  </div>
</section>

{# ---- readiness checks (mirrors the corporate audit) ---- #}
<div class="checks">
  <div class="check-item {{ 'ok' if recon[2] else 'warn' }}">
    <strong>Schedule 1 reconciliation</strong>
    Meals &amp; entertainment on lines: <span class="mono">${{ '%.2f'|format(recon[0]) }}</span>
    · Schedule 1 detail: <span class="mono">${{ '%.2f'|format(recon[1]) }}</span>
    {% if recon[2] %}— reconciled.{% else %}— <b>${{ '%.2f'|format((recon[0]-recon[1])|abs) }} unexplained.</b>
    Every meal needs a Schedule 1 entry before submitting.{% endif %}
  </div>
  <div class="check-item {{ 'warn' if missing else 'ok' }}">
    <strong>Line completeness</strong>
    {% if missing %}{{ missing|length }} line(s) are missing a city or business purpose.
    {% else %}Every line has a date, city, and business purpose.{% endif %}
  </div>
</div>

{# =============================== LINES =============================== #}
<h2 id="lines">Expense lines</h2>
<div class="scroll-x">
<table class="table grid">
  <thead><tr>
    <th>Date</th><th>City / State</th><th>Business purpose</th>
    <th class="num">Miles</th><th class="num">Mileage</th>
    <th class="num">Air/Rail</th><th class="num">Rental</th><th class="num">Lodging</th>
    <th class="num">Bkfst</th><th class="num">Lunch</th><th class="num">Dinner</th>
    <th class="num">Entmt</th><th class="num">Phone</th><th class="num">Gas/Auto</th>
    <th>Misc</th><th class="num">Misc $</th><th class="num">Total</th><th></th>
  </tr></thead>
  <tbody>
  {% for ln in rpt.lines %}
    <tr>
      <td class="mono">{{ ln.date.strftime('%m/%d') }}</td>
      <td>{{ ln.city }}</td><td>{{ ln.purpose }}</td>
      <td class="num mono">{{ ln.miles or '' }}</td>
      <td class="num mono">{{ '%.2f'|format(ln.miles * rate) if ln.miles else '' }}</td>
      {% for f in ['air_rail','auto_rental','lodging','breakfast','lunch','dinner','entertainment','phone_internet','gas_auto'] %}
      <td class="num mono">{{ '%.2f'|format(ln[f]) if ln[f] else '' }}</td>
      {% endfor %}
      <td class="mono">{{ ln.misc_code }}</td>
      <td class="num mono">{{ '%.2f'|format(ln.misc_amount) if ln.misc_amount else '' }}</td>
      <td class="num mono strong">{{ '%.2f'|format(rpt.line_total(ln)) }}</td>
      <td>{% if editable %}
        <form method="post" action="{{ url_for('main.delete_line', report_id=rpt.id, line_id=ln.id) }}">
          <input type="hidden" name="_csrf" value="{{ csrf_token }}">
          <button class="x" title="Remove line">&times;</button>
        </form>{% endif %}</td>
    </tr>
  {% endfor %}
  </tbody>
  <tfoot><tr class="totals">
    <td colspan="3">Totals (US $)</td>
    <td class="num mono">{{ totals['miles'] or '' }}</td>
    <td class="num mono">{{ '%.2f'|format(totals['mileage_amt']) }}</td>
    {% for f in ['air_rail','auto_rental','lodging','breakfast','lunch','dinner','entertainment','phone_internet','gas_auto'] %}
    <td class="num mono">{{ '%.2f'|format(totals[f]) }}</td>
    {% endfor %}
    <td></td>
    <td class="num mono">{{ '%.2f'|format(totals['misc_amount']) }}</td>
    <td class="num mono strong">{{ '%.2f'|format(totals['grand']) }}</td><td></td>
  </tr></tfoot>
</table>
</div>

{% if editable %}
<form method="post" action="{{ url_for('main.add_line', report_id=rpt.id) }}" class="card" id="line-form">
  <input type="hidden" name="_csrf" value="{{ csrf_token }}">
  <h3>Add an expense line</h3>
  <div class="fields">
    <label>Date <input type="date" name="date" id="f-date" required></label>
    <label>City &amp; State <input name="city" id="f-city" placeholder="Hermitage, PA"></label>
    <label class="wide">Business purpose <input name="purpose" id="f-purpose" placeholder="WebCenter workflow review"></label>
    <label>Miles driven <input name="miles" inputmode="decimal" placeholder="0">
      <small>Reimbursed at ${{ '%.3f'|format(rate) }}/mi automatically</small></label>
    <label>Air &amp; rail fares <input name="air_rail" inputmode="decimal" id="f-air_rail"></label>
    <label>Auto rental <input name="auto_rental" inputmode="decimal" id="f-auto_rental"></label>
    <label>Lodging <input name="lodging" inputmode="decimal" id="f-lodging"></label>
    <label>Breakfast (incl. tips) <input name="breakfast" inputmode="decimal" id="f-breakfast"></label>
    <label>Lunch (incl. tips) <input name="lunch" inputmode="decimal" id="f-lunch"></label>
    <label>Dinner (incl. tips) <input name="dinner" inputmode="decimal" id="f-dinner"></label>
    <label>Entertainment <input name="entertainment" inputmode="decimal" id="f-entertainment"></label>
    <label>Phone / internet <input name="phone_internet" inputmode="decimal"></label>
    <label>Gas &amp; auto <input name="gas_auto" inputmode="decimal"></label>
    <label>Misc code
      <select name="misc_code">
        <option value=""></option>
        {% for code, desc in site['misc_codes'].items() %}
        <option value="{{ code }}">{{ code }} — {{ desc }}</option>
        {% endfor %}
      </select></label>
    <label>Misc amount <input name="misc_amount" inputmode="decimal" id="f-misc_amount"></label>
  </div>
  <p class="muted small">Meals and entertainment amounts must also be detailed on
  Schedule 1 below — the report can't be submitted until they reconcile.</p>
  <button class="btn primary" type="submit">Add line</button>
</form>
{% endif %}

{# ============================ SCHEDULE 1 ============================= #}
<h2 id="schedule1">Schedule 1 — meals, entertainment &amp; explained items</h2>
<p class="muted">The IRS requires who attended, their relationship to CCL, where,
and the business discussed, for every business meal or entertainment expense.
Use it also to explain miscellaneous "{{ 'O' if rpt.site == 'charlotte' else 'E' }}" items.</p>
<table class="table">
  <thead><tr><th>Date</th><th>Business purpose</th><th>Guests (incl. employees)</th>
    <th>Relationship to CCL</th><th>Venue</th><th>Type</th><th class="num">Amount</th><th></th></tr></thead>
  <tbody>
  {% for m in rpt.meals %}
    <tr>
      <td class="mono">{{ m.date.strftime('%m/%d') }}</td>
      <td>{{ m.purpose }}</td><td>{{ m.guests }}</td>
      <td>{{ m.relationship_to_ccl }}</td><td>{{ m.venue }}</td><td>{{ m.meal_type }}</td>
      <td class="num mono">{{ '%.2f'|format(m.amount) }}</td>
      <td>{% if editable %}
        <form method="post" action="{{ url_for('main.delete_meal', report_id=rpt.id, meal_id=m.id) }}">
          <input type="hidden" name="_csrf" value="{{ csrf_token }}">
          <button class="x" title="Remove entry">&times;</button>
        </form>{% endif %}</td>
    </tr>
  {% endfor %}
  </tbody>
</table>

{% if editable %}
<form method="post" action="{{ url_for('main.add_meal', report_id=rpt.id) }}" class="card">
  <input type="hidden" name="_csrf" value="{{ csrf_token }}">
  <h3>Add a Schedule 1 entry</h3>
  <div class="fields">
    <label>Date <input type="date" name="date" required></label>
    <label class="wide">Business purpose <input name="purpose" required></label>
    <label class="wide">Guests, incl. employees <input name="guests" placeholder="P. Lee, V. Povazsay"></label>
    <label>Relationship to CCL <input name="relationship" placeholder="Employees"></label>
    <label>Venue (name &amp; location) <input name="venue"></label>
    <label>Type
      <select name="meal_type">
        <option value="">— (explained misc item)</option>
        <option>Breakfast</option><option>Lunch</option><option>Dinner</option>
        <option>Entertainment</option>
      </select></label>
    <label>Amount <input name="amount" inputmode="decimal" required></label>
  </div>
  <button class="btn primary" type="submit">Add entry</button>
</form>
{% endif %}

{# ============================= RECEIPTS ============================== #}
<h2 id="receipts">Receipts</h2>
<p class="muted">Photograph a receipt or pick a PDF — text is read on your device
(nothing is sent for OCR) and the vendor, date, and total are suggested below.
Attach only originals; keep boarding passes for flights.</p>

{% if editable %}
<div class="card" id="receipt-card">
  <div class="capture-row">
    <label class="btn file-btn">
      <input type="file" id="receipt-file" accept="image/*,application/pdf" hidden>
      Choose photo or PDF
    </label>
    <label class="btn file-btn camera-only">
      <input type="file" id="receipt-camera" accept="image/*" capture="environment" hidden>
      Use camera
    </label>
    <span id="ocr-status" class="muted" role="status" aria-live="polite"></span>
  </div>
  <div id="ocr-progress" class="progress" hidden><div></div></div>
  <div class="receipt-review" id="receipt-review" hidden>
    <img id="receipt-preview" alt="Receipt preview">
    <form method="post" action="{{ url_for('main.add_receipt', report_id=rpt.id) }}"
          enctype="multipart/form-data" id="receipt-form">
      <input type="hidden" name="_csrf" value="{{ csrf_token }}">
      <input type="file" name="file" id="receipt-hidden-file" hidden>
      <input type="hidden" name="ocr_text" id="r-ocr_text">
      <label>Vendor <input name="vendor" id="r-vendor"></label>
      <label>Receipt date <input type="date" name="receipt_date" id="r-date"></label>
      <label>Total <input name="total" id="r-total" inputmode="decimal"></label>
      <p class="muted small">Check the suggested values against the receipt before saving.</p>
      <div class="actions">
        <button class="btn primary" type="submit">Save receipt</button>
        <button class="btn" type="button" id="r-copy">Copy total into line form</button>
      </div>
    </form>
  </div>
</div>
{% endif %}

{% if rpt.receipts %}
<ul class="receipt-list">
  {% for r in rpt.receipts %}
  <li>
    <a href="{{ url_for('main.receipt_file', receipt_id=r.id) }}" target="_blank" rel="noopener">
      {{ r.original_name or r.filename }}</a>
    <span class="muted">{{ r.vendor or 'vendor?' }} ·
      {{ r.receipt_date.strftime('%m/%d/%Y') if r.receipt_date else 'date?' }} ·
      <span class="mono">{{ '$%.2f'|format(r.total) if r.total is not none else 'total?' }}</span></span>
    {% if editable %}
    <form method="post" action="{{ url_for('main.delete_receipt', report_id=rpt.id, receipt_id=r.id) }}">
      <input type="hidden" name="_csrf" value="{{ csrf_token }}">
      <button class="x" title="Remove receipt">&times;</button>
    </form>
    {% endif %}
  </li>
  {% endfor %}
</ul>
{% else %}
<p class="muted">No receipts attached yet.</p>
{% endif %}
{% endblock %}

{% block scripts %}
{% if editable %}
<script src="https://cdn.jsdelivr.net/npm/tesseract.js@5/dist/tesseract.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@3.11.174/build/pdf.min.js"></script>
<script>window.pdfjsLib && (pdfjsLib.GlobalWorkerOptions.workerSrc =
  'https://cdn.jsdelivr.net/npm/pdfjs-dist@3.11.174/build/pdf.worker.min.js');</script>
<script src="{{ url_for('static', filename='ocr.js') }}"></script>
{% endif %}
{% endblock %}