refactor(landing): license variables, 3-rd party imports

This commit is contained in:
u.ahmetvaliyev 2019-01-24 16:37:12 +03:00
parent 351de1388e
commit baa60a004c
2 changed files with 21 additions and 19 deletions

View file

@ -29,13 +29,13 @@
</picture> </picture>
<div class="package-switcher"> <div class="package-switcher">
<div [(ngModel)]="licenseType" ngbRadioGroup <div [(ngModel)]="selectedLicenseType" ngbRadioGroup
class="package-switcher__btn-group btn-group btn-group-toggle btn-outline-toggle-group btn-group-full-width btn-toggle-radio-group"> class="package-switcher__btn-group btn-group btn-group-toggle btn-outline-toggle-group btn-group-full-width btn-toggle-radio-group">
<label ngbButtonLabel class="package-switcher__btn btn btn-outline-secondary"> <label ngbButtonLabel class="package-switcher__btn btn btn-outline-secondary">
<input ngbButton type="radio" value="Personal"> Personal <input ngbButton type="radio" [value]="personalLicense"> {{ personalLicense }}
</label> </label>
<label ngbButtonLabel class="package-switcher__btn btn btn-outline-secondary"> <label ngbButtonLabel class="package-switcher__btn btn btn-outline-secondary">
<input ngbButton type="radio" value="Commercial"> Commercial <input ngbButton type="radio" [value]="commercialLicense"> {{ commercialLicense }}
</label> </label>
</div> </div>
</div> </div>
@ -51,8 +51,8 @@
</div> </div>
<div class="package-card__image package-card__image--dot-net"></div> <div class="package-card__image package-card__image--dot-net"></div>
<div class="package-card__price-wrapper"> <div class="package-card__price-wrapper">
<span class="package-card__price package-card__price--old">${{ licenseType === 'Commercial' ? '2000' : '200' }}</span> <span class="package-card__price package-card__price--old">${{ isCommercial() ? '2000' : '200' }}</span>
<span class="package-card__price">${{ licenseType === 'Commercial' ? '1500' : '150' }}</span> <span class="package-card__price">${{ isCommercial() ? '1500' : '150' }}</span>
</div> </div>
<h4 class="package-card__title">{{ firstBundleName }}</h4> <h4 class="package-card__title">{{ firstBundleName }}</h4>
<p class="package-card__description"> <p class="package-card__description">
@ -71,7 +71,7 @@
<nb-card-back class="package-card package-card--back"> <nb-card-back class="package-card package-card--back">
<nb-card> <nb-card>
<nb-card-body> <nb-card-body>
<h4 class="package-card__type">{{ licenseType === 'Commercial' ? 'Commercial' : 'Personal' }}</h4> <h4 class="package-card__type">{{ selectedLicenseType }}</h4>
<ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container> <ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container>
<a [href]="firstBundleMail" <a [href]="firstBundleMail"
target="_blank" target="_blank"
@ -95,8 +95,8 @@
</div> </div>
<div class="package-card__image package-card__image--dot-net"></div> <div class="package-card__image package-card__image--dot-net"></div>
<div class="package-card__price-wrapper"> <div class="package-card__price-wrapper">
<span class="package-card__price package-card__price--old">${{ licenseType === 'Commercial' ? '2000' : '200' }}</span> <span class="package-card__price package-card__price--old">${{ isCommercial() ? '2000' : '200' }}</span>
<span class="package-card__price">${{ licenseType === 'Commercial' ? '1500' : '150' }}</span> <span class="package-card__price">${{ isCommercial() ? '1500' : '150' }}</span>
</div> </div>
<h4 class="package-card__title">{{ secondBundleName }}</h4> <h4 class="package-card__title">{{ secondBundleName }}</h4>
<p class="package-card__description"> <p class="package-card__description">
@ -115,7 +115,7 @@
<nb-card-back class="package-card package-card--back"> <nb-card-back class="package-card package-card--back">
<nb-card> <nb-card>
<nb-card-body> <nb-card-body>
<h4 class="package-card__type">{{ licenseType === 'Commercial' ? 'Commercial' : 'Personal' }}</h4> <h4 class="package-card__type">{{ selectedLicenseType }}</h4>
<ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container> <ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container>
<a [href]="secondBundleMail" <a [href]="secondBundleMail"
target="_blank" target="_blank"
@ -139,8 +139,8 @@
</div> </div>
<div class="package-card__image package-card__image--dot-net-core"></div> <div class="package-card__image package-card__image--dot-net-core"></div>
<div class="package-card__price-wrapper"> <div class="package-card__price-wrapper">
<span class="package-card__price package-card__price--old">${{ licenseType === 'Commercial' ? '1800' : '180' }}</span> <span class="package-card__price package-card__price--old">${{ isCommercial() ? '1800' : '180' }}</span>
<span class="package-card__price">${{ licenseType === 'Commercial' ? '1400' : '140' }}</span> <span class="package-card__price">${{ isCommercial() ? '1400' : '140' }}</span>
</div> </div>
<h4 class="package-card__title">{{ thirdBundleName }}</h4> <h4 class="package-card__title">{{ thirdBundleName }}</h4>
<p class="package-card__description"> <p class="package-card__description">
@ -159,7 +159,7 @@
<nb-card-back class="package-card package-card--back"> <nb-card-back class="package-card package-card--back">
<nb-card> <nb-card>
<nb-card-body> <nb-card-body>
<h4 class="package-card__type">{{ licenseType === 'Commercial' ? 'Commercial' : 'Personal' }}</h4> <h4 class="package-card__type">{{ selectedLicenseType }}</h4>
<ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container> <ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container>
<a [href]="thirdBundleMail" <a [href]="thirdBundleMail"
target="_blank" target="_blank"
@ -183,8 +183,8 @@
</div> </div>
<div class="package-card__image package-card__image--dot-net-core"></div> <div class="package-card__image package-card__image--dot-net-core"></div>
<div class="package-card__price-wrapper"> <div class="package-card__price-wrapper">
<span class="package-card__price package-card__price--old">${{ licenseType === 'Commercial' ? '1800' : '180' }}</span> <span class="package-card__price package-card__price--old">${{ isCommercial() ? '1800' : '180' }}</span>
<span class="package-card__price">${{ licenseType === 'Commercial' ? '1400' : '140' }}</span> <span class="package-card__price">${{ isCommercial() ? '1400' : '140' }}</span>
</div> </div>
<h4 class="package-card__title">{{ fourthBundleName }}</h4> <h4 class="package-card__title">{{ fourthBundleName }}</h4>
<p class="package-card__description"> <p class="package-card__description">
@ -203,7 +203,7 @@
<nb-card-back class="package-card package-card--back"> <nb-card-back class="package-card package-card--back">
<nb-card> <nb-card>
<nb-card-body> <nb-card-body>
<h4 class="package-card__type">{{ licenseType === 'Commercial' ? 'Commercial' : 'Personal' }}</h4> <h4 class="package-card__type">{{ selectedLicenseType }}</h4>
<ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container> <ng-container *ngTemplateOutlet="bundleFeaturesList"></ng-container>
<a [href]="fourthBundleMail" <a [href]="fourthBundleMail"
target="_blank" target="_blank"

