<%- include('../../partials/header') %>
<div class="flex ic jb mb16">
  <div class="flex ic g12"><a href="/purchase-bills" class="btn btn-ghost btn-sm"><i class="fa fa-arrow-left"></i></a>
    <div><h2 style="font-size:18px;font-weight:700;font-family:var(--mono)"><%= bill.billNo %></h2><p class="muted xs">Vendor Invoice: <span class="mono"><%= bill.vendorInvoiceNo||'—' %></span></p></div>
    <span class="badge badge-<%= bill.status.toLowerCase() %>" style="font-size:13px;padding:4px 12px"><%= bill.status %></span>
  </div>
  <div class="flex g8">
    <a href="/purchase-bills/<%= bill.id %>/print" target="_blank" class="btn btn-outline btn-sm"><i class="fa fa-print"></i> Print</a>
    <% if(bill.status!=='Cancelled'){%>
    <button class="btn btn-amber btn-sm" onclick="openModal('payModal')"><i class="fa fa-money-bill"></i> Payment</button>
    <a href="/purchase-bills/<%= bill.id %>/edit" class="btn btn-outline btn-sm"><i class="fa fa-pen"></i> Edit</a>
    <form action="/purchase-bills/<%= bill.id %>/cancel" method="POST" style="display:inline"><button type="submit" class="btn btn-danger btn-sm" onclick="return confirm('Cancel?')"><i class="fa fa-ban"></i></button></form>
    <%}%>
  </div>
</div>
<div class="meta-bar">
  <div class="meta-item"><div class="mk">Bill Date</div><div class="mv"><%= moment(bill.billDate).format('DD/MM/YYYY') %></div></div>
  <div class="meta-div"></div>
  <div class="meta-item"><div class="mk">Payment Terms</div><div class="mv"><%= bill.paymentTerms||45 %> Days</div></div>
  <div class="meta-div"></div>
  <% if(bill.eWayBillNo){%><div class="meta-item"><div class="mk">EWB No.</div><div class="mv cg mono"><%= bill.eWayBillNo %></div></div><div class="meta-div"></div><%}%>
  <div class="meta-item"><div class="mk">Net Payable</div><div class="mv cacc">₹<%= (bill.netPayable||0).toFixed(2) %></div></div>
  <div class="meta-div"></div>
  <div class="meta-item"><div class="mk">Balance Due</div><div class="mv <%= ((bill.netPayable||0)-(bill.paidAmount||0))>0?'cr':'cg' %>">₹<%= ((bill.netPayable||0)-(bill.paidAmount||0)).toFixed(2) %></div></div>
</div>
<div class="det-grid">
  <div class="det-box"><div class="det-box-title">Vendor</div>
    <div style="font-weight:600;color:var(--text);font-size:14px;margin-bottom:8px"><%= bill.billedFrom?.name %></div>
    <div class="det-row"><span class="det-k">GSTIN</span><span class="det-v mono"><%= bill.billedFrom?.gstin||'Unregistered' %></span></div>
    <div class="det-row"><span class="det-k">Address</span><span class="det-v"><%= [bill.billedFrom?.address,bill.billedFrom?.city,bill.billedFrom?.state].filter(Boolean).join(', ') %></span></div>
    <div class="det-row"><span class="det-k">Phone</span><span class="det-v"><%= bill.billedFrom?.phone||'—' %></span></div>
  </div>
  <div class="det-box"><div class="det-box-title">Transport & System</div>
    <div class="det-row"><span class="det-k">Mode</span><span class="det-v"><%= bill.transport?.mode||'BY ROAD' %></span></div>
    <div class="det-row"><span class="det-k">Vehicle No.</span><span class="det-v mono"><%= bill.transport?.vehicleNo||'—' %></span></div>
    <% if(bill.eWayBillNo){%><div class="det-row"><span class="det-k">EWB No.</span><span class="det-v mono cg"><%= bill.eWayBillNo %></span></div><%}%>
    <div class="det-row"><span class="det-k">Created By</span><span class="det-v"><%= bill.createdBy?.name||'System' %></span></div>
  </div>
