Updated

git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174389 ce508802-f39f-4f6c-b175-0d175dae99d5

ecm/Angular/ProteusECM/trunk/src/app/app.module.ts

@@ -6,7 +6,7 @@ import { HttpModule } from '@angular/http';
 import { RouterModule, Routes } from '@angular/router';
 
 //import { JwtHelper } from 'angular2-jwt'; //For Future
-import {CATEGORY,SUBCATEGORY,ITEM} from './ecm-store/ecm-store';
+import {CATEGORY,SUBCATEGORY,ITEM,ECM_LOCATION,CART_COUNTER} from './ecm-store/ecm-store';
 import {StoreModule} from '@ngrx/store';
 
 import { MaterialModule } from '@angular/material';
@@ -47,6 +47,7 @@ import { EcmCartComponent } from './ecm-view/ecm-cart/ecm-cart.component';
 import { EcmCartService } from './ecm-view/ecm-cart/ecm-cart.service';
 import { EcmProductReviewService } from './ecm-product-details/ecm-product-review.service';
 import { EcmRecentViewComponent } from './ecm-view/ecm-recent-view/ecm-recent-view.component';
+import { EcmReadmoreComponent } from './ecm-view/ecm-readmore/ecm-readmore.component';
 
 //Changes by Prajyot
 const appRoutes: Routes = [
@@ -57,7 +58,8 @@ const appRoutes: Routes = [
   { path: 'detail/:itemCode', component: EcmProductDetailsComponent},
   { path: 'share/:itemCode', component: ShareComponent},
   { path: 'signin', component: EcmSigninComponent},
-  { path: 'search/:value', component: EcmSearchResultComponent}
+  { path: 'search/:value', component: EcmSearchResultComponent},
+  { path: 'cart', component: EcmCartComponent}
 ];
 @NgModule({
   declarations: [
@@ -89,7 +91,8 @@ const appRoutes: Routes = [
     EcmTemplateComponent,
     EcmTemplateDirective,
     EcmCartComponent,
-    EcmRecentViewComponent
+    EcmRecentViewComponent,
+    EcmReadmoreComponent
   ],
   imports: [
     BrowserModule,
@@ -97,7 +100,7 @@ const appRoutes: Routes = [
     HttpModule,
     RouterModule.forRoot(appRoutes),
     ReactiveFormsModule,
-    StoreModule.provideStore({CATEGORY,SUBCATEGORY,ITEM}),
+    StoreModule.provideStore({CATEGORY,SUBCATEGORY,ITEM, location: ECM_LOCATION, counter: CART_COUNTER}),
     MaterialModule,
     BrowserAnimationsModule
   ],

ecm/Angular/ProteusECM/trunk/src/app/ecm-breadcrumbs/ecm-breadcrumbs.component.ts

@@ -118,6 +118,19 @@ export class EcmBreadcrumbsComponent implements OnInit {
 //                url: 'javascript:void(0)'
 //            });
         }
+        if ( this.pageName == 'CART' ) {
+
+            this.breadcrumbs = [];
+            this.breadcrumbs.push( {
+                label: 'Home',
+                url: '/home'
+            });
+             this.breadcrumbs.push( {
+                label: 'Cart',
+                url: 'javascript:void(0)'
+            });
+            
+        }
 
     }
 

ecm/Angular/ProteusECM/trunk/src/app/ecm-card/ecm-card.component.css

@@ -111,16 +111,12 @@ p {
 
 .ecm-ratings{
 	top: 10px !important; 
-	font-size: 15px; 
+	font-size: 20px; 
 	color: rgb(500, 150, 50); 
-	font-size: large;
 	display: block;
-	line-height: 12px;
 	position: relative;
-	white-space: nowrap;
 	text-overflow: ellipsis;
 	overflow: hidden;
-	white-space: normal;
 	top: 5px;
 }
 
@@ -193,7 +189,7 @@ p {
 }
 .ecm-product-ratings{
     color: rgb(500, 150, 50);
-    font-size: large;
+    font-size: 20px;
     display: block;
 }
 

ecm/Angular/ProteusECM/trunk/src/app/ecm-card/ecm-card.component.html

@@ -68,7 +68,9 @@
         <span class="ecm-review-title">{{reviewsData.productRemarks}}</span>
         <span class="ecm-customer-details"> By {{reviewsData.reviewBy}} on {{reviewsData.reviewDate | date :'longDate'}}  <span class="ecm-seperator">|</span> <i class="material-icons ecm-verified-icon">&#xE86C;</i> Verified Customer</span>
         <span class="ecm-user-comments">{{reviewsData.productComments}}</span>
-        <i class="material-icons ecm-thumpsdown-icon">&#xE8DC;</i> <span class="likes-count"> {{reviewsData.productUsfulCnt}} </span>
-        <i class="material-icons ecm-thumpsup-icon">&#xE8DB;</i> <span class="likes-count"> {{reviewsData.productNotUsfulCnt}} </span>
+        <i (click)="updateLikes(reviewsData.item_code)" class="material-icons ecm-thumpsup-icon">&#xE8DC;</i>
+          <span class="likes-count"> {{reviewsData.productUsfulCnt}} </span>
+        <i (click)="updateDislikes(reviewsData.item_code)" class="material-icons ecm-thumpsdown-icon">&#xE8DB;</i>
+          <span class="likes-count"> {{reviewsData.productNotUsfulCnt}} </span>
      </div>
  </div>

ecm/Angular/ProteusECM/trunk/src/app/ecm-card/ecm-card.component.ts

 import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
 import { Router } from '@angular/router';
-import {DomSanitizer} from '@angular/platform-browser';
-import {MdIconRegistry} from '@angular/material';
 
 import { ECMCard } from '../ecm-model/card-model';
 import { Category } from '../ecm-model/category-model';
@@ -9,6 +7,8 @@ import { SubCategory } from '../ecm-model/subcategory-model';
 import { Item } from '../ecm-model/product-model';
 import { Reviews } from '../ecm-model/product-review.model';
 
+import { EcmProductReviewService } from '../ecm-product-details/ecm-product-review.service';
+
 @Component({
   selector: 'ecm-card',
   templateUrl: './ecm-card.component.html',
@@ -25,18 +25,7 @@ export class ECMCardComponent implements OnInit {
   
   @Output() storeData = new EventEmitter();
   
-  constructor(private router: Router,  iconRegistry: MdIconRegistry, sanitizer: DomSanitizer) { 
-      iconRegistry.addSvgIcon(
-              'thumbs-up',
-      sanitizer.bypassSecurityTrustResourceUrl('/assets/images/thumbup-icon.svg'));
-      
-      iconRegistry.addSvgIcon(
-              'thumbs-down',
-      sanitizer.bypassSecurityTrustResourceUrl('/assets/images/thumbdown-icon.svg'));
-      
-      iconRegistry.addSvgIcon(
-              'verified',
-      sanitizer.bypassSecurityTrustResourceUrl('/assets/images/verified-icon.svg'));
+  constructor(private router: Router, private productReviewService: EcmProductReviewService) { 
   
   }
 
@@ -44,8 +33,7 @@ export class ECMCardComponent implements OnInit {
   }
 
    storeItem(){      
-      // this.recentviewService.storeRecentViewItem(this.itemData.itemCode);
-       
+      // this.recentviewService.storeRecentViewItem(this.itemData.itemCode);      
        this.storeData.emit(this.itemData);
        this.router.navigate(['/detail',this.itemData.itemCode]);
    }
@@ -67,4 +55,18 @@ export class ECMCardComponent implements OnInit {
      this.storeData.emit(this.subcategory);
      this.router.navigate([ '/products', this.subcategory.scatCode]);
    }
+   
+   updateLikes(item_code) {
+       let likesData ="{\"userId\":\""+this.reviewsData.userId+"\",\"productUsfulCnt\":\""+(this.reviewsData.productUsfulCnt+1)+"\",\"productNotUsfulCnt\":\""+this.reviewsData.productNotUsfulCnt+"\"}";       
+       console.log("Likes Data-->");
+       console.log(likesData);       
+       this.productReviewService.updateLikes(item_code, likesData);
+   }
+   
+   updateDislikes(item_code) {       
+       let likesData ="{\"userId\":\""+this.reviewsData.userId+"\",\"productUsfulCnt\":\""+this.reviewsData.productUsfulCnt+"\",\"productNotUsfulCnt\":\""+(this.reviewsData.productNotUsfulCnt-1)+"\"}";
+       console.log("Likes Data-->");
+       console.log(likesData);
+       this.productReviewService.updateLikes(item_code, likesData);
+   }
 }

ecm/Angular/ProteusECM/trunk/src/app/ecm-header/ecm-header.component.css

@@ -160,7 +160,7 @@ ecm-search{
     border-style: solid;
     border-width: 10px;
     top: 40px;
-    margin-left: 10px;
+    margin-left: 20px;
 }
 
 .siteHeading {
@@ -305,3 +305,21 @@ ecm-search{
 .hide-button:after {
 	transform: translateY(-50%) rotate(-45deg) scale(1);
 }
+
+.medium-btn-checkout{
+	width: 100%;
+    height: 50px;
+    line-height: 15px;
+    text-align: center;
+    border: 1px solid mediumvioletred;
+    background-color: mediumvioletred;
+    border-radius: 2px;
+    float: left;
+    position: relative;
+    top: 15px;
+    color: white;
+    right: 10px;
+    margin: 2rem; 
+    font-size: .9rem;
+    margin-left: 14px;
+}

ecm/Angular/ProteusECM/trunk/src/app/ecm-header/ecm-header.component.html

@@ -7,7 +7,7 @@
 	<ecm-signin *ngIf="sideOption=='USER_OPT'" (closePanel)="hideOverlayPanel(); createUserData();" ></ecm-signin>
 	<div *ngIf="sideOption=='CART_OPT'" style="margin: 5rem;" > 
 		Show Cart option will be display here
-		<button md-raised-button class="button medium-btn">Checkout</button>
+		<button md-raised-button class="button medium-btn-checkout">Checkout</button>
 	</div>
 </div>
 <!-- Overlay End -->
@@ -17,8 +17,7 @@
 	<span (click)="hideSidePanel();" class="hide-button"></span>
 	<ecm-user-option *ngIf="sideOption=='USER_OPT'" (closePanel)="hideSidePanel(); createUserData();" (updateProfileImages) = "updateProfileImages();" ></ecm-user-option>
 	<div *ngIf="sideOption=='CART_OPT'" style="margin: 3rem;" > 
-		<ecm-cart></ecm-cart>	
-		<button md-raised-button class="button medium-btn">Checkout</button>
+		<ecm-cart [isMiniCart] = 'true' (closePanel)="hideSidePanel();" ></ecm-cart>	
 	</div>
 </div>
 <!-- SlidePanel End -->
@@ -32,8 +31,8 @@
 	<section class="header-section visible">
 		<div class="input-container-bg" [@fadeState]="headerFadeState"></div>
 		<div class="input-container">
-			<img *ngIf="userData" [src]="profileImageLink" onerror="this.src = '/ecm/assets/images/w_user_128_128.png'; " class="user-adj user-image-128" title= "{{userData.name}}" (click)="showSidePanel('USER_OPT');" [@userState]="headerFadeState" /> 
-			<img *ngIf="!userData" (click)="showOverlayPanel('USER_OPT');" class="img-user user-adj" [@userState]="headerFadeState" />
+			<img *ngIf="userData" mdTooltip="Click here to Manage Account" [mdTooltipPosition]="'below'" [src]="profileImageLink" onerror="this.src = '/ecm/assets/images/w_user_128_128.png'; " class="user-adj user-image-128" title= "{{userData.name}}" (click)="showSidePanel('USER_OPT');" [@userState]="headerFadeState" /> 
+			<img *ngIf="!userData" mdTooltip="Click here for Login" [mdTooltipPosition]="'below'" (click)="showOverlayPanel('USER_OPT');" class="img-user user-adj" [@userState]="headerFadeState" />
 			<div class="row">
 				<div class="small-12 medium-10 large-10 medium-centered column">
 					<img class="img-logo logo-adj" [@l2dLogoTrans]="headerFadeState" />
@@ -55,16 +54,16 @@
 	    <ecm-search [compFadeState]="headerFadeState" [headerState]="'fixed'"></ecm-search>
 	    <span [ngClass]="{'cart-span': sideOption=='CART_OPT'}" (click)="cartAction();" >
 			<button md-button class="square-button">
-				<span *ngIf="cartItems > 0" class="fixed-header-badge">{{cartItems}}</span>
-				<img class="fixed-header-cart img-cart-32" /> 
+				<span *ngIf="cartItems > 0" class="fixed-header-badge">{{ cartCounter | async }}</span>
+				<img  mdTooltip="Show Cart" [mdTooltipPosition]="'below'" class="fixed-header-cart img-cart-32" /> 
 				<!-- <img *ngIf="cartItems == 0" class="fixed-header-cart img-cart-32 no-badge" /> -->
 				<!--<md-icon  class="example-icon">shopping_cart</md-icon>-->
 			</button>
 	    </span> 
 	    <span [ngClass]="{'user-span': userData && sideOption=='USER_OPT'}" (click)="userAction();" >
 			<button md-button class="square-button">
-				<img *ngIf="userData" [src]="profileImageLink" onerror="this.src = '/ecm/assets/images/svg/user_32_32.svg'; this.className = 'fixed-header-no-user'"  title="{{userData.name}}" [ngClass]="( userImage.src.indexOf('/ibase/') > 0 ) ? 'fixed-header-user' : 'fixed-header-no-user' " #userImage/>
-				<img *ngIf="!userData" class="fixed-header-no-user img-user-32"/>
+				<img *ngIf="userData" mdTooltip="Click here to Manage Account" [mdTooltipPosition]="'below'" [src]="profileImageLink" onerror="this.src = '/ecm/assets/images/svg/user_32_32.svg'; this.className = 'fixed-header-no-user'"  title="{{userData.name}}" [ngClass]="( userImage.src.indexOf('/ibase/') > 0 ) ? 'fixed-header-user' : 'fixed-header-no-user' " #userImage/>
+				<img *ngIf="!userData" mdTooltip="Click here for Login" [mdTooltipPosition]="'below'" class="fixed-header-no-user img-user-32"/>
 				<!--<md-icon  class="example-icon">account_circle</md-icon>-->
 			</button>
 	    </span>

ecm/Angular/ProteusECM/trunk/src/app/ecm-header/ecm-header.component.ts

- import { Component, Input, Output, Inject, OnInit, OnDestroy, HostListener, ElementRef, ViewChild, trigger, state, animate, transition, style } from '@angular/core';
+ import { Component, Input, Output, Inject, OnInit, OnDestroy, AfterViewChecked, HostListener, ElementRef, ViewChild, trigger, state, animate, transition, style } from '@angular/core';
 import { DOCUMENT } from '@angular/platform-browser';
 import { ActivatedRoute, Router,ActivatedRouteSnapshot,RoutesRecognized } from '@angular/router';
 
+import { Observable } from 'rxjs/Observable';
+import { Store } from '@ngrx/store';
+
+import { EcmStoreModel } from '../ecm-store/ecm-store.model';
+
 import { ScrollService } from '../scroll.service';
 import 'rxjs/add/operator/filter';
 
@@ -70,7 +75,7 @@ declare var enableScroll: any;
   ]
 })
 
-export class ECMHeaderComponent implements OnInit, OnDestroy {
+export class ECMHeaderComponent implements OnInit, OnDestroy, AfterViewChecked {
 
     @ViewChild( 'rightSlidePanel' ) rightSlidePanel: ElementRef;
     @ViewChild( 'overlayPanel' ) overlayPanel: ElementRef;
@@ -83,9 +88,10 @@ export class ECMHeaderComponent implements OnInit, OnDestroy {
     userData: any;
     sideOption: any;
     cartItems = 0;
+    cartCounter : Observable<number>;
     profileImageLink : string;
 
-    constructor( @Inject( DOCUMENT ) private document: Document, private route: ActivatedRoute, private router: Router, private scroll_service: ScrollService ) { }
+    constructor( @Inject( DOCUMENT ) private document: Document, private route: ActivatedRoute, private router: Router, private scroll_service: ScrollService, private store: Store<EcmStoreModel>) { }
 
     ngOnInit() {
         console.log( 'ECMHeaderComponent onInit' );
@@ -155,6 +161,14 @@ export class ECMHeaderComponent implements OnInit, OnDestroy {
         //initSearch(); 
     }
 
+    ngAfterViewChecked() {
+      this.cartCounter = this.store.select('counter');
+      this.cartCounter.subscribe( count => { 
+          this.cartItems = count; 
+          //console.log('>>>count ::' + count);
+      });
+      //console.log('this.cartItems ::' + this.cartItems);
+    }
 
     userAction() {
       if( this.userData ){

ecm/Angular/ProteusECM/trunk/src/app/ecm-model/product-review.model.ts

@@ -6,6 +6,7 @@ export class Reviews {
         public productRating: number,
         public productRemarks: string = '',
         public productUsfulCnt: number,
+        public userId: string = '',
         public reviewBy: string = '',
         public reviewDate: string = '',
         public site_code: string = ''

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-product-details.component.html

 <ecm-header [isFixedHeader]=false> </ecm-header>
 <ecm-breadcrumbs *ngIf="itemDetail" [pageName]="'DETAIL'" [itemDetail]='itemDetail'></ecm-breadcrumbs>
 
-<ecm-template *ngIf="ecmTemplate" [ecmTemplate] = "ecmTemplate" (scrollToReviews) = "scrollToReviews();" ></ecm-template>
+<ecm-template *ngIf="ecmTemplate" [ecmTemplate] = "ecmTemplate" (scrollToReviews) = "scrollToReviews();" (doActivity) = "doActivity($event);" >
+</ecm-template>
 
-<ecm-recent-view #recentView> </ecm-recent-view>
+<div  *ngIf="itemCode" #reviewsAndRating>
+   <ecm-product-review [itemCode] = "itemCode"></ecm-product-review>
+</div>
 
-<div  *ngIf="itemCode" #reviewsAndRating class="row" >
-	<md-tab-group class="ecm-tab medium-12 col-sm-9">
+<ecm-recent-view #recentView></ecm-recent-view>
\ No newline at end of file
-	  <md-tab label="Reviews">
-	    <ecm-product-review [itemCode] = "itemCode"></ecm-product-review>
-	  </md-tab>
-	  
-	  <md-tab label="Important">
-		<div class="ecm-important">
-			<div class="ecm-terms-header"> Terms & Conditions: </div>
-			<div class="ecm-terms-points">
-			 <ul>
-			   <li>Please carry the printout of this E-Ticket along with Photo ID proof (Drivers Licence / PAN Card / Passport etc) and exchange it for a valid ticket(s) at the parks.</li>
-			   <li>In case of Credit / Debit Card payments, it is also MANDATORY to carry the same card from which booking was made in original along with a photo-copy.Tickets once booked cannot be exchanged, cancelled or refunded</li>
-			   <li>Sr. Citizens need to carry valid age proof photo ID card to avail the benefit</li>
-			   <li>All bookings and confirmations are subject to availability.</li>
-			   <li>There will be no refund on cancellations. Re-scheduling subject to prior 48 hours intimation.</li>
-			   <li>No two promotions/ offers can be clubbed or combined.</li>
-			   <li>No refunds on purchased ticket is possible, even in case of any rescheduling.</li>
-			   <li>Prices are inclusive of entry ticket to EsselWorld OR Water Kingdom (single entry visit).</li>
-			   <li>Prices are inclusive of transfer from single pick-up point to our parks and back along with driver allowance, toll & car park charges wherever applicable basis package / ticket type bought.</li>
-			   <li>Prices are standard for Child, Adult or Sr. Citizens.</li>
-			   <li>Rates & terms are subject to change, without prior notice.</li>
-			 </ul>
-			</div>
-			<div class="ecm-terms-header"> Instructions </div>
-			<div class="ecm-terms-points">
-			  <ul>
-			    <li>Show Order ID - Email Confirmation Printout to the ticket counter at the entrance to avail physical tickets/ wristbands/passes.</li>
-			  </ul>
-			</div>
-		</div>
-	  </md-tab>
-	</md-tab-group>
-</div>
\ No newline at end of file

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-product-details.component.ts

 import { Component, OnInit, OnDestroy, ViewChild, ElementRef } from '@angular/core';
 import { Router, ActivatedRoute } from '@angular/router';
+import { MdSnackBar } from '@angular/material';
+import { Store } from '@ngrx/store';
+
+import { EcmStoreModel } from '../ecm-store/ecm-store.model';
+import { INCREMENT, DECREMENT, RESET } from '../ecm-store/ecm-store';
 
 import { EcmProductDetailService } from './ecm-product-detail.service';
 import { ScrollService } from '../scroll.service';
@@ -25,21 +30,19 @@ export const ECM_TEMPLATES: any = {
   styleUrls: ['./ecm-product-details.component.css'],
   providers: [EcmProductDetailService]
 })
-export class EcmProductDetailsComponent implements OnInit,OnDestroy {
+export class EcmProductDetailsComponent implements OnInit, OnDestroy {
 
-  @ViewChild('recentView') recentView: EcmRecentViewComponent;  
   @ViewChild('reviewsAndRating') reviewsAndRating: ElementRef;
-  
+  @ViewChild('recentView') recentView: EcmRecentViewComponent;
+
   itemCode:string;
   ecmTemplate : EcmTemplateItem;
   itemDetail: ItemDetail;
   
-  constructor(private route: ActivatedRoute, private router:Router, public subcategoryService: EcmProductDetailService) { }
+  constructor(private route: ActivatedRoute, private router:Router, public subcategoryService: EcmProductDetailService, public snackBar: MdSnackBar, private store: Store<EcmStoreModel>) { }
 
   ngOnInit() {
-      console.log(this.recentView +'Product Detail Onit');
-      this.recentView.ngOnInit();
-	this.route.params.subscribe( params => {
+	    this.route.params.subscribe( params => {
            //let id: number = +params['id']; // (+) converts string 'id' to a number
            // In a real app: dispatch action to load the details here.
           this.itemCode = params['itemCode'];
@@ -49,6 +52,20 @@ export class EcmProductDetailsComponent implements OnInit,OnDestroy {
        });
   }
 
+  ngAfterViewInit() {
+    console.log('Product Detail ngAfterViewInit' + this.recentView );
+    if( this.recentView ) {
+      this.recentView.ngOnInit();
+      console.log('item-detail-2  ' + document.getElementById('item-detail-2'));
+      if( document.getElementById('item-detail-2') ) {
+        console.log('item-detail-2  TOP' + document.getElementById('item-detail-2').offsetTop);
+      }
+      console.log('recentViewCard  ' + document.getElementById('recentViewCard'));
+      if( document.getElementById('recentViewCard') ) {
+        console.log('recentViewCard  TOP' + document.getElementById('recentViewCard').style.position);
+      }
+    }
+  }
   
   getItemDetail( itemCode: string ) {
       this.subcategoryService.getItemDetail( itemCode ).subscribe(
@@ -71,7 +88,8 @@ export class EcmProductDetailsComponent implements OnInit,OnDestroy {
       );
   }
   ngOnDestroy() {
-      this.recentView.doDestroy(this.itemCode);
+      if( this.recentView )
+        this.recentView.doDestroy(this.itemCode);
   }
   
   scrollToReviews() {
@@ -79,4 +97,40 @@ export class EcmProductDetailsComponent implements OnInit,OnDestroy {
       console.log(' scrollToReviews:: offsetTop >>' + offsetTop);
       window.scrollTo(0, offsetTop - 80); 
   }
+
+
+  doActivity($event) {
+    this.performActivity($event.activity, $event.data);
+  }
+
+  performActivity(activity: string, data: any) {
+    console.log( 'doActivity > > ' , activity, data );
+    if( activity == 'ADD_CART' ) {
+        this.addToCart();
+        this.showSnackbar('Item Added to your Cart');
+    }
+    else if( activity == 'ADD_WISHLIST' ) {
+        this.addToWishlist();
+        this.showSnackbar('Item Added to your Wishlist');
+    }
+    else if( activity == 'BOOK_NOW' ) {
+        this.showSnackbar('Book Now - Redirect to Checkout');
+    }
+    else if( activity == 'BUY_NOW' ) {
+        this.showSnackbar('Buy Now - Redirect to Checkout');
+    }
+  }
+
+  addToCart() {
+    this.store.dispatch({ type: INCREMENT });
+  }
+
+  addToWishlist() {
+
+  }
+ 
+  showSnackbar(message) {
+      this.snackBar.open(message, '', {duration: 500});
+  }
+
 }

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-product-review.component.css

+.ecm-tab {
+    padding-left: 15px;
+}
 
 .ecm-result-header{
 	padding-left: 15px;
@@ -9,6 +12,7 @@
  float: right;
  padding-left: 25px;	
  font-size: 12px;
+ padding-top: 20px;
 }
 
 .ecm-options {
@@ -22,15 +26,10 @@
 	font-size: 18px
 }
 
-.ecm-review-tab {
-	padding: 20px 20px 20px 0px;
+.ecm-review {
+	padding: 50px 20px 20px 0px;
 	min-height: 400px;
 }
-.ecm-ratings{
-    color: rgb(500, 150, 50);
-    font-size: large;
-    display: block;
-}
 
 .ecm-null-ratings {
 	color: lightgray;
@@ -73,9 +72,7 @@
 	position: absolute;
 }
 .ecm-reviews {
-    position: relative;
-    padding-top: 10px;
-    padding-bottom: 30px;
+
 }
 
 .ecm-result-count {
@@ -126,6 +123,14 @@
 	color: #fff;
 }
 
+.ecm-pages-info{
+	color: #444; 
+	float: left; 
+	font-size: 15px; 
+	padding-top: 5px;	
+    margin-left: 100px;
+}
+
 .next-button, .prev-button{
     color: mediumvioletred;
     cursor: pointer;
@@ -133,6 +138,8 @@
     border-radius: 10%;
     margin-left: 30px;
     margin-right: 30px;
+    font-weight: bold;
+    font-size: 15px;
 }
 
 .disabled {
@@ -146,4 +153,118 @@
 .ecm-null-data-descr {
 	text-align: center;
     padding-top: 50px;
-}
+}
\ No newline at end of file
+
+.reviews-content {
+	margin-top: 50px;
+}
+
+.ecm-review-header {
+	height: 250px;
+    padding-top: 40px;	
+}
+
+.ecm-write-review {
+	position: absolute;
+	bottom: 0;
+	right: 0;
+}
+
+.ecm-avg-rating {
+    display: block;
+    font-size: 50px;
+    text-align: center;
+    height: 60px;
+}
+
+.ecm-ratings{
+    color: rgb(500, 150, 50);
+    font-size: 20px;
+    display: block;
+    position: relative;
+    text-align: center;
+}
+
+.ecm-total-ratings {
+    font-weight: bold;
+    font-size: 12px;
+    text-align: center;
+    display: block;
+}
+
+.write-review-button {
+	display: block;
+    vertical-align: middle;
+    height: 50px;
+    width: 170px;
+    text-align: center;
+    line-height: 50px;
+    color: mediumvioletred;
+    cursor: pointer;
+    float: right;
+    box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
+}
+
+.ecm-review-card {
+    position: absolute;
+    width: calc(100% - 380px); 
+ 	margin: 30px 0px 30px 30px
+
+}
+
+.write-review-text {
+	font-size: 13px;
+    font-weight: bold;
+}
+
+.edit {
+    vertical-align: sub;
+    font-size: 18px;
+}
+
+hr {
+	margin: 0px 0px 50px 0px;
+}
+
+.header-title {
+	text-align: center;
+	display: block;
+	height: 40px;
+    width: 160px;
+    line-height: 40px;
+    margin: 0px;
+    border-bottom: thin solid mediumvioletred
+}
+
+.header-content {
+	position: relative;
+}
+
+.tab-link {
+	color: black;
+}
+
+@media screen and (max-width: 770px)
+{
+	.write-review-button {
+		width: 50%;
+		margin-left: 25%;
+		margin-right: 25%;
+		float: inherit;
+	}
+	
+	.ecm-write-review {
+		position: relative;
+		padding-top: 30px;
+        padding-bottom: 30px;
+        width: 100%;
+	}
+	
+	.ecm-total-reviews {
+		width: 100% !important;
+	}
+}
+
+
+
+

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-product-review.component.html

+<md-card class="ecm-review-card">
+	<div class="ecm-review-header">  
+	   <div>
+	      <span class="header-title"> Ratings & Reviews </span>
+	   </div>
+	   <hr>
+	    <div class="row header-content">
+		<div class="medium-5 medium-4 columns ecm-total-reviews">
+			<span class="ecm-avg-rating"> 3.4 </span>
+			<span class="ecm-ratings">&#x2605; &#x2605; &#x2605; &#x2605; &#x2605;</span>
+			<span class="ecm-total-ratings"> 20,344 Ratings </span>
+		</div>
+		
+		<div class="medium-5 medium-4 columns ecm-write-review">
+			<span class="write-review-button">
+				<i class="material-icons edit">&#xE254;</i> 
+				<span class="write-review-text"> Write a Review </span>
+			</span>
+		</div>
+		</div>
+	
+	</div>
+	
+	<md-tab-group class="ecm-tab medium-12 col-sm-9" (selectChange)="onSelectChange($event)" > 
+	  <md-tab label="Most Recent">
+	    
+	    <md-select class="ecm-select" placeholder="Sort By" [(ngModel)]="sortBy" (change)="sort()" name="sort">
+            <md-option class="ecm-options" *ngFor="let type of sortTypes" [value]="type.value">
+                 {{type.viewValue}}
+            </md-option>
+        </md-select>
+	    
+	    <div *ngIf="numFound==0" class="ecm-null-data-descr">
+	      No Reviews Found
+	    </div>
+	               	    
+	    <div *ngIf="reviews && numFound!=0" class="reviews-content">
+	    	<ecm-card *ngFor="let review of reviews" [reviewsData]="review"> </ecm-card>
+	    </div>
+	     
+	     <div *ngIf="reviews && numFound!=0 && pageCount!=1" class="ecm-pagination-section">  
+             <span class="ecm-pages-info">1 of {{pageCount}} Pages</span> 
+             <span *ngFor="let a of createPages(); let i = index" class="ecm-page" [ngClass]="{active:(i+1) === currentPage}" (click)="goToPage(i+1)">
+               <span>{{i+1}}</span>
+             </span>
+             <span class="next-button" (click)="nextPage()"> Next </span>
+         
+             <!--   <span class="next-button" [ngClass]="{disabled:currentPage === reviews.length}" (click)="nextPage()"> Next </span>  -->
+         </div> 
+	     
+	  </md-tab>
+	
+	  <md-tab label="Most Helpful">
 
- <div class="ecm-review-tab">
- <div *ngIf="reviews && numFound!=0" class="ecm-result-count"> 1-4 of {{reviews.length}} Reviews </div>
- <div class="ecm-result-header">		    
-    <span class="ecm-result-info">Customer Reviews</span>
-  
-  <div class="ecm-select-options">      
-  <md-select class="ecm-select" placeholder="Filter By" [(ngModel)]="filterBy" (change)="filter()" name="filter">
-    <md-option class="ecm-options" *ngFor="let type of filterTypes" [value]="type.value">
-      {{type.viewValue}}
-    </md-option>
-  </md-select>
-  		   
-  <md-select class="ecm-select" placeholder="Sort By" [(ngModel)]="sortBy" (change)="sort()" name="sort">
-    <md-option class="ecm-options" *ngFor="let type of sortTypes" [value]="type.value">
-      {{type.viewValue}}
-    </md-option>
-  </md-select>
-  </div>
-  
- </div>
- 
- <div *ngIf="numFound==0" class="ecm-null-data-descr">  No Reviews Found </div>
- 
- <div *ngIf="reviews && numFound!=0" class="reviews-content">
-  <ecm-card *ngFor="let review of reviews" [reviewsData]="review"> </ecm-card>
- </div>
+	    <md-select class="ecm-select" placeholder="Sort By" [(ngModel)]="sortBy" (change)="sort()" name="sort">
+            <md-option class="ecm-options" *ngFor="let type of sortTypes" [value]="type.value">
+                 {{type.viewValue}}
+            </md-option>
+        </md-select>
+	    
+	    <div *ngIf="numFound==0" class="ecm-null-data-descr">
+	      No Reviews Found
+	    </div>
+	               	    
+	    <div *ngIf="reviews && numFound!=0" class="reviews-content">
+	    	<ecm-card *ngFor="let review of reviews" [reviewsData]="review"> </ecm-card>
+	    </div>
+	     
+	     <div *ngIf="reviews && numFound!=0 && pageCount!=1" class="ecm-pagination-section">  
+             <span class="ecm-pages-info">1 of {{pageCount}} Pages</span> 
+             <span *ngFor="let a of createPages(); let i = index" class="ecm-page" [ngClass]="{active:(i+1) === currentPage}" (click)="goToPage(i+1)">
+               <span>{{i+1}}</span>
+             </span>
+             <span class="next-button" (click)="nextPage()"> Next </span>
+         
+             <!--   <span class="next-button" [ngClass]="{disabled:currentPage === reviews.length}" (click)="nextPage()"> Next </span>  -->
+         </div> 
 
- <div *ngIf="reviews && numFound!=0" class="ecm-pagination-section">  
-      <span class="prev-button" [ngClass]="{disabled:currentPage === 1}" (click)="prevPage()"><img class="arrow_logo" src="v_left_arrow_38_38.png"></span>
-      <!--  <span class="prev-button" (click)="prevPage()" [ngClass]="{disabled:currentPage === 1}"> Prev </span>  -->
-      
-        <span *ngFor="let a of createPages(); let i = index" class="ecm-page" [ngClass]="{active:(i+1) === currentPage}" (click)="goToPage(i+1)">
-           <span>{{i+1}}</span>
-        </span>
-      <span class="next-button" [ngClass]="{disabled:currentPage === pageCount}" (click)="nextPage()"><img class="arrow_logo" src="v_right_arrow_38_38.png"></span>
-        
-     <!--   <span class="next-button" [ngClass]="{disabled:currentPage === reviews.length}" (click)="nextPage()"> Next </span>  -->
- </div> 	
- 
- </div>  
+	  </md-tab>
+	  	
+	</md-tab-group>
+
+</md-card>
\ No newline at end of file

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-product-review.component.ts

@@ -12,8 +12,9 @@ export class EcmProductReviewComponent implements OnInit {
     @Input() itemCode;
     solrUrl = '/ecm/service/solr/local2do/';
     reviews: Reviews[];
-    sortBy: string = "productRating desc";
-    filterBy: string = "item_code:[* TO *]";
+    tabSort: string = "reviewDate desc";
+    
+    sortBy: string = "item_code:[* TO *]";
     pageCount;
     currentPage: number = 1;
     start = 0;
@@ -21,13 +22,6 @@ export class EcmProductReviewComponent implements OnInit {
     numFound;
 
     sortTypes = [
-        { value: 'reviewDate desc', viewValue: 'Most Recent' },
-        { value: 'productRating desc', viewValue: 'Positive' },
-        { value: 'productRating asc', viewValue: 'Negative' },
-        { value: 'productUsfulCnt desc', viewValue: 'Most Helpful' }
-    ];
-
-    filterTypes = [
         { value: 'productRating:[5 TO 5]', viewValue: '5 Stars' },
         { value: 'productRating:[4 TO 4]', viewValue: '4 Stars' },
         { value: 'productRating:[3 TO 3]', viewValue: '3 Stars' },
@@ -42,12 +36,15 @@ export class EcmProductReviewComponent implements OnInit {
     }
 
     fetchReviews() {
-        var solrUrl = this.solrUrl + this.itemCode + '/json/' + this.start + '/' + this.sortBy + '/' + this.filterBy;
+        var solrUrl = this.solrUrl + this.itemCode + '/json/' + this.start + '/' + this.tabSort + '/' + this.sortBy;
 
         this.productreviewService.getReviews( solrUrl )
             .subscribe( data => {
                 this.searchResponse = data;
-                if ( data.response ) {
+                if( data.message ) {
+                    console.log( data.message );
+                }
+                else if ( data.response ) {
                     this.reviews = data.response.docs;
                     this.numFound = data.response.numFound;
                     this.pageCount = Math.ceil(( this.numFound / 10 ) );
@@ -106,5 +103,19 @@ export class EcmProductReviewComponent implements OnInit {
         else
             return false;
     }
+    
+    onSelectChange($event) {
+        console.log('index => ', $event.index);
+        if($event.index == 0)
+        {
+            this.tabSort = 'reviewDate desc'; 
+            this.fetchReviews();
+        }
+        else if($event.index == 1)
+             {
+               this.tabSort = 'productUsfulCnt desc';
+               this.fetchReviews();
+             }
+    }
 
 }

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-product-review.service.ts

@@ -7,8 +7,7 @@ import 'rxjs/add/operator/map';
 @Injectable()
 export class EcmProductReviewService {
   
-  solrUrl = '/ecm/service/solr/local2do/';
-    
+   
   constructor(private http: Http) { }
   
   getReviews(solrUrl) {
@@ -22,6 +21,22 @@ export class EcmProductReviewService {
       
   }
   
+  updateLikes(itemCode, data) {
+      let userServiceUrl = '/ecm/service/feeds/update/likes/'+itemCode;
+      let headers = new Headers( { 'Content-Type': 'application/json' });
+      let options = new RequestOptions( { headers: headers });
+      
+      console.log("Inside Update Likes "+itemCode);
+      console.log(JSON.stringify(data));
+      
+      this.http.post(userServiceUrl, data, options)
+      .subscribe(data => {
+         console.log("Updated Likes");
+      }, error => {
+          console.log(error.json());
+      }); 
+  }
+  
   private extractData(res: Response) {
       let body = res.json();
       console.log('extractData[' + JSON.stringify(body) + ']');

ecm/Angular/ProteusECM/trunk/src/app/ecm-product-details/ecm-template/ecm-template.component.ts

@@ -2,7 +2,7 @@ import { Component, AfterViewInit, ComponentFactoryResolver, Input, Output, View
 import { ItemDetail } from '../../ecm-model/product-detail-model';
 
 @Directive({
-    selector: '[ecm-template]',
+    selector: '[ecm-template-ref]',
 })
  export class EcmTemplateDirective {
     constructor(public viewContainerRef: ViewContainerRef) { }
@@ -21,6 +21,7 @@ export class EcmTemplateItem {
 export interface EcmTemplateInterface {
     itemDetail: ItemDetail;
     scrollToReviews: any;
+    doActivity: any;
 }
 
 @Component({
@@ -31,6 +32,8 @@ export interface EcmTemplateInterface {
 export class EcmTemplateComponent implements AfterViewInit {
     
     @Output() scrollToReviews = new EventEmitter();
+    @Output() doActivity = new EventEmitter();
+    
     @Input() ecmTemplate: EcmTemplateItem;
     @ViewChild(EcmTemplateDirective) ecmTemplateDir: EcmTemplateDirective;
    
@@ -51,5 +54,6 @@ export class EcmTemplateComponent implements AfterViewInit {
         let componentRef = viewContainerRef.createComponent(componentFactory);
         (<EcmTemplateInterface>componentRef.instance).itemDetail = ecmTemplateItem.itemDetail;
         (<EcmTemplateInterface>componentRef.instance).scrollToReviews = this.scrollToReviews;
+        (<EcmTemplateInterface>componentRef.instance).doActivity = this.doActivity;  
     }
 }

ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-cart/ecm-cart.component.css

@@ -26,4 +26,86 @@
 {
 	padding-left: 10px;
 	width : 140px;
+}
+th{
+	padding-bottom: 22px;
+	text-align: left
+}
+.ViewAll{
+    font-size: 16px;
+    color: mediumvioletred;
+}
+.cartItemsDetails{
+	margin: 5px; 
+	position: absolute;
+    width: 50%;
+    margin-top: 24px;
+}
+
+.ecm-productDetails{
+	position: absolute;
+    width: 30%;
+    left: 58%;
+    
+}
+.PriceDetails{
+	font-size: 15px;
+    color: dimgray;
+}
+.amountPayable{
+	padding-top: 30px;
+    font-weight: 600;
+    font-size: 18px;
+    margin: 10px;
+    
+}
+.totalPriceDetails{
+  margin: 5px; 
+  margin-top: 24px;
+}
+/*.medium-btn-ecm-View{
+	cursor: pointer;
+	position: absolute;
+	background: transparent;
+	color: mediumvioletred;
+	padding-top: 6px;
+	width: 78%;
+}*/
+/*.medium-btn-ecm-View{
+    background: transparent;
+    color: mediumvioletred;
+    width: 302px;
+    height: 50px;
+    font-size: 15px;
+    line-height: 44px;
+    text-align: center;
+    border-radius: 2px;
+    position: relative;
+    padding: 0;
+    margin: 26px 0 5px 0;
+}*/
+/* .ecm-buttons{
+	width: 295px;
+    height: 50px;
+    font-size: 15px;
+    line-height: 15px;
+    text-align: center;
+    border-radius: 2px;
+    position: relative;
+    padding: 0;
+    margin: 5px 0 5px 0;  
+}*/
+.checkout-button,
+.viewAll-button
+{
+/*     width: 320px; */
+	width: 295px;
+    height: 50px;
+    font-size: 15px;
+    line-height: 15px;
+    text-align: center;
+    border-radius: 2px;
+    position: relative;
+    padding: 0;
+    margin: 5px 0 5px 0;
 }
\ No newline at end of file

ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-cart/ecm-cart.component.html

-<div *ngIf="cartItemsDetail">
-	<div class="cartItemsDetail" *ngFor="let item of cartItemsDetail">
-		<body>
+<div *ngIf="isMiniCart then miniCart; else fullCart;" ></div>
+
+<!-- --<div *ngIf="cartItemsDetail &&  miniView">------ -->
+<ng-template #miniCart>
+<div *ngIf="cartItemsDetail && cartItemsDetail.length ">
+	<div class="cartItemsDetail" *ngFor="let item of cartItemsDetail  | slice:0:show; let i=index">
 			<table style="border: 2px solid ghostwhite; width: 100%;">
 				<tr>
 					<td class="itemImage"><img style="height: inherit;" src="../assets/images/items/{{item.itemCode}}.png"></td>
 					<td class="itemdescription">{{item.descr}}</td>
 					<td style="padding: 10px;">₹ {{item.costRate}}</td>
-					<td (click)="deleteCartItem(item.itemCode)" style="cursor: pointer;">x</td>
+					<td (click)="deleteCartItem(item.itemCode)" style="cursor: pointer;"><i class="material-icons" style="color: mediumvioletred; font-size: 20px;">&#xE872;</i></td>
 				</tr>
 			</table>
-		</body>
-		{{item.scat_sh_descr}} {{item.rating}}
+		
 	</div>
+<!--  	<div class="ViewAll" *ngIf="cartItemsDetail.length > 3 && show == 3" (click)="show = cartItemsDetail.length"> -->
+		
+			
+			<div class="ViewAll" *ngIf="cartItemsDetail.length > 3 && show == 3" (click)="showTotalCartItems()"> 
+				<a md-button class="viewAll-button"  [routerLink]="['/cart']" (click)="closePanel.emit();" style="background: transparent;color: mediumvioletred;line-height: 44px;" > View All ( {{cartItemsDetail.length}} )</a>
+				
+	   <!--  <span class="ecm-View" style="cursor: pointer;position: absolute;">ViewAll ( {{cartItemsDetail.length}} )</span>  --> 
+	   		</div>
+	   	<!--	<button md-raised-button class="button medium-btn-checkout" style="background: mediumvioletred; color:#fff;" >Checkout</button> -->
+	   		<button md-button class="checkout-button"  style="background: mediumvioletred; color:#fff;" >Checkout</button>
+
+</div>
+</ng-template>
+<!-- ---------================ MiniCart Ends==============================---------------------------- -->
+
+<!-- ---------================ detailCart start==============================---------------------------- -->
+
+
+<ng-template #fullCart>
+<div *ngIf="cartItemsDetail">
+ <ecm-header [isFixedHeader]=false> </ecm-header>
+ <ecm-breadcrumbs  [pageName]="'CART'"></ecm-breadcrumbs>
+
+<div class="row items" style="margin-top: 61px;">
+<md-card class="medium-6 columns cartItemsDetails">
+	<div style="margin: 5px;">
+			<table style="border: 2px solid ghostwhite; width: 100%;">
+			    <tr>
+					<th>Item</th>
+					<th>itemDescription</th>
+					<th>Price</th>
+					<th>Remove</th>
+				</tr>
+				<tr *ngFor="let item of cartItemsDetail" >
+					<td class="itemImage"><img style="height: inherit;" src="../assets/images/items/{{item.itemCode}}.png"></td>
+					<td class="itemdescription">{{item.descr}}</td>
+					<td style="padding: 10px;">₹ {{item.costRate}}</td>
+					<td (click)="deleteCartItem(item.itemCode)" style="cursor: pointer;"><i class="material-icons" style="color: mediumvioletred; font-size: 20px;">&#xE872;</i></td>
+				</tr>
+			</table>
+	</div>
+</md-card>	
+	<div class="medium-6 columns ecm-productDetails">
+	    <md-card class="totalPriceDetails">
+        <span class="PriceDetails">PRICE DETAILS</span>
+         <hr style="margin-top: 14px;">
+         <div>
+         <span style="font-size: 15px;padding-left: 14px;">Price (1 item)</span> 
+         <span style="float: right;">₹ 671</span>
+         </div>
+         <br>
+         <div>
+         <hr style="border: dotted;color: dimgray;border-width: thin;">
+         <span class="amountPayable">Amount Payable</span>
+         <span style="float: right; font-weight: 600;font-size: 16px;">₹ 671</span>
+         </div>    
+      </md-card>
+	</div>
+</div>
+
 </div>
+</ng-template>

ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-cart/ecm-cart.component.ts

-import { Component, OnInit } from '@angular/core';
-import { Http } from '@angular/http'
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { Http, Response, Headers, RequestOptions, URLSearchParams  } from '@angular/http'
+import { MdSnackBar } from '@angular/material';
 
 import { Item } from '../../ecm-model/product-model';
 import { EcmCartService } from './ecm-cart.service';
 
+import { Router,ActivatedRoute } from '@angular/router';
+
 @Component({
   selector: 'ecm-cart',
   templateUrl: './ecm-cart.component.html',
@@ -12,7 +15,11 @@ import { EcmCartService } from './ecm-cart.service';
 export class EcmCartComponent implements OnInit {
         cartItemsDetail: Item[];
         cartItems = 0;
-  constructor(public cartService: EcmCartService, private http: Http) { }
+        catCode;
+        show = 3;
+        @Input() isMiniCart:  boolean = false;
+        @Output() closePanel = new EventEmitter();
+  constructor(private route: ActivatedRoute, private router:Router, public cartService: EcmCartService, public snackBar: MdSnackBar, private http: Http) { }
 
   ngOnInit() {
    this.getCartItem();
@@ -32,7 +39,7 @@ export class EcmCartComponent implements OnInit {
             });
     }
     
-        userActionUrl = '/ecm/service/feeds/cart';
+    userActionUrl = '/ecm/service/feeds/cart';
 
     deleteCartItem( itemCode ) {
         console.log( "deleteCartItem Called" );
@@ -43,6 +50,26 @@ export class EcmCartComponent implements OnInit {
                 console.log( error.json() );
             });
         this.getCartItem();
+        this.openSnackBar("Item in the Cart","Deleted");
     }
-
+    
+    openSnackBar(message: string, action: string) {
+        this.snackBar.open(message, action, {
+        duration: 1000,
+    });
+  }
+  
+  showTotalCartItems(){
+  
+        this.show = this.cartItemsDetail.length;
+      
+        this.router.navigate(['/cart']);
+  }
+   
 }
+
+
+
+
+
+

ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-cart/ecm-cart.service.ts

@@ -9,7 +9,7 @@ import { Item } from '../../ecm-model/product-model';
 export class EcmCartService {
 private userActionUrl = '/ecm/service/feeds/cart';
 
-itemNo;
+  itemNo;
  
   constructor(private http: Http) { }