Commit 4f449811 authored by prumde's avatar prumde

Updated


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174491 ce508802-f39f-4f6c-b175-0d175dae99d5
parent 210b7e96
h6
{
color: mediumvioletred;
}
/* .changePass-form */
/* { */
/* position: relative; */
/* left: calc( ( 100% / 2 ) - 187.5px ); */
/* margin: 0; */
/* width: 375px; */
/* padding: 0 40px 0 40px; */
/* } */
.password-input-container {
/* width: 320px; */
/* width: 295px; */
font-size: 15px;
/* line-height: 15px; */
/* margin: 0 0 10px 0; */
/* padding: 0; */
width: 100%;
}
.password-input {
height:20px;
}
.statusError {
position: absolute;
font-size: 75%;
width: 50%;
margin-top: -1.2em;
line-height: 1.2em;
overflow: hidden;
}
.successForm{
position: absolute;
left: calc( ( 100% / 2 ) - 110px );
top: 40%;
color: mediumvioletred;
}
.signin-button
{
background: mediumvioletred;
color: #fff;
}
.signin-button[disabled]
{
background: #e0e0e0;
color: #fff;
}
.signin-button{
width: 200px;
height: 46px;
font-size: 15px;
line-height: 15px;
text-align: center;
border-radius: 2px;
position: relative;
padding: 0;
margin: 5px 0 5px 0;
}
.changePassForm{
padding: 10px;
}
.changePass-head{
font-size: 16px;
font-weight: normal;
border-bottom: 1px solid lightgrey;
padding: 12px;
}
.changePass-form{
padding: 0px;
}
<ecm-user-option [activeScreen]="'changePwdScreen'" [fullProfile]="true"></ecm-user-option> <div class="row">
<ecm-user-option [activeScreen]="'successForm'"></ecm-user-option> <div class="small-12 medium-12 large-12 medium column changePass-form ">
\ No newline at end of file <div class="changePass-head">
<span *ngIf="!fullProfile">Change Password</span>
</div>
<form class="changePassForm" #changePass="ngForm" (ngSubmit)="changePassword(changePass);" novalidate autocomplete="off">
<md-input-container class="password-input-container" [hideRequiredMarker] = "true">
<input mdInput class="username-input" placeholder="Current Password" required name="cpassword" [(ngModel)]="_current_password" #current_password="ngModel" (keydown)="clearTimer();" type = 'password'
#curPassElem (focus) = "scrollIntoView(curPassElem);" />
<md-error *ngIf="current_password.errors && current_password.dirty" class="">Password required</md-error>
</md-input-container>
<md-input-container class="password-input-container" [hideRequiredMarker] = "true">
<input mdInput class="username-input" placeholder="New Password" required name="npassword" [(ngModel)]="_new_password" #new_password="ngModel" (keydown)="clearTimer();" type = 'password'
#newPassElem (focus) = "scrollIntoView(newPassElem);" />
<md-error *ngIf="new_password.errors && new_password.dirty" class="">Password required</md-error>
</md-input-container>
<md-input-container class="password-input-container" [hideRequiredMarker] = "true">
<input mdInput class="username-input" placeholder="Confirm Password" required name="cfpassword" [(ngModel)]="_confirm_password" #confirm_password="ngModel" (keydown)="clearTimer();" type = 'password'
#confPassElem (focus) = "scrollIntoView(confPassElem);" />
<md-error *ngIf="confirm_password.errors && confirm_password.dirty" class="">Password required</md-error>
</md-input-container>
<md-error class="statusError" *ngIf="statusErrorMsg">{{statusErrorMsg}}</md-error>
<button md-button class="signin-button" type="submit" [disabled]="!changePass.form.valid">Change Password</button>
</form>
<md-progress-bar *ngIf="statusPending"
class="signin-progress-bar"
[color]="'primary'"
[mode]="'indeterminate'"
[value]="50">
</md-progress-bar>
</div>
</div>
import { Component, OnInit } from '@angular/core'; import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { ECMSigninService } from '../ecm-signin/ecm-signin.service';
@Component({ import { FormGroupDirective, NgControl, NgForm, NgModel } from '@angular/forms';
selector: 'app-change-password', @Component( {
templateUrl: './change-password.component.html', selector: 'change-password',
styleUrls: ['./change-password.component.css'] templateUrl: './change-password.component.html',
styleUrls: ['./change-password.component.css'],
providers: [ECMSigninService]
}) })
export class ChangePasswordComponent implements OnInit { export class ChangePasswordComponent implements OnInit {
constructor() { } _username: string;
_password: string;
_npassword: string;
statusPending: boolean = false;
statusErrorMsg: string;
userData: any;
_current_password: string;
_new_password: string;
_confirm_password: string;
@Output() closePanel = new EventEmitter();
constructor( public signinService: ECMSigninService, ) { }
@Input('activeScreen') activeScreen : string = 'userInfoScreen';
activeNGForm: NgForm;
ngOnInit() {
}
ngOnInit() { changePassword(chgForm: NgForm) {
}
this.signinService.changeCurrentPassword( this.userData.jti, this._new_password, this._current_password, this.userData.TOKEN_ID ).subscribe(
result => {
console.log( 'comp result.results.indexOf [' + result.Response.results.indexOf( '{' ) + ']' );
if ( result.Response.status == 'success' ) {
console.log( 'Logging Out' );
alert(result.Response.results);
this.activeScreen = 'successForm';
this.userData = null;
//TODO Load Login Screen
this.closePanel.emit();
}
else if ( result.Response.status == 'error' ) {
chgForm.resetForm();
}
},
error => {
let errorMessage = <any>error;
console.log( 'comp errorMessage[' + errorMessage + ']' );
}
);
}
} }
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="ecm-section-info" > <div class="ecm-section-info" >
<img class="fixed-header-back img-back-32 mat-raised-button" (click) = "backClicked();" src="back_32_32.svg" /> <img class="fixed-header-back img-back-32 mat-raised-button" (click) = "backClicked();" src="back_32_32.svg" />
<ul class="ecm-breadcrumbs"> <ul class="ecm-breadcrumbs">
<li *ngFor="let breadcrumb of breadcrumbs; let i = index"> <li *ngFor="let breadcrumb of getBreadCrummbs(); let i = index">
<a *ngIf="!((i+1) == breadcrumbs.length)" [routerLink]="[breadcrumb.url]">{{breadcrumb.label}}</a> <a *ngIf="!((i+1) == getBreadCrummbs().length)" [routerLink]="[breadcrumb.url]">{{breadcrumb.label}}</a>
<span class="disabled-link" *ngIf="(i+1) == breadcrumbs.length">{{breadcrumb.label}}</span> <span class="disabled-link" *ngIf="(i+1) == getBreadCrummbs().length">{{breadcrumb.label}}</span>
</li> </li>
</ul> </ul>
</div> </div>
......
import { Component, OnInit, Input } from '@angular/core'; import { Component, OnInit, Input, Injectable } from '@angular/core';
import { Location } from '@angular/common'; import { Location } from '@angular/common';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import {AppState} from '../ecm-store/reducers'; import {AppState} from '../ecm-store/reducers';
...@@ -13,6 +13,22 @@ interface IBreadcrumb { ...@@ -13,6 +13,22 @@ interface IBreadcrumb {
url: string; url: string;
} }
@Injectable()
export class Breadcrumbs {
breadcrumbsList: IBreadcrumb[] = [];
get breadcrumbs(): IBreadcrumb[] { return this.breadcrumbsList; }
set breadcrumbs(breadcrumbs: IBreadcrumb[]) {
console.log('set breadcrumbs',breadcrumbs);
this.breadcrumbsList = breadcrumbs;
}
constructor() {
}
}
@Component( { @Component( {
selector: 'ecm-breadcrumbs', selector: 'ecm-breadcrumbs',
templateUrl: './ecm-breadcrumbs.component.html', templateUrl: './ecm-breadcrumbs.component.html',
...@@ -28,143 +44,22 @@ export class EcmBreadcrumbsComponent implements OnInit { ...@@ -28,143 +44,22 @@ export class EcmBreadcrumbsComponent implements OnInit {
subcategory; subcategory;
item : Observable<Item>; item : Observable<Item>;
constructor( private _location: Location, private store: Store<AppState> ) { } constructor( private _location: Location, private store: Store<AppState>, public breadcrumbSerivce: Breadcrumbs) { }
ngOnInit() {
if ( this.pageName == 'SUB_CATEGORY' ) {
let storeCategory;
let category_shDescr;
this.store.select('category')
.subscribe( category => this.category = category );
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: this.category.shDescr,
url: 'javascript:void(0)'
});
}
if ( this.pageName == 'ITEMS' ) {
this.store.select('category')
.subscribe( category => this.category = category );
this.store.select('subcategory')
.subscribe( subcategory => this.subcategory = subcategory );
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: this.category.shDescr,
url: '/categories/' + this.subcategory.catCode
});
this.breadcrumbs.push( {
label: this.subcategory.shDescr,
url: 'javascript:void(0)'
});
}
if ( this.pageName == 'SEARCH' ) {
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: 'Search',
url: 'javascript:void(0)'
});
}
if ( this.pageName == 'DETAIL' ) {
let catCode = this.itemDetail.itemCategory.catCode;
let scatCode = this.itemDetail.itemSubCategory.scatCode ;
let catShDescr = this.itemDetail.itemCategory.shDescr;
let subcatShDescr = this.itemDetail.itemSubCategory.shDescr;
this.breadcrumbs = []; ngOnInit() {
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: catShDescr,
url: '/categories/' + catCode
});
this.breadcrumbs.push( {
label: subcatShDescr,
url: '/products/' + scatCode
});
}
if ( this.pageName == 'CART' ) {
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: 'Cart',
url: 'javascript:void(0)'
});
}
if ( this.pageName == 'CHECKOUT' ) {
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: 'Checkout',
url: 'javascript:void(0)'
});
}
if ( this.pageName == 'WISHLIST' ) {
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: 'Wishlist',
url: 'javascript:void(0)'
});
}
if ( this.pageName == 'USERPROFILE' ) {
this.breadcrumbs = [];
this.breadcrumbs.push( {
label: 'Home',
url: '/home'
});
this.breadcrumbs.push( {
label: 'My Profile',
url: 'javascript:void(0)'
});
}
} }
backClicked() { backClicked() {
//TODO : Pagewise Back click //TODO : Pagewise Back click
this._location.back(); this._location.back();
} }
getBreadCrummbs(){
return this.breadcrumbSerivce.breadcrumbs;
}
} }
...@@ -169,8 +169,15 @@ p { ...@@ -169,8 +169,15 @@ p {
#ecm-item-info-title { #ecm-item-info-title {
line-height: 15px; line-height: 15px;
padding-top: 0px; padding-top: 0px;
display: inline;
padding-right: 5px; padding-right: 5px;
position: relative;
overflow: hidden;
display: inline-block;
white-space: nowrap;
text-overflow: ellipsis;
max-width: 70%;
vertical-align: middle;
} }
#ecm-item-info-subhead { #ecm-item-info-subhead {
...@@ -353,7 +360,7 @@ p { ...@@ -353,7 +360,7 @@ p {
/* padding: 8px; */ /* padding: 8px; */
/* padding: 8px; */ /* padding: 8px; */
right: 25px; right: 25px;
top: 10px; top: 15px;
/* height: 40px; */ /* height: 40px; */
/* width: 40px; */ /* width: 40px; */
cursor: pointer; cursor: pointer;
...@@ -370,6 +377,14 @@ p { ...@@ -370,6 +377,14 @@ p {
font-size: 28px; font-size: 28px;
} }
.close-icon{
color: inherit;
font-size: 22px;
position: relative;
box-shadow: 0px 0px 3px 1px lightgrey;
border-radius: 100%;
}
.inwishlist { .inwishlist {
color: mediumvioletred !important; color: mediumvioletred !important;
} }
......
...@@ -57,8 +57,8 @@ ...@@ -57,8 +57,8 @@
<span *ngIf="extraParam && !itemData.cat_sh_descr && !itemData.scat_sh_descr" class="ecm-card-info-subhead" id="ecm-item-info-subhead">{{extraParam.catShDesc}} - {{extraParam.scatDesc}}</span> <span *ngIf="extraParam && !itemData.cat_sh_descr && !itemData.scat_sh_descr" class="ecm-card-info-subhead" id="ecm-item-info-subhead">{{extraParam.catShDesc}} - {{extraParam.scatDesc}}</span>
--> -->
</div> </div>
<div class="ecm-card-price"><span class="ecm-rupee"></span><s style="color:lightgray;">Rs. {{itemData.itemHeader.itemCostRate}}</s> <div class="ecm-card-price"><span class="ecm-rupee"></span><s style="color:lightgray;">Rs. {{itemData.itemHeader.itemCostRate | number : '3.1-5'}}</s>
<span class="ecm-discount-rate">Rs.{{itemData.itemHeader.itemDiscountedRate}}</span> <span class="ecm-discount-rate">Rs.{{itemData.itemHeader.itemDiscountedRate | number : '3.1-5'}}</span>
<span class="ecm-discount-off">{{itemData.itemHeader.itemDiscount}}% off</span> <span class="ecm-discount-off">{{itemData.itemHeader.itemDiscount}}% off</span>
</div> </div>
<div class="ecm-ratings"> <div class="ecm-ratings">
...@@ -68,7 +68,8 @@ ...@@ -68,7 +68,8 @@
</div> </div>
</div> </div>
<div [ngClass]="inWishlist ? 'inwishlist' : ''" class="ecm-wishlist-button"> <div [ngClass]="inWishlist ? 'inwishlist' : ''" class="ecm-wishlist-button">
<md-icon class="favourite-icon" (click)="inWishlist ? removeFromWishlist.emit() : addToWishlist.emit()">favorite</md-icon> <md-icon *ngIf="!IS_WISHLIST" class="favourite-icon" (click)="inWishlist ? removeFromWishlist.emit() : addToWishlist.emit()">favorite</md-icon>
<md-icon *ngIf="IS_WISHLIST" class="close-icon" (click)="removeFromWishlist.emit()">close</md-icon>
</div> </div>
</div> </div>
......
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { Router } from '@angular/router'; import { Router, ActivatedRoute } from '@angular/router';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import {AppState} from '../ecm-store/reducers'; import {AppState} from '../ecm-store/reducers';
...@@ -14,6 +14,8 @@ import { EcmProductReviewService } from '../ecm-product-details/ecm-product-revi ...@@ -14,6 +14,8 @@ import { EcmProductReviewService } from '../ecm-product-details/ecm-product-revi
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import { Item } from '../ecm-model/product-model'; import { Item } from '../ecm-model/product-model';
import { ItemActions } from '../ecm-store/actions';
@Component({ @Component({
selector: 'ecm-card', selector: 'ecm-card',
templateUrl: './ecm-card.component.html', templateUrl: './ecm-card.component.html',
...@@ -35,8 +37,9 @@ export class ECMCardComponent implements OnInit { ...@@ -35,8 +37,9 @@ export class ECMCardComponent implements OnInit {
@Output() removeFromWishlist = new EventEmitter(); @Output() removeFromWishlist = new EventEmitter();
wishlistItems: Observable<Item[]>; wishlistItems: Observable<Item[]>;
categoryList: any;
constructor(private router: Router, private productReviewService: EcmProductReviewService, private store: Store<AppState>) { IS_WISHLIST: boolean;
constructor(private route: ActivatedRoute,private router: Router, private productReviewService: EcmProductReviewService, private store: Store<AppState>, private itemAction: ItemActions) {
} }
...@@ -50,6 +53,15 @@ export class ECMCardComponent implements OnInit { ...@@ -50,6 +53,15 @@ export class ECMCardComponent implements OnInit {
this.inWishlist = false; this.inWishlist = false;
} ); } );
} }
let openRoutePath = this.route.snapshot.url[0].path;
if(openRoutePath == 'wishlist'){
this.IS_WISHLIST = true;
}
let menu : Observable<any> = this.store.select('menuList');
menu.subscribe( menuList => {
this.categoryList = menuList.catSummary;
console.log('menuList.catSummary',menuList, menuList.catSummary);
});
} }
viewItem(){ viewItem(){
...@@ -67,8 +79,18 @@ export class ECMCardComponent implements OnInit { ...@@ -67,8 +79,18 @@ export class ECMCardComponent implements OnInit {
} }
viewCategories(){ viewCategories(){
this.storeData.emit(this.category);
this.router.navigate([ '/categories', this.category.catCode]); let cat = this.categoryList.find( category => category.catCode === this.category.catCode);
console.log( this.categoryList, cat );
if( cat && !cat.subcategory ){
this.store.dispatch( this.itemAction.loadItems( this.category.catCode ) );
this.router.navigate([ '/products', this.category.catCode]);
}
else {
this.storeData.emit(this.category);
this.router.navigate([ '/categories', this.category.catCode]);
}
} }
viewProducts(){ viewProducts(){
......
...@@ -226,7 +226,7 @@ export class ECMHeaderComponent implements OnInit, OnDestroy { ...@@ -226,7 +226,7 @@ export class ECMHeaderComponent implements OnInit, OnDestroy {
} }
else else
{ {
this.ecmPanel.open({ type: 'inplace', option: 'CART_OPT', top:'65px', left: '', right: '75px', width:'360px', height: '' }); this.ecmPanel.open({ type: 'inplace', option: 'CART_OPT', top:'65px', left: '', right: '75px', width:'400px', height: '' });
} }
} }
} }
......
...@@ -52,7 +52,8 @@ export class EcmImageComponent implements OnInit, AfterViewChecked { ...@@ -52,7 +52,8 @@ export class EcmImageComponent implements OnInit, AfterViewChecked {
initImage(objName:string, refSer:string, refId:string, attachType:string) initImage(objName:string, refSer:string, refId:string, attachType:string)
{ {
this.imageUrl = "?OBJ_NAME=" + objName + "&REF_SER=" + refSer + "&REF_ID=" + refId + this.imageUrl = "?OBJ_NAME=" + objName + "&REF_SER=" + refSer + "&REF_ID=" + refId +
"&DOC_TYPE=" + attachType + "&TOKEN_ID=" + localStorage.getItem('TOKEN_ID') + "&DATA_FORMAT=JSON"; "&DOC_TYPE=" + attachType + "&TOKEN_ID=" + localStorage.getItem('TOKEN_ID') + "&DATA_FORMAT=JSON" +
"&TEST=ON";
console.log("initImage calling /ibase/rest/E12ExtService/getAttachDocument "); console.log("initImage calling /ibase/rest/E12ExtService/getAttachDocument ");
console.log("created imageUrl " + this.imageUrl); console.log("created imageUrl " + this.imageUrl);
} }
...@@ -141,9 +142,15 @@ export class EcmImageComponent implements OnInit, AfterViewChecked { ...@@ -141,9 +142,15 @@ export class EcmImageComponent implements OnInit, AfterViewChecked {
{ {
console.log("this.targetImg ngAfterViewChecked... " + this.targetImg.nativeElement); console.log("this.targetImg ngAfterViewChecked... " + this.targetImg.nativeElement);
this.targetImg.nativeElement.src = "/ibase/rest/E12ExtService/getAttachDocument" + this.imageUrl; this.targetImg.nativeElement.src = "/ibase/rest/E12ExtService/getAttachDocument" + this.imageUrl;
this.targetImg.nativeElement.onerror ="this.src = '/ecm/assets/images/svg/img_not_found.svg'; this.onerror = null;"; //this.targetImg.nativeElement.onerror ="this.src = '/ecm/assets/images/svg/img_not_found.svg'; this.onerror = null;";
this.targetImg.nativeElement.onerror = this.onEcmImageError;
this.imageUrl = null; this.imageUrl = null;
} }
} }
onEcmImageError( elem ){
console.log( "onEcmImageError", this );
console.log( "onEcmImageError", elem );
}
} }
...@@ -9,16 +9,17 @@ export class ItemDetail { ...@@ -9,16 +9,17 @@ export class ItemDetail {
public itemCategory: any; // JSON String public itemCategory: any; // JSON String
public itemSubCategory: any; // JSON String public itemSubCategory: any; // JSON String
public itemHeader: any; // JSON String public itemHeader: any; // JSON String
public itemDetail1: any; // JSON String
public itemDetail2: any; // JSON String
public itemRatings: any; // JSON String public itemRatings: any; // JSON String
public itemVariants: any; // JSON String public itemVariants: any; // JSON String
public itemAttributes: Array<any>; // JSON String
public itemDetail1: any; // JSON String
public itemDetail2: any; // JSON String
public productStatus: any; // JSON String public productStatus: any; // JSON String
}
/* /*
any = { "itemPackages": [{"package": "Experienced Instructor"},{"package":"Meal(option)"}, {"package":"Large group concession"}], any = { "itemPackages": [{"package": "Experienced Instructor"},{"package":"Meal(option)"}, {"package":"Large group concession"}],
"itemExtraInfo" : "Discount valid till 31st July 2017 ", "itemExtraInfo" : "Discount valid till 31st July 2017 ",
"itemVenue" : "Mumbai" "itemVenue" : "Mumbai"
}; };
*/ */
} \ No newline at end of file
\ No newline at end of file
...@@ -81,17 +81,21 @@ ...@@ -81,17 +81,21 @@
display: none; display: none;
padding: 10px 0px; padding: 10px 0px;
} }
.category-box { .category-box{
padding: 5px 0px; padding: 5px 0px;
cursor: pointer; cursor: pointer;
} }
.category-box:HOVER { .category-box:HOVER ,
.category-box.hovered{
background: rgba(200, 191, 191, 0.16); background: rgba(200, 191, 191, 0.16);
color: mediumvioletred; color: mediumvioletred;
border-right: 5px solid mediumvioletred; border-right: 5px solid mediumvioletred;
} }
.category-box:HOVER > .category-products-tab { .category-box:HOVER ~ .category-products-tab {
display: block;
}
.category-products-tab:HOVER{
display: block; display: block;
} }
......
<!--
<div class="category-list-container"> <div class="category-list-container">
<div class="top-categories-title">Top Categories</div> <div class="top-categories-title">Top Categories</div>
<div class="category-list"> <div class="category-list">
...@@ -24,14 +26,51 @@ ...@@ -24,14 +26,51 @@
</div> </div>
</div> </div>
-->
<div class="category-list-container">
<div class="top-categories-title">Top Categories</div>
<div class="category-list">
<div *ngFor="let _category of categoryList | slice:0:3; let i = index;" class="category-box" [ngClass]="{'hovered' : hoverIdx == i }" (click)="viewAllSubCategory(_category);" on-mouseover="hoverIdx = i; ">
<ecm-image [refId]='_category.catCode' [refSer]="'ECMCAT'" [object]="'ECM_CATEGORY'" [attachType]="'Icon'" [isSmallIcon]="true"></ecm-image>
<span class="category-title">{{_category.catShDescr}}</span>
</div>
<div class="row category-products-tab" *ngIf="hoverIdx >= 0" >
<div *ngFor="let _subcategory of categoryList[hoverIdx].list " class="small-12 medium-6 large-4 column category_product">
<div *ngIf="categoryList[hoverIdx].subcategory">
<span class="sub-cat-descr">{{_subcategory.scatShDescr}}</span>
<div *ngFor="let _item of _subcategory.list | slice:0:4;">
<a (click)="viewItem(_item.itemCode)" class="ecm-item">
{{_item.descr}}
</a>
</div>
<div *ngIf="_subcategory.list.length > 4">
<span class="view-all" (click)="viewAllProducts(_subcategory);">View All</span>
</div>
</div>
<div *ngIf="!categoryList[hoverIdx].subcategory">
<a (click)="viewItem(_subcategory.itemCode)" class="ecm-item">
{{_subcategory.shDescr}}
</a>
</div>
</div>
</div>
</div>
<div class="view-all-button">
<span (click)="viewAllCategories();">View All</span>
</div>
</div>
<div class="my-menu-container" *ngIf="userData"> <div class="my-menu-container" *ngIf="userData">
<div class="my-menu-title">My Menu</div> <div class="my-menu-title">My Menu</div>
<div class="my-menu-list"> <div class="my-menu-list">
<div class="nav-my-profile"> <div class="nav-my-profile" (click)="goToMyProfile();">
<img class="ecm-user-icon" src="/ecm/assets/images/svg/user.svg" /> <img class="ecm-user-icon" src="/ecm/assets/images/svg/user.svg" />
<span class="menu-title" [routerLink]="['/myprofile']">My Profile</span> <span class="menu-title">My Profile</span>
</div> </div>
<div class="nav-orders"> <div class="nav-orders" (click)="goToMyOrders();">
<img class="ecm-order-icon" src="/ecm/assets/images/svg/order.svg" /> <img class="ecm-order-icon" src="/ecm/assets/images/svg/order.svg" />
<span class="menu-title">Orders</span> <span class="menu-title">Orders</span>
</div> </div>
......
...@@ -19,10 +19,10 @@ export class ECMNavMenuComponent implements OnInit { ...@@ -19,10 +19,10 @@ export class ECMNavMenuComponent implements OnInit {
subcategoryList; subcategoryList;
subcategories; subcategories;
userData; userData;
showProducts: boolean = false; hoverIdx = -1;
menu: Observable<any>; menu: Observable<any>;
constructor(private store: Store<AppState>, private categoryAction:CategoryActions, private subCategoryAction: SubCategoryActions, private router: Router, private route: ActivatedRoute, private itemAction: ItemActions) { } constructor(private store: Store<AppState> , private router: Router, private route: ActivatedRoute, private itemAction: ItemActions/*, private categoryAction:CategoryActions*/, private subCategoryAction: SubCategoryActions) { }
ngOnInit() { ngOnInit() {
this.getCategories(); this.getCategories();
this.createUserData(); this.createUserData();
...@@ -30,25 +30,29 @@ export class ECMNavMenuComponent implements OnInit { ...@@ -30,25 +30,29 @@ export class ECMNavMenuComponent implements OnInit {
getCategories() { getCategories() {
this.menu = this.store.select('menuList'); this.menu = this.store.select('menuList');
this.menu.subscribe( menuList => this.categoryList = menuList.catList); this.menu.subscribe( menuList => {
this.categoryList = menuList.catSummary;
console.log('menuList.catSummary',menuList, menuList.catSummary);
});
} }
viewAllSubCategory(category) { viewAllSubCategory(category) {
this.store.dispatch( this.subCategoryAction.resetSubCategoryList() ); console.log('viewAllSubCategory');
this.store.dispatch( this.subCategoryAction.loadSubCategories( category.catCode ) );
this.store.dispatch(this.categoryAction.getCategorySuccess(category));
this.closePanel.emit(); this.closePanel.emit();
this.router.navigate([ '/categories', category.catCode]); if( category.subcategory )
} {
this.store.dispatch( this.subCategoryAction.resetSubCategoryList() );
showSubcategories(catCode) { this.store.dispatch( this.subCategoryAction.loadSubCategories( category.catCode ) );
this.menu.subscribe( menuList => this.subcategoryList = menuList.subCatList); //this.store.dispatch(this.categoryAction.getCategorySuccess(category));
this.subcategories = this.subcategoryList.filter( subcategory => subcategory.catCode === catCode); this.router.navigate([ '/categories', category.catCode]);
console.log("this.showProducts Before"+this.showProducts); }
this.showProducts = true; if( !category.subcategory )
console.log("this.showProducts After"+this.showProducts); {
this.store.dispatch( this.itemAction.loadItems( category.catCode ) );
this.router.navigate([ '/products', category.catCode]);
}
} }
viewAllCategories() { viewAllCategories() {
let openRoutePath = this.route.snapshot.url[0].path; let openRoutePath = this.route.snapshot.url[0].path;
this.closePanel.emit(); this.closePanel.emit();
...@@ -63,14 +67,15 @@ export class ECMNavMenuComponent implements OnInit { ...@@ -63,14 +67,15 @@ export class ECMNavMenuComponent implements OnInit {
} }
viewAllProducts(subcategory) { viewAllProducts(subcategory) {
console.log('viewAllProducts');
//this.closePanel.emit();
//this.store.dispatch( this.subCategoryAction.getSubCategorySuccess(subcategory) );
//let category = this.categoryList.find( category => category.catCode === subcategory.catCode);
//this.store.dispatch(this.categoryAction.getCategorySuccess(category));
this.closePanel.emit(); this.closePanel.emit();
this.store.dispatch( this.itemAction.resetItemList() ); this.store.dispatch( this.itemAction.resetItemList() );
this.store.dispatch( this.itemAction.loadItems( subcategory.scatCode ) ); this.store.dispatch( this.itemAction.loadItems( subcategory.scatCode ) );
this.store.dispatch( this.subCategoryAction.getSubCategorySuccess(subcategory) );
let category = this.categoryList.find( category => category.catCode === subcategory.catCode);
this.store.dispatch(this.categoryAction.getCategorySuccess(category));
this.closePanel.emit();
this.router.navigate( ['/products', subcategory.scatCode] ); this.router.navigate( ['/products', subcategory.scatCode] );
} }
...@@ -85,6 +90,16 @@ export class ECMNavMenuComponent implements OnInit { ...@@ -85,6 +90,16 @@ export class ECMNavMenuComponent implements OnInit {
this.router.navigate(['/wishlist']); this.router.navigate(['/wishlist']);
} }
goToMyProfile() {
this.closePanel.emit();
this.router.navigate(['/myprofile']);
}
goToMyOrders() {
this.closePanel.emit();
this.router.navigate(['/myOrder']);
}
createUserData() { createUserData() {
var userInfo = localStorage.getItem( 'userInfo' ); var userInfo = localStorage.getItem( 'userInfo' );
if ( userInfo !== 'undefined' && userInfo !== null && userInfo !== 'null' ) if ( userInfo !== 'undefined' && userInfo !== null && userInfo !== 'null' )
......
...@@ -18,6 +18,7 @@ import { EcmOutingComponent } from './ecm-template/ecm-outing.component'; ...@@ -18,6 +18,7 @@ import { EcmOutingComponent } from './ecm-template/ecm-outing.component';
import { EcmFoodComponent } from './ecm-template/ecm-food.component'; import { EcmFoodComponent } from './ecm-template/ecm-food.component';
import { EcmCelebrationComponent } from './ecm-template/ecm-celebration.component'; import { EcmCelebrationComponent } from './ecm-template/ecm-celebration.component';
import { EcmHandicraftComponent } from './ecm-template/ecm-handicraft.component'; import { EcmHandicraftComponent } from './ecm-template/ecm-handicraft.component';
import { EcmTrainingComponent } from './ecm-template/ecm-training.component';
import { EcmProductReviewComponent } from './ecm-product-review.component'; import { EcmProductReviewComponent } from './ecm-product-review.component';
import { EcmRelatedItemsComponent } from '../ecm-view/ecm-related-items/ecm-related-items.component'; import { EcmRelatedItemsComponent } from '../ecm-view/ecm-related-items/ecm-related-items.component';
import { ECMCart } from '../ecm-model/cart-model'; import { ECMCart } from '../ecm-model/cart-model';
...@@ -27,12 +28,14 @@ import { Reviews } from '../ecm-model/product-review.model'; ...@@ -27,12 +28,14 @@ import { Reviews } from '../ecm-model/product-review.model';
import { MdDialog, MdDialogRef, MdDialogConfig, MD_DIALOG_DATA } from '@angular/material'; import { MdDialog, MdDialogRef, MdDialogConfig, MD_DIALOG_DATA } from '@angular/material';
import { ECMWriteReviewDialog } from './ecm-product-review.component'; import { ECMWriteReviewDialog } from './ecm-product-review.component';
import { EcmPanelComponent } from '../ecm-view/ecm-panel/ecm-panel.component'; import { EcmPanelComponent } from '../ecm-view/ecm-panel/ecm-panel.component';
import { Breadcrumbs } from '../ecm-breadcrumbs/ecm-breadcrumbs.component';
export const ECM_TEMPLATES: any = { export const ECM_TEMPLATES: any = {
'ecm-outing' : new EcmTemplateItem(EcmOutingComponent), 'ecm-outing' : new EcmTemplateItem(EcmOutingComponent),
'ecm-food' : new EcmTemplateItem(EcmFoodComponent), 'ecm-food' : new EcmTemplateItem(EcmFoodComponent),
'ecm-celebration' : new EcmTemplateItem(EcmCelebrationComponent), 'ecm-celebration' : new EcmTemplateItem(EcmCelebrationComponent),
'ecm-handicraft' : new EcmTemplateItem(EcmHandicraftComponent) 'ecm-handicraft' : new EcmTemplateItem(EcmHandicraftComponent),
'ecm-training' : new EcmTemplateItem(EcmTrainingComponent)
}; };
@Component({ @Component({
...@@ -57,7 +60,7 @@ export class EcmProductDetailsComponent implements OnInit { ...@@ -57,7 +60,7 @@ export class EcmProductDetailsComponent implements OnInit {
attribVal; attribVal;
attribCode; attribCode;
constructor(private route: ActivatedRoute, private router:Router, public productDetailService: EcmProductDetailService, public snackBar: MdSnackBar, private store: Store<AppState>, private productreviewService: EcmProductReviewService, public dialog: MdDialog, private cartActions: CartActions, private itemAction:ItemActions, private wishListAction:WishListActions) { } constructor(private route: ActivatedRoute, private router:Router, public productDetailService: EcmProductDetailService, public snackBar: MdSnackBar, private store: Store<AppState>, private productreviewService: EcmProductReviewService, public dialog: MdDialog, private cartActions: CartActions, private itemAction:ItemActions, private wishListAction:WishListActions, public breadcrumbSerivce: Breadcrumbs) { }
ngOnInit() { ngOnInit() {
this.clientWidth = document.documentElement.clientWidth; this.clientWidth = document.documentElement.clientWidth;
...@@ -82,7 +85,7 @@ export class EcmProductDetailsComponent implements OnInit { ...@@ -82,7 +85,7 @@ export class EcmProductDetailsComponent implements OnInit {
items.subscribe( items => { items.subscribe( items => {
item = items.find(x => x.itemCode === this.itemCode); item = items.find(x => x.itemCode === this.itemCode);
this.store.dispatch( this.itemAction.getItemSuccess(item) ); this.store.dispatch( this.itemAction.getItemSuccess(item) );
}); });
} }
...@@ -99,6 +102,9 @@ export class EcmProductDetailsComponent implements OnInit { ...@@ -99,6 +102,9 @@ export class EcmProductDetailsComponent implements OnInit {
this.ecmTemplate = ECM_TEMPLATES[ecmTemplateName]; this.ecmTemplate = ECM_TEMPLATES[ecmTemplateName];
this.scatCode = this.itemDetail.itemSubCategory.scatCode; this.scatCode = this.itemDetail.itemSubCategory.scatCode;
this.noOfReviews = this.itemDetail.itemRatings.NO_OF_REVIEWS; this.noOfReviews = this.itemDetail.itemRatings.NO_OF_REVIEWS;
let breadcrumb = [{label: 'Home', url: '/home'}, {label: this.itemDetail.itemCategory.shDescr,url: '/categories/' + this.itemDetail.itemSubCategory.catCode},{label: this.itemDetail.itemSubCategory.shDescr,url: '/products/' + this.itemDetail.itemSubCategory.scatCode}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
console.log( "Changed scatCode.." + this.scatCode ); console.log( "Changed scatCode.." + this.scatCode );
...@@ -155,7 +161,7 @@ export class EcmProductDetailsComponent implements OnInit { ...@@ -155,7 +161,7 @@ export class EcmProductDetailsComponent implements OnInit {
} }
else if( activity == 'BUY_NOW' ) { else if( activity == 'BUY_NOW' ) {
if( !data.isAddToCart ) { //ADD TO CART if( !data.isAddToCart ) { //ADD TO CART
this.addToCart(data.itemCode); this.addToCart(data.item);
this.showSnackbar('Item Added to your Cart'); this.showSnackbar('Item Added to your Cart');
} }
this.router.navigate(['/checkout']); this.router.navigate(['/checkout']);
......
...@@ -75,28 +75,39 @@ ...@@ -75,28 +75,39 @@
<ng-template #changePassForm > <!-- <ng-template #changePassForm > -->
<div class="changePass-form"> <!-- <div class="changePass-form"> -->
<h4>Change Password</h4> <!-- <h4>Change Password</h4> -->
<form #changePass="ngForm" (ngSubmit)="changePassword(changePass);" novalidate autocomplete="off"> <!-- <form #changePass="ngForm" (ngSubmit)="changePassword(changePass);" novalidate autocomplete="off"> -->
<md-input-container class="password-input-container" [hideRequiredMarker] = "true"> <!-- <md-input-container class="password-input-container" [hideRequiredMarker] = "true"> -->
<input mdInput class="username-input" placeholder="New Password" required name="npassword" [(ngModel)]="_npassword" #npassword="ngModel" (keydown)="clearTimer();" type = 'password' <!-- <input mdInput class="username-input" placeholder="New Password" required name="npassword" [(ngModel)]="_npassword" #npassword="ngModel" (keydown)="clearTimer();" type = 'password' -->
#npasswordElem (focus) = "scrollIntoView(npasswordElem);" /> <!-- #npasswordElem (focus) = "scrollIntoView(npasswordElem);" /> -->
<md-error *ngIf="npassword.errors && npassword.dirty" class="">Enter your password</md-error> <!-- <md-error *ngIf="npassword.errors && npassword.dirty" class="">Enter your password</md-error> -->
</md-input-container> <!-- </md-input-container> -->
<md-input-container class="password-input-container" [hideRequiredMarker] = "true"> <!-- <md-input-container class="password-input-container" [hideRequiredMarker] = "true"> -->
<input mdInput class="username-input" placeholder="Confirm Password" required name="confirm_password" [(ngModel)]="_confirm_password" #confirm_password="ngModel" (keydown)="clearTimer();" type = 'password' <!-- <input mdInput class="username-input" placeholder="Confirm Password" required name="confirm_password" [(ngModel)]="_confirm_password" #confirm_password="ngModel" (keydown)="clearTimer();" type = 'password' -->
#confirm_passwordElem (focus) = "scrollIntoView(confirm_passwordElem);" /> <!-- #confirm_passwordElem (focus) = "scrollIntoView(confirm_passwordElem);" /> -->
<md-error *ngIf="confirm_password.errors && confirm_password.dirty" class="">Enter your password again</md-error> <!-- <md-error *ngIf="confirm_password.errors && confirm_password.dirty" class="">Enter your password again</md-error> -->
</md-input-container> <!-- </md-input-container> -->
<md-error class="statusError" *ngIf="statusErrorMsg">{{statusErrorMsg}}</md-error> <!-- <md-error class="statusError" *ngIf="statusErrorMsg">{{statusErrorMsg}}</md-error> -->
<button md-button class="signin-button" type="submit" [disabled]="!changePass.form.valid">Change Password</button> <!-- <button md-button class="signin-button" type="submit" [disabled]="!changePass.form.valid">Change Password</button> -->
</form> <!-- </form> -->
<md-progress-bar *ngIf="statusPending" <!-- <md-progress-bar *ngIf="statusPending" -->
class="signin-progress-bar" <!-- class="signin-progress-bar" -->
[color]="'primary'" <!-- [color]="'primary'" -->
[mode]="'indeterminate'" <!-- [mode]="'indeterminate'" -->
[value]="50"> <!-- [value]="50"> -->
</md-progress-bar> <!-- </md-progress-bar> -->
</div> <!-- </div> -->
</ng-template> <!-- </ng-template> -->
<ng-template #changePassForm >
<change-password></change-password>
</ng-template>
...@@ -141,32 +141,32 @@ export class EcmSigninComponent implements OnInit { ...@@ -141,32 +141,32 @@ export class EcmSigninComponent implements OnInit {
); );
} }
changePassword(changePassForm) { // changePassword(changePassForm) {
this.activeNGForm = changePassForm; // this.activeNGForm = changePassForm;
this.statusPending = true; // this.statusPending = true;
//
this.signinService.changePassword( this._username, this._npassword ).subscribe( // this.signinService.changePassword( this._username, this._npassword ).subscribe(
result => { // result => {
console.log( 'comp results[' + result.Response.results + ']status[' + result.Response.status + ']' ); // console.log( 'comp results[' + result.Response.results + ']status[' + result.Response.status + ']' );
console.log( 'comp result.results.indexOf [' + result.Response.results.indexOf('{') + ']' ); // console.log( 'comp result.results.indexOf [' + result.Response.results.indexOf('{') + ']' );
this.statusPending = false; // this.statusPending = false;
this.statusErrorMsg = null; // this.statusErrorMsg = null;
if( result.Response.status == 'success') // if( result.Response.status == 'success')
{ // {
this.activeForm = 'successForm'; // this.activeForm = 'successForm';
} // }
else if( result.Response.status == 'error' ) // else if( result.Response.status == 'error' )
{ // {
this.statusErrorMsg = result.Response.results; // this.statusErrorMsg = result.Response.results;
this.activeNGForm.resetForm(); // this.activeNGForm.resetForm();
} // }
}, // },
error => { // error => {
let errorMessage = <any>error; // let errorMessage = <any>error;
console.log( 'comp errorMessage[' + errorMessage + ']' ); // console.log( 'comp errorMessage[' + errorMessage + ']' );
} // }
); // );
} // }
login(signinForm) { login(signinForm) {
this.activeNGForm = signinForm; this.activeNGForm = signinForm;
......
...@@ -14,6 +14,7 @@ const initialState: ItemState = { ...@@ -14,6 +14,7 @@ const initialState: ItemState = {
itemDetail2: '', itemDetail2: '',
itemRatings: '', itemRatings: '',
itemVariants: '', itemVariants: '',
itemAttributes: [],
productStatus: '' productStatus: ''
}; };
......
...@@ -387,7 +387,7 @@ h6 ...@@ -387,7 +387,7 @@ h6
} }
} }
.signin-button,
.register-button .register-button
{ {
/* width: 320px; */ /* width: 320px; */
...@@ -401,19 +401,8 @@ h6 ...@@ -401,19 +401,8 @@ h6
padding: 0; padding: 0;
margin: 5px 0 5px 0; margin: 5px 0 5px 0;
} }
.signin-button
{
background: mediumvioletred;
color: #fff;
}
.signin-button[disabled]
{
background: #e0e0e0;
color: #fff;
}
.username-input-container, .username-input-container{
.password-input-container {
/* width: 320px; */ /* width: 320px; */
width: 100%; width: 100%;
font-size: 15px; font-size: 15px;
...@@ -434,10 +423,10 @@ h6 ...@@ -434,10 +423,10 @@ h6
padding-bottom: 20px; padding-bottom: 20px;
} }
.changePass-form { /* .changePass-form { */
padding: 0px 20px; /* padding: 0px 20px; */
padding-top: 40px; /* padding-top: 40px; */
} /* } */
.changePass-userProfile{ .changePass-userProfile{
padding: 0px; padding: 0px;
...@@ -464,4 +453,3 @@ h6 ...@@ -464,4 +453,3 @@ h6
...@@ -63,34 +63,35 @@ ...@@ -63,34 +63,35 @@
<ng-template #changePwdScreen> <ng-template #changePwdScreen>
<!-- <div [ngClass]="!fullProfile ? 'changePass-userProfile' : 'changePass-form'"> <!-- <div [ngClass]="!fullProfile ? 'changePass-userProfile' : 'changePass-form'">
<h4 *ngIf="!fullProfile">Change Password</h4> --> <h4 *ngIf="!fullProfile">Change Password</h4> -->
<div class="changePass-form"> <!-- <div class="changePass-form"> -->
<h4 *ngIf="!fullProfile">Change Password</h4> <!-- <h4 *ngIf="!fullProfile">Change Password</h4> -->
<form #changePass="ngForm" (ngSubmit)="changePassword(changePass);" novalidate autocomplete="off"> <!-- <form #changePass="ngForm" (ngSubmit)="changePassword(changePass);" novalidate autocomplete="off"> -->
<md-input-container class="password-input-container" [hideRequiredMarker] = "true"> <!-- <md-input-container class="password-input-container" [hideRequiredMarker] = "true"> -->
<input mdInput class="username-input" placeholder="Current Password" required name="cpassword" [(ngModel)]="_current_password" #current_password="ngModel" (keydown)="clearTimer();" type = 'password' <!-- <input mdInput class="username-input" placeholder="Current Password" required name="cpassword" [(ngModel)]="_current_password" #current_password="ngModel" (keydown)="clearTimer();" type = 'password' -->
#curPassElem (focus) = "scrollIntoView(curPassElem);" /> <!-- #curPassElem (focus) = "scrollIntoView(curPassElem);" /> -->
<md-error *ngIf="current_password.errors && current_password.dirty" class="">Password required</md-error> <!-- <md-error *ngIf="current_password.errors && current_password.dirty" class="">Password required</md-error> -->
</md-input-container> <!-- </md-input-container> -->
<md-input-container class="password-input-container" [hideRequiredMarker] = "true"> <!-- <md-input-container class="password-input-container" [hideRequiredMarker] = "true"> -->
<input mdInput class="username-input" placeholder="New Password" required name="npassword" [(ngModel)]="_new_password" #new_password="ngModel" (keydown)="clearTimer();" type = 'password' <!-- <input mdInput class="username-input" placeholder="New Password" required name="npassword" [(ngModel)]="_new_password" #new_password="ngModel" (keydown)="clearTimer();" type = 'password' -->
#newPassElem (focus) = "scrollIntoView(newPassElem);" /> <!-- #newPassElem (focus) = "scrollIntoView(newPassElem);" /> -->
<md-error *ngIf="new_password.errors && new_password.dirty" class="">Password required</md-error> <!-- <md-error *ngIf="new_password.errors && new_password.dirty" class="">Password required</md-error> -->
</md-input-container> <!-- </md-input-container> -->
<md-input-container class="password-input-container" [hideRequiredMarker] = "true"> <!-- <md-input-container class="password-input-container" [hideRequiredMarker] = "true"> -->
<input mdInput class="username-input" placeholder="Confirm Password" required name="cfpassword" [(ngModel)]="_confirm_password" #confirm_password="ngModel" (keydown)="clearTimer();" type = 'password' <!-- <input mdInput class="username-input" placeholder="Confirm Password" required name="cfpassword" [(ngModel)]="_confirm_password" #confirm_password="ngModel" (keydown)="clearTimer();" type = 'password' -->
#confPassElem (focus) = "scrollIntoView(confPassElem);" /> <!-- #confPassElem (focus) = "scrollIntoView(confPassElem);" /> -->
<md-error *ngIf="confirm_password.errors && confirm_password.dirty" class="">Password required</md-error> <!-- <md-error *ngIf="confirm_password.errors && confirm_password.dirty" class="">Password required</md-error> -->
</md-input-container> <!-- </md-input-container> -->
<md-error class="statusError" *ngIf="statusErrorMsg">{{statusErrorMsg}}</md-error> <!-- <md-error class="statusError" *ngIf="statusErrorMsg">{{statusErrorMsg}}</md-error> -->
<button md-button class="signin-button" type="submit" [disabled]="!changePass.form.valid">Change Password</button> <!-- <button md-button class="signin-button" type="submit" [disabled]="!changePass.form.valid">Change Password</button> -->
</form> <!-- </form> -->
<md-progress-bar *ngIf="statusPending" <!-- <md-progress-bar *ngIf="statusPending" -->
class="signin-progress-bar" <!-- class="signin-progress-bar" -->
[color]="'primary'" <!-- [color]="'primary'" -->
[mode]="'indeterminate'" <!-- [mode]="'indeterminate'" -->
[value]="50"> <!-- [value]="50"> -->
</md-progress-bar> <!-- </md-progress-bar> -->
<button md-button class="chg-pwd-button" (click)="activeScreen = 'userInfoScreen';" >Cancel</button> <!-- </div> -->
</div> <change-password></change-password>
<button md-button class="chg-pwd-button" (click)="activeScreen = 'userInfoScreen';" >Cancel</button>
</ng-template> </ng-template>
...@@ -95,9 +95,9 @@ ...@@ -95,9 +95,9 @@
<div class="large-6 columns ecm-item-info"> <div class="large-6 columns ecm-item-info">
<span style="display: block;font-size: 16px;"> {{item.itemHeader.itemDescr}} </span> <span style="display: block;font-size: 16px;"> {{item.itemHeader.itemDescr}} </span>
<div> <div>
<span class="seller-info"> <!-- <span class="seller-info"> -->
<span class="seller-title">Sold By </span> <span class="seller-name">{{item.itemDetail1.sellerInfo.name}}</span> <!-- <span class="seller-title">Sold By </span> <span class="seller-name">{{item.itemDetail1.sellerInfo.name}}</span> -->
</span> <!-- </span> -->
<span *ngIf="item == 'occassion'" class="location-info"> <span *ngIf="item == 'occassion'" class="location-info">
<span class="location-title">Location:</span> <span class="location-name">{{item.itemDetail1.location}}</span><i class="material-icons location-icon">&#xE0C8;</i> <span class="location-title">Location:</span> <span class="location-name">{{item.itemDetail1.location}}</span><i class="material-icons location-icon">&#xE0C8;</i>
</span> </span>
......
...@@ -10,6 +10,7 @@ import { ECMHeaderComponent } from '../../ecm-header/ecm-header.component'; ...@@ -10,6 +10,7 @@ import { ECMHeaderComponent } from '../../ecm-header/ecm-header.component';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import { AppState } from '../../ecm-store/reducers'; import { AppState } from '../../ecm-store/reducers';
import { CartActions, WishListActions } from '../../ecm-store/actions'; import { CartActions, WishListActions } from '../../ecm-store/actions';
import { Breadcrumbs } from '../../ecm-breadcrumbs/ecm-breadcrumbs.component';
import { Item } from '../../ecm-model/product-model'; import { Item } from '../../ecm-model/product-model';
import { EcmCartService } from './ecm-cart.service'; import { EcmCartService } from './ecm-cart.service';
...@@ -39,11 +40,14 @@ export class EcmCartComponent implements OnInit, AfterViewChecked { ...@@ -39,11 +40,14 @@ export class EcmCartComponent implements OnInit, AfterViewChecked {
@ViewChild('scrollMe') private myScrollContainer: ElementRef; @ViewChild('scrollMe') private myScrollContainer: ElementRef;
@ViewChild('header') header: ECMHeaderComponent; @ViewChild('header') header: ECMHeaderComponent;
constructor( private route: ActivatedRoute, public dialog: MdDialog, private router: Router, public cartService: EcmCartService, public snackBar: MdSnackBar, private http: Http, private store: Store<AppState>, private cartAction: CartActions, private wishListAction:WishListActions) { } constructor( private route: ActivatedRoute, public dialog: MdDialog, private router: Router, public cartService: EcmCartService, public snackBar: MdSnackBar, private http: Http, private store: Store<AppState>, private cartAction: CartActions, private wishListAction:WishListActions, public breadcrumbSerivce: Breadcrumbs) { }
ngOnInit() { ngOnInit() {
this.getCartItem(); this.getCartItem();
this.scrollToBottom(); this.scrollToBottom();
let breadcrumb = [{label: 'Home', url: '/home'}, {label: 'Cart', url: 'javascript:void(0)'}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
} }
ngAfterViewChecked() { ngAfterViewChecked() {
...@@ -178,8 +182,19 @@ export class ECMConfirmDialog { ...@@ -178,8 +182,19 @@ export class ECMConfirmDialog {
@Input() confirmMsg : any; @Input() confirmMsg : any;
@Input() cancelText : any; @Input() cancelText : any;
@Input() confirmText : any; @Input() confirmText : any;
IS_CART: boolean;
constructor( public dialogRef: MdDialogRef<ECMConfirmDialog>) { } constructor( public dialogRef: MdDialogRef<ECMConfirmDialog>,private route: ActivatedRoute,private router: Router) { }
ngOnInit() {
console.log('route--',this.route,this.route.snapshot,this.router);
let openRoutePath = this.router.url;
if(openRoutePath == '/cart'){
this.IS_CART = true;
}
}
} }
......
<div class="deleteCart"> <div class="deleteCart">
<i class="material-icons" style="color: mediumvioletred;font-size: 26px;padding-bottom: 22px;">remove_shopping_cart</i> <i *ngIf="IS_CART" class="material-icons" style="color: mediumvioletred;font-size: 26px;padding-bottom: 22px;">remove_shopping_cart</i>
<span style="font-size: 19px;position: relative;bottom: 6px;">{{dialogTitle}}</span> <span style="font-size: 19px;position: relative;bottom: 6px;">{{dialogTitle}}</span>
<div md-dialog-content>{{confirmMsg}}</div> <div md-dialog-content>{{confirmMsg}}</div>
<div md-dialog-actions class="delete-cartitems-button"> <div md-dialog-actions class="delete-cartitems-button">
...@@ -10,10 +10,3 @@ ...@@ -10,10 +10,3 @@
</div> </div>
<!--
<h1 md-dialog-title>{{dialogTitle}}</h1>
<div md-dialog-content>{{confirmMsg}}</div>
<div md-dialog-actions>
<button md-button md-dialog-close="false">{{cancelText}}</button>
<button md-button md-dialog-close="true">{{confirmText}}</button>
</div> -->
\ No newline at end of file
...@@ -179,9 +179,12 @@ ...@@ -179,9 +179,12 @@
</tr> </tr>
</table> </table>
</div> </div>
<button type="submit" [disabled]="!userForm.valid" md-button class="place-order-button">Place Order</button> <button type="submit" [disabled]="!userForm.valid" md-button class="place-order-button">Place Order</button>
<span *ngIf="unAuthorized " >
<md-error >Please login first</md-error>
</span>
</md-card> </md-card>
</div> </div>
......
import { Component, OnInit, ViewChild, ElementRef, Input, Output, EventEmitter } from '@angular/core'; import { Component, OnInit, ViewChild, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { FormBuilder, Validators,NgForm } from '@angular/forms'; import { FormBuilder, Validators,NgForm,NgModel } from '@angular/forms';
import { ItemDetail } from '../../ecm-model/product-detail-model'; import { ItemDetail } from '../../ecm-model/product-detail-model';
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import { Location } from '@angular/common';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import {AppState} from '../../ecm-store/reducers'; import {AppState} from '../../ecm-store/reducers';
import { EcmCheckoutService } from './ecm-checkout.service';
import {CartActions} from '../../ecm-store/actions';
import { Breadcrumbs } from '../../ecm-breadcrumbs/ecm-breadcrumbs.component';
@Component( { @Component( {
selector: 'ecm-checkout', selector: 'ecm-checkout',
templateUrl: './ecm-checkout.component.html', templateUrl: './ecm-checkout.component.html',
styleUrls: ['./ecm-checkout.component.css'] styleUrls: ['./ecm-checkout.component.css'],
providers:[EcmCheckoutService]
}) })
export class EcmCheckoutComponent implements OnInit { export class EcmCheckoutComponent implements OnInit {
...@@ -19,12 +26,15 @@ export class EcmCheckoutComponent implements OnInit { ...@@ -19,12 +26,15 @@ export class EcmCheckoutComponent implements OnInit {
checked = false; checked = false;
cartItemsDetail: ItemDetail[]; cartItemsDetail: ItemDetail[];
totalPrice:number = 0; totalPrice:number = 0;
@Input() unAuthorized: boolean = false;
countries; countries;
months; months;
years; years;
activeNGForm: NgForm;
cartItems: Observable<ItemDetail[]>; cartItems: Observable<ItemDetail[]>;
userData: any;
constructor(private formBuilder: FormBuilder, private store: Store<AppState>) { constructor(private formBuilder: FormBuilder, private store: Store<AppState>,public checkoutService: EcmCheckoutService,private _location: Location, private cartActions: CartActions, public breadcrumbSerivce: Breadcrumbs) {
this.countries = [ this.countries = [
{ viewValue: 'India' }, { viewValue: 'India' },
{ viewValue: 'UAE' }, { viewValue: 'UAE' },
...@@ -57,12 +67,22 @@ export class EcmCheckoutComponent implements OnInit { ...@@ -57,12 +67,22 @@ export class EcmCheckoutComponent implements OnInit {
ngOnInit() { ngOnInit() {
window.scrollTo(0,0); window.scrollTo(0,0);
var userInfo = localStorage.getItem( 'userInfo' );
console.log( 'EcmUserOptionComponent getUserInfo ::' + userInfo );
if ( userInfo !== 'undefined' && userInfo !== null && userInfo !== 'null' ) {
this.userData = JSON.parse( userInfo );
}
this.getCartItems(); this.getCartItems();
let breadcrumb = [{label: 'Home', url: '/home'}, {label: 'Checkout', url: 'javascript:void(0)'}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
} }
onSubmit(data) { onSubmit(data) {
alert("Form Submitted");
console.log("User Email:[" +data.email +"]"); console.log("User Email:[" +data.email +"]");
console.log("User Data :[" + JSON.stringify(data) +"]");
this.activeNGForm = data;
this.placeOrder(data);
} }
getCartItems() { getCartItems() {
...@@ -77,6 +97,33 @@ export class EcmCheckoutComponent implements OnInit { ...@@ -77,6 +97,33 @@ export class EcmCheckoutComponent implements OnInit {
); );
}); });
} }
} placeOrder(data)
{
console.log( 'PlaceOrder dat[' + data + ']' );
this.checkoutService.sendData(data, this.userData.TOKEN_ID).subscribe(
result => {
if(result.Response.status == 'Unauthorized')
{
this.unAuthorized=true;
}
else
{
this.unAuthorized=false;
alert('Form sumited');
//this.store.dispatch(this.cartActions.resetCart());
this._location.back();
}
console.log( 'comp results[' + result.Response.results + ']status[' + result.Response.status + ']' );
console.log( 'comp result.results.indexOf [' + result.Response.results.indexOf('{') + ']' );
},
error => {
let errorMessage = <any>error;
console.log( 'comp errorMessage[' + errorMessage + ']' );
}
);
}
}
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions, URLSearchParams } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import {Store} from '@ngrx/store';
@Injectable() @Injectable()
export class EcmCheckoutService { export class EcmCheckoutService {
constructor (private http: Http ) {}
sendData(data, _tokenid: string): Observable<any> {
console.log( "inside send data" + JSON.stringify(data));
let authUrl = '/ecm/service/order'; // URL to web service
let _urlParams = new URLSearchParams();
_urlParams.append('tokenid', _tokenid);
console.log( "sendLogin 1...." + _urlParams.toString() );
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
authUrl = authUrl + '?' + _urlParams.toString();
console.log( "sendLogin 2...." + authUrl);
return this.http.post( authUrl, JSON.stringify(data) , options)
.map( (res) => this.extractData(res) );
}
private extractData(res: Response) {
let body = res.json();
console.log('extractData[' + JSON.stringify(body) + ']');
return body || { };
}
constructor() { } private handleError (error: Response | any) {
// In a real world app, we might use a remote logging infrastructure
let errMsg: string;
if (error instanceof Response) {
const body = error.json() || '';
const err = body.error || JSON.stringify(body);
errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
} else {
errMsg = error.message ? error.message : error.toString();
}
console.error('Service handleError:' + errMsg);
return Observable.throw(errMsg);
}
} }
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<ecm-breadcrumbs [pageName]="'ITEMS'"> </ecm-breadcrumbs> <ecm-breadcrumbs [pageName]="'ITEMS'"> </ecm-breadcrumbs>
</span> </span>
<div class="loading" *ngIf="(items | async)?.length == 0"> <div class="loading" *ngIf="items?.length == 0">
<div class="ecm-progress-bar"> <div class="ecm-progress-bar">
<div class="ecm-progress-title"> Loading </div> <div class="ecm-progress-title"> Loading </div>
<md-progress-spinner <md-progress-spinner
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
</div> </div>
</div> </div>
<div *ngIf="(items | async)?.length > 0"> <div *ngIf="items?.length > 0">
<section class="subcategories-section"> <section class="subcategories-section">
<div class="row"> <div class="row">
<md-card class="product-list-card"> <md-card class="product-list-card">
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
</div> </div>
<div class="ecm-item-card-detail"> <div class="ecm-item-card-detail">
<div class="small-12 medium-6 large-4 column end item-card" <div class="small-12 medium-6 large-4 column end item-card"
*ngFor="let _item of items | async"> *ngFor="let _item of items">
<div class="item-card-overlay" (click)="isInCart(_item.itemCode) ? goToCart() : addToCart(_item) "> <div class="item-card-overlay" (click)="isInCart(_item.itemCode) ? goToCart() : addToCart(_item) ">
<span class="item-card-overlay-action" > <span class="item-card-overlay-action" >
<i class="material-icons">shopping_cart</i> <i class="material-icons">shopping_cart</i>
......
...@@ -14,6 +14,7 @@ import { ItemDetail } from '../../ecm-model/product-detail-model'; ...@@ -14,6 +14,7 @@ import { ItemDetail } from '../../ecm-model/product-detail-model';
import { ECMHeaderComponent } from '../../ecm-header/ecm-header.component'; import { ECMHeaderComponent } from '../../ecm-header/ecm-header.component';
import { ScrollService } from '../../scroll.service'; import { ScrollService } from '../../scroll.service';
import { Breadcrumbs } from '../../ecm-breadcrumbs/ecm-breadcrumbs.component';
@Component( { @Component( {
selector: 'ecm-product', selector: 'ecm-product',
...@@ -36,7 +37,7 @@ export class EcmProductComponent implements OnInit { ...@@ -36,7 +37,7 @@ export class EcmProductComponent implements OnInit {
cartItems: Observable<ItemDetail[]>; cartItems: Observable<ItemDetail[]>;
Items = 0; Items = 0;
private items: Observable<ItemDetail[]>; private items;
private extra_param = { "catCode": '', "catShDesc": '', scatDesc: '' }; private extra_param = { "catCode": '', "catShDesc": '', scatDesc: '' };
private category; private category;
...@@ -45,7 +46,7 @@ export class EcmProductComponent implements OnInit { ...@@ -45,7 +46,7 @@ export class EcmProductComponent implements OnInit {
attribVal; attribVal;
attribCode; attribCode;
constructor( private route: ActivatedRoute, private router: Router, private scroll_service: ScrollService, private store: Store<AppState>, private itemAction: ItemActions, private cartAction: CartActions, private wishlistAction: WishListActions, public snackBar: MdSnackBar) { } constructor( private route: ActivatedRoute, private router: Router, private scroll_service: ScrollService, private store: Store<AppState>, private itemAction: ItemActions, private cartAction: CartActions, private wishlistAction: WishListActions, public snackBar: MdSnackBar, public breadcrumbSerivce: Breadcrumbs) { }
ngOnInit() { ngOnInit() {
window.scrollTo( 0, 0 ); window.scrollTo( 0, 0 );
this.route.params.subscribe( params => { this.route.params.subscribe( params => {
...@@ -64,7 +65,20 @@ export class EcmProductComponent implements OnInit { ...@@ -64,7 +65,20 @@ export class EcmProductComponent implements OnInit {
} }
getItems( scatCode: string ) { getItems( scatCode: string ) {
this.items = this.store.select( 'items' ); this.store.select( 'items' ).subscribe(
items => {
this.items = items;
if(this.items[0]){
console.log('Items:[',this.items[0]);
let breadcrumb;
if(this.items[0].itemCategory.catCode == 'CAT0000005')
breadcrumb = [{label: 'Home', url: '/home'}, {label: this.items[0].itemCategory.shDescr,url: 'javascript:void(0)'}];
else
breadcrumb = [{label: 'Home', url: '/home'}, {label: this.items[0].itemCategory.shDescr,url: '/categories/' + this.items[0].itemSubCategory.catCode}, {label: this.items[0].itemSubCategory.shDescr,url: 'javascript:void(0)'}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
}
}
);
} }
storeItem( selectedItem ) { storeItem( selectedItem ) {
......
...@@ -11,6 +11,8 @@ import { Item } from '../../ecm-model/product-model'; ...@@ -11,6 +11,8 @@ import { Item } from '../../ecm-model/product-model';
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import { Breadcrumbs } from '../../ecm-breadcrumbs/ecm-breadcrumbs.component';
@Component( { @Component( {
selector: 'ecm-sub-category', selector: 'ecm-sub-category',
templateUrl: './ecm-sub-category.component.html', templateUrl: './ecm-sub-category.component.html',
...@@ -32,7 +34,7 @@ export class EcmSubCategoryComponent implements OnInit { ...@@ -32,7 +34,7 @@ export class EcmSubCategoryComponent implements OnInit {
private category: Category; private category: Category;
private subcategory: SubCategory; private subcategory: SubCategory;
constructor( private route: ActivatedRoute, private router: Router, private scroll_service: ScrollService, private store: Store<AppState>, private subCategoryAction: SubCategoryActions, private itemAction:ItemActions ) { } constructor( private route: ActivatedRoute, private router: Router, private scroll_service: ScrollService, private store: Store<AppState>, private subCategoryAction: SubCategoryActions, private itemAction:ItemActions, public breadcrumbSerivce: Breadcrumbs ) { }
ngOnInit() { ngOnInit() {
window.scrollTo( 0, 0 ); window.scrollTo( 0, 0 );
this.route.params.subscribe( params => { this.route.params.subscribe( params => {
...@@ -49,6 +51,17 @@ export class EcmSubCategoryComponent implements OnInit { ...@@ -49,6 +51,17 @@ export class EcmSubCategoryComponent implements OnInit {
getSubCategories( catCode: string ) { getSubCategories( catCode: string ) {
this.subcategories = this.store.select( 'subcategories' ); this.subcategories = this.store.select( 'subcategories' );
let categories: Observable<Category[]> = this.store.select('categories');
let category;
categories.subscribe( items => {
category = items.find(x => x.catCode === catCode);
if(category){
let breadcrumb = [{label: 'Home', url: '/home'}, {label: category.shDescr, url: 'javascript:void(0)'}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
}
});
} }
storeSubCategory( selectedSubCategory ) { storeSubCategory( selectedSubCategory ) {
......
/* neew*/ /* neew*/
@media screen and (max-width: 640px){
.desc{ .listItems {
padding-left: 14px; margin: 0px;
padding-right: 14px; padding: 0px;
} border-top: 1px solid lightgrey;
.itemImage }
{ }
position: relative; .details-of-Cart{
height: 55px;
width: 55px;
border-radius: 2px;
}
.ecm-cancel-buttton
{
cursor: pointer;
padding-left: 13px;
padding-right: 13px;
}
.itemdescription
{
font-size: 12px;
width: 45%;
cursor: pointer;
position: relative;
}
.item-descr-span{
display: block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
position: relative;
width: 125px;
}
.ecm-itemdescription{
font-size: 18px;
position: relative;
top: 22px;
}
.itemcostRate{
font-size: 18px;
position: relative;
bottom: 58px;
float: right;
}
.itemRemove{
padding: 10px;
font-size: 18px;
}
.listItems{
border: 2px solid ghostwhite;
border-left: none;
border-right: none;
/* padding: 20px; */
}
.ViewAll{
font-size: 16px;
color: mediumvioletred;
}
.amountPayable{
padding-top: 30px;
font-weight: 600;
font-size: 18px;
}
.edit-cart-button, .viewAll-button
{
/* width: 320px; */
width: 304px;
height: 50px;
font-size: 16px;
line-height: 46px;
text-align: center;
border-radius: 2px;
position: relative;
padding: 0;
margin: 38px 0 0px 0;
}
.viewAll-button{
background: transparent;
color: mediumvioletred;
line-height: 44px;
}
.edit-cart-button
{
background: mediumvioletred;
color: #fff;
}
.edit-cart-button:hover {
color: #fff;
}
@media screen and (max-width: 750px){
.total-description {
width: 70%;
bottom: 0px !important;
}
.ecm-productDetails{
padding: 0px !important;
}
.ecm-textBox{
height: 42px !important;
}
.detail-Continue-Shopping-button{
height: 46px !important;
margin-top: 30px !important;
margin-bottom: 15px !important;
}
.counter-screen{
display: inline-block !important;
float: none !important;
}
.items-cost-rate {
text-align: left !important;
padding-top: 40px !important;
}
.wish-remove-dipslay{
padding-top: 0px !important;
padding-right: 0px !important;
}
.remove-items{
padding-left: 0px !important;
}
/* .item-image {
width: 16% !important;
bottom: 100px !important;
} */
.counter{
position: relative;
padding-top: 18px;
}
.listItems[_ngcontent-c8] {
margin: 0px;
padding: 0px;
}
.ecm-productDetails{
margin-top: 6px !important;
}
.continue-shopping{
width: 89% !important;
margin-right: 20px !important;
margin-top: -8px !important;
bottom: 0px !important;
}
.wishList-items,.remove-items{
font-size: 16px !important;
}
.counter-button{
width: 50px !important;
height: 50px !important;
}
}
.counter
{
position: inherit;
}
.change-color
{
display: flex;
}
.totalPriceDetails
{
padding: 20px;
}
.ecm-payments{
display: flex;
position: relative;
left: 15px;
color: dimgray;
padding-top: 36px;
}
.ecm-Info{
position: relative;
left: 8px;
font-size: 13px;
color: #787878;
}
.detail-checkout-button{
width: 100%;
height: 50px;
font-size: 15px;
line-height: 15px;
border-radius: 2px;
background: mediumvioletred;
color:#fff;
}
.shipping{
position: relative;
top: 15px;
}
.priceDetails{
text-align: center;
height: 40px;
/* width: 160px; */
line-height: 40px;
border-bottom: thin solid mediumvioletred;
font-size: 16px;
padding-bottom: 10px;
}
.image{
width: 100px;
height: 100px;
}
.info{
display: flex;
}
.detail-Continue-Shopping-button {
height: 46px;
font-size: 15px;
line-height: 15px;
border-radius: 2px;
background: white;
color: mediumvioletred;
position: relative;
float: right;
width: 100%;
margin-top: 15px;
margin-bottom: 15px;
}
.item-image{
/* width: 140px;
padding-top: 16px;
position: relative; */
display: inline-block;
position: relative;
vertical-align: top;
width: 110px;
top: 30px;
}
.change-color{
padding-top: 16px;
}
.size-of-item{
color: #787878;
font-size: 14px;
font-weight: 700;
line-height: 36px;
padding-right: 20px;
}
.selected{
position: relative;
left: 5px;
height: 36px;
font-size: 15px;
background-color: mediumvioletred;
border-radius: 100%;
min-width: 36px;
line-height: 36px;
color: white;
padding: 0;
cursor: default;
}
.color-change{
position: relative;
font-size: 13px;
color: mediumvioletred;
cursor: pointer;
font-weight: 600;
padding-left: 8px;
line-height: 36px;
}
.wishList-items{
font-size: 12px;
color: mediumvioletred;
cursor: pointer;
font-weight: 600;
}
.remove-items{
font-size: 12px;
color: dimgray;
padding-left: 31px;
font-weight: 600;
cursor: pointer;
}
.wish-remove-dipslay{
position: inherit;
padding-top: 80px;
padding-right: 28px;
}
.counter{
position: relative;
padding-top: 18px;
}
.ecm-textBox{
width: 76px;
position: relative;
margin-left: 8px;
margin-right: 8px;
text-align: center;
height: 36px;
font-size: 17px;
}
.counter-button{
color: mediumvioletred;
background-color: white;
width: 40px;
height: 40px;
min-width: 40px;
padding: 0;
margin: 0;
line-height: 32px;
border-radius: 100%;
}
.counter-button.mat-button-ripple.mat-ripple {
border-radius: 100%;
}
.items-cost-rate{
padding-top: 25px;
font-size: 25px;
font-weight: bold;
}
.no-button{
position: relative;
left: 50px;
border-style: groove;
background-color: ghostwhite;
}
.delete-cartitems-button{
padding-bottom: 20px;
padding-top: 36px;
}
.continue-shopping{
float: right;
border: 2px solid ghostwhite;
margin-right: 18px;
height: 46px;
width: 170px;
position: inherit;
bottom: 7px;
}
.items-desc{
padding-top: 18px;
}
.shippingFree{
float: right;
font-weight: 600;
color: mediumaquamarine;
font-size: 13px;
}
.details-of-Cart{
top: 60px; top: 60px;
bottom: 50px; bottom: 50px;
position: relative; position: relative;
...@@ -365,90 +14,12 @@ ...@@ -365,90 +14,12 @@
padding-bottom: 70px; padding-bottom: 70px;
max-width: 72rem; max-width: 72rem;
} }
.cartItemsDetails{ .ecm-headings {
padding: 0;
}
.item-shDescr{
display: block;
font-size: 18px;
padding-top: 10px;
line-height: 24px;
color: #444;
font-weight: 600;
}
.item-title{
font-size: 14px;
color: mediumvioletred;
font-weight: 600;
cursor: pointer;
}
.item-seller{
color: #787878;
font-size: 14px;
font-weight: 700;
}
.item-sellerInfo{
font-size: 14px;
color: mediumvioletred;
font-weight: 600;
}
.price-info{
float: right;
font-weight: 600;
font-size: 14px;
}
.total-amountPrice {
float: right;
font-weight: 600;
font-size: 20px;
}
.ecm-headings {
font-size: 15px; font-size: 15px;
border-bottom: 1px solid #f3f3f3; border-bottom: 1px solid #f3f3f3;
padding: 20px; padding: 20px;
} }
.empty-cart-title {
.counter-button, .selected {
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
font-size: 15px;
width: 36px;
height: 36px;
}
.counter-button, .selected, .detail-checkout-button, .continue-shopping {
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
}
.secure-icon {
font-size: 20px important;
}
.delete-icon {
display: none;
cursor: pointer;
font-size: 20px;
width: 32px;
height: 32px;
text-align: center;
position: relative;
}
.cartItemsDetail:HOVER .delete-icon{
display: block;
}
.cartItemsDetail{
cursor: pointer;
border-bottom: 1px solid #f3f3f3;
}
/* Empty Cart*/
.empty-cart-img {
width: 140px;
height: 140px;
}
.empty-cart-title {
display: block; display: block;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
...@@ -457,7 +28,7 @@ ...@@ -457,7 +28,7 @@
line-height: 0.8; line-height: 0.8;
} }
.empty-cart-msg { .empty-cart-msg {
font-size: 14px; font-size: 14px;
display: block; display: block;
text-align: center; text-align: center;
...@@ -465,92 +36,62 @@ ...@@ -465,92 +36,62 @@
line-height: 1.2; line-height: 1.2;
} }
.border-line { .border-line {
height: 3px; height: 3px;
width: 40px; width: 40px;
background-color: mediumvioletred; background-color: mediumvioletred;
display: inline-block; display: inline-block;
} }
.my-cart-title { .my-cart-title {
padding-bottom: 21px; padding-bottom: 21px;
border-bottom: 2px solid #c71585; border-bottom: 2px solid #c71585;
font-size: 16px; font-size: 16px;
margin-left: 17px; margin-left: 17px;
} }
/* attribute colors */ .ecmdetailsItems{
.BLACK, .BLK_WH{ display: inline-grid;
background-color: black;
}
.BLUE, .BLU_WH{
background-color: blue;
}
.BROWN{
background-color: brown;
}
.PEACH{
background-color: peachpuff;
}
.RED, .RED_WH{
background-color: red;
} }
.WHITE{
background-color: white; .listItems{
} /* padding-top: 20px; */
.YELLOW{ padding: 16px;
background-color: yellow; position:relative;
}
.total-description{
width: 55%;
display: inline-block;
position: relative;
padding-bottom: 16px;
bottom: 4px;
} }
.counter-screen{ .item-card{
display: inline-block; display: none;
position: inherit;
float: right;
/* padding: 20px; */
} }
.new-checkout-button{ .item-card-action{
width: 100%; color: mediumvioletred;
/* height: 45px; */ line-height: 60px;
font-size: 15px; background: #fff;
line-height: 15px; padding: 10px;
border-radius: 2px; border-radius: 2px;
background: mediumvioletred; font-size: 12px;
color: #fff; font-weight: 600;
/* margin-top: 4px; */
position: fixed !important;
bottom: 0 !important;
height: 54px !important;
} }
.scrollMe{ .item-card-action > i {
overflow: hidden; vertical-align: sub;
max-height: 350px; font-size: 16px;
} }
.scrollMe:hover {
overflow: auto; .listItems:hover > .item-card {
} position: absolute;
z-index: 1;
::-webkit-scrollbar { display: block;
width: 7px; text-align: center;
-webkit-appearance: none; height: 60px;
top: 120px;
cursor: pointer;
width: calc( 100% - 30px);
} }
::-webkit-scrollbar-thumb { md-card.cartItemsDetails.mat-card {
border-radius: 4px; padding: 0px;
background-color: rgba(199, 21, 133,.5);
-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
display: none;
} }
\ No newline at end of file
...@@ -11,49 +11,34 @@ ...@@ -11,49 +11,34 @@
</div> </div>
<ecm-footer></ecm-footer> <ecm-footer></ecm-footer>
</div> </div>
<div *ngIf="(wishListItems | async)?.length > 0" style="min-height: calc(100% - 120px);"> <div *ngIf="(wishListItems | async)?.length > 0" style="min-height: calc(100% - 120px);">
<ecm-header [isFixedHeader]=true> </ecm-header> <ecm-header [isFixedHeader]=true> </ecm-header>
<ecm-breadcrumbs [pageName]="'WISHLIST'"></ecm-breadcrumbs> <ecm-breadcrumbs [pageName]="'WISHLIST'"></ecm-breadcrumbs>
<div class="row details-of-Cart"> <div class="row details-of-Cart">
<md-card class="medium-12 columns cartItemsDetails"> <div class="small-12 medium-12 large-12 column ecmdetailsItems">
<div class="ecmdetailsItems"> <md-card class="cartItemsDetails">
<div class="ecm-headings"> <div class="ecm-headings">
<span class="my-cart-title">My Wishlist ( {{(wishListItems | async)?.length}} )</span> <span class="my-cart-title">My Wishlist ( {{(wishListItems | async)?.length}} )</span>
</div> </div>
<div class="listItems" *ngFor="let item of wishListItems | async"> <div class="small-12 medium-6 large-3 column listItems" *ngFor="let _item of wishListItems | async">
<div class="item-image"> <div class="item-card" (click)="isInCart(_item.itemCode) ? goToCart() : addToCart(_item) ">
<ecm-image [refId]='item.itemCode' [refSer]="'M-ITEM'" <span class="item-card-action" >
[object]="'ITEM'" [isSingleImage]="true" [isThumbnail]="true"></ecm-image> <i class="material-icons">shopping_cart</i>
</div> {{ (_item.itemCode.indexOf('L2D014') == 0 ) ? (isInCart(_item.itemCode) ? 'Go To Cart' : 'Add to Cart') : 'Enroll Now'}}
<div class="total-description"> </span>
<div class="items-desc">
<span class="item-title" (click)="viewItem(item.itemCode)">Handmade
Handicarft</span> <span class="item-shDescr">{{item.itemHeader.itemShDescr}}</span>
<span class="item-shDescr">{{item.descr}}</span>
<span class="item-seller">Sold by</span> <span class="item-sellerInfo">Handmade
Handicarfts</span>
</div>
<div class="items-cost-rate">
<span>Rs. {{item.itemHeader.itemDiscountedRate}}</span>
</div>
</div>
<div class="counter-screen">
<div class="wish-remove-dipslay">
<!-- <span class="remove-items" (click)=" confirmDialog(item)" style="cursor: pointer;">Remove</span> -->
<span class="remove-items" (click)="deletewishlistItem(item) ">Remove</span>
</div>
</div>
</div> </div>
<ecm-card (storeData)="storeItem(_item)" [itemData]="_item" [extraParam]="extra_param" (removeFromWishlist)="confirmDialog(_item);" ></ecm-card>
</div>
</md-card>
</div> </div>
<div class="detail-Continue-Shopping-button">
<button md-button class="continue-shopping" [routerLink]="['/home']">Continue
Shopping</button>
</div>
</md-card>
</div> </div>
<ecm-footer></ecm-footer>
</div> </div>
...@@ -7,10 +7,11 @@ import { Http} from '@angular/http' ...@@ -7,10 +7,11 @@ import { Http} from '@angular/http'
import { Router, ActivatedRoute } from '@angular/router'; import { Router, ActivatedRoute } from '@angular/router';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import { AppState } from '../../ecm-store/reducers'; import { AppState } from '../../ecm-store/reducers';
import { WishListActions } from '../../ecm-store/actions'; import { ItemActions, CartActions, WishListActions } from '../../ecm-store/actions';
import { MdDialog, MdDialogRef } from '@angular/material';
import { Observable } from 'rxjs/Observable'; import { Observable } from 'rxjs/Observable';
import { EcmCartComponent, ECMConfirmDialog } from '../../ecm-view/ecm-cart/ecm-cart.component';
import { Breadcrumbs } from '../../ecm-breadcrumbs/ecm-breadcrumbs.component';
@Component({ @Component({
selector: 'app-ecm-wish-list', selector: 'app-ecm-wish-list',
...@@ -19,16 +20,17 @@ import { Observable } from 'rxjs/Observable'; ...@@ -19,16 +20,17 @@ import { Observable } from 'rxjs/Observable';
}) })
export class EcmWishListComponent implements OnInit { export class EcmWishListComponent implements OnInit {
wishListItems: Observable<ItemDetail[]>; wishListItems: Observable<ItemDetail[]>;
cartItems: Observable<ItemDetail[]>;
errorMessage: string; errorMessage: string;
constructor( private route: ActivatedRoute, private router: Router, public snackBar: MdSnackBar, public wishListService: EcmWishListService, private http: Http, private store: Store<AppState>, private wishListAction: WishListActions) { } constructor( private route: ActivatedRoute, private router: Router, public dialog: MdDialog, public snackBar: MdSnackBar, public wishListService: EcmWishListService, private http: Http, private store: Store<AppState>, private wishListAction: WishListActions, private cartAction: CartActions, public breadcrumbSerivce: Breadcrumbs) { }
ngOnInit() { ngOnInit() {
this.getWishlistItems();
}
getWishlistItems() {
this.wishListItems = this.store.select( 'wishlistItems' ); this.wishListItems = this.store.select( 'wishlistItems' );
this.cartItems = this.store.select( 'cartItems' );
let breadcrumb = [{label: 'Home', url: '/home'}, {label: 'Wishlist', url: 'javascript:void(0)'}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
} }
deletewishlistItem( item ) { deletewishlistItem( item ) {
...@@ -45,5 +47,45 @@ export class EcmWishListComponent implements OnInit { ...@@ -45,5 +47,45 @@ export class EcmWishListComponent implements OnInit {
viewItem( itemCode ) { viewItem( itemCode ) {
this.router.navigate( ['/detail', itemCode] ); this.router.navigate( ['/detail', itemCode] );
} }
isInCart(itemCode): boolean {
var incart;
this.cartItems.subscribe( cartItems => {
if(cartItems.find(x => x.itemCode === itemCode))
incart = true;
else
incart = false;
} );
return incart;
}
addToCart( item: ItemDetail ) {
item.itemQuantity = 1;
this.store.dispatch( this.cartAction.addToCartSuccess( item ) );
}
goToCart(){
this.router.navigate(['/cart']);
}
confirmDialog( item: any ) {
this.wishListService.setItemCode( item.itemCode );
let dialogRef = this.dialog.open( ECMConfirmDialog,{
width:'300px',
height:'180px',
disableClose: true
});
dialogRef.componentInstance.dialogTitle = "Remove Item from wishlist?";
//dialogRef.componentInstance.confirmMsg = "Would you like to remove item from cart?";
dialogRef.componentInstance.cancelText = "No";
dialogRef.componentInstance.confirmText = "Yes";
dialogRef.afterClosed().subscribe( result => {
if( result == 'true')
{
this.deletewishlistItem(item);
}
});
}
} }
...@@ -13,6 +13,7 @@ export class EcmWishListService { ...@@ -13,6 +13,7 @@ export class EcmWishListService {
private wishListUrl = '/ecm/service/feeds/wishlist'; // URL to web service private wishListUrl = '/ecm/service/feeds/wishlist'; // URL to web service
wishListItems: Item[]; wishListItems: Item[];
public itemCode;
constructor( private http: Http, private store: Store<AppState> ) { } constructor( private http: Http, private store: Store<AppState> ) { }
...@@ -113,4 +114,14 @@ export class EcmWishListService { ...@@ -113,4 +114,14 @@ export class EcmWishListService {
console.error( 'Service handleError:' + errMsg ); console.error( 'Service handleError:' + errMsg );
return Observable.throw( errMsg ); return Observable.throw( errMsg );
} }
getItemCode() {
console.log("getItems"+this.itemCode);
return this.itemCode;
}
setItemCode(itemCode) {
this.itemCode = itemCode;
console.log("setItems"+this.itemCode);
}
} }
...@@ -9,7 +9,7 @@ import { Store } from '@ngrx/store'; ...@@ -9,7 +9,7 @@ import { Store } from '@ngrx/store';
import { AppState } from '../ecm-store/reducers'; import { AppState } from '../ecm-store/reducers';
import { CartActions } from '../ecm-store/actions'; import { CartActions } from '../ecm-store/actions';
import { Breadcrumbs } from '../ecm-breadcrumbs/ecm-breadcrumbs.component';
@Component({ @Component({
selector: 'my-profile', selector: 'my-profile',
...@@ -27,13 +27,13 @@ export class MyProfileComponent implements OnInit { ...@@ -27,13 +27,13 @@ export class MyProfileComponent implements OnInit {
userData: any; userData: any;
constructor(private router: Router , private route: ActivatedRoute) { constructor(private router: Router , private route: ActivatedRoute, public breadcrumbSerivce: Breadcrumbs) {
this.navLinks = [ this.navLinks = [
{ name: 'Profile Info', navLink: 'userprofile', isOpen: false }, { name: 'Profile Info', navLink: 'userprofile', isOpen: false },
{ name: 'Manage Address', navLink: 'useraddress', isOpen: false }, { name: 'Manage Address', navLink: 'useraddress', isOpen: false },
{ name: 'Change Password', navLink: 'chgpassword', isOpen: false }, { name: 'Change Password', navLink: 'chgpassword', isOpen: false },
{ name: 'Saved Cards', navLink: 'usercard', isOpen: false }, { name: 'Saved Cards', navLink: 'usercard', isOpen: false },
{ name: 'My Reviews', navLink: 'userreview', isOpen: false } // { name: 'My Reviews', navLink: 'userreview', isOpen: false }
]; ];
} }
...@@ -55,6 +55,9 @@ export class MyProfileComponent implements OnInit { ...@@ -55,6 +55,9 @@ export class MyProfileComponent implements OnInit {
if( this.clientWidth > 640 ){ if( this.clientWidth > 640 ){
this.selectLink(this.navLinks[0]); this.selectLink(this.navLinks[0]);
} }
let breadcrumb = [{label: 'Home', url: '/home'}, {label: 'My Profile', url: 'javascript:void(0)'}];
this.breadcrumbSerivce.breadcrumbs = breadcrumb;
} }
selectLink (link: Links) { selectLink (link: Links) {
......
...@@ -110,5 +110,11 @@ export class AddressScreenComponent implements OnInit { ...@@ -110,5 +110,11 @@ export class AddressScreenComponent implements OnInit {
submitAddress(userAddress) { submitAddress(userAddress) {
console.log('Submitted Address Data', userAddress); console.log('Submitted Address Data', userAddress);
} }
getSeparator( displayVal ){
if( displayVal ) {
return ',';
}
return '';
}
} }
...@@ -14,6 +14,7 @@ import { Address } from './address-manager/address.model'; ...@@ -14,6 +14,7 @@ import { Address } from './address-manager/address.model';
export class UserAddressService { export class UserAddressService {
private userActionUrl = '/ecm/service/feeds'; private userActionUrl = '/ecm/service/feeds';
public userAddress;
constructor(private http: Http, private store: Store<AppState>, private addressActions: AdressAction) { } constructor(private http: Http, private store: Store<AppState>, private addressActions: AdressAction) { }
...@@ -136,6 +137,17 @@ export class UserAddressService { ...@@ -136,6 +137,17 @@ export class UserAddressService {
console.error('Service handleError:' + errMsg); console.error('Service handleError:' + errMsg);
return Observable.throw(errMsg); return Observable.throw(errMsg);
} }
getAddress() {
console.log("getItems"+this.userAddress);
return this.userAddress;
}
setAddress(userAddress) {
this.userAddress = userAddress;
console.log("setItems"+this.userAddress);
}
......
...@@ -26,9 +26,9 @@ ...@@ -26,9 +26,9 @@
<ng-template #editScreen> <ng-template #editScreen>
<div class="card-remove-edit-button" *ngIf="editMode == 'V' "> <div class="card-remove-edit-button" *ngIf="editMode == 'V' ">
<button md-button class="card-delete-button" (click)="remove();" > <button md-button class="card-delete-button" (click)="remove();" >
<i class="material-icons card-delete-icon">delete</i> <i class="material-icons card-delete-icon">delete</i>
</button> </button>
</div> </div>
<card-screen class="card-screen" [editMode] = "editMode" [card]='card'></card-screen> <card-screen class="card-screen" [editMode] = "editMode" [card]='card'></card-screen>
</ng-template> </ng-template>
\ No newline at end of file
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CardManagerComponent } from './card-manager.component';
describe('CardManagerComponent', () => {
let component: CardManagerComponent;
let fixture: ComponentFixture<CardManagerComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CardManagerComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CardManagerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should be created', () => {
expect(component).toBeTruthy();
});
});
import { Component,Input, Output, EventEmitter, ViewEncapsulation, OnInit, ElementRef, ViewChild } from '@angular/core'; import { Component,Input, Output, EventEmitter, ViewEncapsulation, OnInit, ElementRef, ViewChild } from '@angular/core';
import { Card } from './card.model'; import { Card } from './card.model';
import { IScreenEditor } from '../screen-editor'; import { IScreenEditor } from '../screen-editor';
import { MdDialog, MdDialogRef } from '@angular/material';
import { CardScreenComponent } from './card-screen/card-screen.component'; import { CardScreenComponent } from './card-screen/card-screen.component';
import { ECMConfirmDialog } from '../../ecm-view/ecm-cart/ecm-cart.component';
@Component({ @Component({
selector: 'card-manager', selector: 'card-manager',
...@@ -32,7 +34,10 @@ export class CardEditor implements OnInit, IScreenEditor { ...@@ -32,7 +34,10 @@ export class CardEditor implements OnInit, IScreenEditor {
addType = [ { viewValue: 'Home'},{ viewValue: 'Office/Commercial'} ]; addType = [ { viewValue: 'Home'},{ viewValue: 'Office/Commercial'} ];
advance = [ { viewValue: 'Set as delivery address'},{ viewValue: 'Set as Billing address'},{ viewValue: 'Set as default'} ]; advance = [ { viewValue: 'Set as delivery address'},{ viewValue: 'Set as Billing address'},{ viewValue: 'Set as default'} ];
constructor( public dialog: MdDialog ){
}
ngOnInit(){ ngOnInit(){
console.log("ID", this.editorId ); console.log("ID", this.editorId );
} }
...@@ -90,6 +95,24 @@ export class CardEditor implements OnInit, IScreenEditor { ...@@ -90,6 +95,24 @@ export class CardEditor implements OnInit, IScreenEditor {
remove(){ remove(){
this.onDelete.emit(this.card); this.onDelete.emit(this.card);
} }
confirmDialog( item: any ) {
let dialogRef = this.dialog.open( ECMConfirmDialog,{
width:'300px',
height:'180px',
disableClose: true
});
dialogRef.componentInstance.dialogTitle = "Remove Card ?";
//dialogRef.componentInstance.confirmMsg = "Would you like to remove item from cart?";
dialogRef.componentInstance.cancelText = "No";
dialogRef.componentInstance.confirmText = "Yes";
dialogRef.afterClosed().subscribe( result => {
if( result == 'true')
{
this.onDelete.emit(this.card);
}
});
}
simpleClone(obj: any) { simpleClone(obj: any) {
return Object.assign({}, obj); return Object.assign({}, obj);
......
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { CardScreenComponent } from './card-screen.component';
describe('CardScreenComponent', () => {
let component: CardScreenComponent;
let fixture: ComponentFixture<CardScreenComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ CardScreenComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CardScreenComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should be created', () => {
expect(component).toBeTruthy();
});
});
...@@ -33,7 +33,6 @@ export class CardScreenComponent implements OnInit { ...@@ -33,7 +33,6 @@ export class CardScreenComponent implements OnInit {
expiryYear: ['', [<any>Validators.required, <any>Validators.min(this.currentYear)]], expiryYear: ['', [<any>Validators.required, <any>Validators.min(this.currentYear)]],
acctName: ['', [<any>Validators.required]] acctName: ['', [<any>Validators.required]]
}); });
console.log('this.card.acctNumber.trim()',this.card.acctNumber.trim());
this.card.acctNumber = this.replaceFullWidthChars(this.card.acctNumber.trim()); this.card.acctNumber = this.replaceFullWidthChars(this.card.acctNumber.trim());
//this.form.addFormGroup(dir) //this.form.addFormGroup(dir)
} }
......
...@@ -29,29 +29,25 @@ ...@@ -29,29 +29,25 @@
display: inline-block; display: inline-block;
height: 46px; height: 46px;
line-height: 40px; line-height: 40px;
max-width: 190px;
text-align: center; text-align: center;
border-radius: 3px; border-radius: 3px;
background: #fff; background: #fff;
color: mediumvioletred !important; color: mediumvioletred !important;
min-width: 166px;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1); box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
/* position: relative; */ /* position: relative; */
/* left: 200px; */ /* left: 200px; */
} }
.save-review-button { .save-review-button {
display: inline-block; display: inline-block;
height: 46px; height: 46px;
line-height: 40px; line-height: 40px;
background: mediumvioletred; background: mediumvioletred;
color: #fff !important; color: #fff !important;
max-width: 190px;
text-align: center; text-align: center;
margin-left: 10px; margin-left: 10px;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1); box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px; border-radius: 3px;
min-width: 166px;
/* position: relative; */ /* position: relative; */
/* left: 200px; */ /* left: 200px; */
} }
...@@ -71,9 +67,16 @@ ...@@ -71,9 +67,16 @@
} }
.review-save-cancel-button{ .review-save-cancel-button{
padding: 15px; padding: 15px;
background-color: rgba(242, 242, 242, 0.34);
} }
@media screen and (max-width: 640px){
.save-review-button {
width: 127px !important;
}
.cancel-review-button {
width: 127px !important;
}
}
......
<div class="user-review-card"> <!-- <div class="user-review-card"> -->
<span class="review-card-info">My Reviews</span> <!-- <span class="review-card-info">My Reviews</span> -->
</div> <!-- </div> -->
<review-screen [editMode] = "editMode" [reviewList]='reviewList'></review-screen> <review-screen [editMode] = "editMode" [reviewList]='reviewList'></review-screen>
<div class="user-review-edit-button" *ngIf="editMode == 'V' "> <div class="user-review-edit-button" *ngIf="editMode == 'V' ">
......
...@@ -29,9 +29,9 @@ font-size: 14px; ...@@ -29,9 +29,9 @@ font-size: 14px;
} }
/*---------------------- UPDATED CSS------------------------------------------------*/ /*---------------------- UPDATED CSS------------------------------------------------*/
.user-review-info{ /* .user-review-info{ */
padding: 12px; /* padding: 12px; */
} /* } */
.ecm-product-image{ .ecm-product-image{
width: 118px; width: 118px;
height: 118px; height: 118px;
...@@ -41,14 +41,19 @@ font-size: 14px; ...@@ -41,14 +41,19 @@ font-size: 14px;
position: relative; position: relative;
right: 13px; right: 13px;
} }
.review-edit-information { /* .review-edit-information { */
padding: 12px; /* padding: 12px; */
background-color: rgba(242, 242, 242, 0.34); /* background-color: rgba(242, 242, 242, 0.34); */
/* } */
.review{
width: 100% ;
}
.itemList-review{
width: 100% ;
} }
.input-review-title{ @media screen and (max-width: 640px){
width: 400px; .item-review{
display: none !important;
}
} }
...@@ -3,27 +3,28 @@ ...@@ -3,27 +3,28 @@
<ng-template #displayTemplate> <ng-template #displayTemplate>
<div class="row user-review-info"> <div class="user-review-info">
<div class="large-2 columns"> <!-- <div class="large-2 columns"> -->
<img class="ecm-product-image" src="/ecm/assets/images/items/L2D0100058.png" /> <!-- <img class="ecm-product-image" src="/ecm/assets/images/items/L2D0100058.png" /> -->
</div> <!-- </div> -->
<div class="large-10 columns"> <div>
<div> <!-- <div> -->
<span class="category-name">{{reviewList?.itemCategory}}</span> <!-- <span class="category-name">{{reviewList?.itemCategory}}</span> -->
</div> <!-- </div> -->
<div> <div>
<rating [rate]="reviewList?.ratings"></rating> <rating [rate]="reviewList?.ratings"></rating>
</div> </div>
<div class="user-review-title"> <div class="user-review-title">
<span class="review-title">{{reviewList?.reviewTitle}}</span> <span class="review-title">{{reviewList?.reviewTitle}}</span>
</div> </div>
<div class="items-seller-info"> <!-- <div class="items-seller-info"> -->
<span class="seller-info">{{reviewList?.sellerInfo}}</span> <!-- <span class="seller-info">{{reviewList?.sellerInfo}}</span> -->
</div> <!-- </div> -->
<div> <div class="item-review">
<span class="item-review">{{reviewList?.itemdescription}}</span> <!-- <span class="item-review">{{reviewList?.itemdescription}}</span> -->
<ecm-readmore [text]="reviewList?.itemdescription" [maxLength]="112"></ecm-readmore>
</div> </div>
</div> </div>
</div> </div>
...@@ -31,15 +32,15 @@ ...@@ -31,15 +32,15 @@
<ng-template #interactiveTemplate> <ng-template #interactiveTemplate>
<div class="row review-edit-information"> <div class="review-edit-information">
<div class="large-2 columns"> <!-- <div class="large-2 columns"> -->
<img class="ecm-product-image" src="/ecm/assets/images/items/L2D0100058.png" /> <!-- <img class="ecm-product-image" src="/ecm/assets/images/items/L2D0100058.png" /> -->
</div> <!-- </div> -->
<div class="large-10 columns"> <div >
<div> <!-- <div> -->
<span class="edit-category-name">{{reviewList?.itemCategory}}</span> <!-- <span class="edit-category-name">{{reviewList?.itemCategory}}</span> -->
</div> <!-- </div> -->
<div class="user-edit-review-item-rating"> <div class="user-edit-review-item-rating">
<rating [rate]="reviewList.ratings" (updateRate)="updateRate($event)" [isResponsive]="true" ></rating> <rating [rate]="reviewList.ratings" (updateRate)="updateRate($event)" [isResponsive]="true" ></rating>
</div> </div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment