Chore: Removed Mat Card from everywhere.

Chore: Removed the Toaster Service.
Chore: Updated to Material Theme 3
This commit is contained in:
2025-07-11 11:30:35 +00:00
parent 5c1c474e93
commit 88a1572747
117 changed files with 2895 additions and 3236 deletions

View File

@ -11,7 +11,7 @@ import { VoucherType } from '../bills/voucher-type';
selector: 'app-bill-type',
templateUrl: './bill-type.component.html',
styleUrls: ['./bill-type.component.sass'],
imports: [CdkScrollableModule, MatButtonModule, MatCardModule, MatDialogModule, MatRippleModule],
imports: [CdkScrollableModule, MatButtonModule, MatDialogModule, MatRippleModule, MatCardModule],
})
export class BillTypeComponent {
dialogRef = inject<MatDialogRef<BillTypeComponent>>(MatDialogRef);

View File

@ -1,6 +1,7 @@
import { SelectionModel } from '@angular/cdk/collections';
import { Injectable, inject } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { BehaviorSubject, throwError, Observable } from 'rxjs';
import { tap } from 'rxjs/operators';
@ -10,7 +11,6 @@ import { Product } from '../core/product';
import { ReceivePaymentItem } from '../core/receive-payment-item';
import { SaleCategory } from '../core/sale-category';
import { Table } from '../core/table';
import { ToasterService } from '../core/toaster.service';
import { ModifierCategoryService } from '../modifier-categories/modifier-category.service';
import { MathService } from '../shared/math.service';
import { Bill } from './bills/bill';
@ -25,7 +25,7 @@ import { ModifiersComponent } from './modifiers/modifiers.component';
})
export class BillService {
private dialog = inject(MatDialog);
private toaster = inject(ToasterService);
private snackBar = inject(MatSnackBar);
private math = inject(MathService);
private ser = inject(VoucherService);
private modifierCategoryService = inject(ModifierCategoryService);
@ -118,7 +118,7 @@ export class BillService {
if (quantity < 0) {
const minimum = this.minimum(product.id as string, product.hasHappyHour) + quantity;
if (minimum + quantity < 0) {
this.toaster.show('Error', 'Total quantity cannot be negative!');
this.snackBar.open('Total quantity cannot be negative!', 'Error');
return;
}
}

View File

@ -1,174 +1,165 @@
<mat-card>
<mat-card-header>
<mat-card-title>Bill</mat-card-title>
</mat-card-header>
<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
<span>Bill</span>
<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
>&nbsp;/&nbsp;<span [matTooltip]="bs.bill.creationDateTip">{{ bs.bill.creationDate }}</span
>&nbsp;/&nbsp;<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"
><button>Table: {{ bs.bill.table.name }}</button> /
<button mat-button (click)="choosePax()">{{ bs.bill.pax }} Pax</button> /
<button mat-button (click)="chooseCustomer()">
{{ bs.bill.customer?.name ?? 'Customer' }}
</button></mat-header-cell
>
</ng-container>
<!-- Checkbox Column -->
<ng-container matColumnDef="select">
<mat-cell *matCellDef="let row">
@if (row.isOldKot) {
<mat-checkbox
(change)="$event ? masterToggle(row) : null"
[checked]="bs.selection.hasValue() && isAllSelected(row)"
[indeterminate]="isAnySelected(row)"
>
</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
>&nbsp;/&nbsp;<span [matTooltip]="bs.bill.creationDateTip">{{ bs.bill.creationDate }}</span
>&nbsp;/&nbsp;<span [matTooltip]="bs.bill.lastEditDateTip">{{ bs.bill.lastEditDate }}</span></mat-header-cell
</mat-checkbox>
}
@if (!row.isKot) {
<mat-checkbox
[disabled]="!row.id"
(click)="$event.stopPropagation()"
(change)="$event ? toggle(row) : null"
[checked]="isSelected(row)"
>
</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"
><button>Table: {{ bs.bill.table.name }}</button> /
<button mat-button (click)="choosePax()">{{ bs.bill.pax }} Pax</button> /
<button mat-button (click)="chooseCustomer()">
{{ bs.bill.customer?.name ?? 'Customer' }}
</button></mat-header-cell
>
</ng-container>
</mat-checkbox>
}
</mat-cell>
</ng-container>
<!-- Info Column -->
<ng-container matColumnDef="info">
<mat-cell *matCellDef="let row">
<span>
{{ row.info }}
</span>
<ul>
@for (m of row.modifiers; track m.id) {
<li>{{ 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">
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="subtractOne(row)" [disabled]="row.isPrinted">
<mat-icon>indeterminate_check_box</mat-icon>
</button>
}
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="quantity(row)" [disabled]="rowQuantityDisabled(row)">
{{ row.quantity }}
</button>
}
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="addOne(row)" [disabled]="row.isPrinted">
<mat-icon>control_point</mat-icon>
</button>
}
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="modifier(row)" [disabled]="row.isPrinted">
<mat-icon>assignment</mat-icon>
</button>
}
@if (row.isKot) {
<button mat-icon-button (click)="moveKot(row)" [disabled]="row.isKot && !row.kotId">
<mat-icon class="del">open_in_new</mat-icon>
</button>
}
</mat-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.old-kot]="row.isOldKot"
[class.new-kot]="row.isNewKot"
[class.is-printed]="row.isPrinted && !row.isHappyHour"
[class.hh-new]="row.isHappyHour && !row.isPrinted"
[class.hh-printed]="row.isPrinted && row.isHappyHour"
></mat-row>
<mat-footer-row *matFooterRowDef="['gross-title', 'gross-amount']"></mat-footer-row>
<ng-container matColumnDef="gross-title">
<mat-footer-cell *matFooterCellDef class="bold">Gross</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="gross-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.grossAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<!-- Checkbox Column -->
<ng-container matColumnDef="select">
<mat-cell *matCellDef="let row">
@if (row.isOldKot) {
<mat-checkbox
(change)="$event ? masterToggle(row) : null"
[checked]="bs.selection.hasValue() && isAllSelected(row)"
[indeterminate]="isAnySelected(row)"
>
</mat-checkbox>
}
@if (!row.isKot) {
<mat-checkbox
[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">
<span>
{{ row.info }}
</span>
<ul>
@for (m of row.modifiers; track m.id) {
<li>{{ 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">
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="subtractOne(row)" [disabled]="row.isPrinted">
<mat-icon>indeterminate_check_box</mat-icon>
</button>
}
@if (!row.isKot) {
<button
mat-icon-button
class="small-icon-button"
(click)="quantity(row)"
[disabled]="rowQuantityDisabled(row)"
>
{{ row.quantity }}
</button>
}
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="addOne(row)" [disabled]="row.isPrinted">
<mat-icon>control_point</mat-icon>
</button>
}
@if (!row.isKot) {
<button mat-icon-button class="small-icon-button" (click)="modifier(row)" [disabled]="row.isPrinted">
<mat-icon>assignment</mat-icon>
</button>
}
@if (row.isKot) {
<button mat-icon-button (click)="moveKot(row)" [disabled]="row.isKot && !row.kotId">
<mat-icon class="del">open_in_new</mat-icon>
</button>
}
</mat-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.old-kot]="row.isOldKot"
[class.new-kot]="row.isNewKot"
[class.is-printed]="row.isPrinted && !row.isHappyHour"
[class.hh-new]="row.isHappyHour && !row.isPrinted"
[class.hh-printed]="row.isPrinted && row.isHappyHour"
></mat-row>
<mat-footer-row *matFooterRowDef="['gross-title', 'gross-amount']"></mat-footer-row>
<ng-container matColumnDef="gross-title">
<mat-footer-cell *matFooterCellDef class="bold">Gross</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="gross-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.grossAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['hh-title', 'hh-amount']"></mat-footer-row>
<ng-container matColumnDef="hh-title">
<mat-footer-cell *matFooterCellDef class="bold">Happy Hour Discount</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="hh-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.hhAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['hh-title', 'hh-amount']"></mat-footer-row>
<ng-container matColumnDef="hh-title">
<mat-footer-cell *matFooterCellDef class="bold">Happy Hour Discount</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="hh-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.hhAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['discount-title', 'discount-amount']"></mat-footer-row>
<ng-container matColumnDef="discount-title">
<mat-footer-cell *matFooterCellDef class="bold">Discount</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="discount-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.discountAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['discount-title', 'discount-amount']"></mat-footer-row>
<ng-container matColumnDef="discount-title">
<mat-footer-cell *matFooterCellDef class="bold">Discount</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="discount-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.discountAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['tax-title', 'tax-amount']"></mat-footer-row>
<ng-container matColumnDef="tax-title">
<mat-footer-cell *matFooterCellDef class="bold">Tax</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="tax-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.taxAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['tax-title', 'tax-amount']"></mat-footer-row>
<ng-container matColumnDef="tax-title">
<mat-footer-cell *matFooterCellDef class="bold">Tax</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="tax-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.taxAmount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
<mat-footer-row *matFooterRowDef="['amount-title', 'amount-amount']"></mat-footer-row>
<ng-container matColumnDef="amount-title">
<mat-footer-cell *matFooterCellDef>Amount</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="amount-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.amount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
</table>
<mat-footer-row *matFooterRowDef="['amount-title', 'amount-amount']"></mat-footer-row>
<ng-container matColumnDef="amount-title">
<mat-footer-cell *matFooterCellDef>Amount</mat-footer-cell>
</ng-container>
<ng-container matColumnDef="amount-amount">
<mat-footer-cell *matFooterCellDef class="bold right-align">{{
bs.amount | async | currency: 'INR'
}}</mat-footer-cell>
</ng-container>
</table>
</mat-card-content>
</mat-card>
<router-outlet></router-outlet>

View File

@ -1,10 +1,10 @@
import { AsyncPipe, CurrencyPipe } from '@angular/common';
import { Component, OnInit, inject } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDialog } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
import { MatSnackBar } from '@angular/material/snack-bar';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { ActivatedRoute, Router, RouterOutlet } from '@angular/router';
@ -15,7 +15,6 @@ import { AuthService } from '../../auth/auth.service';
import { BillViewItem } from '../../core/bill-view-item';
import { Customer } from '../../core/customer';
import { Table } from '../../core/table';
import { ToasterService } from '../../core/toaster.service';
import { ConfirmDialogComponent } from '../../shared/confirm-dialog/confirm-dialog.component';
import { TableService } from '../../tables/table.service';
import { BillService } from '../bill.service';
@ -38,7 +37,7 @@ import { VoucherType } from './voucher-type';
AsyncPipe,
CurrencyPipe,
MatButtonModule,
MatCardModule,
MatCheckboxModule,
MatIconModule,
MatTableModule,
@ -50,7 +49,7 @@ export class BillsComponent implements OnInit {
private route = inject(ActivatedRoute);
private router = inject(Router);
private dialog = inject(MatDialog);
private toaster = inject(ToasterService);
private snackBar = inject(MatSnackBar);
private auth = inject(AuthService);
bs = inject(BillService);
private tSer = inject(TableService);
@ -273,11 +272,11 @@ export class BillsComponent implements OnInit {
)
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (x) => {
this.toaster.show('Error', x);
this.snackBar.open(x, 'Error');
},
});
}

