Added fixes for address & product page

src/app/checkout/address/add-address/add-address.component.html

@@ -10,13 +10,13 @@
 </form>
 
 <form class="form" [formGroup]="addressForm" (ngSubmit)="onSubmit()">
-  <input type="hidden" formControlName="country_id">
+  <input type="hidden" formControlName="country_id" >
   <div class="pincode">
     <label>
       Pin Code
       <span class="required">*</span>
     </label>
-    <input type="tel" class="half-width readonly" readonly formControlName="zipcode">
+    <input type="tel" class="half-width readonly"  formControlName="zipcode">
     <p *ngIf="addressForm.get('zipcode').hasError('required') && addressForm.get('zipcode').touched" class="value-err show">This is a mandatory field</p>
   </div>
   <div class="locality">
@@ -38,10 +38,15 @@
     </div>
     <div class="state">
       <label>
-        State
-        <span class="required">*</span>
+        <!-- State -->
+        <!-- <span class="required">*</span> -->
       </label>
-      <input type="text" class="half-width readonly" readonly formControlName="state_id">
+      <!-- <input type="text" class="half-width readonly"  formControlName="state_id"> -->
+      State
+      <select class="form-control" formControlName="state_name">
+        <option *ngFor="let state of states">{{state.name}}</option>
+        <input type="hidden" formControlName="state_id">
+      </select>
     </div>
   </div>
   <div>

src/app/checkout/address/services/address.service.ts

@@ -1,9 +1,14 @@
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs/Observable';
 import { FormBuilder, Validators } from '@angular/forms';
 import { Injectable } from '@angular/core';
 
 @Injectable()
 export class AddressService {
-  constructor(private fb: FormBuilder) {}
+  constructor(
+    private fb: FormBuilder,
+    private http: HttpClient
+  ) { }
 
   initAddressForm() {
     return this.fb.group({
@@ -13,9 +18,10 @@ export class AddressService {
       'address2': ['', Validators.required],
       'city': ['', Validators.required],
       'phone': ['', Validators.required],
-      'zipcode': [10001, Validators.required],
-      'state_id': [3561, Validators.required],
-      'country_id': [232, Validators.required]
+      'zipcode': ['', Validators.required],
+      'state_id': [1140, Validators.required],
+      'country_id': [105, Validators.required],
+      'state_name': ['', Validators.required]
     });
   }
 
@@ -43,5 +49,8 @@ export class AddressService {
       }
     };
   }
-
+  // Country ID: 105 is for INDIA.
+  getAllStates(): Observable<any> {
+    return this.http.get<any>(`api/v1/countries/105/states`)
+  }
 }

src/app/checkout/cart/components/line-item-list/line-item/line-item.component.html

@@ -21,7 +21,7 @@
         </span>
         <span class="qty">
           <span class="gray">Qty:</span>
-          <span class="value">1</span>
+          <span class="value">{{quantity}}</span>
           <!--<span class="icon"></span>-->
         </span>
       </div>

src/app/core/services/checkout.service.ts

@@ -104,14 +104,14 @@ export class CheckoutService {
 
     return (
       this.http
-        .post<Order>('api/v1/orders', {}, { headers })
+        .post<Order>('api/v1/orders.json', { headers })
         .map(order => {
           this.setOrderTokenInLocalStorage({ order_token: order.token });
           return this.store.dispatch(this.actions.fetchCurrentOrderSuccess(order));
         })
         .do(
-          _ => _,
-          _ => this.toastyService.error({title: 'ERROR!!', msg: 'Unable to create empty order'})
+        _ => _,
+        _ => this.toastyService.error({ title: 'ERROR!!', msg: 'Unable to create empty order' })
         )
     );
   }

src/app/product/components/product-detail-page/product-details/product-details.component.html

@@ -11,29 +11,27 @@
   </div>
   <div class="col-md-7 col-12">
 
-    <app-product-price-info [product]="product" class="row">
+    <app-product-price-info 
+    [product]="product"
+    (onAddToCart)= "addToCart()"
+    (onMarkAsFavorites) = "markAsFavorite()"
+    class="row">
     </app-product-price-info>
 
-     <app-product-variants [customOptionTypesHash]="customOptionTypesHash" [currentSelectedOptions]="currentSelectedOptions" (onOptionClickEvent)="onOptionClick($event)"
-      [correspondingOptions]="correspondingOptions" [mainOptions]="mainOptions" class="row"></app-product-variants> 
+    <app-product-variants [customOptionTypesHash]="customOptionTypesHash" [currentSelectedOptions]="currentSelectedOptions" (onOptionClickEvent)="onOptionClick($event)"
+      [correspondingOptions]="correspondingOptions" [mainOptions]="mainOptions" class="row"></app-product-variants>
 
     <!-- <div class="row col-12">
       <button (click)="addToCart()" class="pdp-add-to-bag pdp-button">ADD TO BAG</button>
     </div> -->
-
-
-
-
   </div>
-
 </div>
 <div class="row">
   <div class="col-12">
     <h1>
       Description
     </h1>
-      <app-product-description [description]="product.description" class="row">
-        </app-product-description>
+    <app-product-description [description]="product.description" class="row">
+    </app-product-description>
   </div>
 </div>
-

src/app/product/components/product-detail-page/product-price-info/product-count/product-count.component.html

@@ -12,12 +12,12 @@
         </div>
       </div>
       <div class="buttons">
-        <input type="submit" class="cw-btn cw-btn--action cw-btn--full js-add-cart" value="Add to Cart">
+        <input type="submit" class="cw-btn cw-btn--action cw-btn--full js-add-cart" value="Add to Cart" (click)="addToCart()">
       </div>
     </form>
   </div>
