Commit b4225c45 authored by prumde's avatar prumde

Updated


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174404 ce508802-f39f-4f6c-b175-0d175dae99d5
parent 3416efd4
......@@ -42,7 +42,7 @@ import { EcmSubCategoryComponent } from './ecm-view/ecm-sub-category/ecm-sub-cat
import { EcmProductComponent } from './ecm-view/ecm-product/ecm-product.component';
import { EcmTrendProductComponent } from './ecm-view/ecm-trend-product/ecm-trend-product.component';
import { EcmTemplateComponent, EcmTemplateDirective } from './ecm-product-details/ecm-template/ecm-template.component';
import { EcmCartComponent } from './ecm-view/ecm-cart/ecm-cart.component';
import { EcmCartComponent, DialogOverviewExampleDialog } from './ecm-view/ecm-cart/ecm-cart.component';
import { EcmCartService } from './ecm-view/ecm-cart/ecm-cart.service';
import { EcmProductReviewService } from './ecm-product-details/ecm-product-review.service';
......@@ -97,7 +97,8 @@ const appRoutes: Routes = [
EcmRecentViewComponent,
EcmReadmoreComponent,
EcmRelatedItemsComponent,
EcmCheckoutComponent
EcmCheckoutComponent,
DialogOverviewExampleDialog
],
imports: [
BrowserModule,
......@@ -120,7 +121,8 @@ const appRoutes: Routes = [
EcmOutingComponent,
EcmFoodComponent,
EcmHandicraftComponent,
EcmCelebrationComponent
EcmCelebrationComponent,
DialogOverviewExampleDialog
],
bootstrap: [AppComponent]
})
......
......@@ -22,8 +22,9 @@
.itemdescription
{
font-size: 14px;
font-size: 12px;
width: 42%;
cursor: pointer;
}
.ecm-itemdescription{
......@@ -43,7 +44,9 @@
font-size: 18px;
}
.listItems{
border: 2px solid ghostwhite;
border: 2px solid ghostwhite;
border-left: none;
border-right: none;
}
.ViewAll{
......@@ -130,22 +133,28 @@
cursor: pointer;
bottom: 4px;
}
.counter{
padding: 0px;
}
.change-color{
display: flex;
}
.size-of-item{
display: table;
}
.selected {
position: relative;
left: 5px;
width: 32px;
height: 32px;
bottom: 7px;
background-color: mediumvioletred;
}
.totalPriceDetails{
.totalPriceDetails{
margin-top: 10px;
}
.continue-shopping{
width: 100%;
margin-right: 0px;
}
}
.ecm-payments{
display: flex;
......@@ -157,7 +166,7 @@
.ecm-Info{
position: relative;
left: 8px;
font-size: 17px;
font-size: 15px;
}
.detail-checkout-button{
width: 100%;
......@@ -179,6 +188,7 @@
/* width: 160px; */
line-height: 40px;
border-bottom: thin solid mediumvioletred;
font-size: 14px;
}
.image{
width: 100px;
......@@ -197,74 +207,172 @@
position: relative;
float: right;
width: 100%;
margin-top: 10px;
}
.item-image{
width: 140px;
padding-top: 16px;
padding-top: 16px;
}
.change-color{
padding-top: 24px;
padding-bottom: 35px;
padding-top: 16px;
}
.size-of-item{
font-size: 14px;
font-size: 12px;
color: dimgray;
font-weight: 600;
}
.selected{
position: relative;
left: 5px;
width: 32px;
height: 32px;
width: 38px;
height: 36px;
font-size: 19px;
margin-left: 8px;
background-color: mediumvioletred;
}
.color-change{
position: relative;
left: 10px;
font-size: 16px;
font-size: 13px;
color: mediumvioletred;
cursor: pointer;
font-weight: 600;
padding-left: 8px;
}
.wishList-items{
font-size: 16px;
color: mediumvioletred;
cursor: pointer;
font-size: 12px;
color: mediumvioletred;
cursor: pointer;
font-weight: 600;
}
.remove-items{
font-size: 16px;
color: dimgray;
padding-left: 31px
font-size: 12px;
color: dimgray;
padding-left: 31px;
font-weight: 600;
cursor: pointer;
}
.wish-remove-dipslay{
display: inline-block;
position: relative;
top: 100px;
}
.ecm-textBox{
text-align: center;
padding-bottom: 16px;
position: relative;
left: 26px;
}
.counter{
position: relative;
top: 12px;
padding-left: 58px;
}
.ecm-decre{
background-color: white;
color: red;
width: 40px;
height: 35px;
position: relative;
padding-top: 18px;
}
.ecm-textBox{
width: 56px;
width: 76px;
position: relative;
margin-left: 8px;
margin-right: 8px;
text-align: center;
height: 36px;
font-size: 17px;
}
.ecm-incre{
.counter-button{
color: mediumvioletred;
background-color: white;
width: 36px;
height: 32px;
position: relative;
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-bottom: 32px;
position: relative;
top: 78px;
position: relative;
font-size: 20px;
float: right;
padding-top: 35px;
padding-bottom: 35px;
font-weight: 600;
top: 5px;
padding-right: 37px;
}
.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;
}
.items-desc{
padding-top: 18px;
}
.shippingFree{
float: right;
font-weight: 600;
color: mediumaquamarine;
font-size: 13px;
}
.details-of-Cart{
top: 60px;
margin-bottom: 50px;
position: relative;
margin-top: 50px;
}
.cartItemsDetails{
padding-right: 0px;
padding-left: 0px;
}
.item-shDescr{
display: block;
font-size: 18px;
padding-top: 10px;
font-weight: 600;
}
.item-title{
font-size: 14px;
color: mediumvioletred;
font-weight: 600;
cursor: pointer;
}
.item-seller{
font-size: 12px;
color: dimgray;
font-weight: 600;
}
.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;
padding-left: 14px;
}
\ No newline at end of file
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { Http, Response, Headers, RequestOptions, URLSearchParams } from '@angular/http'
import { MdSnackBar } from '@angular/material';
import { MdDialog, MdDialogRef } from '@angular/material';
import { Store } from '@ngrx/store';
import { EcmStoreModel } from '../../ecm-store/ecm-store.model';
import { INCREMENT, DECREMENT, RESET, REMOVE } from '../../ecm-store/ecm-store';
import { INCREMENT, DECREMENT, RESET } from '../../ecm-store/ecm-store';
import { Item } from '../../ecm-model/product-model';
import { EcmCartService } from './ecm-cart.service';
......@@ -30,8 +31,8 @@ export class EcmCartComponent implements OnInit {
@Input() isMiniCart: boolean = false;
@Output() closePanel = new EventEmitter();
@Output() doActivity = new EventEmitter();
constructor( private route: ActivatedRoute, private router: Router, public cartService: EcmCartService, public snackBar: MdSnackBar, private http: Http, private store: Store<EcmStoreModel> ) { }
selectedOption: string;
constructor( private route: ActivatedRoute, public dialog: MdDialog, private router: Router, public cartService: EcmCartService, public snackBar: MdSnackBar, private http: Http, private store: Store<EcmStoreModel> ) { }
ngOnInit() {
this.getCartItem();
......@@ -53,7 +54,7 @@ export class EcmCartComponent implements OnInit {
console.log( 'comp errorMessage[' + errorMessage + ']' );
});
}
userActionUrl = '/ecm/service/feeds/cart';
deleteCartItem( itemCode ) {
......@@ -66,11 +67,9 @@ export class EcmCartComponent implements OnInit {
});
this.getCartItem();
this.decreasePrice();
let cartData = new ECMCart;
cartData.itemCode = itemCode;
this.store.dispatch( { type: REMOVE, payload: cartData });
this.store.dispatch({ type: DECREMENT, payload: cartData });
this.openSnackBar( "Item in the Cart", "Deleted" );
}
......@@ -81,6 +80,7 @@ export class EcmCartComponent implements OnInit {
}
showTotalCartItems() {
this.show = this.cartItemsDetail.length;
this.getTotalPrice();
this.router.navigate( ['/cart'] );
......@@ -97,25 +97,18 @@ export class EcmCartComponent implements OnInit {
this.totalPrice = this.totalPrice - parseFloat( item.costRate );
});
}
increment(itemCode) {
increment() {
this.counterValue += 1;
this.total = this.counterValue * this.total;
let cartData = new ECMCart;
cartData.itemCode = itemCode;
this.store.dispatch( { type: INCREMENT, payload: cartData });
}
decrement(itemCode) {
decrement() {
this.counterValue -= 1;
this.total = this.total - this.total;
let cartData = new ECMCart;
cartData.itemCode = itemCode;
this.store.dispatch( { type: DECREMENT, payload: cartData });
}
disable() {
console.log( this.counterValue );
if ( this.counterValue == 1 )
return true;
else
......@@ -124,10 +117,45 @@ export class EcmCartComponent implements OnInit {
wishList() {
alert( "item is added in a wishList" );
}
openDialog( itemCode ) {
this.cartService.setItemCode( itemCode );
let dialogRef = this.dialog.open( DialogOverviewExampleDialog );
dialogRef.afterClosed().subscribe( result => {
this.selectedOption = result;
});
}
viewItem( itemCode ) {
//this.productDetailComponent.getItemDetail(itemCode);
//this.setItemDetail.next(itemCode);
this.router.navigate( ['/detail', itemCode] );
}
}
@Component( {
selector: 'dialog-overview-example-dialog',
templateUrl: 'dialog-overview-example-dialog.html',
styleUrls: ['./ecm-cart.component.css'],
providers: [EcmCartComponent]
})
export class DialogOverviewExampleDialog {
itemCode;
constructor( public dialogRef: MdDialogRef<DialogOverviewExampleDialog>, private route: ActivatedRoute, private router: Router, public cartService: EcmCartService, private http: Http, private store: Store<EcmStoreModel>, private cartComp:EcmCartComponent) { }
userActionUrl = '/ecm/service/feeds/cart';
deleteCartItem() {
console.log( "deleteCartItem Called" );
this.itemCode = this.cartService.getItemCode();
console.log( "the cart deleted " + this.itemCode);
this.cartComp.deleteCartItem(this.itemCode);
}
}
......@@ -9,8 +9,8 @@ import { Item } from '../../ecm-model/product-model';
export class EcmCartService {
private userActionUrl = '/ecm/service/feeds/cart';
itemNo;
public itemCode;
constructor(private http: Http) { }
getCartItems(): Observable<Item[]> {
......@@ -44,11 +44,14 @@ private userActionUrl = '/ecm/service/feeds/cart';
return Observable.throw(errMsg);
}
getItemNo () {
return this.itemNo;
getItemCode() {
console.log("getItems"+this.itemCode);
return this.itemCode;
}
setItemNo(value) {
this.itemNo = value;
setItemCode(itemCode) {
this.itemCode = itemCode;
console.log("setItems"+this.itemCode);
}
}
......@@ -52,7 +52,7 @@
.select-country {
width: calc(100% - 20px);
margin: 20px;
margin: 20px 20px 20px 25px;
}
.billingAddress{
......@@ -173,7 +173,7 @@
}
.cvv-input {
width: 50px;
}
.diff-bill-chkbox {
......@@ -191,17 +191,24 @@
margin-top: 20px;
}
.place-order-button[disabled]
{
background: #e0e0e0;
color: #fff;
}
.error-msg {
color: red;
padding-left: 25px;
}
.item-name, .item-cost, .order-summary-title, .total, .total-price {
padding: 10px;
padding: 20px;
}
.order-summary-title {
text-align: left;
padding-left: 20px;
}
.total {
......@@ -209,12 +216,11 @@
}
.item-cost{
width: 25%;
padding-top: 25px;
width: 30%;
}
md-error{
padding-left: 20px;
padding-top: 12px;
}
......@@ -438,4 +444,3 @@ select:focus ~ .highlight-select {
md-card {
margin: 20px;
}
......@@ -42,7 +42,7 @@
<span>
<md-input-container class="userCity">
<input required mdInput placeholder="City" #cityRef="ngModel" [(ngModel)]="city" name="city">
<input required mdInput placeholder="City" #cityRef="ngModel" [(ngModel)]="shippingCity" name="city">
<md-error *ngIf="cityRef.errors && cityRef.dirty" class="">City required</md-error>
</md-input-container></span></span></table>
</div>
......@@ -51,11 +51,11 @@
<table class="example-full-width" cellspacing="5" width="100%"><tr>
<td>
<md-input-container class="userState">
<input mdInput placeholder="State/Province" required #stateRef="ngModel" [(ngModel)]="state" name="state">
<input mdInput placeholder="State/Province" required #stateRef="ngModel" [(ngModel)]="shippingState" name="state">
<md-error *ngIf="stateRef.errors && stateRef.dirty" class="">State required</md-error>
</md-input-container></td>
<td><md-input-container class="userPostal">
<input required minlength="6" maxlength="6" type="number" mdInput placeholder="Zip/Postalcode" #zipcodeRef="ngModel" [(ngModel)]="zipCode" name="zipCode">
<input required minlength="6" maxlength="6" type="number" mdInput placeholder="Zip/Postalcode" #zipcodeRef="ngModel" [(ngModel)]="shippingZipCode" name="zipCode">
<md-error *ngIf="zipcodeRef.errors && zipcodeRef.dirty" class="">Zip/Postalcode required</md-error>
</md-input-container></td>
</tr>
......@@ -63,8 +63,7 @@
</div>
<div class="billingCountry">
<span class="countryValue">Country</span>
<md-select class="select-country" placeholder="Country" [(ngModel)]="selectedCountry" name="countries">
<md-select class="select-country" placeholder="Country" [(ngModel)]="shippingCountry" name="countries">
<md-option *ngFor="let countries of countries" [value]="countries.viewValue">
{{countries.viewValue}}
</md-option>
......@@ -86,34 +85,34 @@
<table class="example-full-width" cellspacing="5" width="100%"><span>
<span>
<md-input-container class="userAdress">
<input required minlength="10" maxlength="100" mdInput placeholder="Address" #billaddressRef="ngModel" [(ngModel)]="billAddress" name="billAddress">
<md-error *ngIf="billaddressRef.errors && billaddressRef.dirty" class="">Address required</md-error>
<input required minlength="10" maxlength="100" mdInput placeholder="Address" [(ngModel)]="billAddress" #addressRef="ngModel" name="billAddress">
<md-error *ngIf="addressRef.errors && addressRef.dirty" class="">Address required</md-error>
</md-input-container></span>
<span>
<md-input-container class="userCity">
<input required mdInput placeholder="City" #cityRef="ngModel" [(ngModel)]="city" name="city">
<md-error *ngIf="cityRef.errors && cityRef.dirty" class="">City required</md-error>
<input required mdInput placeholder="City" #cityRef="ngModel" [(ngModel)]="billingCity" name="city">
<md-error *ngIf="cityRef.errors && cityRef.dirty" class="">City required</md-error>
</md-input-container></span></span></table>
</div>
<div class="billinguserState">
<table class="example-full-width" cellspacing="5" width="100%"><tr>
<td>
<md-input-container class="userState">
<input mdInput placeholder="State/Province" #stateRef="ngModel" [(ngModel)]="state" name="state">
<md-input-container class="userState">
<input mdInput placeholder="State/Province" required #stateRef="ngModel" [(ngModel)]="billingState" name="state">
<md-error *ngIf="stateRef.errors && stateRef.dirty" class="">State required</md-error>
</md-input-container></td>
<td>
<md-input-container class="userPostal">
<input required minlength="6" maxlength="6" type="number" mdInput placeholder="Zip/Postalcode" #zipcodeRef="ngModel" [(ngModel)]="zipCode" name="zipCode">
<md-error *ngIf="zipcodeRef.errors && zipcodeRef.dirty" class="">Zip/Postalcode required</md-error>
</md-input-container></td></tr>
</table>
<td><md-input-container class="userPostal">
<input required minlength="6" maxlength="6" type="number" mdInput placeholder="Zip/Postalcode" #zipcodeRef="ngModel" [(ngModel)]="billingZipCode" name="zipCode">
<md-error *ngIf="zipcodeRef.errors && zipcodeRef.dirty" class="">Zip/Postalcode required</md-error>
</md-input-container></td>
</tr>
</table>
</div>
<div class="billingCountry">
<span class="countryValue">Country</span>
<md-select class="select-country" placeholder="Country" [(ngModel)]="selectedCountry" name="countries">
<md-select class="select-country" placeholder="Country" [(ngModel)]="billingCountry" name="countries">
<md-option *ngFor="let countries of countries" [value]="countries.viewValue">
{{countries.viewValue}}
</md-option>
......
......@@ -12,21 +12,26 @@ export class EcmCheckoutComponent implements OnInit {
@ViewChild('userForm') currentForm: NgForm;
userForm: NgForm;
selectedCountry;
selectedMonth;
selectedYear: string;
checked = false;
shippingCountry;
shippingAddress;
shippingCity;
shippingState;
shippingZipCode;
billingCountry;
billAddress;
billingCity;
billingState;
billingZipCode;
checked = false;
selectedMonth;
selectedYear;
phone;
email;
shipAddress;
billAddress;
city;
zipCode;
cardHolder;
cardNumber;
cvv;
state;
countries;
months;
......
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