You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
59 lines
1.7 KiB
TypeScript
59 lines
1.7 KiB
TypeScript
import { Component, OnInit } from '@angular/core';
|
|
import { Product } from '../../models/product';
|
|
import { ActivatedRoute } from "@angular/router"
|
|
import { HttpService } from 'src/app/services/http.service';
|
|
import { CartService } from 'src/app/services/cart.service';
|
|
import { FormControl } from '@angular/forms';
|
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
|
|
|
@Component({
|
|
selector: 'app-product-item-details',
|
|
templateUrl: './product-item-details.component.html',
|
|
styleUrls: ['./product-item-details.component.scss']
|
|
})
|
|
export class ProductItemDetailsComponent implements OnInit {
|
|
disableSelect = new FormControl(false);
|
|
product: Product =
|
|
{
|
|
id: 1,
|
|
name: "",
|
|
price: 0,
|
|
url: "",
|
|
description: "",
|
|
quantity: 0
|
|
}
|
|
productId: number = 0
|
|
quantity: string = '1'
|
|
|
|
snackBarDuration = 7;
|
|
|
|
constructor(
|
|
private httpService: HttpService,
|
|
private route: ActivatedRoute,
|
|
private cartService: CartService,
|
|
private _snackBar: MatSnackBar
|
|
) { }
|
|
|
|
ngOnInit(): void {
|
|
this.productId = parseInt(this.route.snapshot.paramMap.get('id') as string, 10);
|
|
|
|
this.httpService.getProducts().subscribe((res: Product[]) => {
|
|
this.product = res.filter(item => item.id === this.productId)[0];
|
|
})
|
|
|
|
}
|
|
|
|
addToCart(product: Product) {
|
|
this.product.quantity = parseInt(this.quantity)
|
|
this.cartService.addToCart(product);
|
|
this.openSnackBar(product.name, product.quantity)
|
|
}
|
|
|
|
openSnackBar(productName: string, productQuantity: number) {
|
|
this._snackBar.open( productName + " x" + productQuantity + " " + "added to cart", 'Close', {
|
|
duration: this.snackBarDuration * 100
|
|
});
|
|
}
|
|
|
|
}
|