Chore: Upgrade to Angular v18

Chore: Upgrade to Python 3.12
Chore: Upgrade to psycopg3
This commit is contained in:
2024-06-03 13:22:56 +05:30
parent 56c1be5e05
commit 010e9a84db
573 changed files with 5727 additions and 6528 deletions

View File

@ -1,30 +0,0 @@
import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot } from '@angular/router';
import { Observable } from 'rxjs';
import { Bill } from './bill';
import { VoucherService } from './voucher.service';
@Injectable({
providedIn: 'root',
})
export class BillResolver {
constructor(private ser: VoucherService) {}
resolve(route: ActivatedRouteSnapshot): Observable<Bill> {
const tableId = route.queryParamMap.get('table');
const guestId = route.queryParamMap.get('guest');
const voucherId = route.queryParamMap.get('voucher');
const billId = route.queryParamMap.get('bill');
if (billId !== null) {
return this.ser.getFromBill(billId);
}
if (tableId !== null) {
return this.ser.getFromTable(tableId as string, voucherId, guestId);
}
if (voucherId !== null) {
return this.ser.getFromId(voucherId);
}
throw new Error('Unable to get bill');
}
}

View File

@ -0,0 +1,22 @@
import { inject } from '@angular/core';
import { ResolveFn } from '@angular/router';
import { Bill } from './bill';
import { VoucherService } from './voucher.service';
export const billResolver: ResolveFn<Bill> = (route) => {
const tableId = route.queryParamMap.get('table');
const guestId = route.queryParamMap.get('guest');
const voucherId = route.queryParamMap.get('voucher');
const billId = route.queryParamMap.get('bill');
if (billId !== null) {
return inject(VoucherService).getFromBill(billId);
}
if (tableId !== null) {
return inject(VoucherService).getFromTable(tableId as string, voucherId, guestId);
}
if (voucherId !== null) {
return inject(VoucherService).getFromId(voucherId);
}
throw new Error('Unable to get bill');
};

View File

@ -40,21 +40,23 @@
<!-- 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>
@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 -->
@ -64,7 +66,9 @@
{{ row.info }}
</span>
<ul>
<li *ngFor="let m of row.modifiers">{{ m.name }}</li>
@for (m of row.modifiers; track m) {
<li>{{ m.name }}</li>
}
</ul>
</mat-cell>
</ng-container>
@ -72,45 +76,36 @@
<ng-container matColumnDef="quantity">
<mat-header-cell *matHeaderCellDef>Quantity</mat-header-cell>
<mat-cell *matCellDef="let row" class="right-align">
<button
mat-icon-button
class="small-icon-button"
(click)="subtractOne(row)"
[disabled]="row.isPrinted"
*ngIf="!row.isKot"
>
<mat-icon>indeterminate_check_box</mat-icon>
</button>
<button
mat-icon-button
class="small-icon-button"
(click)="quantity(row)"
[disabled]="rowQuantityDisabled(row)"
*ngIf="!row.isKot"
>
{{ row.quantity }}
</button>
<button
mat-icon-button
class="small-icon-button"
(click)="addOne(row)"
[disabled]="row.isPrinted"
*ngIf="!row.isKot"
>
<mat-icon>control_point</mat-icon>
</button>
<button
mat-icon-button
class="small-icon-button"
(click)="modifier(row)"
[disabled]="row.isPrinted"
*ngIf="!row.isKot"
>
<mat-icon>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>
@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>

View File