View File

@ -1,80 +1,76 @@
<mat-card>
<mat-card-content>
<div class="tables-grid">
<mat-card
class="primary flex flex-col square-button"
matRipple
[routerLink]="['menu-categories']"
queryParamsHandling="preserve"
>
<h3>Add Product</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="discount()"
[class.disabled]="!discountAllowed()"
[class.primary]="discountAllowed()"
>
<h3>Discount</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="printKot()"
[class.disabled]="!printKotAllowed()"
[class.primary]="printKotAllowed()"
>
<h3>Print KOT</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="printBill()"
[class.disabled]="!printBillAllowed()"
[class.primary]="printBillAllowed()"
>
<h3>Print Bill</h3>
</mat-card>
<mat-card class="flex flex-col square-button warn" matRipple [routerLink]="['/', 'sales', 'tables']">
<h3>Back to Tables</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="receivePayment()"
[class.disabled]="!receivePaymentAllowed()"
[class.primary]="receivePaymentAllowed()"
>
<h3>Receive Payment</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="moveTable()"
[class.disabled]="!moveTableAllowed()"
[class.primary]="moveTableAllowed()"
>
<h3>Move Table</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="cancelBill()"
[class.disabled]="!cancelBillAllowed()"
[class.primary]="cancelBillAllowed()"
>
<h3>Cancel Bill</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="splitBill()"
[class.disabled]="!splitBillAllowed()"
[class.primary]="splitBillAllowed()"
>
<h3>Split Bill</h3>
</mat-card>
</div>
</mat-card-content>
</mat-card>
<div class="tables-grid">
<mat-card
class="primary flex flex-col square-button"
matRipple
[routerLink]="['menu-categories']"
queryParamsHandling="preserve"
>
<h3>Add Product</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="discount()"
[class.disabled]="!discountAllowed()"
[class.primary]="discountAllowed()"
>
<h3>Discount</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="printKot()"
[class.disabled]="!printKotAllowed()"
[class.primary]="printKotAllowed()"
>
<h3>Print KOT</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="printBill()"
[class.disabled]="!printBillAllowed()"
[class.primary]="printBillAllowed()"
>
<h3>Print Bill</h3>
</mat-card>
<mat-card class="flex flex-col square-button warn" matRipple [routerLink]="['/', 'sales', 'tables']">
<h3>Back to Tables</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="receivePayment()"
[class.disabled]="!receivePaymentAllowed()"
[class.primary]="receivePaymentAllowed()"
>
<h3>Receive Payment</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="moveTable()"
[class.disabled]="!moveTableAllowed()"
[class.primary]="moveTableAllowed()"
>
<h3>Move Table</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="cancelBill()"
[class.disabled]="!cancelBillAllowed()"
[class.primary]="cancelBillAllowed()"
>
<h3>Cancel Bill</h3>
</mat-card>
<mat-card
class="flex flex-col square-button"
matRipple
(click)="splitBill()"
[class.disabled]="!splitBillAllowed()"
[class.primary]="splitBillAllowed()"
>
<h3>Split Bill</h3>
</mat-card>
</div>

