<%- include('../partials/header') %>
<div class="flex ic jb mb16">
  <div class="flex ic g12"><a href="/vendors" class="btn btn-ghost btn-sm"><i class="fa fa-arrow-left"></i></a>
    <div><h2 style="font-size:18px;font-weight:700"><%=vendor.name%></h2><p class="muted xs">Code: <span class="mono"><%=vendor.code%></span></p></div>
    <span class="badge badge-issued">Active</span>
  </div>
  <div class="flex g8"><a href="/purchase-bills/new" class="btn btn-primary btn-sm"><i class="fa fa-plus"></i> New Purchase Bill</a><a href="/vendors/<%=vendor.id%>/edit" class="btn btn-outline btn-sm"><i class="fa fa-pen"></i> Edit</a></div>
</div>
<div class="det-grid">
  <div class="det-box"><div class="det-box-title">Business Info</div>
    <div class="det-row"><span class="det-k">GSTIN</span><span class="det-v mono"><%=vendor.gstin||'Unregistered'%></span></div>
    <div class="det-row"><span class="det-k">PAN</span><span class="det-v mono"><%=vendor.pan||'—'%></span></div>
    <div class="det-row"><span class="det-k">Bank</span><span class="det-v"><%=vendor.bank?.bankName||'—'%></span></div>
    <div class="det-row"><span class="det-k">Account</span><span class="det-v mono"><%=vendor.bank?.accountNumber||'—'%></span></div>
    <div class="det-row"><span class="det-k">IFSC</span><span class="det-v mono"><%=vendor.bank?.ifsc||'—'%></span></div>
  </div>
  <div class="det-box"><div class="det-box-title">Contact</div>
    <div class="det-row"><span class="det-k">Address</span><span class="det-v"><%=[vendor.address?.line1,vendor.address?.city,vendor.address?.state].filter(Boolean).join(', ')||'—'%></span></div>
    <div class="det-row"><span class="det-k">Phone</span><span class="det-v"><%=vendor.contact?.phone||'—'%></span></div>
    <div class="det-row"><span class="det-k">Email</span><span class="det-v"><%=vendor.contact?.email||'—'%></span></div>
  </div>
</div>
<div class="tbl-wrap mt16">
  <div class="tbl-hdr"><span class="tbl-title">Recent Purchase Bills</span></div>
  <%if(!bills.length){%><div class="empty" style="padding:30px"><i class="fa fa-cart-arrow-down"></i><p>No bills yet</p></div>
  <%}else{%><table><thead><tr><th>Bill No.</th><th>Vendor Invoice</th><th>Date</th><th>Net Payable</th><th>Status</th></tr></thead>
  <tbody><% const moment=require('moment');bills.forEach(b=>{%><tr>
    <td><a href="/purchase-bills/<%=b.id%>" class="cacc" style="font-family:var(--mono);font-size:12px"><%=b.billNo%></a></td>
    <td class="mono sm muted"><%=b.vendorInvoiceNo||'—'%></td>
    <td class="muted sm"><%=moment(b.billDate).format('DD/MM/YYYY')%></td>
    <td class="mono fw6">₹<%=(b.netPayable||0).toFixed(2)%></td>
    <td><span class="badge badge-<%=b.status.toLowerCase()%>"><%=b.status%></span></td>
  </tr><%})%></tbody></table><%}%>
</div>
<%- include('../partials/footer') %>
