tanshu/barker
1
0
Fork 0
Code Issues 1 Pull Requests Releases 4 Activity

Product list / detail / router fully working.

Browse Source 
Need to test the sale / reports
This commit is contained in:
Amritanshu Agrawal
2020-11-09 12:43:18 +05:30
parent 4aaa3fc72b
commit a92726f5e6
22 changed files with 370 additions and 271 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
bookie/src/app/product/product-detail/product-detail.component.html
View File

@ -58,7 +58,6 @@
>
<mat-checkbox formControlName="hasHappyHour">Has Happy Hour?</mat-checkbox>
<mat-checkbox formControlName="isNotAvailable">Is Not Available?</mat-checkbox>
<mat-checkbox formControlName="isActive">Is Active?</mat-checkbox>
</div>
<div
fxLayout="row"

3
bookie/src/app/product/product-detail/product-detail.component.ts
View File

@ -44,7 +44,6 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
hasHappyHour: '',
isNotAvailable: '',
quantity: '',
isActive: '',
});
}
@ -70,7 +69,6 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
hasHappyHour: this.item.hasHappyHour,
isNotAvailable: this.item.isNotAvailable,
quantity: this.item.quantity || '',
isActive: this.item.isActive,
});
}
@ -127,7 +125,6 @@ export class ProductDetailComponent implements OnInit, AfterViewInit {
this.item.hasHappyHour = formModel.hasHappyHour;
this.item.isNotAvailable = formModel.isNotAvailable;
this.item.quantity = +formModel.quantity;
this.item.isActive = formModel.isActive;
return this.item;
}
}

47
bookie/src/app/product/product-list/product-list-datasource.ts
View File