View File

@ -2,6 +2,7 @@ import { Component, inject } from '@angular/core';
import { MatCardModule } from '@angular/material/card';
import { MatRippleModule } from '@angular/material/core';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Router, RouterLink } from '@angular/router';
import { Observable, of as observableOf } from 'rxjs';
import { map, switchMap, tap } from 'rxjs/operators';
@ -9,7 +10,6 @@ import { map, switchMap, tap } from 'rxjs/operators';
import { AuthService } from '../../auth/auth.service';
import { ReceivePaymentItem } from '../../core/receive-payment-item';
import { Table } from '../../core/table';
import { ToasterService } from '../../core/toaster.service';
import { SaleCategoryService } from '../../sale-category/sale-category.service';
import { ConfirmDialogComponent } from '../../shared/confirm-dialog/confirm-dialog.component';
import { TableService } from '../../tables/table.service';
@ -28,14 +28,14 @@ import { TablesDialogComponent } from '../tables-dialog/tables-dialog.component'
selector: 'app-sales-home',
templateUrl: './sales-home.component.html',
styleUrls: ['./sales-home.component.sass'],
imports: [MatCardModule, MatRippleModule, RouterLink],
imports: [MatRippleModule, RouterLink, MatCardModule],
})
export class SalesHomeComponent {
private route = inject(ActivatedRoute);
private router = inject(Router);
private dialog = inject(MatDialog);
private auth = inject(AuthService);
private toaster = inject(ToasterService);
private snackBar = inject(MatSnackBar);
private saleCategoryService = inject(SaleCategoryService);
private tableService = inject(TableService);
private customerDiscountsService = inject(CustomerDiscountsService);
@ -64,11 +64,11 @@ export class SalesHomeComponent {
}
this.bs.printKot(guestBookId).subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (result) => {
this.toaster.show('Error', result);
this.snackBar.open(result, 'Error');
},
});
}
@ -167,11 +167,11 @@ export class SalesHomeComponent {
)
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (result) => {
this.toaster.show('Error', result);
this.snackBar.open(result, 'Error');
},
});
}
@ -216,11 +216,11 @@ export class SalesHomeComponent {
)
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (value) => {
this.toaster.show('Error', value);
this.snackBar.open(value, 'Error');
},
});
}
@ -259,11 +259,11 @@ export class SalesHomeComponent {
)
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (x) => {
this.toaster.show('Error', x);
this.snackBar.open(x, 'Error');
},
});
}
@ -315,11 +315,11 @@ export class SalesHomeComponent {
)
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (x) => {
this.toaster.show('Error', x);
this.snackBar.open(x, 'Error');
},
});
}
@ -382,11 +382,11 @@ export class SalesHomeComponent {
)
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.snackBar.open('', 'Success');
this.router.navigate(['/sales']);
},
error: (x) => {
this.toaster.show('Error', x);
this.snackBar.open(x, 'Error');
},
});
}

View File

@ -1,24 +1,15 @@
<mat-card>
<mat-card-content>
<div class="tables-grid">
<mat-card
class="flex flex-col square-button warn"
matRipple
[routerLink]="['../']"
queryParamsHandling="preserve"
>
<h3>Back</h3>
</mat-card>
@for (item of list; track item) {
<mat-card
class="primary flex flex-col square-button"
matRipple
[routerLink]="['../products', item.id]"
queryParamsHandling="preserve"
>
<h3>{{ item.name }}</h3>
</mat-card>
}
</div>
</mat-card-content>
</mat-card>
<div class="tables-grid">
<mat-card class="flex flex-col square-button warn" matRipple [routerLink]="['../']" queryParamsHandling="preserve">
<h3>Back</h3>
</mat-card>
@for (item of list; track item) {
<mat-card
class="primary flex flex-col square-button"
matRipple
[routerLink]="['../products', item.id]"
queryParamsHandling="preserve"
>
<h3>{{ item.name }}</h3>
</mat-card>
}
</div>

View File

@ -9,7 +9,7 @@ import { MenuCategory } from '../../core/menu-category';
selector: 'app-menu-category',
templateUrl: './menu-categories.component.html',
styleUrls: ['./menu-categories.component.sass'],
imports: [MatCardModule, MatRippleModule, RouterLink],
imports: [MatRippleModule, RouterLink, MatCardModule],
})
export class MenuCategoriesComponent implements OnInit {
private route = inject(ActivatedRoute);

View File

@ -1,27 +1,23 @@
<mat-card>
<mat-card-content>
<div class="tables-grid">
<mat-card
class="flex flex-col square-button warn"
matRipple
[routerLink]="['../../menu-categories']"
queryParamsHandling="preserve"
>
<h3>Back</h3>
</mat-card>
@for (item of list; track item) {
<mat-card
class="flex flex-col square-button"
matRipple
(click)="addProduct(item)"
[class.accent]="item.hasHappyHour"
[class.strong-disabled]="item.isNotAvailable"
[class.primary]="!item.hasHappyHour && !item.isNotAvailable"
>
<h3>{{ item.name }}</h3>
<span>{{ item.price | currency: 'INR' }}</span>
</mat-card>
}
</div>
</mat-card-content>
</mat-card>
<div class="tables-grid">
<mat-card
class="flex flex-col square-button warn"
matRipple
[routerLink]="['../../menu-categories']"
queryParamsHandling="preserve"
>
<h3>Back</h3>
</mat-card>
@for (item of list; track item) {
<mat-card
class="flex flex-col square-button"
matRipple
(click)="addProduct(item)"
[class.accent]="item.hasHappyHour"
[class.disabled]="item.isNotAvailable"
[class.primary]="!item.hasHappyHour && !item.isNotAvailable"
>
<h3>{{ item.name }}</h3>
<span>{{ item.price | currency: 'INR' }}</span>
</mat-card>
}
</div>

View File

@ -11,7 +11,7 @@ import { BillService } from '../bill.service';
selector: 'app-products',
templateUrl: './products.component.html',
styleUrls: ['./products.component.sass'],
imports: [CurrencyPipe, MatCardModule, MatRippleModule, RouterLink],
imports: [CurrencyPipe, MatRippleModule, RouterLink, MatCardModule],
})
export class ProductsComponent implements OnInit {
private route = inject(ActivatedRoute);

View File

@ -1,32 +1,27 @@
<mat-card>
<mat-card-header>
<mat-card-title>Running Tables</mat-card-title>
</mat-card-header>
<mat-card-content>
<div class="tables-grid">
@for (table of list; track table) {
<mat-card
class="flex flex-col square-button"
matRipple
(click)="navigateToBill(table)"
[class.primary]="table.status !== 'running' && table.status !== 'printed'"
[class.accent]="table.status === 'running'"
[class.strong-accent]="table.status === 'printed'"
>
<h3>{{ table.name }}</h3>
<span>{{ table.guest }}</span>
<span>{{ table.pax ?? '-' }} / {{ table.seats }} / {{ table.section?.name }}</span>
@if (table.date) {
<span>{{ table.date }}</span>
}
@if (table.amount) {
<span>{{ table.amount | currency: 'INR' }}</span>
}
</mat-card>
<h2>Running Tables</h2>
<div class="tables-grid">
@for (table of list; track table) {
<mat-card
class="flex flex-col square-button"
matRipple
(click)="navigateToBill(table)"
[class.primary]="table.status !== 'running' && table.status !== 'printed'"
[class.accent]="table.status === 'running'"
[class.strong-accent]="table.status === 'printed'"
>
<h3>{{ table.name }}</h3>
<span>{{ table.guest }}</span>
<span>{{ table.pax ?? '-' }} / {{ table.seats }} / {{ table.section?.name }}</span>
@if (table.date) {
<span>{{ table.date }}</span>
}
<mat-card class="flex flex-col square-button strong-primary" matRipple (click)="openBill()">
<h3>Open Bill</h3>
</mat-card>
</div>
</mat-card-content>
</mat-card>
@if (table.amount) {
<span>{{ table.amount | currency: 'INR' }}</span>
}
</mat-card>
}
<mat-card class="flex flex-col square-button strong-primary" matRipple (click)="openBill()">
<h3>Open Bill</h3>
</mat-card>
</div>

View File

@ -3,25 +3,25 @@ import { Component, OnInit, inject } from '@angular/core';
import { MatCardModule } from '@angular/material/card';
import { MatRippleModule } from '@angular/material/core';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
import { map } from 'rxjs/operators';
import { Regime } from 'src/app/core/regime';
import { Table } from '../../core/table';
import { ToasterService } from '../../core/toaster.service';
import { BillNumberComponent } from '../bill-number/bill-number.component';
@Component({
selector: 'app-running-tables',
templateUrl: './running-tables.component.html',
styleUrls: ['./running-tables.component.sass'],
imports: [CurrencyPipe, MatCardModule, MatRippleModule],
imports: [CurrencyPipe, MatRippleModule, MatCardModule],
})
export class RunningTablesComponent implements OnInit {
private dialog = inject(MatDialog);
private router = inject(Router);
private route = inject(ActivatedRoute);
private toaster = inject(ToasterService);
private snackBar = inject(MatSnackBar);
regimes: Regime[] = [];
list: Table[] = [];
@ -61,7 +61,7 @@ export class RunningTablesComponent implements OnInit {
)
.subscribe({
next: (x) => this.router.navigate(['/sales', 'bill'], { queryParams: { bill: x } }),
error: (x) => this.toaster.show('Error', x),
error: (x) => this.snackBar.open(x, 'Error'),
});
}
}

View File

@ -13,7 +13,7 @@ import { Table } from '../../core/table';
selector: 'app-tables-dialog',
templateUrl: './tables-dialog.component.html',
styleUrls: ['./tables-dialog.component.sass'],
imports: [CdkScrollableModule, CurrencyPipe, MatButtonModule, MatCardModule, MatDialogModule, MatRippleModule],
imports: [CdkScrollableModule, CurrencyPipe, MatButtonModule, MatDialogModule, MatRippleModule, MatCardModule],
})
export class TablesDialogComponent {
dialogRef = inject<MatDialogRef<TablesDialogComponent>>(MatDialogRef);