-  <a href="#" class="buybox__favorite">
-    <span class="">
+  <a  class="buybox__favorite" (click)="markAsFavorites()">
+    <span>
       <i class="fa fa-heart"></i> Add to Favorites</span>
   </a>
-</div>
+</div>

src/app/product/components/product-detail-page/product-price-info/product-count/product-count.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input, ViewEncapsulation } from '@angular/core';
+import { Component, OnInit, Input, ViewEncapsulation, Output, EventEmitter } from '@angular/core';
 
 @Component({
   selector: 'app-product-count',
@@ -8,20 +8,18 @@ import { Component, OnInit, Input, ViewEncapsulation } from '@angular/core';
 })
 export class ProductCountComponent implements OnInit {
   @Input() product;
-  count: number = 1;
-  flag: any;
+  @Output() onAddToCart = new EventEmitter<Object>();
+  @Output() onMarkAsFavorites = new EventEmitter<Object>();
+
+  count = 1;
 
   constructor() { }
 
   ngOnInit() {
-
   }
 
   increseCount() {
-    console.log(this.count)
-
     this.count += 1;
-
   }
 
   /**
@@ -30,16 +28,17 @@ export class ProductCountComponent implements OnInit {
    * @memberof ProductcountComponent
    */
   decreaseCount() {
-
-    if (this.count = 1) {
-      this.flag = true;
-
-    }
     if (this.count > 1) {
       this.count -= 1;
     }
+  }
 
+  addToCart() {
+    this.onAddToCart.emit()
+  }
 
+  markAsFavorites() {
+    this.onMarkAsFavorites.emit()
   }
 
 }

src/app/product/components/product-detail-page/product-price-info/product-price-info.component.html

@@ -74,7 +74,10 @@ <h1 itemprop="name" class="title">{{product.name}}</h1>
 
     </div>
     <div id="buybox" class="">
-      <app-product-count></app-product-count>
+      <app-product-count
+      (onAddToCart)="addToCart()"
+      (onMarkAsFavorites) = "markAsFavorites()"
+      ></app-product-count>
     </div>
   </div>
 </div>

src/app/product/components/product-detail-page/product-price-info/product-price-info.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';
 
 @Component({
   selector: 'app-product-price-info',
@@ -7,9 +7,19 @@ import { Component, OnInit, Input } from '@angular/core';
 })
 export class ProductPriceInfoComponent implements OnInit {
   @Input() product;
+  @Output() onAddToCart = new EventEmitter<Object>();
+  @Output() onMarkAsFavorites = new EventEmitter<Object>();
+
   constructor() { }
 
   ngOnInit() {
   }
 
+  addToCart() {
+    this.onAddToCart.emit()
+  }
+
+  markAsFavorites() {
+    this.onMarkAsFavorites.emit()
+  }
 }

src/app/product/components/product-detail-page/product-variants/product-variants.component.ts

@@ -17,19 +17,16 @@ export class ProductVariantsComponent implements OnInit {
   @Input() mainOptions;
   @Input() correspondingOptions;
   @Output() onOptionClickEvent = new EventEmitter();
-  selectedItem:any;
+  selectedItem: any;
   constructor() {
   }
 
   ngOnInit() {
   }
 
   listClick(event, newValue) {
-
     this.selectedItem = newValue;  // don't forget to update the model here
-
   }
-
 
   isDisabled(arrayTocheck, value) {
     return (arrayTocheck.indexOf(value) === -1);

src/app/product/index.ts

@@ -13,7 +13,7 @@ import { ProductDetailsComponent } from './components/product-detail-page/produc
 import { ProductDescriptionComponent } from './components/product-detail-page/product-description/product-description.component';
 import { ProductImagesComponent } from './components/product-detail-page/product-images/product-images.component';
 import { ProductPriceInfoComponent } from './components/product-detail-page/product-price-info/product-price-info.component';
-import{ ProductCountComponent } from './components/product-detail-page/product-price-info/product-count/product-count.component';
+import { ProductCountComponent } from './components/product-detail-page/product-price-info/product-count/product-count.component';
 import { ProductVariantsComponent } from './components/product-detail-page/product-variants/product-variants.component';
 import { ProductComponent } from './product.component';
 

src/app/user/services/user.service.ts

@@ -34,7 +34,7 @@ export class UserService {
    *
    * @memberof UserService
    */
-  getOrderDetail(orderNumber: string): Observable<Order> { return this.http.get<Order>(`spree/api/v1/orders/${orderNumber}`) }
+  getOrderDetail(orderNumber: string): Observable<Order> { return this.http.get<Order>(`api/v1/orders/${orderNumber}`) }
 
   /**
    *
@@ -45,7 +45,7 @@ export class UserService {
    */
   getUser(): Observable<User> {
     const user_id = JSON.parse(localStorage.getItem('user')).id;
-    return this.http.get<User>(`spree/api/v1/users/${user_id}`);
+    return this.http.get<User>(`api/v1/users/${user_id}`);
   }
 
 }

src/app/user/user.component.html

@@ -1,4 +1,4 @@
-<div class="container-fluid">
+<div class="row">
   <div class="col-md-12">
     <h4> My Account </h4>
     <hr>
@@ -7,7 +7,6 @@ <h4> My Account </h4>
   <div class="sidebar col-md-3">
     <p><a routerLink="/user/overview" routerLinkActive="active">Overview</a></p>
     <hr>
-    <p><small>ORDERS</small></p>
     <p><a routerLink="/user/orders" routerLinkActive="active">My Orders</a></p>
     <hr>
     <p><a routerLink="/user/addresses" routerLinkActive="active">My Address</a></p>