</div>
<div class="tbl-wrap mb16 mt16"><div class="tbl-hdr"><span class="tbl-title">Line Items</span></div>
<table><thead><tr><th>#</th><th>Particulars</th><th>HSN</th><th>Qty</th><th>Unit</th><th class="tr">Rate</th><th class="tr">Amount</th><th class="tr">GST%</th><th class="tr">GST Amt</th><th class="tr">Total</th></tr></thead>
<tbody><% bill.lineItems.forEach(item=>{%><tr><td class="muted"><%= item.srNo %></td><td class="fw6"><%= item.particulars %></td><td class="mono sm"><%= item.hsnCode||'—' %></td><td class="mono"><%= item.qty %></td><td class="muted"><%= item.unit||'NOS' %></td><td class="mono tr">₹<%= (item.rate||0).toFixed(2) %></td><td class="mono tr">₹<%= (item.amount||0).toFixed(2) %></td><td class="tr"><%= item.gstRate %>%</td><td class="mono tr">₹<%= (item.gstAmt||0).toFixed(2) %></td><td class="mono fw6 tr">₹<%= (item.total||0).toFixed(2) %></td></tr><%})%></tbody>
</table></div>
<div style="display:flex;justify-content:flex-end;margin-bottom:20px">
  <div class="totals-box">
    <div class="tot-row"><span class="lbl">Taxable Amount</span><span class="val">₹<%= (bill.taxableAmount||0).toFixed(2) %></span></div>
    <div class="tot-row"><span class="lbl">CGST</span><span class="val">₹<%= (bill.cgstAmount||0).toFixed(2) %></span></div>
    <div class="tot-row"><span class="lbl">SGST</span><span class="val">₹<%= (bill.sgstAmount||0).toFixed(2) %></span></div>
    <div class="tot-row"><span class="lbl">Total GST</span><span class="val">₹<%= (bill.totalGst||0).toFixed(2) %></span></div>
    <div class="tot-row"><span class="lbl">Round Off</span><span class="val">₹<%= (bill.roundOff||0).toFixed(2) %></span></div>
    <div class="tot-row grand divider"><span class="lbl">Net Payable</span><span class="val cacc">₹<%= (bill.netPayable||0).toFixed(2) %></span></div>
    <div class="tot-row"><span class="lbl">Paid</span><span class="val cg">₹<%= (bill.paidAmount||0).toFixed(2) %></span></div>
    <div class="tot-row divider"><span class="lbl" style="font-weight:700">Balance Due</span><span class="val" style="font-weight:700">₹<%= ((bill.netPayable||0)-(bill.paidAmount||0)).toFixed(2) %></span></div>
  </div>
</div>
<div style="background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:12px 16px;margin-bottom:20px"><span class="muted xs" style="font-weight:600">AMOUNT IN WORDS: </span><span style="font-size:13px;font-style:italic"><%= bill.amountInWords %></span></div>
<% if(bill.payments&&bill.payments.length>0){%><div class="tbl-wrap mb16"><div class="tbl-hdr"><span class="tbl-title">Payment History</span></div><table><thead><tr><th>Date</th><th>Amount</th><th>Mode</th><th>Reference</th></tr></thead><tbody><% bill.payments.forEach(p=>{%><tr><td><%= moment(p.date).format('DD/MM/YYYY') %></td><td class="mono fw6 cg">₹<%= (p.amount||0).toFixed(2) %></td><td><%= p.mode||'—' %></td><td class="mono sm"><%= p.reference||'—' %></td></tr><%})%></tbody></table></div><%}%>
<div class="modal-ov" id="payModal"><div class="modal"><div class="modal-title"><i class="fa fa-money-bill cacc"></i> Record Payment</div>
  <form action="/purchase-bills/<%= bill.id %>/payment" method="POST">
    <div class="form-grid form-grid-2">
      <div class="form-group"><label>Amount *</label><input type="number" name="amount" step="0.01" required value="<%= ((bill.netPayable||0)-(bill.paidAmount||0)).toFixed(2) %>"></div>
      <div class="form-group"><label>Mode</label><select name="mode"><option>Bank Transfer</option><option>NEFT</option><option>RTGS</option><option>IMPS</option><option>Cheque</option><option>Cash</option><option>UPI</option></select></div>
      <div class="form-group"><label>Reference / UTR</label><input type="text" name="reference" placeholder="UTR / Cheque No."></div>
      <div class="form-group"><label>Notes</label><input type="text" name="notes"></div>
    </div>
    <div class="modal-foot"><button type="button" class="btn btn-outline" onclick="closeModal('payModal')">Cancel</button><button type="submit" class="btn btn-primary"><i class="fa fa-check"></i> Record</button></div>
  </form>
</div></div>
<%- include('../../partials/footer') %>