@ -1,7 +1,7 @@
@use '@angular/material' as mat
$my-grey: mat.define-palette(mat.$grey-palette)
$my-green: mat.define-palette(mat.$green-palette)
$my-grey: mat.m2-define-palette(mat.$m2-grey-palette)
$my-green: mat.m2-define-palette(mat.$m2-green-palette)
.right-align
display: flex
@ -17,72 +17,72 @@ table
background-color: #1b5e20
color: #ffffff
font-size: 1.2em
// color: mat.get-color-from-palette($my-grey, '900-contrast')
// background: mat.get-color-from-palette($my-grey, 900)
// color: mat.m2-get-color-from-palette($my-grey, '900-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 900)
.grey700, .mat-column-tax-title, .mat-column-tax-amount
background-color: #388e3c
color: #ffffff
// color: mat.get-color-from-palette($my-grey, '900-contrast')
// background: mat.get-color-from-palette($my-grey, 900)
// color: mat.m2-get-color-from-palette($my-grey, '900-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 900)
.grey500, .mat-column-discount-title, .mat-column-discount-amount
background-color: #4caf50
color: #000000
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.grey300, .mat-column-hh-title, .mat-column-hh-amount, .mat-column-gross-title, .mat-column-gross-amount
background-color: #81c784
color: #000000
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.blue400, .old-kot
background-color: #42a5f5
color: #ffffff
// color: mat.get-color-from-palette($my-green, 700)
// background-color: mat.get-color-from-palette($my-green, 500)
// color: mat.m2-get-color-from-palette($my-green, 700)
// background-color: mat.m2-get-color-from-palette($my-green, 500)
.blue800, .new-kot
background-color: #1565c0
color: #ffffff
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.red100, .is-printed
// background-color: #ffcdd2
// color: #000000
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.deep-purple-50
background-color: #ede7f6
color: #000000
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.deep-purple-100
background-color: #d1c4e9
color: #000000
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.deep-purple-200
background-color: #b39ddb
color: #000000
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.yellow300, .hh-new
background-color: #fff176
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
.hh-printed
background-color: #f7ca18
// color: mat.get-color-from-palette($my-grey, '300-contrast')
// background: mat.get-color-from-palette($my-grey, 300)
// color: mat.m2-get-color-from-palette($my-grey, '300-contrast')
// background: mat.m2-get-color-from-palette($my-grey, 300)
// https://github.com/btxtiger/mat-icon-button-sizes
$button-size: 32px

View File

@ -8,7 +8,7 @@ describe('BillsComponent', () => {
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [BillsComponent],
imports: [BillsComponent],
}).compileComponents();
}));

View File

@ -1,6 +1,28 @@
import { AsyncPipe, CurrencyPipe } from '@angular/common';
import { Component, OnInit } from '@angular/core';
import { MatButton, MatIconButton } from '@angular/material/button';
import { MatCard, MatCardHeader, MatCardTitle, MatCardContent } from '@angular/material/card';
import { MatCheckbox } from '@angular/material/checkbox';
import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Router } from '@angular/router';
import { MatIcon } from '@angular/material/icon';
import {
MatTable,
MatColumnDef,
MatHeaderCellDef,
MatHeaderCell,
MatCellDef,
MatCell,
MatHeaderRowDef,
MatHeaderRow,
MatRowDef,
MatRow,
MatFooterRowDef,
MatFooterRow,
MatFooterCellDef,
MatFooterCell,
} from '@angular/material/table';
import { MatTooltip } from '@angular/material/tooltip';
import { ActivatedRoute, Router, RouterOutlet } from '@angular/router';
import { Observable } from 'rxjs';
import { map, switchMap } from 'rxjs/operators';
@ -28,6 +50,35 @@ import { VoucherType } from './voucher-type';
selector: 'app-bills',
templateUrl: './bills.component.html',
styleUrls: ['./bills.component.sass'],
standalone: true,
imports: [
MatCard,
MatCardHeader,
MatCardTitle,
MatCardContent,
MatTable,
MatColumnDef,
MatHeaderCellDef,
MatHeaderCell,
MatTooltip,
MatButton,
MatCellDef,
MatCell,
MatCheckbox,
MatIconButton,
MatIcon,
MatHeaderRowDef,
MatHeaderRow,
MatRowDef,
MatRow,
MatFooterRowDef,
MatFooterRow,
MatFooterCellDef,
MatFooterCell,
RouterOutlet,
AsyncPipe,
CurrencyPipe,
],
})
export class BillsComponent implements OnInit {
dataSource: BillsDataSource = new BillsDataSource(this.bs.dataObs);
@ -256,15 +307,15 @@ export class BillsComponent implements OnInit {
return this.bs.moveKot(kot.kotId as string, table);
}),
)
.subscribe(
() => {
.subscribe({
next: () => {
this.toaster.show('Success', '');
this.router.navigate(['/sales']);
},
(x) => {
error: (x) => {
this.toaster.show('Error', x);
},
);
});
}
rowQuantityDisabled(row: BillViewItem) {

View File

@ -1,14 +0,0 @@
import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot } from '@angular/router';
import { Observable, of as observableOf } from 'rxjs';
@Injectable({
providedIn: 'root',
})
export class UpdateTableResolver {
constructor() {}
resolve(route: ActivatedRouteSnapshot): Observable<boolean> {
return route.queryParamMap.get('bill') !== null ? observableOf(false) : observableOf(true);
}
}

View File

@ -0,0 +1,6 @@
import { ResolveFn } from '@angular/router';
import { of as observableOf } from 'rxjs';
export const updateTableResolver: ResolveFn<boolean> = (route) => {
return route.queryParamMap.get('bill') !== null ? observableOf(false) : observableOf(true);
};