Skip to content

B
business-java
Commit d71c6ba6 authored by prumde's avatar prumde
Browse files
Options

Updated 


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174202 ce508802-f39f-4f6c-b175-0d175dae99d5
parent fa9b6829
Hide whitespace changes
Inline Side-by-side
Showing with 179 additions and 247 deletions
ecm/Angular/trunk/src/app/app.module.ts
View file @ d71c6ba6
......@@ -76,7 +76,7 @@ const appRoutes: Routes = [
{ path: 'search/:value', component: EcmSearchResultComponent},
{ path: 'cart', component: EcmCartComponent},
{ path: 'checkout', component: EcmCheckoutComponent},
{ path: 'wishList', component: EcmWishListComponent}
{ path: 'wishlist', component: EcmWishListComponent}
];
@NgModule({
declarations: [
......
ecm/Angular/trunk/src/app/ecm-header/ecm-header.component.css
View file @ d71c6ba6
......@@ -378,11 +378,16 @@ ecm-search{
.ecm-menu-icon {
width: 32px;
height: 4px;
background-color: black;
background-color: white;
margin: 6px 0;
display: block;
opacity: 0.8;
}
.user-nav-menu {
cursor: pointer;
}
@media screen and (max-width: 750px){
.logo-adj{
width: 128px;
......
ecm/Angular/trunk/src/app/ecm-header/ecm-header.component.html
View file @ d71c6ba6
<ecm-nav-menu class="fixed-header-nav"> </ecm-nav-menu>
<!-- Overlay Start
<div #bgGlass class="ecm-bgGlass"></div>
......@@ -86,7 +85,7 @@ Overlay End -->
<ng-template #fixedHeaderSmall >
<md-toolbar color="primary">
<div (click)="menuAction();">
<div (click)="menuAction();" class="user-nav-menu">
<span class="ecm-menu-icon"></span>
<span class="ecm-menu-icon"></span>
<span class="ecm-menu-icon"></span>
......
ecm/Angular/trunk/src/app/ecm-header/ecm-header.component.ts
View file @ d71c6ba6
......@@ -263,7 +263,9 @@ export class ECMHeaderComponent implements OnInit, OnDestroy {
}
menuAction() {
this.ecmPanel.open({ type: 'overlay', option: 'MENU_OPT', top:'', right: '', width:'80%' });
if( this.clientWidth < 640 ){
this.ecmPanel.open({ type: 'overlay', option: 'MENU_OPT', top:'', right: '', width:'80%' });
}
}
updateProfileImages() {
......
ecm/Angular/trunk/src/app/ecm-nav-menu/ecm-nav-menu.component.css
View file @ d71c6ba6
/* Basic styles */
* {
box-sizing: border-box;
}
html, body {
margin: 0;
}
body {
font-family: sans-serif;
background-color: #F6C390;
}
a {
text-decoration: none;
}
.container {
position: relative;
margin: 0;
/*width: 300px;*/
height: 534px;
background-color: #533557;
background-color: transparent;
overflow: hidden;
height: 100%;
}
/* Toggle functionality */
#toggle {
position: absolute;
left: -100%;
top: -100%;
}
#toggle:focus ~ .toggle-container .button-toggle {
box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1);
}
#toggle:checked ~ .container {
background-color: blue;
}
#toggle:checked ~ .toggle-container .button-toggle {
box-shadow: 0 0 0 700px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1);
}
#toggle:checked ~ .toggle-container .button-toggle:hover {
box-shadow: 0 0 0 700px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1), 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1);
}
#toggle:checked ~ .toggle-container .button-toggle:before {
transform: translateY(-50%) rotate(45deg) scale(1);
}
#toggle:checked ~ .toggle-container .button-toggle:after {
transform: translateY(-50%) rotate(-45deg) scale(1);
}
#toggle:checked:focus ~ .toggle-container .button-toggle {
box-shadow: 0 0 0 700px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1), 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1);
}
#toggle:checked ~ .nav {
margin-bottom: 100px;
pointer-events: auto;
transform: translate(50px, 50px);
}
#toggle:checked ~ .nav .nav-item {
color: #EC7263;
color: #fff;
letter-spacing: 0;
.category-list-container {
padding-top: 40px;
padding-left: 20px;
padding-bottom: 25px;
border-bottom: 1px solid #f2f2f2;
}
.top-categories-title, .my-menu-title {
color: #787878;
font-size: 0.8rem;
padding-left: 5px;
}
.category-list {
padding-top: 20px;
}
.category-title {
line-height: 47px;
font-size: 1.2rem;
padding-left: 10px;
}
.top-category {
height: 60px;
}
.view-all-button {
padding-left: 60px;
color: mediumvioletred;
font-weight: bold;
font-size: 1.1rem;
}
.my-menu-container {
padding-top: 10px;
padding-left: 20px;
}
.my-menu-list {
padding-top: 20px;
}
.menu-title {
font-size: 1.2rem;
padding-left: 10px;
}
.ecm-user-icon, .ecm-order-icon, .ecm-wishlist-icon {
height: 40px;
line-height: 40px;
margin-top: 0;
opacity: 1;
transform: scaleY(1);
transition: 0.5s, opacity 0.1s;
}
#toggle:checked ~ .nav .nav-item:nth-child(1) {
transition-delay: 0.15s;
}
#toggle:checked ~ .nav .nav-item:nth-child(1):before {
transition-delay: 0.15s;
}
#toggle:checked ~ .nav .nav-item:nth-child(2) {
transition-delay: 0.1s;
}
#toggle:checked ~ .nav .nav-item:nth-child(2):before {
transition-delay: 0.1s;
}
#toggle:checked ~ .nav .nav-item:nth-child(3) {
transition-delay: 0.05s;
}
#toggle:checked ~ .nav .nav-item:nth-child(3):before {
transition-delay: 0.05s;
}
#toggle:checked ~ .nav .nav-item:nth-child(4) {
transition-delay: 0s;
}
#toggle:checked ~ .nav .nav-item:nth-child(4):before {
transition-delay: 0s;
}
#toggle:checked ~ .nav .nav-item:before {
opacity: 0;
}
/* Toggle button */
.button-toggle {
top: 0;
position: absolute;
/* display: inline-block; */
width: 20px;
height: 20px;
margin: 10px 15px 15px 5px;
/* margin: 10px 15px 15px 25px; */
background-color: transparent;
border: none;
cursor: pointer;
border-radius: 100%;
transition: 0.6s;
-webkit-transition: 0.6s;
}
.button-toggle:hover {
box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1), inset 0 0 0 20px
rgba(0, 0, 0, 0.1);
}
.button-toggle:before, .button-toggle:after {
position: absolute;
content: '';
top: 50%;
left: 0;
width: 100%;
height: 2px;
background-color: #EC7263;
background-color: #fff;
border-radius: 5px;
transition: 0.5s;
}
.button-toggle:before {
transform: translateY(-50%) rotate(45deg) scale(0);
}
.button-toggle:after {
transform: translateY(-50%) rotate(-45deg) scale(0);
}
/* Menu */
.nav {
left: 10px;
position: absolute;
display: inline-block;
margin: 10px 15px 15px 10px;
pointer-events: none;
transition: 0.5s;
-webkit-transition: 0.5s;
}
.nav-item {
position: relative;
display: inline-block;
float: left;
clear: both;
color: transparent;
font-size: 14px;
letter-spacing: -6.2px;
height: 7px;
line-height: 7px;
text-transform: uppercase;
white-space: nowrap;
transform: scaleY(0.2);
transition: 0.5s, opacity 1s;
}
.nav-item:nth-child(1) {
transition-delay: 0s;
}
.nav-item:nth-child(1):before {
transition-delay: 0s;
}
.nav-item:nth-child(2) {
transition-delay: 0.05s;
}
.nav-item:nth-child(2):before {
transition-delay: 0.05s;
}
.nav-item:nth-child(3) {
transition-delay: 0.1s;
}
.nav-item:nth-child(3):before {
transition-delay: 0.1s;
}
.nav-item:nth-child(4) {
transition-delay: 0.15s;
}
.nav-item:nth-child(4):before {
transition-delay: 0.15s;
}
.nav-item:nth-child(1) {
letter-spacing: -8px;
}
.nav-item:nth-child(2) {
letter-spacing: -7px;
}
.nav-item:nth-child(n + 4) {
letter-spacing: -8px;
margin-top: -7px;
opacity: 0;
}
.nav-item:before {
position: absolute;
content: '';
top: 50%;
left: 0;
width: 100%;
height: 2px;
background-color: #EC7263;
background-color: #fff;
transform: translateY(-50%) scaleY(5);
transition: 0.5s;
width: 40px;
}
.nav-my-profile, .nav-orders, .nav-wishlist {
padding-bottom: 10px;
}
.help-center-title {
bottom: 0;
position: fixed;
padding: 10px;
padding-left: 20px;
font-size: 1.2rem;
width: 80%;
border-top: 1px solid #f2f2f2;
}
\ No newline at end of file
ecm/Angular/trunk/src/app/ecm-nav-menu/ecm-nav-menu.component.html
View file @ d71c6ba6
<div class="container">
<!-- This checkbox will give us the toggle behavior, it will be hidden, but functional -->
<input id="toggle" type="checkbox">
<!-- IMPORTANT: Any element that we want to modify when the checkbox state changes go here, being "sibling" of the checkbox element -->
<!-- This label is tied to the checkbox, and it will contain the toggle "buttons" -->
<label class="toggle-container" for="toggle"> <!-- If menu is open, it will be the "X" icon, otherwise just a clickable area behind the hamburger menu icon -->
<span class="button button-toggle"></span>
</label>
<!-- The nav menu -->
<nav class="nav">
<a class="nav-item" href="">Dashboard</a> <a class="nav-item" href="">History</a>
<a class="nav-item" href="">Statistics</a> <a class="nav-item" href="">Settings</a>
</nav>
<!-- Just dummy content like in the animated gif -->
<!-- <section class="dummy-content">
<div class="circle"></div>
<div class="text">
<span></span>
<span></span>
</div>
<div class="square-top"></div>
<div class="square-behind"></div>
</section> -->
<div class="category-list-container">
<div class="top-categories-title">Top Categories</div>
<div class="category-list">
<div *ngFor="let _category of categories | async" class="top-category" (click)="viewCategory(_category);">
<ecm-image [refId]='_category.catCode' [refSer]="'ECMCAT'" [object]="'ECM_CATEGORY'" [attachType]="'Icon'"></ecm-image>
<span class="category-title">{{_category.shDescr}}</span>
</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-title">My Menu</div>
<div class="my-menu-list">
<div class="nav-my-profile">
<img class="ecm-user-icon" src="/ecm/assets/images/svg/user.svg" />
<span class="menu-title">My Profile</span>
</div>
<div class="nav-orders">
<img class="ecm-order-icon" src="/ecm/assets/images/svg/order.svg" />
<span class="menu-title">Orders</span>
</div>
<div class="nav-wishlist">
<img class="ecm-wishlist-icon" src="/ecm/assets/images/svg/wishlist.svg" />
<span class="menu-title" (click)="goToWishlist();">Wishlist</span>
</div>
</div>
</div>
<div class="help-center-title">
<span>Help Center</span>
</div>
\ No newline at end of file
ecm/Angular/trunk/src/app/ecm-nav-menu/ecm-nav-menu.component.ts
View file @ d71c6ba6
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { Category } from '../ecm-model/category-model';
import { Store } from '@ngrx/store';
import { AppState } from '../ecm-store/reducers';
import { CategoryActions, SubCategoryActions } from '../ecm-store/actions';
import { Observable } from 'rxjs/Observable';
@Component({
selector: 'ecm-nav-menu',
......@@ -6,8 +14,53 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./ecm-nav-menu.component.css']
})
export class ECMNavMenuComponent implements OnInit {
constructor() { }
@Output() closePanel = new EventEmitter();
categories: Observable<Category[]>;
userData;
constructor(private store: Store<AppState>, private categoryAction:CategoryActions, private subCategoryAction: SubCategoryActions, private router: Router, private route: ActivatedRoute) { }
ngOnInit() {
this.getCategories();
this.createUserData();
}
getCategories() {
this.categories = this.store.select('categories');
}
viewCategory(category){
this.store.dispatch( this.subCategoryAction.resetSubCategoryList() );
this.store.dispatch( this.subCategoryAction.loadSubCategories( category.catCode ) );
this.store.dispatch(this.categoryAction.getCategorySuccess(category));
this.router.navigate([ '/categories', category.catCode]);
}
viewAllCategories(){
let openRoutePath = this.route.snapshot.url[0].path;
if(openRoutePath !== 'home')
{
this.router.navigate(['/home']);
}else {
this.closePanel.emit();
window.scrollTo(0,600);
}
}
goToWishlist(){
this.router.navigate(['/wishlist']);
}
createUserData() {
var userInfo = localStorage.getItem( 'userInfo' );
if ( userInfo !== 'undefined' && userInfo !== null && userInfo !== 'null' )
{
this.userData = JSON.parse( userInfo );
}
else
{
this.userData = null;
}
}
}
ecm/Angular/trunk/src/app/ecm-view/ecm-panel/ecm-dialog.html
View file @ d71c6ba6
......@@ -19,7 +19,7 @@
<ecm-signin *ngSwitchCase="'SIGNIN_OPT'" (closePanel)="dialogRef.close();" ></ecm-signin>
<ecm-cart *ngSwitchCase="'CART_OPT'" [isMiniCart] = 'true' (closePanel)="dialogRef.close();" ></ecm-cart>
<ecm-user-option *ngSwitchCase="'USER_OPT'" (closePanel)="dialogRef.close();" (updateProfileImages) = "updateProfileImages();" ></ecm-user-option>
<ecm-nav-menu *ngSwitchCase="'MENU_OPT'" (closePanel)="dialogRef.close();"> </ecm-nav-menu>
<div *ngSwitchCase="'SEARCH_OPT'">
<span style="float:left;">
<button md-button class="square-button" (click)="dialogRef.close()" >
......
ecm/Angular/trunk/src/app/ecm-view/ecm-wish-list/ecm-wish-list.component.html
View file @ d71c6ba6
<div *ngIf="(wishListItems | async)?.length == 0">
<ecm-header [isFixedHeader]=true> </ecm-header>
<ecm-breadcrumbs [pageName]="'WISHLIST'"></ecm-breadcrumbs>
<div *ngIf="(wishListItems | async)?.length == 0">
<div class="row">
<div class="medium-12 large-12 columns" style="text-align: center; margin-top: 120px;">
<img class="empty-cart-img" src="/ecm/assets/images/svg/Empty Cart.svg">
......@@ -11,10 +11,13 @@
</div>
<div style="margin-top: 155px;">
</div>
<ecm-footer></ecm-footer>
</div>
<div *ngIf="(wishListItems | async)?.length > 0">
<ecm-header [isFixedHeader]=true> </ecm-header>
<ecm-breadcrumbs [pageName]="'WISHLIST'"></ecm-breadcrumbs>
<div class="row details-of-Cart">
<md-card class="medium-12 columns cartItemsDetails">
<div class="ecmdetailsItems">
......@@ -54,5 +57,5 @@
</div>
</md-card>
</div>
</div>
<ecm-footer></ecm-footer>
</div>
ecm/Angular/trunk/src/app/ecm-view/ecm-wish-list/ecm-wish-list.component.ts
View file @ d71c6ba6
......@@ -8,6 +8,8 @@ import { Http} from '@angular/http'
import { Router, ActivatedRoute } from '@angular/router';
import { Store } from '@ngrx/store';
import { AppState } from '../../ecm-store/reducers';
import { WishListActions } from '../../ecm-store/actions';
import { Observable } from 'rxjs/Observable';
......@@ -19,18 +21,18 @@ import { Observable } from 'rxjs/Observable';
})
export class EcmWishListComponent implements OnInit {
// wishListDetail: Item;
wishListItems: Observable<Item[]>;
wishListItems: Observable<ItemDetail[]>;
errorMessage: string;
cartCount = 0;
constructor( public subcategoryService: EcmProductDetailService, private route: ActivatedRoute, private router: Router, public snackBar: MdSnackBar, public wishListService: EcmWishListService, private http: Http, private store: Store<AppState> ) { }
constructor( public subcategoryService: EcmProductDetailService, private route: ActivatedRoute, private router: Router, public snackBar: MdSnackBar, public wishListService: EcmWishListService, private http: Http, private store: Store<AppState>, private wishListAction: WishListActions) { }
ngOnInit() {
this.getWishlistItems();
}
getWishlistItems() {
this.wishListItems = this.store.select( 'wishlist' );
this.wishListItems = this.store.select( 'wishlistItems' );
this.store.select( 'wishlist' ).forEach(
value => {
console.log( 'wishlist Items----' );
......@@ -42,8 +44,8 @@ export class EcmWishListComponent implements OnInit {
userActionUrl = '/ecm/service/feeds/wishlist';
deletewishlistItem( item ) {
//this.store.dispatch( { type: REMOVE_WISLIST, payload: item });
this.store.dispatch(this.wishListAction.deleteWishlistItemSuccess(item));
this.http.delete( this.userActionUrl + '/' + item.itemCode, {})
.subscribe( data => {
console.log( "deleted item in wishlist" );
......
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