cart works!
+ \ No newline at end of file diff --git a/ShopifyUI/src/app/components/cart/cart.component.ts b/ShopifyUI/src/app/components/cart/cart.component.ts index 2ea3717..d70a5d4 100644 --- a/ShopifyUI/src/app/components/cart/cart.component.ts +++ b/ShopifyUI/src/app/components/cart/cart.component.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import { CartService } from 'src/app/service/cart.service'; @Component({ selector: 'app-cart', @@ -7,9 +8,14 @@ import { Component, OnInit } from '@angular/core'; }) export class CartComponent implements OnInit { - constructor() { } + cartNo:number = 0; + uid:string = "10"; + constructor(private cartService:CartService) { } ngOnInit(): void { + this.cartService.getCartByUser(this.uid).subscribe(data1 => { + this.cartNo = data1.length; + }) } } diff --git a/ShopifyUI/src/app/components/home/home.component.html b/ShopifyUI/src/app/components/home/home.component.html index 2086c7a..bcc1f6a 100644 --- a/ShopifyUI/src/app/components/home/home.component.html +++ b/ShopifyUI/src/app/components/home/home.component.html @@ -1,6 +1,6 @@-
+
+
+
diff --git a/ShopifyUI/src/app/components/product-detail/product-detail.component.ts b/ShopifyUI/src/app/components/product-detail/product-detail.component.ts
index b8eb53a..a26d799 100644
--- a/ShopifyUI/src/app/components/product-detail/product-detail.component.ts
+++ b/ShopifyUI/src/app/components/product-detail/product-detail.component.ts
@@ -1,25 +1,49 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
+import { Cart } from 'src/app/model/cart.model';
import { Product } from 'src/app/model/product.model';
+import { CartService } from 'src/app/service/cart.service';
import { ProductService } from 'src/app/service/product.service';
@Component({
selector: 'app-product-detail',
templateUrl: './product-detail.component.html',
- styleUrls: ['./product-detail.component.css']
+ styleUrls: ['./product-detail.component.css'],
})
export class ProductDetailComponent implements OnInit {
pid:string;
+ uid:string = "10";
product:Product;
- constructor(private actRouter:ActivatedRoute, private productService:ProductService) { }
+ currentRating:any = [];
+ rating:any = [];
+ quantity:number;
+ cartNo:number = 0;
+ constructor(private actRouter:ActivatedRoute, private productService:ProductService, private cartService:CartService) { }
ngOnInit(): void {
+ this.cartService.getCartByUser(this.uid).subscribe(data1 => {
+ this.cartNo = data1.length;
+ })
this.actRouter.paramMap.subscribe(params => {
this.pid = params.get("product_id");
})
this.productService.getProductById(this.pid).subscribe(data => {
this.product = data;
+ for(let i=1;i<=this.product.rating;i++) {
+ this.currentRating.push(0);
+ }
+ for(let i=1;i<=(5-this.product.rating);i++) {
+ this.rating.push(0);
+ }
+ console.log(this.rating,this.currentRating);
})
}
+ addToCart() {
+ }
+
+ onQuantityEnter(value: string) {
+ this.quantity = +value;
+ }
+
}
diff --git a/ShopifyUI/src/app/components/products/products.component.css b/ShopifyUI/src/app/components/products/products.component.css
index afaabd2..9365493 100644
--- a/ShopifyUI/src/app/components/products/products.component.css
+++ b/ShopifyUI/src/app/components/products/products.component.css
@@ -39,3 +39,28 @@
padding: 16px 12px;
float: right;
}
+
+.pageBtn button {
+ color: #1F618D;
+ background-color: transparent;
+ border: none;
+ font-size: 2em;
+ transition: 0.2s all linear;
+}
+
+.pageBtn button:disabled {
+ opacity: 0.5;
+}
+
+.search-btn {
+ transform: translate(0px,5px);
+}
+
+.cartBtn button {
+ border: 1px solid transparent;
+ padding: 12px 14px;
+ border-radius: 20px;
+ color: white;
+ background-color: #2E86C1;
+ width: 20%;
+}
\ No newline at end of file
diff --git a/ShopifyUI/src/app/components/products/products.component.html b/ShopifyUI/src/app/components/products/products.component.html
index 146f63a..918b266 100644
--- a/ShopifyUI/src/app/components/products/products.component.html
+++ b/ShopifyUI/src/app/components/products/products.component.html
@@ -9,7 +9,7 @@
Products
{{product.name}}
- 
+
+
+ +
+
+
+
+ {{product.description}} +
+ Product Description :
++ {{product.description}} +
+
+
+
+
+
Qty :
+
- Cart
+ {{cartNo}} Cart
Login
@@ -17,8 +17,11 @@
-
@@ -49,12 +52,11 @@
-
-
+
+
@@ -49,12 +52,11 @@
Discount Price : Rs {{p.discountedPrice}}
-
-
Qty :
- +
+ {
+ let cart_post_api = this.path + "/cart/" + uid + "/" + pid;
+ return this.httpClent.post(cart_post_api,cart);
+ }
+
+ public getCartByUser(uid:string): Observable {
+ let cart_post_api = this.path + "/cart/" + uid;
+ return this.httpClent.get(cart_post_api);
}
}
diff --git a/ShopifyUI/src/app/service/product.service.ts b/ShopifyUI/src/app/service/product.service.ts
index 557e2fc..badfaa3 100644
--- a/ShopifyUI/src/app/service/product.service.ts
+++ b/ShopifyUI/src/app/service/product.service.ts
@@ -8,12 +8,12 @@ import { Product } from '../model/product.model';
})
export class ProductService {
- path:String = "http://localhost:9999";
+ path:string = "http://localhost:59279/api";
constructor(private httpClient:HttpClient) { }
public getAllProducts(): Observable {
- let product_get_api = this.path + '/product';
+ let product_get_api = this.path + '/product';
return this.httpClient.get(product_get_api);
}
@@ -21,4 +21,9 @@ export class ProductService {
let product_get_api = this.path + '/product/' + pid;
return this.httpClient.get(product_get_api);
}
+
+ public getByProductName(pname:string): Observable {
+ let product_get_api = this.path + '/product/name/' + pname;
+ return this.httpClient.get(product_get_api);
+ }
}
diff --git a/ShopifyUI/src/polyfills.ts b/ShopifyUI/src/polyfills.ts
index 373f538..83dc6f4 100644
--- a/ShopifyUI/src/polyfills.ts
+++ b/ShopifyUI/src/polyfills.ts
@@ -1,3 +1,7 @@
+/***************************************************************************************************
+ * Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
+ */
+import '@angular/localize/init';
/**
* This file includes polyfills needed by Angular and is loaded before the app.
* You can add your own extra polyfills to this file.
diff --git a/ShopifyUI/src/styles.css b/ShopifyUI/src/styles.css
index 502672e..261c74d 100644
--- a/ShopifyUI/src/styles.css
+++ b/ShopifyUI/src/styles.css
@@ -10,11 +10,10 @@ body {
.navbar {
padding-left: 45px;
background-color: #1B4F72 !important;
- z-index: 100;
}
.navbar a {
- padding: 12px 20px;
+ padding: 12px;
margin: 0px;
text-decoration: none;
color: white;
@@ -67,7 +66,7 @@ body {
}
.searchBar input {
- width: 95%;
+ width: 90%;
height: 45px;
padding: 12px;
border-radius: 20px;
+
-
+
diff --git a/ShopifyUI/src/app/components/products/products.component.ts b/ShopifyUI/src/app/components/products/products.component.ts
index e8a804a..3f21429 100644
--- a/ShopifyUI/src/app/components/products/products.component.ts
+++ b/ShopifyUI/src/app/components/products/products.component.ts
@@ -1,5 +1,8 @@
import { Component, OnInit } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { Cart } from 'src/app/model/cart.model';
import { Product } from 'src/app/model/product.model';
+import { CartService } from 'src/app/service/cart.service';
import { ProductService } from 'src/app/service/product.service';
@Component({
@@ -9,23 +12,49 @@ import { ProductService } from 'src/app/service/product.service';
})
export class ProductsComponent implements OnInit {
+ cartNo:number = 0;
searchValue: string = '';
- quantity:number;
products: Product[] = [];
- constructor(private productService: ProductService) { }
+ searchForm: FormGroup;
+ prodName:string;
+ uid:string = "10";
+ constructor(private productService: ProductService,private cartService: CartService) {
+ this.searchForm = new FormGroup({
+ prodName: new FormControl('')
+ })
+ }
ngOnInit(): void {
+ console.log("In Product Component");
+ this.searchForm = new FormGroup({
+ prodName: new FormControl('', Validators.required)
+ })
this.productService.getAllProducts().subscribe(data => {
this.products = data;
console.log(this.products)
})
+ this.cartService.getCartByUser(this.uid).subscribe(data1 => {
+ this.cartNo = data1.length;
+ })
}
- onSearchEnter(value: string) {
- this.searchValue = value;
+ onChangeSearchSubmit() {
+ this.prodName = this.searchForm.value.prodName;
+ this.productService.getByProductName(this.prodName).subscribe(data => {
+ this.products = data;
+ })
}
- onQuantityEnter(value: string) {
- this.quantity = +value;
+ addToCart(discountedPrice: number,pid:number) {
+ console.log("addtocart")
+ let cartData:Cart = {
+ quantity : 1,
+ price: discountedPrice
+ }
+ this.cartService.postCart(cartData,this.uid,pid).subscribe(data => {
+ this.cartService.getCartByUser(this.uid).subscribe(data1 => {
+ this.cartNo = data1.length;
+ })
+ })
}
}
diff --git a/ShopifyUI/src/app/model/cart.model.ts b/ShopifyUI/src/app/model/cart.model.ts
index e69de29..70cc9aa 100644
--- a/ShopifyUI/src/app/model/cart.model.ts
+++ b/ShopifyUI/src/app/model/cart.model.ts
@@ -0,0 +1,11 @@
+import { Product } from "./product.model";
+import { User } from "./user.model";
+
+export class Cart {
+ id?:Number;
+ user?: User;
+ product?: Product;
+ quantity: number;
+ price: number;
+ }
+
\ No newline at end of file
diff --git a/ShopifyUI/src/app/model/product.model.ts b/ShopifyUI/src/app/model/product.model.ts
index 2cb71c1..0bae0bb 100644
--- a/ShopifyUI/src/app/model/product.model.ts
+++ b/ShopifyUI/src/app/model/product.model.ts
@@ -1,10 +1,10 @@
export class Product {
- id?:Number;
+ id?:number;
name:String;
imageUrl:string;
description:String;
- rating:Number;
- marketRetailPrice:DoubleRange;
+ rating:number;
+ marketRetailPrice:number;
discount:Number;
- discountedPrice:DoubleRange;
+ discountedPrice:number;
}
diff --git a/ShopifyUI/src/app/model/user.model.ts b/ShopifyUI/src/app/model/user.model.ts
index e69de29..99eb847 100644
--- a/ShopifyUI/src/app/model/user.model.ts
+++ b/ShopifyUI/src/app/model/user.model.ts
@@ -0,0 +1,13 @@
+export class User {
+ id?:Number;
+ name?: string;
+ username: string;
+ password: string;
+ mobileNumber?: string;
+ emailId?: string;
+ address?: string;
+ city?: string;
+ state?: string;
+ country?: string;
+ pinCode?: string;
+}
\ No newline at end of file
diff --git a/ShopifyUI/src/app/service/cart.service.ts b/ShopifyUI/src/app/service/cart.service.ts
index 37064b8..17c6e9d 100644
--- a/ShopifyUI/src/app/service/cart.service.ts
+++ b/ShopifyUI/src/app/service/cart.service.ts
@@ -1,16 +1,24 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { Cart } from '../model/cart.model';
@Injectable({
providedIn: 'root'
})
export class CartService {
- path:String = "http://localhost:9999";
+ path:String = "http://localhost:59279/api";
constructor(private httpClent:HttpClient) { }
- public postCart() {
-
+ public postCart(cart:Cart,uid:string,pid:number): Observable