188 lines
7.1 KiB
HTML
188 lines
7.1 KiB
HTML
<mat-card>
|
|
<mat-card-title-group>
|
|
<mat-card-title>Bill</mat-card-title>
|
|
</mat-card-title-group>
|
|
<mat-card-content>
|
|
<table
|
|
mat-table
|
|
#table
|
|
[dataSource]="dataSource"
|
|
aria-label="Elements"
|
|
class="mat-elevation-z8"
|
|
>
|
|
<ng-container matColumnDef="bill-no-title">
|
|
<mat-header-cell *matHeaderCellDef class="deep-purple-200 bold"
|
|
>Bill / KOT number</mat-header-cell
|
|
>
|
|
</ng-container>
|
|
<ng-container matColumnDef="bill-no-details">
|
|
<mat-header-cell *matHeaderCellDef class="deep-purple-200 bold right-align"
|
|
>{{ bs.bill.billId }} / K-{{ bs.bill.kotId }}</mat-header-cell
|
|
>
|
|
</ng-container>
|
|
<ng-container matColumnDef="time-title">
|
|
<mat-header-cell *matHeaderCellDef class="deep-purple-100 bold"
|
|
>Time / Start Time / Last Edit Time
|
|
</mat-header-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="time-details">
|
|
<mat-header-cell *matHeaderCellDef class="deep-purple-100 bold right-align"
|
|
><span [matTooltip]="bs.bill.dateTip">{{ bs.bill.date }}</span
|
|
> / <span [matTooltip]="bs.bill.creationDateTip">{{
|
|
bs.bill.creationDate
|
|
}}</span
|
|
> / <span [matTooltip]="bs.bill.lastEditDateTip">{{
|
|
bs.bill.lastEditDate
|
|
}}</span></mat-header-cell
|
|
>
|
|
</ng-container>
|
|
<ng-container matColumnDef="table-title">
|
|
<mat-header-cell *matHeaderCellDef class="deep-purple-50 bold"
|
|
>Table / Pax / Customer</mat-header-cell
|
|
>
|
|
</ng-container>
|
|
<ng-container matColumnDef="table-details">
|
|
<mat-header-cell *matHeaderCellDef class="deep-purple-50 bold right-align"
|
|
>{{ bs.bill.table.name }} / {{ bs.bill.pax }} /
|
|
{{ bs.bill.customer?.name }}</mat-header-cell
|
|
>
|
|
</ng-container>
|
|
|
|
<!-- Checkbox Column -->
|
|
<ng-container matColumnDef="select">
|
|
<mat-cell *matCellDef="let row">
|
|
<mat-checkbox
|
|
*ngIf="row.isOldKot"
|
|
(change)="$event ? masterToggle(row) : null"
|
|
[checked]="bs.selection.hasValue() && isAllSelected(row)"
|
|
[indeterminate]="isAnySelected(row)"
|
|
>
|
|
</mat-checkbox>
|
|
<mat-checkbox
|
|
*ngIf="!row.isKot"
|
|
[disabled]="!row.id"
|
|
(click)="$event.stopPropagation()"
|
|
(change)="$event ? toggle(row) : null"
|
|
[checked]="isSelected(row)"
|
|
>
|
|
</mat-checkbox>
|
|
</mat-cell>
|
|
</ng-container>
|
|
<!-- Info Column -->
|
|
<ng-container matColumnDef="info">
|
|
<mat-cell *matCellDef="let row" [class.blue800]="row.isNewKot">
|
|
<span>
|
|
{{ row.info }}
|
|
</span>
|
|
<ul>
|
|
<li *ngFor="let m of row.modifiers">{{ m.name }}</li>
|
|
</ul>
|
|
</mat-cell>
|
|
</ng-container>
|
|
<!-- Quantity Column -->
|
|
<ng-container matColumnDef="quantity">
|
|
<mat-header-cell *matHeaderCellDef>Quantity</mat-header-cell>
|
|
<mat-cell *matCellDef="let row" class="right-align">
|
|
<button
|
|
mat-icon-button
|
|
(click)="subtractOne(row)"
|
|
[disabled]="row.isPrinted"
|
|
*ngIf="!row.isKot"
|
|
>
|
|
<mat-icon class="del">indeterminate_check_box</mat-icon>
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
(click)="quantity(row)"
|
|
[disabled]="rowQuantityDisabled(row)"
|
|
*ngIf="!row.isKot"
|
|
>
|
|
{{ row.quantity }}
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
(click)="addOne(row)"
|
|
[disabled]="row.isPrinted"
|
|
*ngIf="!row.isKot"
|
|
>
|
|
<mat-icon class="del">control_point</mat-icon>
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
(click)="removeItem(row)"
|
|
[disabled]="row.isPrinted"
|
|
*ngIf="!row.isKot"
|
|
>
|
|
<mat-icon class="del">cancel</mat-icon>
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
(click)="modifier(row)"
|
|
[disabled]="row.isPrinted"
|
|
*ngIf="!row.isKot"
|
|
>
|
|
<mat-icon class="del">assignment</mat-icon>
|
|
</button>
|
|
<button
|
|
mat-icon-button
|
|
(click)="moveKot(row)"
|
|
[disabled]="row.isKot && !row.kotId"
|
|
*ngIf="row.isKot"
|
|
>
|
|
<mat-icon class="del">open_in_new</mat-icon>
|
|
</button>
|
|
</mat-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="net-title">
|
|
<mat-footer-cell *matFooterCellDef class="grey300 bold">Net</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="net-amount">
|
|
<mat-footer-cell *matFooterCellDef class="grey300 bold right-align">{{
|
|
bs.netAmount | async | currency: 'INR'
|
|
}}</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="discount-title">
|
|
<mat-footer-cell *matFooterCellDef class="grey500 bold">Discount</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="discount-amount">
|
|
<mat-footer-cell *matFooterCellDef class="grey500 bold right-align">{{
|
|
bs.discountAmount | async | currency: 'INR'
|
|
}}</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="tax-title">
|
|
<mat-footer-cell *matFooterCellDef class="grey700 bold">Tax</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="tax-amount">
|
|
<mat-footer-cell *matFooterCellDef class="grey700 bold right-align">{{
|
|
bs.taxAmount | async | currency: 'INR'
|
|
}}</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="amount-title">
|
|
<mat-footer-cell *matFooterCellDef class="grey900">Amount</mat-footer-cell>
|
|
</ng-container>
|
|
<ng-container matColumnDef="amount-amount">
|
|
<mat-footer-cell *matFooterCellDef class="grey900 bold right-align">{{
|
|
bs.amount | async | currency: 'INR'
|
|
}}</mat-footer-cell>
|
|
</ng-container>
|
|
|
|
<mat-header-row *matHeaderRowDef="['bill-no-title', 'bill-no-details']"></mat-header-row>
|
|
<mat-header-row *matHeaderRowDef="['time-title', 'time-details']"></mat-header-row>
|
|
<mat-header-row *matHeaderRowDef="['table-title', 'table-details']"></mat-header-row>
|
|
<mat-row
|
|
*matRowDef="let row; columns: displayedColumns"
|
|
[class.blue400]="row.isOldKot"
|
|
[class.blue800]="row.isNewKot"
|
|
[class.red100]="row.isPrinted && !row.isHappyHour"
|
|
[class.yellow300]="row.isHappyHour && !row.isPrinted"
|
|
[class.yellow-for-hh-printed]="row.isPrinted && row.isHappyHour"
|
|
></mat-row>
|
|
<mat-footer-row *matFooterRowDef="['net-title', 'net-amount']"></mat-footer-row>
|
|
<mat-footer-row *matFooterRowDef="['discount-title', 'discount-amount']"></mat-footer-row>
|
|
<mat-footer-row *matFooterRowDef="['tax-title', 'tax-amount']"></mat-footer-row>
|
|
<mat-footer-row *matFooterRowDef="['amount-title', 'amount-amount']"></mat-footer-row>
|
|
</table>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
<router-outlet></router-outlet>
|