Buynow action fixes (#222)

Why? Bug Buy now action unable to add item to cart. If already Item present in cart. This change addresses the need by: Now buy now action works as expected. When user clicks on Buy Now If there is product added in cart already using Add to Cart then buy now will re-direct user to cart page. If a product is not added to cart then product is added to cart using Buy Now & user will redirected to cart page. [delivers #159394459]
aviabird · Aug 9, 2018 · f6b1e70 · f6b1e70
1 parent 3092280
commit f6b1e70
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 26 deletions.
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -68,9 +68,8 @@ import { ToastrModule } from 'ngx-toastr';
     Ng2UiAuthModule.forRoot(myAuthConfig),
     ToastrModule.forRoot({
       timeOut: 1500,
-      positionClass: 'toast-top-right',
+      positionClass: 'toast-top-center',
       preventDuplicates: true,
-      progressBar: true,
       progressAnimation: 'increasing'
     }),
     CoreModule,

diff --git a/...app/product/components/product-detail-page/product-details/product-details.component.html b/...app/product/components/product-detail-page/product-details/product-details.component.html
@@ -16,15 +16,20 @@ <h4 class="check-head">Check COD Availability</h4>
             <form [formGroup]="checkPincodeForm" (ngSubmit)="checkCodAvilability()" class="d-block">
               <div class="form-inline">
                 <div class="form-group mr-sm-3">
-                  <input type="text" class="form-control" name="pincode" placeholder="Postal/Pin code" formControlName="pincode" required>
+                  <input type="text" 
+                         class="form-control" 
+                         name="pincode" 
+                         placeholder="Postal/Pin code" 
+                         formControlName="pincode"
+                         onkeypress="return event.charCode >= 48 && event.charCode <= 57">
                 </div>
                 <button type="submit" class="btn themebtnprimarybasic" [disabled]=!checkPincodeForm.valid>Check</button>
-
               </div>
-              <p *ngIf="checkPincodeForm.get('pincode').hasError('required') &&  checkPincodeForm.get('pincode').touched" class="value-err text-danger show mt-3 ml-2 d-block">Pincode can't be blank!</p>
               <div *ngIf="isCodAvilable$ | async;let isCodAvilable" class="mt-2 msg">
-                <h5 *ngIf="isCodAvilable.available" class="text-success">CASH ON DELIVERY IS AVAILABLE!</h5>
-                <h5 *ngIf="!isCodAvilable.available" class="text-danger">CASH ON DELIVERY IS NOT AVAILABLE TO THIS POSTAL CODE.</h5>
+                <h5 *ngIf="isCodAvilable.available; else elseBlock" class="text-success">CASH ON DELIVERY IS AVAILABLE!</h5>
+                <ng-template #elseBlock>
+                  <h5 class="text-danger">CASH ON DELIVERY IS NOT AVAILABLE!</h5>
+                </ng-template>
               </div>
             </form>
           </div>
@@ -116,14 +121,19 @@ <h4 class="check-head">Check COD Availability</h4>
             <form [formGroup]="checkPincodeForm" (ngSubmit)="checkCodAvilability()" class="d-block">
               <div class="form-inline">
                 <div class="form-group mr-sm-3 mr-3">
-                  <input type="text" class="form-control mt-3 mt-sm-0" name="pincode" placeholder="Postal/Pin code" formControlName="pincode"
-                    required>
+                  <input type="text" 
+                  class="form-control mt-3 mt-sm-0" 
+                  name="pincode" placeholder="Postal/Pin code" 
+                  formControlName="pincode"
+                  onkeypress="return event.charCode >= 48 && event.charCode <= 57">
                 </div>
                 <button type="submit" class="btn themebtnprimarybasic" [disabled]=!checkPincodeForm.valid>Check</button>
                 <p *ngIf="checkPincodeForm.get('pincode').hasError('required') &&  checkPincodeForm.get('pincode').touched" class="value-err text-danger show mt-0 mt-sm-3 ml-0 ml-sm-2 d-block">Pincode can't be blank!</p>
                 <div *ngIf="isCodAvilable$ | async;let isCodAvilable" class="mt-2 msg">
-                  <h5 *ngIf="isCodAvilable.available" class="text-success">CASH ON DELIVERY IS AVAILABLE!</h5>
-                  <h5 *ngIf="!isCodAvilable.available" class="text-danger">CASH ON DELIVERY IS NOT AVAILABLE TO THIS POSTAL CODE.</h5>
+                  <h5 *ngIf="isCodAvilable.available; else elseBlock" class="text-success">CASH ON DELIVERY IS AVAILABLE!</h5>
+                  <ng-template #elseBlock>
+                    <h5 class="text-danger">CASH ON DELIVERY IS NOT AVAILABLE!</h5>
+                  </ng-template>
                 </div>
               </div>
             </form>
@@ -166,4 +176,4 @@ <h2>
   <div class="container">
     <app-product-review [product]="product" [isMobile]='isMobile' [reviewList]='reviewProducts$ | async'></app-product-review>
   </div>
-</div>
+</div>
diff --git a/src/app/product/components/product-detail-page/product-details/product-details.component.ts b/src/app/product/components/product-detail-page/product-details/product-details.component.ts
@@ -23,6 +23,7 @@ import { environment } from '../../../../../environments/environment';
 import { Taxon } from '../../../../core/models/taxon';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { CheckoutService } from '../../../../core/services/checkout.service';
+import { getLineItems } from '../../../../checkout/reducers/selectors';
 
 @Component({
   selector: 'app-product-details',
@@ -49,6 +50,7 @@ export class ProductDetailsComponent implements OnInit {
   brand: Taxon;
   checkPincodeForm: FormGroup;
   isCodAvilable$: Observable<any>;
+  linesItems: any
 
   constructor(
     private checkoutActions: CheckoutActions,
@@ -62,7 +64,9 @@ export class ProductDetailsComponent implements OnInit {
     private title: Title,
     private fb: FormBuilder,
     private checkoutService: CheckoutService
-  ) { }
+  ) {
+    // this.linesItems = this.store.select(getLineItems);
+  }
 
   ngOnInit() {
     this.screenwidth = window.innerWidth;
@@ -113,11 +117,25 @@ export class ProductDetailsComponent implements OnInit {
   }
 
   addToCart(event) {
+    let navigateToCart: boolean;
+    this.store.select(getLineItems)
+      .subscribe(res => {
+        this.linesItems = res
+      })
     if (event.buyNow) {
-      this.store.dispatch(
-        this.checkoutActions.addToCart(this.variantId, event.count)
-      );
-      setTimeout(() => { this.router.navigate(['checkout', 'cart']); }, 1500)
+      this.linesItems.find(item => {
+        if (item.variant_id === this.variantId && item.quantity === 1) {
+          navigateToCart = true
+        }
+      })
+      if (navigateToCart) {
+        this.router.navigate(['checkout', 'cart'])
+      } else {
+        this.store.dispatch(
+          this.checkoutActions.addToCart(this.variantId, event.count)
+        );
+        setTimeout(() => { this.router.navigate(['checkout', 'cart']); }, 1500)
+      }
     } else {
       this.store.dispatch(
         this.checkoutActions.addToCart(this.variantId, event.count)
@@ -202,11 +220,11 @@ export class ProductDetailsComponent implements OnInit {
 
   initForm() {
     const pincode = '';
-
     this.checkPincodeForm = this.fb.group({
       'pincode': [pincode, Validators.required]
     });
   }
+
   checkCodAvilability() {
     if (this.checkPincodeForm.valid) {
       const pincode = this.checkPincodeForm.value.pincode;

diff --git a/...omponents/product-detail-page/product-price-info/product-count/product-count.component.ts b/...omponents/product-detail-page/product-price-info/product-count/product-count.component.ts
@@ -56,14 +56,7 @@ export class ProductCountComponent implements OnInit {
   }
 
   buyNow(count: number) {
-    this.totalCartItems$.subscribe(cartCount => {
-      this.cartCount = cartCount
-    })
-    if (this.cartCount > 0) {
-      this.router.navigate(['checkout', 'cart']);
-    } else {
-      this.onAddToCart.emit({ count: count, buyNow: true });
-    }
+    this.onAddToCart.emit({ count: count, buyNow: true });
   }
 
   markAsFavorites() {

diff --git a/yarn.lock b/yarn.lock
@@ -475,6 +475,10 @@ amdefine@>=0.0.4:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
 
+angular-svg-round-progressbar@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/angular-svg-round-progressbar/-/angular-svg-round-progressbar-2.0.0.tgz#39fbad9deea6bc10efe74d4e8d99f61561589461"
+
 ansi-align@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/ansi-align/-/ansi-align-2.0.0.tgz#c36aeccba563b89ceb556f3690f0b1d9e3547f7f"