Isuru Bimsara
97 lines
2.8 KiB
HTML
97 lines
2.8 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<style>
|
|
{{styles}}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div>
|
|
<!-- PURCHASE ORDER title -->
|
|
<div class="header-section">
|
|
<div>
|
|
<img src="{{logoBase64}}" alt="Company Logo" style="height:80px; margin-bottom:-8px;" />
|
|
</div>
|
|
<div class="po-title">PRICE QUOTATION</div>
|
|
</div>
|
|
|
|
<!-- Company & supplier info (dynamic / editable) -->
|
|
<div class="info-grid">
|
|
<div class="info-left">
|
|
<div class="info-row">
|
|
<span class="info-label">VESSEL NAME :</span>
|
|
<span class="info-value" id="companyName">Oceanic Maritime Solutions (Pvt) Ltd</span>
|
|
</div>
|
|
<div class="info-row">
|
|
<span class="info-label">SUPPLY PORT :</span>
|
|
<span class="info-value" id="supplierName">Supplier Name</span>
|
|
</div>
|
|
</div>
|
|
<div class="info-right">
|
|
<div class="info-row">
|
|
<span class="info-label">CLIENT RFQ :</span>
|
|
<span class="info-value" id="rfqNum">RFQ-001</span>
|
|
</div>
|
|
<div class="info-row">
|
|
<span class="info-label">OMS RFQ :</span>
|
|
<span class="info-value" id="rfqNum">RFQ-001</span>
|
|
</div>
|
|
<div class="info-row">
|
|
<span class="info-label">DATE :</span>
|
|
<span class="info-value" id="orderDate">Current Date</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- items table: ITEM NO, DESCRIPTION, REMARKS, UNIT, QTY, UNIT PRICE, TOTAL PRICE -->
|
|
<div style="overflow-x: auto;">
|
|
<table class="items-table" id="poItemsTable">
|
|
<thead>
|
|
<tr>
|
|
<th>ITEM NO</th>
|
|
<th>DESCRIPTION</th>
|
|
<th>REMARKS</th>
|
|
<th>QTY</th>
|
|
<th>UNIT</th>
|
|
<th>UNIT PRICE</th>
|
|
<th>TOTAL PRICE</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="itemsTableBody">
|
|
{{items}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- summary: subtotal, discount, transportation, full total -->
|
|
<div class="summary-area">
|
|
<table class="summary-table" id="summaryTable">
|
|
<tr>
|
|
<td>SUB TOTAL</td>
|
|
<td id="subTotalVal">{{subtotal}}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>DISCOUNT <span style="font-weight:normal;">(%)</span>
|
|
</td>
|
|
<td id="discountAmount">{{discount}}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>ADDITIONAL CHARGES (CUSTOM/HANDLING/TRANSPORT)
|
|
</td>
|
|
<td id="transportDisplay">{{transport}}</td>
|
|
</tr>
|
|
<tr class="total-row">
|
|
<td>GRAND TOTAL</td>
|
|
<td id="fullTotalVal">{{fullTotal}}</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div class="footer-note">
|
|
<img src="https://res.cloudinary.com/dtthuvvir/image/upload/v1780748661/footer_ax2jyz.png" alt="Footer">
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html> |