aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--src/classes/invoice_item.ts2
-rw-r--r--src/components/invoice_items_table.vue30
-rw-r--r--src/views/ViewInvoice.vue8
3 files changed, 29 insertions, 11 deletions
diff --git a/src/classes/invoice_item.ts b/src/classes/invoice_item.ts
index dcb917a..c3da433 100644
--- a/src/classes/invoice_item.ts
+++ b/src/classes/invoice_item.ts
@@ -37,6 +37,6 @@ export const calculate = (items: InvoiceItem[]) => items.map((x: InvoiceItem) =>
, GSTValue: gstValue
, TotalGSTValue: totalGSTValue
, AmountWithoutGST: amountWithoutGST
- , TotalAmount: amountWithoutGST.add(totalGSTValue)
+ , TotalAmount: amountWithoutGST.multiply(gstPercentage).divide(100).add(amountWithoutGST)
})
})
diff --git a/src/components/invoice_items_table.vue b/src/components/invoice_items_table.vue
index 285f990..ad1bf94 100644
--- a/src/components/invoice_items_table.vue
+++ b/src/components/invoice_items_table.vue
@@ -32,12 +32,12 @@ const handleDelete = async (id) => {
<tr>
<th scope="col">#</th>
<th scope="col">Item Name</th>
- <th scope="col">Description</th>
- <th scope="col">Brand</th>
+ <th v-if="!props.preview" scope="col">Brand</th>
<th scope="col">HSN</th>
<th scope="col">Unit Price</th>
- <th scope="col">GST <span class="sup text-muted">%</span></th>
- <th scope="col">Quantity <span class="sup text-muted">Unit</span></th>
+ <th v-if="props.preview" scope="col">Taxable Value</th>
+ <th scope="col">GST</th>
+ <th scope="col">Quantity</th>
<th scope="col">Amount</th>
<th v-if="!props.preview" scope="col" class="table-action-column">
@@ -53,16 +53,24 @@ const handleDelete = async (id) => {
<tbody>
<tr v-for="(item, index) in props.items" :key="item['id']">
<td scope="row">{{ index + 1 }}</td>
- <td>{{ item.Name }}</td>
- <td>{{ item.Description }}</td>
- <td>{{ item.BrandName }}</td>
+ <td class="item-name-cell multi-row">
+ <span>{{ item.Name }}</span>
+ <span class="text-muted">
+ <span v-if="props.preview">{{ item.BrandName }}</span>
+ {{ item.Description }}
+ </span>
+ </td>
+ <td v-if="!props.preview">{{ item.BrandName }}</td>
<td>{{ item.HSN }}</td>
<td>{{ item.UnitPrice }}</td>
+ <td v-if="props.preview">{{ item.AmountWithoutGST }}</td>
<td>
{{ item.GSTValue }} <span class="sup text-muted">{{ item.GSTPercentage }}%</span>
</td>
- <td>{{ item.Quantity }} <span class="sup text-muted">{{ item.UnitOfMeasure }}</span></td>
- <td>{{ item.TotalAmount }} <span class="sup text-muted">{{ item.AmountWithoutGST }} + {{ item.TotalGSTValue }}</span> </td>
+ <td>
+ {{ item.Quantity }} <span class="sup text-muted">{{ item.UnitOfMeasure }}</span>
+ </td>
+ <td>{{ item.TotalAmount }}</td>
<td v-if="!props.preview" class="table-action-column">
<div class="wrapper">
@@ -110,4 +118,8 @@ tbody tr:hover .table-action-column .btn {
opacity: 1;
transition: opacity 300ms;
}
+td.multi-row {
+ display: flex;
+ flex-direction: column;
+}
</style>
diff --git a/src/views/ViewInvoice.vue b/src/views/ViewInvoice.vue
index 68857b4..5f2a783 100644
--- a/src/views/ViewInvoice.vue
+++ b/src/views/ViewInvoice.vue
@@ -74,7 +74,6 @@ onMounted(() => {
font-size: 12pt !important;
}
#print-preview .sup {
- display: none;
}
#print-preview table {
width: 100%;
@@ -88,9 +87,16 @@ onMounted(() => {
#print-preview .invoice-summary {
margin-top: auto !important;
}
+#print-preview .item-name-cell span {
+ max-width: 150pt !important;
+}
@media print {
+ body {
+ background-color: white;
+ }
#print-preview {
width: auto !important;
+ height: 100% !important;
}
#sidebar, #navbar, #print-button, .btn {
display: none !important;