From 93b89131567923ed69ee794bac201c2e59e6663d Mon Sep 17 00:00:00 2001 From: Sanjith Sivapuram <59279@hexaware.com> Date: Fri, 17 Sep 2021 17:46:43 +0530 Subject: [PATCH] Angular Proxy and Spring Boot Apps --- .../cart/controller/CartController.java | 15 ++++-- .../cart/controller/ProductController.java | 48 ------------------- .../cart/controller/UserController.java | 36 -------------- .../cart/repository/CartRepository.java | 3 ++ .../src/main/resources/application.properties | 4 +- ShopifyUI/proxy.conf.json | 12 ++++- ShopifyUI/src/app/app-routing.module.ts | 6 +++ .../src/app/auth/login/login.component.css | 27 +++++++++++ .../src/app/auth/login/login.component.html | 42 +++++++++++++++- .../src/app/auth/login/login.component.ts | 33 ++++++++++++- .../app/auth/sign-up/sign-up.component.css | 33 +++++++++++++ .../app/auth/sign-up/sign-up.component.html | 42 +++++++++++++++- .../src/app/auth/sign-up/sign-up.component.ts | 34 ++++++++++++- .../app/components/cart/cart.component.css | 14 ++++++ .../app/components/cart/cart.component.html | 11 ++++- .../src/app/components/cart/cart.component.ts | 27 +++++++++-- .../app/components/home/home.component.css | 7 ++- .../app/components/home/home.component.html | 13 +++-- .../payments/payments.component.css | 17 +++++++ .../payments/payments.component.html | 32 ++++++++++++- .../components/payments/payments.component.ts | 16 ++++++- .../product-detail.component.css | 3 ++ .../product-detail.component.html | 29 ++++++++++- .../product-detail.component.ts | 31 +++++++++--- .../products/products.component.css | 4 +- .../products/products.component.html | 2 +- ShopifyUI/src/app/model/review.model.ts | 6 +++ ShopifyUI/src/app/service/cart.service.ts | 7 ++- ShopifyUI/src/app/service/product.service.ts | 2 +- ShopifyUI/src/app/service/review.service.ts | 12 ++++- ShopifyUI/src/styles.css | 4 ++ 31 files changed, 449 insertions(+), 123 deletions(-) delete mode 100644 Shopify-Cart/src/main/java/com/shopify/cart/controller/ProductController.java delete mode 100644 Shopify-Cart/src/main/java/com/shopify/cart/controller/UserController.java diff --git a/Shopify-Cart/src/main/java/com/shopify/cart/controller/CartController.java b/Shopify-Cart/src/main/java/com/shopify/cart/controller/CartController.java index e5d7424..c9ceac8 100644 --- a/Shopify-Cart/src/main/java/com/shopify/cart/controller/CartController.java +++ b/Shopify-Cart/src/main/java/com/shopify/cart/controller/CartController.java @@ -30,9 +30,18 @@ public class CartController { @PostMapping("/cart/{uid}/{pid}") public Cart postCart(@PathVariable("uid") Long uid, @PathVariable("pid") Long pid, @RequestBody Cart cart) { - cart.setUser(userRepository.getById(uid)); - cart.setProduct(productRepository.getById(pid)); - return cartRepository.save(cart); + List cartItems = cartRepository.findByUserAndProduct(uid,pid); + if (cartItems.size() > 0) { + Cart cartDB = cartItems.get(0); + cartDB.setQuantity(cartDB.getQuantity()+cart.getQuantity()); + cartDB.setPrice(cartDB.getProduct().getDiscountedPrice()*(cartDB.getQuantity())); + return cartRepository.save(cartDB); + } + else { + cart.setUser(userRepository.getById(uid)); + cart.setProduct(productRepository.getById(pid)); + return cartRepository.save(cart); + } } @GetMapping("/cart/{uid}") diff --git a/Shopify-Cart/src/main/java/com/shopify/cart/controller/ProductController.java b/Shopify-Cart/src/main/java/com/shopify/cart/controller/ProductController.java deleted file mode 100644 index 6410c1d..0000000 --- a/Shopify-Cart/src/main/java/com/shopify/cart/controller/ProductController.java +++ /dev/null @@ -1,48 +0,0 @@ -package com.shopify.cart.controller; - -import java.util.List; - -import org.springframework.beans.factory.annotation.Autowired; -import org.springframework.web.bind.annotation.CrossOrigin; -import org.springframework.web.bind.annotation.GetMapping; -import org.springframework.web.bind.annotation.PathVariable; -import org.springframework.web.bind.annotation.PostMapping; -import org.springframework.web.bind.annotation.RequestBody; -import org.springframework.web.bind.annotation.RequestMethod; -import org.springframework.web.bind.annotation.RestController; - -import com.shopify.cart.model.Product; -import com.shopify.cart.repository.ProductRepository; - -@RestController -public class ProductController { - - @Autowired - private ProductRepository productRepository; - - @PostMapping("/product") - public Product postProduct(@RequestBody Product product) { - return productRepository.save(product); - } - - @GetMapping("/product") - public List getAllProducts() { - return productRepository.findAll(); - } - - @GetMapping("/product/trending") - public List getAllTrendingProducts() { - return productRepository.findAllByTrending(); - } - - @GetMapping("/product/{pid}") - public Product getProductById(@PathVariable("pid") Long pid) { - return productRepository.getById(pid); - } - - @GetMapping("/product/name/{name}") - public List showProduct(@PathVariable String name) - { - return productRepository.findAllByName(name); - } -} diff --git a/Shopify-Cart/src/main/java/com/shopify/cart/controller/UserController.java b/Shopify-Cart/src/main/java/com/shopify/cart/controller/UserController.java deleted file mode 100644 index 420044d..0000000 --- a/Shopify-Cart/src/main/java/com/shopify/cart/controller/UserController.java +++ /dev/null @@ -1,36 +0,0 @@ -package com.shopify.cart.controller; - -import java.util.List; - -import org.springframework.beans.factory.annotation.Autowired; -import org.springframework.web.bind.annotation.GetMapping; -import org.springframework.web.bind.annotation.PathVariable; -import org.springframework.web.bind.annotation.PostMapping; -import org.springframework.web.bind.annotation.RequestBody; -import org.springframework.web.bind.annotation.RestController; - -import com.shopify.cart.model.User; -import com.shopify.cart.repository.UserRepository; - - -@RestController -public class UserController { - - @Autowired - private UserRepository userRepository; - - @PostMapping("/user") - public User postUser(@RequestBody User user) { - return userRepository.save(user); - } - - @GetMapping("/user") - public List getAllUser() { - return userRepository.findAll(); - } - - @GetMapping("/user/{uid}") - public User getUserById(@PathVariable("uid") Long uid) { - return userRepository.getById(uid); - } -} diff --git a/Shopify-Cart/src/main/java/com/shopify/cart/repository/CartRepository.java b/Shopify-Cart/src/main/java/com/shopify/cart/repository/CartRepository.java index 184f094..c8e543c 100644 --- a/Shopify-Cart/src/main/java/com/shopify/cart/repository/CartRepository.java +++ b/Shopify-Cart/src/main/java/com/shopify/cart/repository/CartRepository.java @@ -11,4 +11,7 @@ public interface CartRepository extends JpaRepository { @Query("select c from Cart c join c.user u where u.id=?1") List getCartByUserId(Long uid); + + @Query("select c from Cart c join c.user u join c.product p where u.id=?1 and p.id=?2") + List findByUserAndProduct(Long uid, Long pid); } diff --git a/Shopify-Cart/src/main/resources/application.properties b/Shopify-Cart/src/main/resources/application.properties index 32e3992..44b3588 100644 --- a/Shopify-Cart/src/main/resources/application.properties +++ b/Shopify-Cart/src/main/resources/application.properties @@ -1,10 +1,10 @@ server.port=8002 -spring.datasource.url=jdbc:mysql://10.3.117.22:3306/Shopify_DB?createDatabaseIfNotExist=true +spring.datasource.url=jdbc:mysql://10.3.117.26:3306/Shopify_DB?createDatabaseIfNotExist=true spring.datasource.username=testuser spring.datasource.password=PASSWORD123 -server.servlet.context-path=/api +server.servlet.context-path=/api2 spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.MySQL5Dialect diff --git a/ShopifyUI/proxy.conf.json b/ShopifyUI/proxy.conf.json index ea8630f..b722973 100644 --- a/ShopifyUI/proxy.conf.json +++ b/ShopifyUI/proxy.conf.json @@ -1,6 +1,14 @@ { - "/api": { - "target": "http://10.3.117.22:8002", + "/api1": { + "target": "http://10.3.117.26:8001", + "secure": false + }, + "/api2": { + "target": "http://10.3.117.26:8002", + "secure": false + }, + "/api3": { + "target": "http://10.3.117.26:8003", "secure": false } } \ No newline at end of file diff --git a/ShopifyUI/src/app/app-routing.module.ts b/ShopifyUI/src/app/app-routing.module.ts index 438c5c0..4b229cc 100644 --- a/ShopifyUI/src/app/app-routing.module.ts +++ b/ShopifyUI/src/app/app-routing.module.ts @@ -1,7 +1,10 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; +import { LoginComponent } from './auth/login/login.component'; +import { SignUpComponent } from './auth/sign-up/sign-up.component'; import { CartComponent } from './components/cart/cart.component'; import { HomeComponent } from './components/home/home.component'; +import { PaymentsComponent } from './components/payments/payments.component'; import { ProductDetailComponent } from './components/product-detail/product-detail.component'; import { ProductsComponent } from './components/products/products.component'; @@ -11,6 +14,9 @@ const routes: Routes = [ { path: 'products', component: ProductsComponent}, { path: 'products/:product_id', component: ProductDetailComponent}, { path: 'cart/:user_id', component: CartComponent}, + { path: 'payment', component: PaymentsComponent}, + { path: 'login', component: LoginComponent}, + { path: 'signup', component: SignUpComponent} ]; @NgModule({ diff --git a/ShopifyUI/src/app/auth/login/login.component.css b/ShopifyUI/src/app/auth/login/login.component.css index e69de29..bd0e7c0 100644 --- a/ShopifyUI/src/app/auth/login/login.component.css +++ b/ShopifyUI/src/app/auth/login/login.component.css @@ -0,0 +1,27 @@ +.login_form { + margin: 0px auto; + border: none; + padding: 16px; + height: 440px; + box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -webkit-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -moz-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + } + + .login_form input { + width: 100%; + height: 45px; + padding: 12px; + } + + .login_form button { + border: none; + background-color: #1F618D; + color: white; + padding: 12px 16px; + width: 100%; + } + +.login_form p { + color: #E74C3C; +} \ No newline at end of file diff --git a/ShopifyUI/src/app/auth/login/login.component.html b/ShopifyUI/src/app/auth/login/login.component.html index 147cfc4..83b244a 100644 --- a/ShopifyUI/src/app/auth/login/login.component.html +++ b/ShopifyUI/src/app/auth/login/login.component.html @@ -1 +1,41 @@ -

login works!

+
+
+

Shopify

+
+
+ Home +
+
+ Products +
+
+





+
+ +
+
+
+ {{msg}} +
+
+
+
+
+

Don't have an account ? Sign Up

+
+
\ No newline at end of file diff --git a/ShopifyUI/src/app/auth/login/login.component.ts b/ShopifyUI/src/app/auth/login/login.component.ts index 4f58421..4d211ba 100644 --- a/ShopifyUI/src/app/auth/login/login.component.ts +++ b/ShopifyUI/src/app/auth/login/login.component.ts @@ -1,4 +1,8 @@ import { Component, OnInit } from '@angular/core'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; +import { Router } from '@angular/router'; +import { User } from 'src/app/model/user.model'; +import { UserService } from 'src/app/service/user.service'; @Component({ selector: 'app-login', @@ -7,9 +11,36 @@ import { Component, OnInit } from '@angular/core'; }) export class LoginComponent implements OnInit { - constructor() { } + loginForm: FormGroup; + msg: String; + + constructor(private userService: UserService ,private route: Router) { + this.loginForm = new FormGroup({ + username: new FormControl(''), + password: new FormControl('') + }) + } ngOnInit(): void { + this.loginForm = new FormGroup({ + username: new FormControl('', Validators.required), + password: new FormControl('', Validators.required) + }) } + onLoginFormSubmit() { + let user: User = { + username: this.loginForm.value.username, + password: this.loginForm.value.password + } + // this.userService.loginUser(user).subscribe(data => { + // window.sessionStorage.setItem("username", user.username); + // window.sessionStorage.setItem("authcode", btoa(user.username + ":" + user.password)); + // window.sessionStorage.setItem("isLoggedIn", "true"); + // this.route.navigateByUrl("/"); + // }, + // (err: any) => { + // this.msg = "Invalid Credentials" + // }) + } } diff --git a/ShopifyUI/src/app/auth/sign-up/sign-up.component.css b/ShopifyUI/src/app/auth/sign-up/sign-up.component.css index e69de29..b070a5a 100644 --- a/ShopifyUI/src/app/auth/sign-up/sign-up.component.css +++ b/ShopifyUI/src/app/auth/sign-up/sign-up.component.css @@ -0,0 +1,33 @@ +.login_form { + margin: 0px auto; + border: none; + padding: 16px; + height: 570px; + box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -webkit-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -moz-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + } + + .login_form input { + width: 100%; + height: 45px; + padding: 12px; + } + + .login_form button { + border: none; + background-color: #1F618D; + color: white; + padding: 12px 16px; + width: 100%; + } + + .login_form select { + width: 100%; + height: 45px; + } + +.login_form p { + color: #E74C3C; +} + \ No newline at end of file diff --git a/ShopifyUI/src/app/auth/sign-up/sign-up.component.html b/ShopifyUI/src/app/auth/sign-up/sign-up.component.html index 7e8b79f..f6a4244 100644 --- a/ShopifyUI/src/app/auth/sign-up/sign-up.component.html +++ b/ShopifyUI/src/app/auth/sign-up/sign-up.component.html @@ -1 +1,41 @@ -

sign-up works!

+
+
+

Shopify

+
+
+ Home +
+
+ Products +
+
+





+
+ +
+
+
+
+

Already have an account ? Login

+
+
\ No newline at end of file diff --git a/ShopifyUI/src/app/auth/sign-up/sign-up.component.ts b/ShopifyUI/src/app/auth/sign-up/sign-up.component.ts index ec35435..5616eec 100644 --- a/ShopifyUI/src/app/auth/sign-up/sign-up.component.ts +++ b/ShopifyUI/src/app/auth/sign-up/sign-up.component.ts @@ -1,4 +1,8 @@ import { Component, OnInit } from '@angular/core'; +import { FormControl, FormGroup, Validators } from '@angular/forms'; +import { Router } from '@angular/router'; +import { User } from 'src/app/model/user.model'; +import { UserService } from 'src/app/service/user.service'; @Component({ selector: 'app-sign-up', @@ -7,9 +11,37 @@ import { Component, OnInit } from '@angular/core'; }) export class SignUpComponent implements OnInit { - constructor() { } + signUpForm: FormGroup; + msg: String; + + constructor(private userService: UserService, private route: Router) { + this.signUpForm = new FormGroup({ + name: new FormControl(''), + username: new FormControl(''), + password: new FormControl(''), + }) + } ngOnInit(): void { + this.signUpForm = new FormGroup({ + name: new FormControl('', Validators.required), + username: new FormControl('', Validators.required), + password: new FormControl('', Validators.required) + }) + } + + onSignUpFormSubmit() { + let user: User = { + name: this.signUpForm.value.name, + username: this.signUpForm.value.username, + password: this.signUpForm.value.password, + } + // this.userService.postUser(user).subscribe(data => { + // this.route.navigateByUrl("/login?msg=sign-up%20success"); + // }, + // (err: any) => { + // this.msg = "Could Not Sign In"; + // }) } } diff --git a/ShopifyUI/src/app/components/cart/cart.component.css b/ShopifyUI/src/app/components/cart/cart.component.css index 43e3639..e06bcc1 100644 --- a/ShopifyUI/src/app/components/cart/cart.component.css +++ b/ShopifyUI/src/app/components/cart/cart.component.css @@ -48,4 +48,18 @@ .cart-content h3 { color: #1B4F72; padding-left: 50px; +} + +.deleteBtn button { + background-color: transparent; + border: 1px solid #E74C3C; + border-radius: 20px; + color: #E74C3C; + padding: 12px 16px; + transition: 0.2s all linear; +} + +.deleteBtn button:hover { + background-color: #E74C3C; + color: white; } \ No newline at end of file diff --git a/ShopifyUI/src/app/components/cart/cart.component.html b/ShopifyUI/src/app/components/cart/cart.component.html index fb05117..bd442c0 100644 --- a/ShopifyUI/src/app/components/cart/cart.component.html +++ b/ShopifyUI/src/app/components/cart/cart.component.html @@ -53,9 +53,16 @@
- +
+
+
+
+ +
+
+
@@ -67,6 +74,6 @@

Total : Rs {{totalPrice}}

- +
\ 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 b4d928e..71c077f 100644 --- a/ShopifyUI/src/app/components/cart/cart.component.ts +++ b/ShopifyUI/src/app/components/cart/cart.component.ts @@ -26,10 +26,11 @@ export class CartComponent implements OnInit { }) } - increaseQty(cid:number,quantity:number,price:number) { + increaseQty(cid:number,quantity:number,discountPrice:number) { + this.totalPrice = 0; console.log("Increase Quantity") let qty:number = quantity + 1; - let amount:number = price*qty; + let amount:number = discountPrice*qty; let cart:Cart = { quantity : qty, price : amount @@ -49,8 +50,9 @@ export class CartComponent implements OnInit { } decreaseQty(cid:number,quantity:number,price:number) { + this.totalPrice = 0; console.log("Decrease Quantity") - let amount:number = price/quantity; + let amount:number = price-(price/quantity); let qty:number = quantity - 1; let cart:Cart = { quantity : qty, @@ -70,4 +72,23 @@ export class CartComponent implements OnInit { }) } + deleteCartItems(cid:number) { + this.totalPrice = 0; + this.cartService.deleteCartItem(cid).subscribe(data => { + this.cartItems.forEach((i, index) => { + if (i.cart_id == cid) { + this.cartItems.splice(index, 1); + } + }) + this.cartService.getCartByUser(this.uid).subscribe(data1 => { + this.cartNo = data1.length; + this.cartItems=data1; + console.log(this.cartItems) + this.cartItems.forEach((i,index) => { + this.totalPrice = this.totalPrice + i.price; + }) + }) + }) + } + } diff --git a/ShopifyUI/src/app/components/home/home.component.css b/ShopifyUI/src/app/components/home/home.component.css index 5e9a55b..ea44c56 100644 --- a/ShopifyUI/src/app/components/home/home.component.css +++ b/ShopifyUI/src/app/components/home/home.component.css @@ -8,8 +8,11 @@ } .home-heading { - font-size: 13em; - font-weight: 500; + font-size: 7em; + font-weight: 700; + /* background-repeat: no-repeat; + background-size: contain; + background-position: center; */ } .product { diff --git a/ShopifyUI/src/app/components/home/home.component.html b/ShopifyUI/src/app/components/home/home.component.html index 2ce5d44..ea82ac0 100644 --- a/ShopifyUI/src/app/components/home/home.component.html +++ b/ShopifyUI/src/app/components/home/home.component.html @@ -17,17 +17,20 @@
-
- +
+

Welcome To Shopify

-
-

{{searchValue}}

+
-

Welcome To Shopify

Find the products you like.....

+
+
+ +
+
diff --git a/ShopifyUI/src/app/components/payments/payments.component.css b/ShopifyUI/src/app/components/payments/payments.component.css index e69de29..f5d49ee 100644 --- a/ShopifyUI/src/app/components/payments/payments.component.css +++ b/ShopifyUI/src/app/components/payments/payments.component.css @@ -0,0 +1,17 @@ +.paymentLine { + margin: 0px auto; + box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -webkit-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -moz-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + padding: 12px; + color: #1B4F72; +} + +.payBtn button { + border: 1px solid transparent; + padding: 12px 14px; + border-radius: 20px; + color: white; + background-color: #2E86C1; + width: 95%; +} \ No newline at end of file diff --git a/ShopifyUI/src/app/components/payments/payments.component.html b/ShopifyUI/src/app/components/payments/payments.component.html index 3d70d6c..9b0754b 100644 --- a/ShopifyUI/src/app/components/payments/payments.component.html +++ b/ShopifyUI/src/app/components/payments/payments.component.html @@ -1 +1,31 @@ -

payments works!

+
+
+

Shopify

+
+
+ Home +
+
+ Products +
+
+ {{cartNo}}  Cart +
+
+ Login +
+
+

+
+
+
+

We only take cash on delivery

+
+
+
+

+
+
+ +
+
\ No newline at end of file diff --git a/ShopifyUI/src/app/components/payments/payments.component.ts b/ShopifyUI/src/app/components/payments/payments.component.ts index b82cd73..302798e 100644 --- a/ShopifyUI/src/app/components/payments/payments.component.ts +++ b/ShopifyUI/src/app/components/payments/payments.component.ts @@ -1,4 +1,6 @@ import { Component, OnInit } from '@angular/core'; +import { Cart } from 'src/app/model/cart.model'; +import { CartService } from 'src/app/service/cart.service'; @Component({ selector: 'app-payments', @@ -7,9 +9,21 @@ import { Component, OnInit } from '@angular/core'; }) export class PaymentsComponent implements OnInit { - constructor() { } + uid:string = "1"; + cartNo: number = 0; + cartItems: Cart[] = []; + totalPrice: number = 0; + constructor(private cartService: CartService) { } ngOnInit(): void { + this.cartService.getCartByUser(this.uid).subscribe(data1 => { + this.cartNo = data1.length; + this.cartItems=data1; + console.log(this.cartItems) + this.cartItems.forEach((i,index) => { + this.totalPrice = this.totalPrice + i.price; + }) + }) } } diff --git a/ShopifyUI/src/app/components/product-detail/product-detail.component.css b/ShopifyUI/src/app/components/product-detail/product-detail.component.css index 3648424..500b290 100644 --- a/ShopifyUI/src/app/components/product-detail/product-detail.component.css +++ b/ShopifyUI/src/app/components/product-detail/product-detail.component.css @@ -15,3 +15,6 @@ width: 95%; } +.username { + font-weight: 700; +} \ No newline at end of file diff --git a/ShopifyUI/src/app/components/product-detail/product-detail.component.html b/ShopifyUI/src/app/components/product-detail/product-detail.component.html index 5be82a4..f7d45fd 100644 --- a/ShopifyUI/src/app/components/product-detail/product-detail.component.html +++ b/ShopifyUI/src/app/components/product-detail/product-detail.component.html @@ -39,13 +39,38 @@ {{product.description}}
- +
+

Qty :  

- +
+

+
+
+

Reviews

+
+
+
+
+
+
+

{{r.username}}

+
+
+

{{r.rating}} of 5

+
+
+
+
+

{{r.reviewText}}

+
+
+
+
+ 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 a26d799..70e7922 100644 --- a/ShopifyUI/src/app/components/product-detail/product-detail.component.ts +++ b/ShopifyUI/src/app/components/product-detail/product-detail.component.ts @@ -2,8 +2,10 @@ 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 { ReviewDto } from 'src/app/model/review.model'; import { CartService } from 'src/app/service/cart.service'; import { ProductService } from 'src/app/service/product.service'; +import { ReviewService } from 'src/app/service/review.service'; @Component({ selector: 'app-product-detail', @@ -11,14 +13,15 @@ import { ProductService } from 'src/app/service/product.service'; styleUrls: ['./product-detail.component.css'], }) export class ProductDetailComponent implements OnInit { - pid:string; - uid:string = "10"; + pid:any; + uid:string = "1"; product:Product; currentRating:any = []; rating:any = []; - quantity:number; + quantity:number = 1; cartNo:number = 0; - constructor(private actRouter:ActivatedRoute, private productService:ProductService, private cartService:CartService) { } + reviewDtos: ReviewDto[] = []; + constructor(private actRouter:ActivatedRoute, private productService:ProductService, private cartService:CartService,private reviewService:ReviewService) { } ngOnInit(): void { this.cartService.getCartByUser(this.uid).subscribe(data1 => { @@ -37,13 +40,27 @@ export class ProductDetailComponent implements OnInit { } console.log(this.rating,this.currentRating); }) - } - - addToCart() { + this.reviewService.getReviewsByProduct(this.pid).subscribe(data => { + this.reviewDtos = data; + }) } onQuantityEnter(value: string) { this.quantity = +value; } + addToCart(discountedPrice: number) { + console.log("addtocart") + let cartData:Cart = { + quantity : this.quantity, + price: discountedPrice + } + console.log(cartData) + this.cartService.postCart(cartData,this.uid,this.pid).subscribe(data => { + this.cartService.getCartByUser(this.uid).subscribe(data1 => { + this.cartNo = data1.length; + }) + }) + } + } diff --git a/ShopifyUI/src/app/components/products/products.component.css b/ShopifyUI/src/app/components/products/products.component.css index 9365493..a012313 100644 --- a/ShopifyUI/src/app/components/products/products.component.css +++ b/ShopifyUI/src/app/components/products/products.component.css @@ -4,7 +4,9 @@ } .product { - box-shadow: 10px 10px 19px 0px rgba(0,0,0,0.69); + box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -webkit-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); + -moz-box-shadow: 2px 4px 14px 0px rgba(0, 0, 0, 0.74); margin: 0px auto; border-radius: 20px; width: 95%; diff --git a/ShopifyUI/src/app/components/products/products.component.html b/ShopifyUI/src/app/components/products/products.component.html index 918b266..7154203 100644 --- a/ShopifyUI/src/app/components/products/products.component.html +++ b/ShopifyUI/src/app/components/products/products.component.html @@ -36,7 +36,7 @@
- {{p.name}} + {{p.name}}
diff --git a/ShopifyUI/src/app/model/review.model.ts b/ShopifyUI/src/app/model/review.model.ts index e69de29..ebe86c0 100644 --- a/ShopifyUI/src/app/model/review.model.ts +++ b/ShopifyUI/src/app/model/review.model.ts @@ -0,0 +1,6 @@ +export class ReviewDto { + reviewText:string; + rating:number; + username:string; + product_name: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 11d3f72..c6cd52f 100644 --- a/ShopifyUI/src/app/service/cart.service.ts +++ b/ShopifyUI/src/app/service/cart.service.ts @@ -8,7 +8,7 @@ import { Cart } from '../model/cart.model'; }) export class CartService { - path:String = "http://localhost:59279/api"; + path:String = "http://localhost:59279/api2"; constructor(private httpClent:HttpClient) { } @@ -26,4 +26,9 @@ export class CartService { let cart_get_api = this.path + "/cart/" + cid; return this.httpClent.put(cart_get_api,cart); } + + public deleteCartItem(cid:number): Observable { + let cart_delete_api = this.path + "/cart/" + cid; + return this.httpClent.delete(cart_delete_api); + } } diff --git a/ShopifyUI/src/app/service/product.service.ts b/ShopifyUI/src/app/service/product.service.ts index e63cdfa..245a785 100644 --- a/ShopifyUI/src/app/service/product.service.ts +++ b/ShopifyUI/src/app/service/product.service.ts @@ -8,7 +8,7 @@ import { Product } from '../model/product.model'; }) export class ProductService { - path:string = "http://localhost:59279/api"; + path:string = "http://localhost:59279/api1"; constructor(private httpClient:HttpClient) { } diff --git a/ShopifyUI/src/app/service/review.service.ts b/ShopifyUI/src/app/service/review.service.ts index 6b2fce6..3bbd46e 100644 --- a/ShopifyUI/src/app/service/review.service.ts +++ b/ShopifyUI/src/app/service/review.service.ts @@ -1,9 +1,19 @@ +import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; +import { Observable } from 'rxjs'; +import { ReviewDto } from '../model/review.model'; @Injectable({ providedIn: 'root' }) export class ReviewService { - constructor() { } + path:string = "http://localhost:59279/api3"; + + constructor(private httpClient:HttpClient) { } + + public getReviewsByProduct(pid:string): Observable { + let review_get_api = this.path + "/review/product?pid=" + pid; + return this.httpClient.get(review_get_api); + } } diff --git a/ShopifyUI/src/styles.css b/ShopifyUI/src/styles.css index 261c74d..5e0c58e 100644 --- a/ShopifyUI/src/styles.css +++ b/ShopifyUI/src/styles.css @@ -12,6 +12,10 @@ body { background-color: #1B4F72 !important; } +.navbar h2 { + font-weight: 700 !important; +} + .navbar a { padding: 12px; margin: 0px;