Commit 54c96591 authored by prumde's avatar prumde

Updated


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174407 ce508802-f39f-4f6c-b175-0d175dae99d5
parent 71082cc6
<md-card class="product-detail-card">
<div class="row">
<div class="row">
<!-- ------------------------HANDICRAFT-IMAGE START HERE-------------------------------- -->
<div class="small-12 medium-6 large-6 columns image">
<div class="md-card-image">
<ecm-image [refId]='itemDetail.itemCode' [refSer]="'M-ITEM'" [object]="'ITEM'" [isSingleImage] = "true" ></ecm-image>
</div>
</div>
<!-- ------------------------HANDICRAFT-IMAGE ENDS HERE-------------------------------- -->
<!-- ----------------------HANDICRAFT-DETAILS START HERE-------------------------------- -->
<div class="small-12 medium-6 large-6 columns head">
<!-- <md-card> -->
<md-card-content>
<div>
<div _ngcontent-c30="" class="ecm-share">
<div class="small-12 medium-6 large-6 columns head">
<md-card-content>
<div>
<div _ngcontent-c30="" class="ecm-share">
<i _ngcontent-c30="" class="material-icons share-icon">&#xE80D;</i>
<span _ngcontent-c30="" class="share">Share</span>
</div>
<span class="item-shdescr"> {{itemDetail.itemHeader.itemShDescr}} </span>
</div>
<span class="item-shdescr"> {{itemDetail.itemHeader.itemShDescr}} </span>
<span class="item-descr"> {{itemDetail.itemHeader.itemDescr}} </span>
<span class="item-descr"> {{itemDetail.itemHeader.itemDescr}} </span>
<span class="sold-by-title">
Sold by
</span>
<span class="seller-name">
{{itemDetail.itemDetail1.sellerInfo.name}}
</span><br>
<span class="sold-by-title">Sold by</span>
<span class="seller-name">{{itemDetail.itemDetail1.sellerInfo.name}}</span><br>
<a (click)="scrollToReviews.emit();" class="link-reviews">
<span *ngIf="itemDetail.itemRatings.AVG_RATING == 0 && itemDetail.itemRatings.NO_OF_REVIEWS == 0 " style="color: #444; font-size: 18px;">
Be the first to Review this product
</span>
<a (click)="scrollToReviews.emit();" class="link-reviews">
<span *ngIf="itemDetail.itemRatings.AVG_RATING == 0 && itemDetail.itemRatings.NO_OF_REVIEWS == 0 " style="color: #444; font-size: 18px;">
Be the first to Review this product
</span>
<span *ngIf="itemDetail.itemRatings.AVG_RATING > 0 || itemDetail.itemRatings.NO_OF_REVIEWS > 0 " style="display: inline-flex;" >
<span class="ecm-ratingStars" *ngFor="let a of createRatings(itemDetail.itemRatings.AVG_RATING)">&#x2605;</span>
<span class="ecm-itemAvgRating">{{itemDetail.itemRatings.AVG_RATING}} Ratings</span>
<span class="ecm-itemNumOfReviews">|<span class="reviews-no"> {{itemDetail.itemRatings.NO_OF_REVIEWS}} Reviews</span></span>
</span>
</a>
<span *ngIf="itemDetail.itemRatings.AVG_RATING > 0 || itemDetail.itemRatings.NO_OF_REVIEWS > 0 " style="display: inline-flex;" >
<span class="ecm-ratingStars" *ngFor="let a of createRatings(itemDetail.itemRatings.AVG_RATING)">&#x2605;</span>
<span class="ecm-itemAvgRating">{{itemDetail.itemRatings.AVG_RATING}} Ratings</span>
<span class="ecm-itemNumOfReviews">|<span class="reviews-no"> {{itemDetail.itemRatings.NO_OF_REVIEWS}} Reviews</span></span>
</span>
</a>
<div class="item-descount-rate-section">
<span class="item-descount-rate">
Rs. {{itemDetail.itemHeader.itemDiscountedRate}}
</span>
</div>
<div class="item-descount-rate-section">
<span class="item-descount-rate">
Rs. {{itemDetail.itemHeader.itemDiscountedRate}}
</span>
</div>
<div>
<span class="item-cost-rate">
<s>Rs. {{itemDetail.itemHeader.itemCostRate}}</s>
</span>
<span class="item-discount">
{{itemDetail.itemHeader.itemDiscount}}% off
{{itemDetail.itemHeader.itemDiscount}}% off
</span>
</div>
<div class="offers-section">
......@@ -63,9 +57,7 @@
</div>
<div class="row">
<div class="small-6 medium-12 large-6 columns short-detail">
<div class="details-title">
Details
</div>
<div class="details-title">Details</div>
<div class="item-detail-1">
<ul>
<li>Material: {{itemDetail.itemDetail1.shortDetails.material}}</li>
......@@ -75,45 +67,37 @@
</ul>
<button type="button" onclick="()" class="md-button link_button">View More</button>
</div>
</div>
</div>
<div class="small-6 medium-12 large-6 columns">
<div>
<div class="Available">
Delivery
</div>
<div class="Available" style="font-size: 15px;">
<div>
<span>
<span class="available-title">
Available
</span>
<span> at {{itemDetail.itemDetail1.location}} </span>
</span>
<button type="button" onclick="()" class="md-button link_button" >Change
<i class="material-icons arrow ">&#xE313;</i>
</button>
</div>
<span class="delivery-info"> <b>Free Delivery</b> in 5 to 6 days </span><i class="material-icons help-icon">&#xE8FD;</i>
</div>
<div class="small-6 medium-12 large-6 columns">
<div>
<div class="Available">Delivery</div>
<div class="Available" style="font-size: 15px;">
<div>
<span>
<span class="available-title">Available</span>
<span> at {{itemDetail.itemDetail1.location}}</span>
</span>
<button type="button" onclick="()" class="md-button link_button" >Change
<i class="material-icons arrow ">&#xE313;</i>
</button>
</div>
<span class="delivery-info"> <b>Free Delivery</b> in 5 to 6 days </span><i class="material-icons help-icon">&#xE8FD;</i>
</div>
</div>
<br>
<div>
<div class="service-title">
Service
</div>
<div class="service-detail">
<div><span class="symbol">30 days exchange policy</span> <i class="material-icons help-icon">&#xE8FD;</i></div>
<div><span class="symbol">Cash on delivery available</span> <i class="material-icons help-icon">&#xE8FD;</i></div>
</div>
<div class="service-title">Service</div>
<div class="service-detail">
<div><span class="symbol">30 days exchange policy</span> <i class="material-icons help-icon">&#xE8FD;</i></div>
<div><span class="symbol">Cash on delivery available</span> <i class="material-icons help-icon">&#xE8FD;</i></div>
</div>
</div>
<br>
</div>
</div>
<div *ngFor="let itemVariant of itemDetail.itemVariants">
<div *ngIf="itemVariant.variant">
<div *ngIf="itemVariant.attribCode == 'SIZE' ">
<span class = "size-title">Select Size </span>
......@@ -128,107 +112,97 @@
</div>
</div>
</div>
</div>
</div>
</md-card-content>
<md-card-actions>
<div class="buy-cart-button">
<button md-raised-button class="button medium-btn Add_to_cart"
(click)="doActivity.emit({activity:'ADD_CART', data: itemDetail.itemCode });">Add to cart</button>
<button md-raised-button class="button medium-btn Buy_now"
(click)="doActivity.emit({activity:'BUY_NOW', data: itemDetail.itemCode });">Buy Now</button>
</div>
</md-card-actions>
<div _ngcontent-c30="" class="medium-12 columns ecm-payments">
<i class="material-icons"> &#xE8E8;</i>
<span _ngcontent-c30="" class="ecm-Info">Safe and Secure Payments. 100% Authentic products</span>
</div>
<!-- </md-card> -->
</div>
<!-- ----------------------HANDICRAFT-DETAILS ENDS HERE-------------------------------- -->
</div>
</div>
</md-card-content>
<md-card-actions>
<div class="buy-cart-button">
<button md-raised-button class="button medium-btn Add_to_cart"
(click)="doActivity.emit({activity:'ADD_CART', data: itemDetail.itemCode });">Add to cart</button>
<button md-raised-button class="button medium-btn Buy_now"
(click)="doActivity.emit({activity:'BUY_NOW', data: itemDetail.itemCode });">Buy Now</button>
</div>
</md-card-actions>
<div _ngcontent-c30="" class="medium-12 columns ecm-payments">
<i class="material-icons"> &#xE8E8;</i>
<span _ngcontent-c30="" class="ecm-Info">Safe and Secure Payments. 100% Authentic products</span>
</div>
</div>
</div>
</md-card>
<!-- ----------------------HANDICRAFT-DETAILS ENDS HERE-------------------------------- -->
<div class="row ecm-card">
<!-- <div class="medium-12 col-sm-9 ecm-itemsDetailsInfo" > -->
<div class="medium-8 large-8 columns ecm-product-details">
<md-card>
<div>
<span class="ecm-itemDeatils">Items Details</span>
</div>
<hr>
<div class="ecm-Overview">
<span class="ecm-other-title">Overview</span>
<span class="ecm-other-detail">
<ecm-readmore [text]="itemDetail.itemDetail2.productOverview" [maxLength]="120"></ecm-readmore>
</span>
</div>
<div class="medium-8 large-8 columns ecm-product-details">
<md-card>
<div> <span class="ecm-itemDeatils">Items Details</span> </div>
<hr>
<div class="ecm-Overview">
<span class="ecm-other-title">Overview</span>
<span class="ecm-other-detail">
<ecm-readmore [text]="itemDetail.itemDetail2.productOverview" [maxLength]="120"></ecm-readmore>
</span>
</div>
<div class="Attraction" style="padding-top: 24px;">
<span class="attraction">Description</span>
<table style="width: 100%">
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.brand">
<td class="data-title">Brand</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.brand}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.sku">
<td class="data-title">Sku</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.sku}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.type">
<td class="data-title">Type</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.type}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.size">
<td class="data-title">Size</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.size}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.weight">
<td class="data-title">Weight</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.weight}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.material">
<td class="data-title">Material</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.material}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.color">
<td class="data-title">Color</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.color}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.packageContent">
<td class="data-title">PackageContent</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.packageContent}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.care">
<td class="data-title">Care</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.care}}</td>
</tr>
</table>
</div>
<div class="Attraction" style="padding-top: 24px;">
<span class="attraction">Description</span>
<table style="width: 100%">
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.brand">
<td class="data-title">Brand</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.brand}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.sku">
<td class="data-title">Sku</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.sku}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.type">
<td class="data-title">Type</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.type}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.size">
<td class="data-title">Size</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.size}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.weight">
<td class="data-title">Weight</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.weight}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.material">
<td class="data-title">Material</td>
<td class="data-title-detail"> {{itemDetail.itemDetail2.productDetails.material}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.color">
<td class="data-title">Color</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.color}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.packageContent">
<td class="data-title">PackageContent</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.packageContent}}</td>
</tr>
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.care">
<td class="data-title">Care</td>
<td class="data-title-detail">{{itemDetail.itemDetail2.productDetails.care}}</td>
</tr>
</table>
</div>
<div class="ecm-returnsPolicy">
<span class="ecm-other-title">Return Policy</span>
<span class="ecm-other-detail">{{itemDetail.itemDetail2.returnPolicy}}</span>
</div>
<div class="ecm-termsCondition">
<span class="ecm-other-title">Terms and Conditions</span>
<span class="ecm-other-detail">{{itemDetail.itemDetail2.termsAndCondition}}</span>
</div>
<div class="ecm-returnsPolicy">
<span class="ecm-other-title">Return Policy</span>
<span class="ecm-other-detail">{{itemDetail.itemDetail2.returnPolicy}}</span>
</div>
<div class="ecm-termsCondition">
<span class="ecm-other-title">Terms and Conditions</span>
<span class="ecm-other-detail">{{itemDetail.itemDetail2.termsAndCondition}}</span>
</div>
</md-card>
</div>
</md-card>
</div>
<div class="medium-4 large-4 columns">
<ecm-recent-view #recentView> </ecm-recent-view>
</div>
<div class="medium-4 large-4 columns">
<ecm-recent-view #recentView> </ecm-recent-view>
</div>
</div>
......@@ -41,12 +41,7 @@ export class EcmOutingComponent implements OnInit, EcmTemplateInterface {
this.route.params.subscribe( params => {
this.itemCode = params['key'];
});
console.log("The items for outing " + this.itemDetail.itemDetailData.itemDetail2.actionPerformed);
this.actionPerformed = this.itemDetail.itemDetailData.itemDetail2.actionPerformed;
this.activityPerformed = this.itemDetail.itemDetailData.itemDetail2.activityPerformed;
this.transPortFacility = this.itemDetail.itemDetailData.itemDetail2.transportFacility;
this.thingsToCarry = this.itemDetail.itemDetailData.itemDetail2.thingsToCarry;
this.itemDetailpath =this.itemDetail.itemDetailData.itemDetail2
this.myCity = localStorage.getItem('mycity')
}
......
......@@ -36,11 +36,11 @@ export class EcmSigninComponent implements OnInit {
}
register() {
alert( "register" );
window.open("/ibase/E12Registration/jsp/Registration.jsp");
}
forgot() {
alert( "forgot" );
console.log( "Not Implemented Yet" );
}
login() {
......
......@@ -30,7 +30,7 @@
<!-- <span class="ecm-View" style="cursor: pointer;position: absolute;">ViewAll ( {{cartItemsDetail.length}} )</span> -->
</div>
<!-- <button md-raised-button class="button medium-btn-checkout" style="background: mediumvioletred; color:#fff;" >Checkout</button> -->
<button md-button class="checkout-button" [routerLink]="['/check-out']">Checkout</button>
<button md-button class="checkout-button" [routerLink]="['/checkout']">Checkout</button>
</div>
</ng-template>
......
......@@ -4,7 +4,7 @@
<div class="row checkout-page">
<form #userForm="ngForm" (ngSubmit)="onSubmit()">
<form #userForm="ngForm" (ngSubmit)="onSubmit(userForm.value)">
<div class="medium-7 columns">
<md-card>
......@@ -14,14 +14,14 @@
<span class="form-group">
<md-input-container class="userEmail">
<input type="email" mdInput placeholder="Email" class="form-control" required name="email" #emailRef="ngModel" [(ngModel)]="email">
<md-error *ngIf="emailRef.errors && emailRef.dirty" class="">Email required</md-error>
<md-error *ngIf="emailRef.errors && emailRef.dirty">Email required</md-error>
</md-input-container></span>
<span class="form-group">
<md-input-container class="userInfo">
<input type="number" mdInput placeholder="Phone Number" id="phone" class="form-control" required minlength="10" maxlength="10" name="phone" #phoneRef="ngModel" [(ngModel)]="phone">
<md-error *ngIf="phoneRef.errors && phoneRef.dirty" class="">Phone Number required</md-error>
<md-error *ngIf="phoneRef.errors && phoneRef.dirty">Phone Number required</md-error>
</md-input-container>
</span> </span></table>
......@@ -37,7 +37,7 @@
<span>
<md-input-container class="userAdress">
<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-error *ngIf="addressRef.dirty && addressRef.errors">Address required</md-error>
</md-input-container></span>
<span>
......@@ -154,7 +154,7 @@
<span class="cvv">
<md-input-container class="cvv-input">
<input required type="number" mdInput placeholder="cvv" #cvvRef="ngModel" [(ngModel)]="cvv" name="cvv">
<md-error *ngIf="cvvRef.errors && cvvRef.dirty" class="">Zip/Postalcode required</md-error>
<md-error *ngIf="cvvRef.errors && cvvRef.dirty" class="">cvv required</md-error>
</md-input-container>
</span>
</div>
......@@ -162,29 +162,20 @@
</div>
<div class="medium-5 columns">
<div *ngIf="cartItemsDetail" class="medium-5 columns">
<md-card>
<div class="orderSummary">
<table>
<tr>
<th class="order-summary-title">Order Summary</th>
</tr>
<tr>
<td class="item-name">Indigenous Handicrafts Incredible Applique Work Red Cotton Bed Cover</td>
<td class="item-cost">₹ 500</td>
</tr>
<tr>
<td class="item-name">Indigenous Handicrafts Incredible Applique Work Red Cotton Bed Cover</td>
<td class="item-cost">₹ 500</td>
<tr *ngFor="let item of cartItemsDetail">
<td class="item-name">{{item.shDescr}}</td>
<td class="item-cost">₹ {{item.costRate}}</td>
</tr>
<tr>
<td class="item-name">Tie & Dye Black Cotton Reversible Double AC Quilt or Quilted Bed Cover</td>
<td class="item-cost">₹ 500</td>
</tr>
<tr>
<td class="total">Total</td>
<td class="total-price">1500</td>
<td class="total-price">{{totalPrice}}</td>
</tr>
</table>
......
import { Component, OnInit, ViewChild, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { FormBuilder, Validators,NgForm } from '@angular/forms';
import { EcmCartService } from '../ecm-cart/ecm-cart.service';
import { Item } from '../../ecm-model/product-model';
@Component( {
selector: 'ecm-checkout',
......@@ -11,33 +13,14 @@ export class EcmCheckoutComponent implements OnInit {
@ViewChild('userForm') currentForm: NgForm;
userForm: NgForm;
shippingCountry;
shippingAddress;
shippingCity;
shippingState;
shippingZipCode;
billingCountry;
billAddress;
billingCity;
billingState;
billingZipCode;
checked = false;
selectedMonth;
selectedYear;
phone;
email;
cardHolder;
cardNumber;
cvv;
cartItemsDetail: Item[];
totalPrice:number = 0;
countries;
months;
years;
constructor(private formBuilder: FormBuilder) {
constructor(private formBuilder: FormBuilder, public cartService: EcmCartService) {
this.countries = [
{ viewValue: 'India' },
{ viewValue: 'UAE' },
......@@ -69,10 +52,35 @@ export class EcmCheckoutComponent implements OnInit {
}
ngOnInit() {
this.getCartItems();
}
onSubmit() {
onSubmit(data) {
alert("Form Submitted");
console.log("User Email:[" +data.email +"]");
}
getCartItems() {
this.cartService.getCartItems().subscribe(
cartItemsDetail => {
this.cartItemsDetail = cartItemsDetail;
console.log( 'comp cartItemsDetail[' + JSON.stringify( cartItemsDetail ) + '] \n this.cartItemsDetail[' + this.cartItemsDetail.length + ']' );
if ( this.cartItemsDetail ) {
this.getTotalPrice();
console.log( "the total Price is" + this.totalPrice );
}
},
error => {
let errorMessage = <any>error;
console.log( 'comp errorMessage[' + errorMessage + ']' );
});
}
getTotalPrice() {
this.cartItemsDetail.forEach(( item, i ) => {
this.totalPrice = this.totalPrice + parseFloat( item.costRate );
console.log('Total Price Is'+item.costRate);
});
}
}
......
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