View file

@ -14,7 +14,9 @@ import { Component} from '@angular/core';
export class BackendBundlesSectionComponent { export class BackendBundlesSectionComponent {
licenseType = 'Personal'; selectedLicenseType = 'Personal';
personalLicense = 'Personal';
commercialLicense = 'Commercial';
firstBundleName = '.NET + ngx-admin E-commerce'; firstBundleName = '.NET + ngx-admin E-commerce';
secondBundleName = '.NET + ngx-admin IoT'; secondBundleName = '.NET + ngx-admin IoT';
@ -50,14 +52,14 @@ export class BackendBundlesSectionComponent {
} }
isCommercial() { isCommercial() {
return this.licenseType === 'Commercial'; return this.selectedLicenseType === 'Commercial';
} }
private getMailToText(bundleName: string) { private getMailToText(bundleName: string) {
return 'mailto:support@akveo.com' + return 'mailto:support@akveo.com' +
`?subject=${this.licenseType} ${bundleName} Bundle` + `?subject=${this.selectedLicenseType} ${bundleName} Bundle` +
'&body=Dear Akveo, %0D%0A%0D%0A' + '&body=Dear Akveo, %0D%0A%0D%0A' +
`I would like to purchase ${this.licenseType} ${bundleName} Bundle. ` + `I would like to purchase ${this.selectedLicenseType} ${bundleName} Bundle. ` +
'Please give me details how I can proceed with that. %0D%0A%0D%0A' + 'Please give me details how I can proceed with that. %0D%0A%0D%0A' +
'Thanks and regards'; 'Thanks and regards';
} }