Skip to content

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

Added ecm-variants component 


git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@174490 ce508802-f39f-4f6c-b175-0d175dae99d5
parent 315a508c
Hide whitespace changes
Inline Side-by-side
Showing with 1504 additions and 0 deletions
ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-variants/ecm-variants.component.css 0 → 100755
View file @ 210b7e96
@media screen and (max-width: 640px) {
md-card {
margin: 0px 15px;
}
.wishButton {
right: 0 !important;
}
}
.ecm-product-ratings {
color: rgb(500, 150, 50);
font-size: large;
display: block;
padding-right: 10px;
}
.ecm-null-ratings {
color: lightgray;
font-size: large;
}
.Add_to_cart {
background: #fff;
color: mediumvioletred;
max-width: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
/* border-radius: 2px; */
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: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
position: relative;
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: 10px;
padding-right: 10px;
}
ul {
list-style: none;
display: inline;
}
.btn {
font-weight: bold;
color: mediumvioletred;
text-align: center;
line-height: 18px;
}
.selected {
font-weight: bold;
color: white;
text-align: center;
line-height: 18px;
}
.link_button_size {
color: mediumvioletred;
font-weight: bold;
padding-left: 15px;
font-size: 14px;
}
.symbol {
display: inline-block;
vertical-align: super;
/*
height: 20px;
width: 20px;
border-radius: 50%;
border: 1px solid black;
border: black;
*/
}
.back {
background-color: mediumvioletred;
}
.back_selected {
background-color: ghostwhite;
}
.ecm-Info {
padding-left: 8px;
vertical-align: super;
}
.ecm-payments {
font-size: 13px;
color: #787878;
padding: 32px 0px 36px 5px;
}
.ecm-share {
float: right;
cursor: pointer;
font-weight: bold;
font-size: 14px;
padding-right: 25px;
padding-top: 25px;
}
.share {
vertical-align: super;
color: dimgray;
}
.arrow {
vertical-align: middle;
margin-left: -2px;
font-size: 21px;
}
/* new */
.ecm-other-title {
font-size: 16px;
padding-bottom: 6px;
display: block;
font-weight: bold;
}
.ecm-other-detail {
font-size: 17px;
text-align: justify;
}
.short-detail {
padding-bottom: 15px;
}
.ecm-card {
/* margin-top: 20px; */
/* max-width: 75rem; */
/* margin-left: auto; */
/* margin-right: auto; */
padding-top: 20px;
}
.ecm-itemDeatils {
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;
}
.image {
border-right: 1px solid #f3f3f3;
}
.head {
padding-left: 25px;
/*border-left: 1px solid #f3f3f3;*/
}
.link_changebutton {
color: mediumvioletred;
font-weight: bold;
position: absolute;
}
/* new*/
@media screen and (min-width: 20rem) {
.Available {
font-size: calc(0.8rem + 1.2 * (( 100vw - 20rem)/30));
}
}
@media screen and (min-width: 50rem) {
.Available {
font-size: 2rem;
}
}
.ecm-returnsPolicy {
padding-top: 30px;
}
.ecm-termsCondition {
padding-top: 30px;
}
.attraction {
font-size: 16px;
padding-bottom: 6px;
display: block;
font-weight: bold;
}
.extra-details {
}
.data-title {
padding: 5px 0px 5px 0px;
color: #787878;
font-weight: 700;
}
.data-title-detail {
color: black;
padding: 5px;
font-weight: inherit;
padding: 15px;
}
.product-detail-card {
margin-top: 5px;
padding: 0;
}
.ecm-product-details {
padding-right: 10px;
}
.ecm-recent-view {
padding-left: 10px;
}
@media screen and (max-width: 640px) {
.ecm-recent-view {
display: none;
}
.ecm-product-details {
width: 100%;
}
}
hr {
margin-top: 8px;
}
.attribute-button{
color: black;
background-color: #efecec;
width: 36px;
height: 36px;
min-width: 36px;
padding: 0;
margin: 0;
line-height: 36px;
border-radius: 100%;
box-shadow: none;
font-size: 15px;
}
.attribute-button .mat-button-ripple {
border-radius: 100% !important;
}
.highlight {
color: white;
background-color: mediumvioletred;
cursor: auto;
font-weight: bold;
}
.highlight:HOVER {
color: white !important;
}
.selected {
box-shadow: 0 0 1px 1px mediumvioletred;
cursor: auto;
}
.color-title {
color: #787878;
font-size: 14px;
position: relative;
display: inline-block;
height: 60px;
line-height: 60px;
float: left;
margin: 0;
padding: 0;
font-weight: 700;
padding-right: 30px;
}
.size-title {
color: #787878;
font-size: 14px;
position: relative;
display: inline-block;
height: 40px;
line-height: 40px;
float: left;
margin: 0;
padding: 0;
font-weight: 700;
padding-right: 30px;
}
.size-variant {
margin-right: 14px;
cursor: pointer;
display: inline-block;
}
.color-variant {
margin-right: 14px;
padding: 0;
height: 60px;
width: 60px;
position: relative;
display: inline-block;
cursor: pointer;
}
.help-icon {
cursor: pointer;
color: black;
}
.delivery-info {
vertical-align: super;
}
.offers-section {
padding-bottom: 14px;
font-size: 14px;
}
.seller-name {
display: inline;
color: mediumvioletred;
font-size: 14px;
font-weight:bold;
padding-left: 2px;
padding-right: 2px;
cursor: pointer;
}
.sold-by-title {
display: inline;
color: #787878;
font-size: 14px;
font-weight: 700;
}
.item-descr {
display: block;
font-size: 18px;
font-weight: 600;
padding-right: 120px;
line-height: 24px;
color: black;
}
.item-shdescr {
display: block;
font-size: 14px;
font-weight: bold;
padding-bottom: 8px;
padding-top: 28px;
}
.subcat-link {
color: mediumvioletred;
}
.item-descount-rate {
font-size: 25px;
font-weight:bold;
line-height: 1;
}
.item-cost-rate {
font-size: 14px;
color: gray;
font-weight: 100;
}
.details-title {
font-size: 14px;
color: #787878;
width: 55px;
display: inline-block;
vertical-align: top;
font-weight: 700;
}
.Available {
font-size: 14px;
color: #444;
padding-left: initial;
}
.available-title {
display:inline;
color: forestgreen;
font-weight:bold;
}
.service-title {
font-size: 14px;
color: #444;
padding-left: initial;
}
.buy-cart-button {
padding-top: 8px;
}
.item-discount {
padding-left: 10px;
color: forestgreen;
font-weight:bold;
font-size: 14px;
}
.reviews-no {
padding-left: 12px;
}
.share-icon {
color: dimgray;
font-size: 20px;
}
.item-descount-rate-section {
padding-top: 14px;
}
.item-detail-1{
font-size: 14px;
display: inline-block;
color: #444;
padding-left: 45px;
line-height: 1.5;
}
.service-detail {
font-size: 14px;
}
.review-msg-title {
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{
}
.attrib-container {
padding-top: 30px;
}
.attrib-container > ul {
font-size: 17px;
}
li::BEFORE {
padding-right: 10px !important;
content: "•";
color: gray; /* or whatever color you prefer */
}
.product-image {
min-height: 400px;
max-height: 600px;
position: relative;
display: block;
/* height: 600px; */
width: 100%;
}
.ecm-ratingStars {
color: rgb(500, 150, 50);
}
.ecm-itemAvgRating {
color: black;
padding-right: 5px;
padding-left: 5px;
line-height: 20px;
}
.ecm-itemNumOfReviews {
padding-left: 5px;
color: black;
border-left: 1px solid #f3f3f3;
line-height: 20px;
}
md-card {
border-radius: 3px !important;
box-shadow: 0 0px 16px -3px rgba(0,0,0,.1) !important;
}
/* Mobile View*/
.mobi-buy-cart-button{
position: fixed !important;
bottom: 0 !important;
height: 65px !important;
background: #fff;
z-index: 2;
width: 100%;
right: 0%;
}
.mobi-buy-cart-button > .Add_to_cart{
background: #fff;
color: mediumvioletred;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
position: relative;
width: calc(50% - 40px);
font-weight: 700;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px;
margin-left: 40px;
margin-right: 18px;
margin-top: -7px;
}
.mobi-buy-cart-button > .Buy_now{
background: mediumvioletred;
color: #fff;
max-width: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
position: relative;
width: calc(50% - 40px);
font-weight: bold;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px;
margin-top: -7px;
margin-left: -7px;
margin-right: 29px;
}
.wishButton{
float: right;
z-index: 1;
/* padding-top: 18px; */
background: none;
color: mediumvioletred;
top: 15px;
right: 50%;
position: absolute;
box-shadow: none;
}
.total-cost-container {
padding: 20px 0;
}
.onwards-title {
}
.date-select-option {
width: 200px;
}
.time-slot-title {
display: block;
font-size: 14px;
padding-bottom: 10px;
color: #787878;
}
.time-slot-chips {
padding: 0;
float: inherit;
}
.time-slot-chip {
border-radius: 5px !important;
padding: 14px 25px !important;
font-weight: 700;
background-color: #f2f2f2;
cursor: pointer !important;
font-size: 14px;
margin-right: 15px;
}
.attrib-header {
font-size: 20px;
padding-bottom: 15px;
display: block;
font-weight: bold;
}
.overViewInfo {
padding-left: 25px;
}
.ecm-Overview {
display: flex;
padding-top: 20px;
padding-bottom: 15px;
}
.date-selection, .time-selection {
padding-bottom: 20px;
}
.header-attribs-title {
width: 105px;
display: inline-block;
font-size: 15px;
color: #787878;
font-weight: 800;
}
.time-select-chips {
display: inline-flex;
}
.time-selected {
background: mediumvioletred !important;
color: #fff !important;
}
@media screen and (max-width: 640px) {
md-card {
margin: 0px 15px;
}
.wishButton {
right: 0 !important;
}
}
.ecm-product-ratings {
color: rgb(500, 150, 50);
font-size: large;
display: block;
padding-right: 10px;
}
.ecm-null-ratings {
color: lightgray;
font-size: large;
}
.Add_to_cart {
background: #fff;
color: mediumvioletred;
max-width: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
/* border-radius: 2px; */
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: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
position: relative;
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: 10px;
padding-right: 10px;
}
ul {
list-style: none;
display: inline;
}
li::before {
content: "• ";
color: gray; /* or whatever color you prefer */
}
.btn {
font-weight: bold;
color: mediumvioletred;
text-align: center;
line-height: 18px;
}
.selected {
font-weight: bold;
color: white;
text-align: center;
line-height: 18px;
}
.link_button_size {
color: mediumvioletred;
font-weight: bold;
padding-left: 15px;
font-size: 14px;
}
.symbol {
display: inline-block;
vertical-align: super;
/*
height: 20px;
width: 20px;
border-radius: 50%;
border: 1px solid black;
border: black;
*/
}
.back {
background-color: mediumvioletred;
}
.back_selected {
background-color: ghostwhite;
}
.ecm-Info {
padding-left: 8px;
vertical-align: super;
}
.ecm-payments {
font-size: 13px;
color: #787878;
padding: 32px 0px 36px 5px;
}
.ecm-share {
float: right;
cursor: pointer;
font-weight: bold;
font-size: 14px;
padding-right: 25px;
padding-top: 25px;
}
.share {
vertical-align: super;
color: dimgray;
}
.arrow {
vertical-align: middle;
margin-left: -2px;
font-size: 21px;
}
/* new */
.ecm-other-title {
font-size: 16px;
padding-bottom: 6px;
display: block;
font-weight: bold;
}
.ecm-other-detail {
font-weight: 100;
font-size: 15px;
color: black;
text-align: justify;
}
.short-detail {
padding-bottom: 15px;
}
.ecm-card {
/* margin-top: 20px; */
/* max-width: 75rem; */
/* margin-left: auto; */
/* margin-right: auto; */
padding-top: 20px;
}
.ecm-itemDeatils {
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;
}
.image {
border-right: 1px solid #f3f3f3;
}
.head {
padding-left: 25px;
/*border-left: 1px solid #f3f3f3;*/
}
.link_changebutton {
color: mediumvioletred;
font-weight: bold;
position: absolute;
}
/* new*/
@media screen and (min-width: 20rem) {
.Available {
font-size: calc(0.8rem + 1.2 * (( 100vw - 20rem)/30));
}
}
@media screen and (min-width: 50rem) {
.Available {
font-size: 2rem;
}
}
.ecm-returnsPolicy {
padding-top: 30px;
}
.ecm-termsCondition {
padding-top: 30px;
}
.attraction {
font-size: 16px;
padding-bottom: 6px;
display: block;
font-weight: bold;
}
.extra-details {
}
.data-title {
padding: 5px 0px 5px 0px;
color: #787878;
font-weight: 700;
}
.data-title-detail {
color: black;
padding: 5px;
font-weight: inherit;
padding: 15px;
}
.product-detail-card {
margin-top: 5px;
padding: 0;
}
.ecm-product-details {
padding-right: 10px;
}
.ecm-recent-view {
padding-left: 10px;
}
@media screen and (max-width: 640px) {
.ecm-recent-view {
display: none;
}
.ecm-product-details {
width: 100%;
}
}
hr {
margin-top: 8px;
}
.attribute-button{
color: black;
background-color: #efecec;
width: 36px;
height: 36px;
min-width: 36px;
padding: 0;
margin: 0;
line-height: 36px;
border-radius: 100%;
box-shadow: none;
font-size: 15px;
}
.attribute-button .mat-button-ripple {
border-radius: 100% !important;
}
.highlight {
color: white;
background-color: mediumvioletred;
cursor: auto;
font-weight: bold;
}
.highlight:HOVER {
color: white !important;
}
.selected {
box-shadow: 0 0 1px 1px mediumvioletred;
cursor: auto;
}
.color-title {
color: #787878;
font-size: 14px;
position: relative;
display: inline-block;
height: 60px;
line-height: 60px;
float: left;
margin: 0;
padding: 0;
font-weight: 700;
padding-right: 30px;
}
.size-title {
color: #787878;
font-size: 14px;
position: relative;
display: inline-block;
height: 40px;
line-height: 40px;
float: left;
margin: 0;
padding: 0;
font-weight: 700;
padding-right: 30px;
}
.size-variant {
margin-right: 14px;
cursor: pointer;
display: inline-block;
}
.color-variant {
margin-right: 14px;
padding: 0;
height: 60px;
width: 60px;
position: relative;
display: inline-block;
cursor: pointer;
}
.help-icon {
cursor: pointer;
color: black;
}
.delivery-info {
vertical-align: super;
}
.offers-section {
padding-bottom: 14px;
font-size: 14px;
}
.seller-name {
display: inline;
color: mediumvioletred;
font-size: 14px;
font-weight:bold;
padding-left: 2px;
padding-right: 2px;
cursor: pointer;
}
.sold-by-title {
display: inline;
color: #787878;
font-size: 14px;
font-weight: 700;
}
.item-descr {
display: block;
font-size: 18px;
font-weight: 600;
padding-right: 120px;
line-height: 24px;
color: black;
}
.item-shdescr {
display: block;
font-size: 14px;
font-weight: bold;
padding-bottom: 8px;
padding-top: 28px;
}
.subcat-link {
color: mediumvioletred;
}
.item-descount-rate {
font-size: 25px;
font-weight:bold;
line-height: 1;
}
.item-cost-rate {
font-size: 14px;
color: gray;
font-weight: 100;
}
.details-title {
font-size: 14px;
color: #787878;
width: 55px;
display: inline-block;
vertical-align: top;
font-weight: 700;
}
.Available {
font-size: 14px;
color: #444;
padding-left: initial;
}
.available-title {
display:inline;
color: forestgreen;
font-weight:bold;
}
.service-title {
font-size: 14px;
color: #444;
padding-left: initial;
}
.buy-cart-button {
padding-top: 8px;
}
.item-discount {
padding-left: 10px;
color: forestgreen;
font-weight:bold;
font-size: 14px;
}
.reviews-no {
padding-left: 12px;
}
.share-icon {
color: dimgray;
font-size: 20px;
}
.item-descount-rate-section {
padding-top: 14px;
}
.item-detail-1{
font-size: 14px;
display: inline-block;
color: #444;
padding-left: 45px;
line-height: 1.5;
}
.service-detail {
font-size: 14px;
}
.review-msg-title {
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 {
min-height: 400px;
max-height: 600px;
position: relative;
display: block;
/* height: 600px; */
width: 100%;
}
.ecm-ratingStars {
color: rgb(500, 150, 50);
}
.ecm-itemAvgRating {
color: black;
padding-right: 5px;
padding-left: 5px;
line-height: 20px;
}
.ecm-itemNumOfReviews {
padding-left: 5px;
color: black;
border-left: 1px solid #f3f3f3;
line-height: 20px;
}
md-card {
border-radius: 3px !important;
box-shadow: 0 0px 16px -3px rgba(0,0,0,.1) !important;
}
/* Mobile View*/
.mobi-buy-cart-button{
position: fixed !important;
bottom: 0 !important;
height: 65px !important;
background: #fff;
z-index: 2;
width: 100%;
right: 0%;
}
.mobi-buy-cart-button > .Add_to_cart{
background: #fff;
color: mediumvioletred;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
position: relative;
width: calc(50% - 40px);
font-weight: 700;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px;
margin-left: 40px;
margin-right: 18px;
margin-top: -7px;
}
.mobi-buy-cart-button > .Buy_now{
background: mediumvioletred;
color: #fff;
max-width: 190px;
height: 50px;
font-size: 15px;
line-height: 15px;
text-align: center;
position: relative;
width: calc(50% - 40px);
font-weight: bold;
box-shadow: 0 0px 5px 1px rgba(0,0,0,.1);
border-radius: 3px;
margin-top: -7px;
margin-left: -7px;
margin-right: 29px;
}
.wishButton{
float: right;
z-index: 1;
/* padding-top: 18px; */
background: none;
color: mediumvioletred;
top: 15px;
right: 50%;
position: absolute;
box-shadow: none;
}
\ No newline at end of file
ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-variants/ecm-variants.component.html 0 → 100755
View file @ 210b7e96
<div class="date-selection" *ngIf="availableDates.length > 1">
<span class="header-attribs-title" style="vertical-align: bottom;">Select Date</span>
<md-select class="date-select-option" name="date" [(ngModel)]="date_selected">
<md-option *ngFor="let variant of availableDates; let i = index" [value]="i" (click)="loadItem(i,'Date')">
{{ toDate(variant.value) |date : dispDateFormat}}
</md-option>
</md-select>
</div>
<div class="date-selection" *ngIf="availableDates.length == 1">
<span class="header-attribs-title" style="vertical-align: bottom;">Date</span>
<span class="date-select-option" click)="loadItem(0,'Date')">
{{ toDate(availableDates[0]) |date : dispDateFormat}}
</span>
</div>
<div class="time-selection" *ngIf="availableTimings.length > 1">
<span class="header-attribs-title">Time Slot</span>
<div class="time-select-chips">
<span class="time-slot-chip" *ngFor="let variant of availableTimings; let j = index" (click)="loadItem(j,'Time')" [ngClass]="time_selected == j ? 'time-selected' : ''">
{{ toTime(variant.value) |date : dispTimeFormat}}
</span>
</div>
</div>
<div class="time-selection" *ngIf="availableTimings.length == 1">
<span class="header-attribs-title">Timing</span>
<div class="time-select-chips">
<span class="time-slot-chip selected" (click)="loadItem(0,'Time')">
{{ toTime(availableTimings[0]) |date : dispTimeFormat}}
</span>
</div>
</div>
<div *ngIf="availableSizes.length > 0">
<span class="size-title">Select Size </span>
<div *ngFor="let variant of availableSizes; let i = index"
class="size-variant">
<a [ngClass]="size_selected == i ? 'highlight' : ''"
md-button class="attribute-button"
(click)="loadItem(i,'Size')"> {{variant.value}} </a>
</div>
</div>
<div *ngIf="availableColors.length > 0">
<span class="color-title">Select Color </span>
<div *ngFor="let variant of availableColors; let j = index"
class="color-variant"
[ngClass]="color_selected == j ? 'selected' : ''"
(click)="loadItem(j,'Color')">
<ecm-image [isThumbnail]="true" [refId]='variant.itemCode'
[refSer]="'M-ITEM'" [object]="'ITEM'" [isSingleImage]="true"></ecm-image>
</div>
</div>
\ No newline at end of file
ecm/Angular/ProteusECM/trunk/src/app/ecm-view/ecm-variants/ecm-variants.component.ts 0 → 100755
View file @ 210b7e96
import { Component, OnInit, Input, Output, EventEmitter, OnChanges } from '@angular/core';
@Component( {
selector: 'ecm-variants',
templateUrl: './ecm-variants.component.html',
styleUrls: ['./ecm-variants.component.css']
})
export class EcmVariantsComponent implements OnChanges{
@Input( 'itemCode' ) itemCode: string;
@Input( 'itemVariants' ) itemVariants;
@Output() selected = new EventEmitter();
@Input( 'interactive' ) interactive: boolean = true;
currentVariants;
traceData: any;
availableDates: Array<string> = [];
availableTimings: Array<string> = [];
availableSizes: Array<string> = [];
availableColors: Array<string> = [];
date_selected;
time_selected;
size_selected;
color_selected;
timeVar
attractions: Array<string> = [];
activities: Array<string> = [];
transportation: Array<string> = [];
thingsToCarry: Array<string> = [];
advisory: Array<string> = [];
constructor() { }
ngOnChanges() {
console.log( 'OnInit Item Variants and itemcode', this.itemVariants, this.itemCode );
this.fetchAttributes();
}
fetchAttributes() {
this.currentVariants = this.itemVariants.products[this.itemCode];
console.log( 'data in fetch currentVariants', this.currentVariants );
console.log( this.itemVariants.products, this.currentVariants );
this.itemVariants.attributes.forEach( keyAttribute => {
if ( keyAttribute.index >= 0 ) {
if ( keyAttribute.label == 'Date' ) {
this.date_selected = this.currentVariants[this.getVarIndex( 'Date' )];
this.itemVariants.attributeOptions[keyAttribute.index].forEach( variant => {
if ( variant.value ) {
this.availableDates.push( variant );
}
});
}
if ( keyAttribute.label == 'Time' ) {
this.time_selected = this.currentVariants[this.getVarIndex( 'Time' )];
this.itemVariants.attributeOptions[keyAttribute.index].forEach( variant => {
if ( variant.value ) {
this.availableTimings.push( variant );
}
});
}
if ( keyAttribute.label == 'Size' ) {
this.size_selected = this.currentVariants[this.getVarIndex( 'Size' )];
this.itemVariants.attributeOptions[keyAttribute.index].forEach( variant => {
if ( variant.value ) {
this.availableSizes.push( variant );
}
});
}
if ( keyAttribute.label == 'Color' ) {
this.color_selected = this.currentVariants[this.getVarIndex( 'Color' )];
this.itemVariants.attributeOptions[keyAttribute.index].forEach( variant => {
if ( variant.value ) {
this.availableColors.push( variant );
}
});
}
}
});
}
getVarIndex( variant ) {
let selectedVariant = this.itemVariants.attributes.find( keyAttribute => keyAttribute.label === variant );
if ( !selectedVariant )
return -1;
return selectedVariant.index;
}
loadItem( index, variant ) {
let varIndex = this.getVarIndex( variant );
let currentVariants = this.simpleClone( this.currentVariants );
currentVariants[varIndex] = index;
console.log( 'loadItem index:[' + index + ']variant:[' + variant + ']varIndex[' + varIndex + ']', currentVariants );
let itemCode;
let keys = Object.keys( this.itemVariants.products );
//items.find(x => x.itemCode === this.itemCode);
keys.forEach( product => {
let variants = this.itemVariants.products[product];
console.log( 'loadItem variants:[', variants, currentVariants );
if ( this.compare( currentVariants, variants ) ) {
if ( product != this.itemCode ) {
itemCode = product;
console.log( 'compare product:[' + product + ']' );
}
}
});
if ( itemCode ) {
this.selected.emit( itemCode );
}
}
dispDateFormat = 'dd MMM yyyy - EEEE';
dispTimeFormat = 'hh:mm a';
toDate( dateStr ) {
var parts = dateStr.split( "-" );
return new Date( parts[2], parts[1] - 1, parts[0] );
}
toTime( timeStr ) {
var parts = timeStr.split( ":" );
var d = new Date();
this.timeVar = new Date( d.getFullYear(), d.getMonth(), d.getDay(), parts[0], parts[1], 0, 0 );
return new Date( d.getFullYear(), d.getMonth(), d.getDay(), parts[0], parts[1], 0, 0 );
}
compare( array1, array2 ) {
if ( array1.length != array2.length )
return false;
else {
for ( let i = 0; i < array1.length; i++ ) {
if ( array1[i] != array2[i] )
return false;
}
return true;
}
}
simpleClone( obj: any ) {
return Object.assign( [], obj );
}
}
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