83 lines
3.4 KiB
HTML
83 lines
3.4 KiB
HTML
<app-navbar title="Карта гостя" (backEvent)="logout()"></app-navbar>
|
||
|
||
<div class="guest-card">
|
||
<div class="top-info">
|
||
<div class="top-info__level">
|
||
<p id="level">Уровень {{ currentLvl }}</p>
|
||
<p id="level-percent">Кэшбек {{ currentLvlPeriod.percent }}%</p>
|
||
</div>
|
||
<p class="top-info__bonus">{{ getBalanceAmount(customerInfo?.walletBalances) }} бонусов</p>
|
||
</div>
|
||
<div class="guest-card__qr" (click)="qrCodeClick()">
|
||
<ng-container *ngIf="customerInfo">
|
||
<qr-code
|
||
[value]="customerInfo?.phone.substr(2) || 'Данные не найдены'"
|
||
[margin]="0"
|
||
[size]="qrCodeSize"
|
||
errorCorrectionLevel="M"
|
||
></qr-code>
|
||
</ng-container>
|
||
<ng-container *ngIf="!customerInfo">
|
||
<ng-container
|
||
*ngTemplateOutlet="spinner; context: { $implicit: 85 }"
|
||
></ng-container>
|
||
</ng-container>
|
||
</div>
|
||
<div class="guest-card__user-description">
|
||
<p>
|
||
<ng-container *ngIf="currentLvlPeriod.end">
|
||
Осталось купить на сумму <span class="price">{{ currentLvlPeriod.end - (purchaseData.currentAmount || 0) + 1 }}</span>
|
||
рублей, тогда кэшбек будет <span class="percent">{{ getNextLevel().percent }}%</span> с
|
||
{{ purchaseData.currentPeriod[1].locale('ru').format('D MMMM')}}
|
||
</ng-container>
|
||
<ng-container *ngIf="!currentLvlPeriod.end">
|
||
У Вас последний уровень бонусной программы. Процент начисляемых бонусов:
|
||
{{currentLvlPeriod.percent}}%
|
||
</ng-container>
|
||
</p>
|
||
|
||
</div>
|
||
<span id="bonuses-condition"></span>
|
||
|
||
<!-- <div class="guest-card__level-info"> -->
|
||
<!-- <ng-container *ngIf="!purchaseData.$loading"> -->
|
||
<!-- <ng-container *ngIf="currentLvlPeriod.end"> -->
|
||
<!-- <\!-- <input -\-> -->
|
||
<!-- <\!-- type="range" -\-> -->
|
||
<!-- <\!-- [value]="purchaseData.currentAmount" -\-> -->
|
||
<!-- <\!-- [min]="currentLvlPeriod.start" -\-> -->
|
||
<!-- <\!-- [max]="currentLvlPeriod.end" -\-> -->
|
||
<!-- <\!-- [step]="0.01" -\-> -->
|
||
<!-- <\!-- disabled="true" -\-> -->
|
||
<!-- <\!-- [ngStyle]="{ -\-> -->
|
||
<!-- <\!-- 'background-size': ((purchaseData.currentAmount! - currentLvlPeriod.start) / (currentLvlPeriod.end - currentLvlPeriod.start + 1)) * 100 + '% 100%' -\-> -->
|
||
<!-- <\!-- }" -\-> -->
|
||
<!-- <\!-- /> -\-> -->
|
||
<!-- </ng-container> -->
|
||
<!-- <ng-container *ngIf="!currentLvlPeriod.end"> -->
|
||
<!-- <h2> -->
|
||
<!-- У Вас последний уровень бонусной программы. Процент начисляемых бонусов: {{currentLvlPeriod.percent}}% -->
|
||
<!-- </h2> -->
|
||
<!-- </ng-container> -->
|
||
<!-- </ng-container> -->
|
||
<!-- <ng-container *ngIf="purchaseData.$loading"> -->
|
||
<!-- <ng-container -->
|
||
<!-- *ngTemplateOutlet="spinner; context: { $implicit: 48 }" -->
|
||
<!-- ></ng-container> -->
|
||
<!-- </ng-container> -->
|
||
|
||
<!-- </div> -->
|
||
<app-last-order
|
||
[lastOrder]="lastPurchase"
|
||
[loading]="purchaseData.$loading"
|
||
></app-last-order>
|
||
<a class="guest-card__loyalty-program" routerLink="loyality-program"
|
||
>Подробнее о правилах <br />
|
||
Программы лояльности</a
|
||
>
|
||
</div>
|
||
|
||
<ng-template #spinner let-diameter>
|
||
<mat-spinner [strokeWidth]="3" [diameter]="diameter"></mat-spinner>
|
||
</ng-template>
|