Commit 78500b3d authored by prumde's avatar prumde

Updated


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174409 ce508802-f39f-4f6c-b175-0d175dae99d5
parent f738095a
......@@ -16,9 +16,10 @@
}
.ecm-breadcrumbs li:before {
content: "/";
padding-left: 5px;
padding-right: 5px;
color: black;
padding-left: 8px;
padding-right: 8px;
}
.ecm-breadcrumbs li:first-child:before {
content: "";
......@@ -53,7 +54,6 @@
top: 70px;
position: relative;
padding-left: 3rem;
margin-top: 5px;
}
.img-back-32 {
......@@ -67,10 +67,12 @@
height: 20px !important;
width: 20px !important;
min-width: 20px !important;
box-shadow: 0 0 0 3px rgba(0 ,0 ,0, 0.1), inset 0 0 0px 20px rgba(0 ,0, 0, 0.1);
/* box-shadow: 0 0 0 3px rgba(0 ,0 ,0, 0.1), inset 0 0 0px 20px rgba(0 ,0, 0, 0.1); */
box-shadow: none;
cursor: pointer;
border-radius: 100%;
/*border-radius: 100%;*/
margin-left: -2rem !important;
background: #F2F2F2;
}
.ecm-section-info {
......
......@@ -6,6 +6,8 @@
position: relative;
height: 400px;
width: auto;
background-color: #fff;
border-radius: 3px;
}
.ecm-card-img {
border-top-right-radius: 5px;
......@@ -15,13 +17,12 @@
}
.ecm-card-footer {
width: 100%;
height: 90px;
height: 70px;
padding: 10px;
}
.ecm-card-info {
padding: 10px 5px 10px 5px;
padding: 6px 0px 8px 8px;
width: calc(100% - 165px);
height: 100%;
float: left;
}
.ecm-card-info-title {
......@@ -29,7 +30,7 @@
font-weight: 600;
color: #444;
display: block;
line-height: 20px;
line-height: 15px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
......@@ -54,18 +55,18 @@
}
.ecm-card-action {
width: 90px;
height: 35px;
height: 42px;
line-height: 15px;
font-size: 12px;
padding: 10px;
padding: 15px;
text-align: center;
border: 1px solid mediumvioletred;
border-radius: 2px;
float: right;
position: relative;
top: 15px;
color: #333;
right: 10px;
top: 5px;
color: #c71585;
right: 5px;
box-shadow: none;
font-weight: 700;
}
.ecm-card-action:HOVER {
background-color: mediumvioletred;
......@@ -77,7 +78,7 @@
top: 15px;
}
.share {
background-image: url("../../assets/images/share.png");
/*background-image: url("../../assets/images/share.png");*/
border: none;
width: 40px;
height: 40px;
......@@ -90,17 +91,15 @@
/* width: 90px; */
/* height: 35px; */
/* line-height: 20px; */
font-size: 23px;
text-align: center;
/* border-radius: 2px; */
padding-right: 10px;
padding-top: 23px;
padding-bottom: 23px;
float: right;
/* position: relative; */
/* top: 15px; */
color: #333;
/* right: 10px; */
font-size: 20px;
text-align: center;
padding: 10px;
float: right;
color: #333;
}
p {
......@@ -121,17 +120,14 @@ p {
}
.ecm-rupee{
color:#888;
color: #787878;
font-size: 14px;
}
#ecm-item {
cursor: pointer;
}
#ecm-item-footer {
padding: 5px;
}
#ecm-item-info {
padding: 10px;
width: calc(100%-120px);
......@@ -139,7 +135,7 @@ p {
#ecm-item-info-title {
line-height: 15px;
padding-top: 5px;
padding-top: 0px;
}
#ecm-item-info-subhead {
......@@ -289,3 +285,9 @@ p {
color: mediumvioletred;
opacity: 1;
}
.ecm-item-footer {
width: 100%;
border-top: 1px solid #f3f3f3;
padding: 10px;
}
......@@ -41,16 +41,18 @@
<div *ngIf="itemData" class="ecm-card" id="ecm-item" (click)="viewItem()">
<ecm-image [isThumbnail]="true" [refId]='itemData.itemCode' [refSer]="'M-ITEM'" [object]="'ITEM'" [isSingleImage] = "true" ></ecm-image>
<div class="ecm-card-footer" id="ecm-item-footer">
<div class="ecm-item-footer">
<div class="ecm-card-info" id="ecm-item-info">
<span id="ecm-item-info-title" class="ecm-card-info-title">{{itemData.descr}}</span>
<!--
<span *ngIf="itemData.cat_sh_descr && itemData.scat_sh_descr" class="ecm-card-info-subhead" id="ecm-item-info-subhead">{{itemData.cat_sh_descr}} - {{itemData.scat_sh_descr}}</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>
-->
<span class="ecm-ratings">
<span *ngFor="let a of createRatings(itemData.rating);">&#x2605;</span>
</span>
</div>
<div class="ecm-card-price"><span class="ecm-rupee"></span>{{itemData.costRate}}</div>
<div class="ecm-card-price"><span class="ecm-rupee">Rs. </span>{{itemData.costRate}}</div>
</div>
</div>
......
......@@ -87,8 +87,8 @@
.flickity-page-dots .dot {
display: inline-block;
width: 16px;
height: 16px;
width: 10px;
height: 10px;
margin: 0 10px;
border-radius: 100%;
cursor: pointer;
......
import { Component, OnInit, Input, ViewEncapsulation } from '@angular/core';
import { Component, OnInit, Input, ViewEncapsulation, OnChanges } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/fromEvent';
......@@ -14,7 +14,7 @@ declare var reinitFlickity: any;
styleUrls: ['./ecm-carousel.component.css'],
encapsulation: ViewEncapsulation.None
})
export class EcmCarouselComponent implements OnInit {
export class EcmCarouselComponent implements OnInit, OnChanges {
@Input() cardItems: any;
cardsPerSlide: string = '{ "groupCells": 3 }';
......@@ -88,4 +88,8 @@ export class EcmCarouselComponent implements OnInit {
viewAll() {
alert("View All Treding Items");
}
ngOnChanges(){
console.log("ngOnChanges of Carousel");
}
}
......@@ -3,5 +3,4 @@
height: auto;
padding-bottom: 100px;
padding-bottom: 50px;
background-color: #FFF;
}
\ No newline at end of file
......@@ -2,8 +2,7 @@
border-top-right-radius: 5px;
border-top-left-radius: 5px;
width: 100%;
height: calc( 100% - 90px);
height: calc( 100% - 70px);
}
.ecm-image-icon {
......@@ -11,6 +10,8 @@
/*background-color: mediumvioletred;*/
border: none;
border-radius: 100%;
height: 47px;
width: 51px;
}
.img-loading {
......
.ecm-tab {
padding-left: 15px;
}
.ecm-result-header{
......@@ -165,8 +164,6 @@
}
.ecm-review-header {
height: 250px;
padding-top: 40px;
}
.ecm-write-review {
......@@ -198,16 +195,20 @@
}
.write-review-button {
padding: 15px;
display: block;
vertical-align: middle;
height: 50px;
width: 170px;
width: 190px;
max-width: 190px;
text-align: center;
line-height: 50px;
color: mediumvioletred;
cursor: pointer;
float: right;
box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
line-height: 15px;
font-size: 15px;
}
.ecm-review-card {
......@@ -215,10 +216,11 @@
/* width: calc(100% - 380px); */
margin-top: 20px;
top: 70px;
padding: 0;
}
.write-review-text {
font-size: 13px;
font-size: 14px;
font-weight: bold;
}
......@@ -232,13 +234,20 @@ hr {
}
.header-title {
/*
text-align: center;
display: block;
height: 40px;
width: 160px;
line-height: 40px;
margin: 0px;
border-bottom: thin solid mediumvioletred
border-bottom: thin solid mediumvioletred;
*/
padding-bottom: 22px;
border-bottom: 2px solid #c71585;
font-size: 16px;
margin-left: 17px;
}
.header-content {
......@@ -270,6 +279,11 @@ hr {
}
}
.review-title {
border-bottom: 1px solid #f3f3f3;
padding: 20px;
}
@media screen and (max-width: 640px) {
md-card {
margin: 15px;
......@@ -280,4 +294,12 @@ hr {
padding-right: 10px;
}
.ratings-section {
padding: 30px;
}
md-card {
border-radius: 3px !important;
box-shadow: 0 0px 16px -3px rgba(0,0,0,.1) !important;
}
\ No newline at end of file
......@@ -2,10 +2,11 @@
<div class="medium-8 large-8 columns ecm-review-section">
<md-card class="ecm-review-card">
<div class="ecm-review-header">
<div>
<div class="review-title">
<span class="header-title"> Ratings & Reviews </span>
</div>
<hr>
<div class="ratings-section">
<div class="row header-content">
<div class="medium-5 medium-4 columns ecm-total-reviews">
<span class="ecm-avg-rating"> {{itemAvgRating}} </span>
......@@ -22,10 +23,10 @@
</div>
<div class="medium-5 medium-4 columns ecm-write-review">
<span class="write-review-button">
<button md-button class="write-review-button">
<i class="material-icons edit">&#xE254;</i>
<span class="write-review-text"> Write a Review </span>
</span>
<span md-button class="write-review-text"> Write a Review </span>
</button>
</div>
</div>
......@@ -40,6 +41,7 @@
</md-option>
</md-select>
<div>
<div *ngIf="numFound==0" class="ecm-null-data-descr">
No Reviews Found
</div>
......@@ -57,7 +59,7 @@
<!-- <span class="next-button" [ngClass]="{disabled:currentPage === reviews.length}" (click)="nextPage()"> Next </span> -->
</div>
</div>
</md-tab>
<md-tab label="Most Helpful">
......@@ -67,7 +69,7 @@
{{type.viewValue}}
</md-option>
</md-select>
<div>
<div *ngIf="numFound==0" class="ecm-null-data-descr">
No Reviews Found
</div>
......@@ -85,11 +87,12 @@
<!-- <span class="next-button" [ngClass]="{disabled:currentPage === reviews.length}" (click)="nextPage()"> Next </span> -->
</div>
</div>
</md-tab>
</md-tab-group>
</div>
</md-card>
</div>
</div>
......@@ -19,9 +19,8 @@
.Add_to_cart {
background: #fff;
color: mediumvioletred;
border: 1px solid lightgray;
max-width: 220px;
height: 54px;
max-width: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
......@@ -29,29 +28,33 @@
position: relative;
/* float: left; */
width: calc(50% - 40px);
font-weight: 700;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px;
}
.Buy_now {
background: mediumvioletred;
color: #fff;
max-width: 220px;
height: 54px;
max-width: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
/* border-radius: 2px; */
position: relative;
/* float: right; */
width: calc(50% - 40px);
margin-left: 10px;
margin-right: 10px;
font-weight: bold;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px;
}
.link_button {
color: mediumvioletred;
font-weight: bold;
padding-left: 15px;
padding-right: 15px;
padding-left: 10px;
padding-right: 10px;
}
ul {
......@@ -111,16 +114,18 @@ li::before {
}
.ecm-payments {
font-size: 15px;
color: dimgrey;
padding: 15px 0px 15px 0px;
font-size: 13px;
color: #787878;
padding: 20px 0px 36px 5px;
}
.ecm-share {
float: right;
cursor: pointer;
font-weight: bold;
font-size: 15px
font-size: 14px;
padding-right: 25px;
padding-top: 25px;
}
.share {
......@@ -136,8 +141,8 @@ li::before {
/* new */
.ecm-other-title {
font-size: 18px;
padding-bottom: 15px;
font-size: 16px;
padding-bottom: 6px;
display: block;
font-weight: bold;
}
......@@ -162,18 +167,21 @@ li::before {
}
.ecm-itemDeatils {
padding-bottom: 8px;
border-bottom: solid mediumvioletred;
border-bottom-width: 2px;
font-size: 14px;
padding-bottom: 21px;
border-bottom: 2px solid #c71585;
font-size: 16px;
margin-left: 17px;
}
.ecm-returnsPolicy {
padding-top: 30px;
font-size: 16px;
}
.ecm-termsCondition {
padding-top: 30px;
padding-bottom: 30px;
font-size: 16px;
}
td {
......@@ -184,11 +192,11 @@ td {
}
.image {
padding-top: 16px;
}
.head {
margin-top: 16px;
padding-left: 25px;
border-left: 1px solid #f3f3f3;
}
.link_changebutton {
......@@ -210,12 +218,6 @@ td {
}
}
.ecm-itemDeatils {
padding-bottom: 8px;
border-bottom: solid mediumvioletred;
border-bottom-width: 2px;
font-size: 14px;
}
.ecm-returnsPolicy {
padding-top: 30px;
......@@ -233,8 +235,8 @@ td {
}
.attraction {
font-size: 18px;
padding-bottom: 15px;
font-size: 16px;
padding-bottom: 6px;
display: block;
font-weight: bold;
}
......@@ -255,8 +257,12 @@ td {
}
.product-detail-card {
margin-top: 15px;
padding: 10px;
margin-top: 5px;
padding: 0;
}
.ecm-product-details {
padding-right: 10px;
}
.ecm-recent-view {
......@@ -280,13 +286,15 @@ hr {
.attribute-button{
color: black;
background-color: #efecec;
width: 40px;
height: 40px;
width: 36px;
height: 36px;
min-width: 40px;
padding: 0;
margin: 0;
line-height: 40px;
line-height: 36px;
border-radius: 100%;
box-shadow: none;
font-size: 15px;
}
.attribute-button .mat-button-ripple {
......@@ -297,6 +305,7 @@ hr {
color: white;
background-color: mediumvioletred;
cursor: auto;
font-weight: bold;
}
.selected {
......@@ -305,8 +314,8 @@ hr {
}
.color-title {
color: #444;
font-size: 1rem;
color: #787878;
font-size: 14px;
position: relative;
display: inline-block;
height: 60px;
......@@ -314,11 +323,12 @@ hr {
float: left;
margin: 0;
padding: 0;
font-weight: bold;
font-weight: 700;
padding-right: 30px;
}
.size-title {
color: #444;
color: #787878;
font-size: 1rem;
position: relative;
display: inline-block;
......@@ -327,16 +337,18 @@ hr {
float: left;
margin: 0;
padding: 0;
font-weight: 700;
padding-right: 30px;
}
.size-variant {
margin-left: 15px;
margin-right: 14px;
cursor: pointer;
display: inline-block;
}
.color-variant {
margin-left: 15px;
margin-right: 14px;
padding: 0;
height: 60px;
width: 60px;
......@@ -355,8 +367,8 @@ hr {
}
.offers-section {
padding-bottom: 20px;
font-size: 15px;
padding-bottom: 14px;
font-size: 14px;
}
.seller-name {
......@@ -371,50 +383,53 @@ hr {
.sold-by-title {
display: inline;
color: #444;
color: #787878;
font-size: 15px;
font-weight: bold;
font-weight: 700;
}
.item-descr {
display: block;
font-size: 20px;
font-weight:700;
font-size: 18px;
font-weight: 600;
padding-right: 120px;
line-height: 25px
line-height: 24px;
color: black;
}
.item-shdescr {
display: block;
color: mediumvioletred;
font-size: 16px;
font-size: 14px;
font-weight: bold;
padding-bottom: 12px;
padding-bottom: 8px;
padding-top: 28px;
cursor: pointer;
}
.item-descount-rate {
font-size: 25px;
font-weight:bold;
line-height: 1;
}
.item-cost-rate {
font-size: 15px;
font-size: 14px;
color: gray;
font-weight: 100;
}
.details-title {
font-size: 15px;
color: #444;
font-size: 14px;
color: #787878;
width: 55px;
display: inline-block;
vertical-align: top;
font-weight: bold;
font-weight: 700;
}
.Available {
font-size: 15px;
font-size: 14px;
color: #444;
padding-left: initial;
}
......@@ -426,20 +441,20 @@ hr {
}
.service-title {
font-size: 15px;
font-size: 14px;
color: #444;
padding-left: initial;
}
.buy-cart-button {
padding-top: 20px;
padding-top: 8px;
}
.item-discount {
padding-left: 10px;
color: forestgreen;
font-weight:bold;
font-size: 15px;
font-size: 14px;
}
.reviews-no {
......@@ -448,23 +463,77 @@ hr {
.share-icon {
color: dimgray;
font-size: 20px;
}
.item-descount-rate-section {
padding-top: 8px;
padding-top: 14px;
}
.item-detail-1{
font-size: 15px;
font-size: 14px;
display: inline-block;
color: #444;
padding-left: 45px;
line-height: 1.5;
}
.service-detail {
font-size: 15px;
font-size: 14px;
}
.review-msg-title {
color: #444;
font-size: 16px;
color: black;
font-size: 14px;
}
.discount-validity {
color: black;
}
.secure-icon {
font-size: 20px;
}
.details-list {
color: black;
line-height: 1.5;
}
.item-details-title {
border-bottom: 1px solid #f3f3f3;
padding: 20px;
}
.extra-details-card {
padding: 0;
}
.extra-details-section {
padding: 30px;
}
.extra-detail-font{
}
.Attraction {
padding-top: 30px;
}
li::BEFORE {
padding-right: 3px !important;
}
.product-image {
max-height: 600px;
position: relative;
display: block;
height: 600px;
width: 100%;
}
md-card {
border-radius: 3px !important;
box-shadow: 0 0px 16px -3px rgba(0,0,0,.1) !important;
}
\ No newline at end of file
......@@ -5,7 +5,7 @@
<!-- ------------------------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>
<ecm-image [refId]='itemDetail.itemCode' [refSer]="'M-ITEM'" [object]="'ITEM'" [isSingleImage] = "true" class="product-image"></ecm-image>
</div>
</div>
......@@ -50,7 +50,7 @@
</span>
</div>
<div class="offers-section">
<span>{{itemDetail.itemDetail1.validity}}</span>
<span class="discount-validity">{{itemDetail.itemDetail1.validity}}</span>
<button type="button" onclick="()" class="md-button link_button">
More Offers
<i class="material-icons arrow ">&#xE313;</i>
......@@ -60,7 +60,7 @@
<div class="short-detail">
<div class="details-title">Details</div>
<div class="item-detail-1">
<ul>
<ul class="details-list">
<li>Material: {{itemDetail.itemDetail1.shortDetails.material}}</li>
<li>Crafted By: {{itemDetail.itemDetail1.shortDetails.craftedBy}}</li>
<li>Pattern: {{itemDetail.itemDetail1.shortDetails.pattern}}</li>
......@@ -104,7 +104,7 @@
<div *ngIf="itemVariant.attribCode == 'SIZE' ">
<span class = "size-title">Select Size </span>
<div *ngFor="let variant of itemVariant.variants" class="size-variant">
<a [ngClass]="{highlight:variant.itemCode == itemDetail.itemCode}" md-raised-button class="attribute-button" (click)="viewItem(variant.itemCode)"> {{variant.value}} </a>
<a [ngClass]="{highlight:variant.itemCode == itemDetail.itemCode}" md-button class="attribute-button" (click)="viewItem(variant.itemCode)"> {{variant.value}} </a>
</div>
</div>
<div *ngIf="itemVariant.attribCode == 'COLOR' ">
......@@ -120,14 +120,14 @@
<div class="buy-cart-button">
<button md-raised-button class="button medium-btn Add_to_cart"
<button md-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"
<button md-button class="button medium-btn Buy_now"
(click)="doActivity.emit({activity:'BUY_NOW', data: itemDetail.itemCode });">Buy Now</button>
</div>
<div _ngcontent-c30="" class="medium-12 columns ecm-payments">
<i class="material-icons"> &#xE8E8;</i>
<i class="material-icons secure-icon"> &#xE8E8;</i>
<span _ngcontent-c30="" class="ecm-Info">Safe and Secure Payments. 100% Authentic products</span>
</div>
</div>
......@@ -137,9 +137,9 @@
<div class="row ecm-card" #itemDetails>
<div class="medium-8 large-8 columns ecm-product-details">
<md-card>
<div> <span class="ecm-itemDeatils">Items Details</span> </div>
<hr>
<md-card class="extra-details-card">
<div class="item-details-title"> <span class="ecm-itemDeatils">Items Details</span> </div>
<div class="extra-details-section">
<div class="ecm-Overview">
<span class="ecm-other-title">Overview</span>
<span class="ecm-other-detail">
......@@ -147,7 +147,7 @@
</span>
</div>
<div class="Attraction" style="padding-top: 24px;">
<div class="Attraction">
<span class="attraction">Description</span>
<table style="width: 100%">
<tr class="extra-details" *ngIf="itemDetail.itemDetail2.productDetails.brand">
......@@ -194,11 +194,11 @@
<span class="ecm-other-detail">{{itemDetail.itemDetail2.returnPolicy}}</span>
</div>
<div class="ecm-termsCondition">
<div class="ecm-termsCondition">
<span class="ecm-other-title">Terms and Conditions</span>
<span class="ecm-other-detail">{{itemDetail.itemDetail2.termsAndCondition}}</span>
</div>
</div>
</div>
</md-card>
</div>
......
import { Component, AfterViewInit, ComponentFactoryResolver, Input, Output, ViewChild, Type, Directive, ViewContainerRef, EventEmitter } from '@angular/core';
import { Component, ComponentFactoryResolver, Input, Output, ViewChild, Type, Directive, ViewContainerRef, EventEmitter, OnChanges } from '@angular/core';
import { ItemDetail } from '../../ecm-model/product-detail-model';
@Directive({
......@@ -29,21 +29,18 @@ export interface EcmTemplateInterface {
templateUrl: './ecm-template.component.html',
styleUrls: ['./ecm-template.component.css']
})
export class EcmTemplateComponent implements AfterViewInit {
export class EcmTemplateComponent implements OnChanges {
@Output() scrollToReviews = new EventEmitter();
@Output() doActivity = new EventEmitter();
@Input() ecmTemplate: EcmTemplateItem;
@Input('ecmTemplate') ecmTemplate: EcmTemplateItem;
@Input('itemDetail') itemDetail:ItemDetail;
@ViewChild(EcmTemplateDirective) ecmTemplateDir: EcmTemplateDirective;
constructor(private componentFactoryResolver: ComponentFactoryResolver) { }
ngAfterViewInit() {
console.log("AfterViewNit of Ecm-Template Called");
this.loadComponent(this.ecmTemplate);
}
loadComponent(ecmTemplate){
console.log("Ecm-Template Loader Called");
......@@ -56,8 +53,14 @@ export class EcmTemplateComponent implements AfterViewInit {
viewContainerRef.clear();
let componentRef = viewContainerRef.createComponent(componentFactory);
console.log("ecmTemplateItem.itemDetail in template"+ecmTemplateItem.itemDetail);
(<EcmTemplateInterface>componentRef.instance).itemDetail = ecmTemplateItem.itemDetail;
(<EcmTemplateInterface>componentRef.instance).scrollToReviews = this.scrollToReviews;
(<EcmTemplateInterface>componentRef.instance).doActivity = this.doActivity;
}
ngOnChanges(){
console.log("OnChanges of Ecm-Template Called");
this.loadComponent(this.ecmTemplate);
}
}
......@@ -18,8 +18,6 @@
padding-right: 13px;
}
.itemdescription
{
font-size: 12px;
......
......@@ -3,7 +3,7 @@
margin: 0;
padding-top: 100px;
padding-top: 70px;
background-color: #FFF;
background-color: #f2f2f2 !important;
}
.ecm-section-info {
padding: 10px;
......@@ -14,13 +14,13 @@
display: block;
}
.ecm-section-info-subhead {
font-size: 16px;
font-size: 14px;
color: #888;
display: block;
}
.end {
padding-top: 15px;
padding-bottom: 50px;
padding-bottom: 15px;
}
.row.row-category {
max-width: 72rem;
......
......@@ -216,7 +216,7 @@
}
.item-cost{
width: 30%;
width: 40%;
}
md-error{
......
......@@ -3,7 +3,6 @@
margin: 0;
padding-top: 100px;
padding-top: 70px;
background-color: #FFF;
}
.ecm-section-info {
padding: 10px;
......@@ -20,7 +19,7 @@
}
.end {
padding-top: 15px;
padding-bottom: 50px;
padding-bottom: 15px;
}
.row.row-subcategory {
max-width: 72rem;
......
......@@ -16,12 +16,9 @@ hr {
}
.recent-view-title {
text-align: center;
display: block;
height: 40px;
/* width: 160px; */
line-height: 40px;
border-bottom: thin solid mediumvioletred;
padding-bottom: 22px;
border-bottom: 2px solid #c71585;
font-size: 16px;
}
.ecm-recent-view-card {
......@@ -32,13 +29,14 @@ hr {
.item-descr {
display: block;
color: #444;
font-size: 15px;
font-size: 14px;
padding-top: 8px;
}
.item-cost {
display: block;
padding-top: 10px;
font-size: 15px;
font-size: 14px;
font-weight: bold;
}
......@@ -55,7 +53,7 @@ hr {
}
.recentView-section {
margin-top: 70px;
/*margin-top: 70px;*/
height: 600px;
background-color: #F2F2F2;
}
......@@ -84,8 +82,28 @@ hr {
padding-bottom: 50px;
}
md-card{
margin: 15px;
.recent-view-header {
border-bottom: 1px solid #f3f3f3;
padding: 20px;
text-align: center;
}
.recent-view-card {
padding: 0;
padding-bottom: 14px;
}
.recent-view-items {
padding: 30px;
}
@media screen and (max-width: 640px) {
md-card {
margin: 15px;
}
}
md-card {
border-radius: 3px !important;
box-shadow: 0 0px 16px -3px rgba(0,0,0,.1) !important;
}
<md-card *ngIf="recentViewItems && recentViewItems.length "id='recentViewCard'>
<div>
<md-card *ngIf="recentViewItems && recentViewItems.length " class="recent-view-card" id='recentViewCard'>
<div class="recent-view-header">
<span class="recent-view-title"> Recently Viewed </span>
</div>
<hr>
<div class="recent-view-items">
<div *ngFor="let item of recentViewItems | slice:0:show; let i=index" class="ecm-recent-view-card" (click)="viewItem(item.itemCode)">
<div class="media-object-section product-image">
<ecm-image [refId]='item.itemCode' [refSer]="'M-ITEM'" [object]="'ITEM'" [isSingleImage] = "true"></ecm-image>
</div>
<div class="media-object-section">
<span class="item-descr">{{item.descr}}</span>
<span class="item-cost"> {{item.costRate}}</span>
<span class="item-cost">Rs. {{item.costRate}}</span>
</div>
</div>
<div class="view-all-section" *ngIf="recentViewItems.length > 3 && show == 3" (click)="show = recentViewItems.length">
<span class="view-all-button">View All {{recentViewItems.length}} Items </span>
</div>
</div>
</md-card>
\ No newline at end of file
......@@ -4,7 +4,7 @@
<div class="ecm-section-info">
<span class="ecm-section-info-title">Related Items</span>
</div>
<ecm-carousel #ecmCarouselComp [cardItems]="relatedItems" ></ecm-carousel>
<ecm-carousel [cardItems]="relatedItems" ></ecm-carousel>
</div>
</section>
</div>
\ No newline at end of file
import { Component, OnInit, Input, ViewChild } from '@angular/core';
import { Component, Input, ViewChild, OnChanges } from '@angular/core';
import { ItemDetail } from '../../ecm-model/product-detail-model';
import {EcmRelatedItemService} from './ecm-related-item.service';
......@@ -13,20 +13,15 @@ declare var reinitFlickity: any;
styleUrls: ['./ecm-related-items.component.css'],
providers: [EcmRelatedItemService]
})
export class EcmRelatedItemsComponent implements OnInit {
export class EcmRelatedItemsComponent implements OnChanges {
@Input() scatCode;
@ViewChild('ecmCarouselComp') ecmCarouselComp: EcmCarouselComponent;
relatedItems: Item[];
errorMessage: string;
constructor(private relatedItemService:EcmRelatedItemService) { }
ngOnInit() {
this.getRelatedItems(this.scatCode);
}
getRelatedItems(scatCode: string) {
this.relatedItemService.getRelatedItems(scatCode).subscribe(
......@@ -34,8 +29,6 @@ export class EcmRelatedItemsComponent implements OnInit {
this.relatedItems = relatedItems;
reinitFlickity();
this.ecmCarouselComp.ngOnInit();
console.log('comp relatedItems[' + JSON.stringify( relatedItems ) + '] \n this.relatedItems[' + JSON.stringify( this.relatedItems ) + ']');
},
error => {
......@@ -44,4 +37,9 @@ export class EcmRelatedItemsComponent implements OnInit {
});
}
ngOnChanges(){
console.log("OnChanges of ecm-related-items called");
this.getRelatedItems(this.scatCode);
}
}
......@@ -3,7 +3,6 @@
margin: 0;
padding-top: 100px;
padding-top: 70px;
background-color: #FFF;
}
.ecm-section-info {
padding: 10px;
......@@ -20,7 +19,7 @@
}
.end {
padding-top: 15px;
padding-bottom: 50px;
padding-bottom: 15px;
}
.row.row-subcategory {
max-width: 72rem;
......
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