diff options
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/invoice_items_table.vue | 30 |
1 files changed, 21 insertions, 9 deletions
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> |