Skip to content

Commit

Permalink
Buynow action fixes (#222)
Browse files Browse the repository at this point in the history
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]
  • Loading branch information
gopalshimpi authored and pkrawat1 committed Aug 9, 2018
1 parent 3092280 commit f6b1e70
Show file tree
Hide file tree
Showing 5 changed files with 50 additions and 26 deletions.
3 changes: 1 addition & 2 deletions src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -166,4 +176,4 @@ <h2>
<div class="container">
<app-product-review [product]="product" [isMobile]='isMobile' [reviewList]='reviewProducts$ | async'></app-product-review>
</div>
</div>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -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',
Expand All @@ -49,6 +50,7 @@ export class ProductDetailsComponent implements OnInit {
brand: Taxon;
checkPincodeForm: FormGroup;
isCodAvilable$: Observable<any>;
linesItems: any

constructor(
private checkoutActions: CheckoutActions,
Expand All @@ -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;
Expand Down Expand Up @@ -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)
Expand Down Expand Up @@ -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;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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() {
Expand Down
4 changes: 4 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -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"
Expand Down

0 comments on commit f6b1e70

Please sign in to comment.