@ -6,8 +6,8 @@ import { Product } from '../../core/product';
export class ProductListDataSource extends DataSource<Product> {
public data: Product[];
public viewData: Product[];
private filterValue: string;
public filteredData: Product[];
public filterValue: string;
constructor(
private readonly filter: Observable<string>,
@ -15,39 +15,38 @@ export class ProductListDataSource extends DataSource<Product> {
) {
super();
this.data = [];
this.viewData = [];
this.filter = filter.pipe(
tap((x) => {
this.filterValue = x;
}),
);
this.dataObs = dataObs.pipe(
tap((x) => {
this.data = x;
}),
);
this.filteredData = [];
this.filterValue = '';
}
connect(): Observable<Product[]> {
const dataMutations = [this.dataObs, this.filter];
const dataMutations = [
this.dataObs.pipe(
tap((x) => {
this.data = x;
}),
),
this.filter.pipe(
tap((x) => {
this.filterValue = x;
}),
),
];
return merge(...dataMutations).pipe(
map(() => {
this.viewData = this.getFilteredData([...this.data]);
return this.viewData;
map(() => this.getFilteredData(this.data, this.filterValue)),
tap((x) => {
this.filteredData = x;
}),
);
}
disconnect() {}
private getFilteredData(data: Product[]): Product[] {
const filter = this.filterValue === undefined ? '' : this.filterValue;
if (filter === '') {
// eslint-disable-next-line class-methods-use-this
private getFilteredData(data: Product[], filter: string): Product[] {
if (filter === undefined) {
return data;
}
return data.filter((x) => {
return x.menuCategory.id === filter;
});
return data.filter((x) => x.menuCategory.id === filter);
}
}

4
bookie/src/app/product/product-list/product-list.component.css
View File

@ -0,0 +1,4 @@
.right {
display: flex;
justify-content: flex-end;
}

19
bookie/src/app/product/product-list/product-list.component.html
View File

@ -4,7 +4,8 @@
<button mat-button (click)="updateSortOrder()" [disabled]="!(filter | async)">
Update Order
</button>
<button mat-button mat-icon-button *ngIf="dataSource.viewData.length" (click)="exportCsv()">
<!-- This should check filtered data and not data-->
<button mat-button mat-icon-button (click)="exportCsv()" [disabled]="!((data | async).length)">
<mat-icon>save_alt</mat-icon>
</button>
<a mat-button [routerLink]="['/products', 'new']">
@ -26,7 +27,7 @@
<mat-select
placeholder="Menu Category"
formControlName="menuCategory"
(selectionChange)="filterOn($event)"
(selectionChange)="filterOn($event.value)"
>
<mat-option>-- All Products --</mat-option>
<mat-option *ngFor="let mc of menuCategories" [value]="mc.id">
@ -54,8 +55,8 @@
<!-- Price Column -->
<ng-container matColumnDef="price">
<mat-header-cell *matHeaderCellDef>Price</mat-header-cell>
<mat-cell *matCellDef="let row">{{ row.price | currency: 'INR' }}</mat-cell>
<mat-header-cell *matHeaderCellDef class="right">Price</mat-header-cell>
<mat-cell *matCellDef="let row" class="right">{{ row.price | currency: 'INR' }}</mat-cell>
</ng-container>
<!-- Menu Category Column -->
@ -87,20 +88,14 @@
</mat-icon>
<b> {{ row.isNotAvailable ? 'Not Available' : 'Available' }}</b>
</div>
<div flex>
<mat-icon>
{{ row.isActive ? 'visibility' : 'visibility_off' }}
</mat-icon>
<b> {{ row.isActive ? 'Active' : 'Deactivated' }}</b>
</div>
</div>
</mat-cell>
</ng-container>
<!-- Yield Column -->
<ng-container matColumnDef="quantity">
<mat-header-cell *matHeaderCellDef>Quantity</mat-header-cell>
<mat-cell *matCellDef="let row">{{ row.quantity | currency: 'INR' }}</mat-cell>
<mat-header-cell *matHeaderCellDef class="right">Quantity</mat-header-cell>
<mat-cell *matCellDef="let row" class="right">{{ row.quantity | number: '1.2-2' }}</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>

21
bookie/src/app/product/product-list/product-list.component.ts
View File

@ -44,15 +44,15 @@ export class ProductListComponent implements OnInit {
this.form = this.fb.group({
menuCategory: '',
});
this.filter = new BehaviorSubject('');
this.filter = new BehaviorSubject(undefined);
this.data = new BehaviorSubject([]);
this.data.subscribe((data: Product[]) => {
this.list = data;
});
}
filterOn(val: any) {
this.filter.next(val.value);
filterOn(val: string) {
this.filter.next(val);
}
ngOnInit() {
@ -68,7 +68,7 @@ export class ProductListComponent implements OnInit {
}
updateSortOrder() {
this.ser.updateSortOrder(this.dataSource.viewData).subscribe(
this.ser.updateSortOrder(this.dataSource.filteredData).subscribe(
(result: Product[]) => {
this.toaster.show('Success', '');
this.loadData(result, this.menuCategories);
@ -80,8 +80,15 @@ export class ProductListComponent implements OnInit {
}
dropTable(event: CdkDragDrop<ProductListDataSource>) {
const prevIndex = this.list.indexOf(event.item.data);
moveItemInArray(this.list, prevIndex, event.currentIndex);
const prevIndex = this.dataSource.filteredData.indexOf(event.item.data);
moveItemInArray(this.dataSource.filteredData, prevIndex, event.currentIndex);
if (this.dataSource.filterValue === undefined) {
this.list = this.dataSource.filteredData;
} else {
this.list = this.list
.filter((x) => x.menuCategory.id !== this.dataSource.filterValue)
.concat(this.dataSource.filteredData);
}
this.data.next(this.list);
}
@ -95,7 +102,7 @@ export class ProductListComponent implements OnInit {
SaleCategory: 'saleCategory',
};
const csvData = new Blob([this.toCsv.toCsv(headers, this.dataSource.viewData)], {
const csvData = new Blob([this.toCsv.toCsv(headers, this.dataSource.filteredData)], {
type: 'text/csv;charset=utf-8;',
});
const link = document.createElement('a');

2
bookie/src/app/product/product.service.ts
View File

@ -35,7 +35,7 @@ export class ProductService {
}
listIsActiveOfCategory(id: string): Observable<Product[]> {
const options = { params: new HttpParams().set('mc', id).set('a', 'true') };
const options = { params: new HttpParams().set('mc', id) };
return <Observable<Product[]>>(
this.http
.get<Product[]>(`${url}/query`, options)