h-usersite/angular/src/app/presentation-options/default-option/pages/guest-card/guest-card.component.html

86 lines
3.2 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<app-navbar title="Карта гостя" [backEvent]="showBack ? logout : undefined"></app-navbar>
<ng-container *ngIf="!authService.loading && authService.userInfo">
<div class="guest-card">
<div class="top-info">
<div class="top-info__level">
<p id="level">Уровень {{ authService.error ? '--' : authService.userInfo.current_level_and_cashback?.current_level }}</p>
<p id="level-percent">Кэшбек {{ authService.error ? '--' : authService.currentLvlPeriod.percent }}%</p>
</div>
<ng-container *ngIf="!authService.error && authService.userInfo.walletBalances < 0">
<p class="top-info__bonus">
Отрицательный баланс бонусов, свяжитесь с техподдержкой
</p>
</ng-container>
<ng-container *ngIf="authService.error || authService.userInfo.walletBalances >= 0">
<p class="top-info__bonus">
{{ authService.error ? '--' : Math.floor(authService.userInfo.walletBalances) }}
бонусов
</p>
</ng-container>
</div>
<div class="guest-card__qr" (click)="qrCodeClick()">
<qr-code
[value]="phone || 'Данные не найдены'"
[margin]="0"
[size]="qrCodeSize"
errorCorrectionLevel="H"
></qr-code>
</div>
<div class="guest-card__user-description">
<p>
Осталось купить на сумму
<span class="price">{{
authService.error ? '--' : authService.userInfo.next_level.sum_for_next_level
}}</span>
рублей, тогда кэшбек будет
<span class="percent">{{ authService.error ? '--' : authService.userInfo.next_level.cashback}}%</span>
с
{{
authService.currentPeriod[1]
.locale("ru")
.format("D MMMM")
}}
</p>
</div>
<ng-container *ngIf="!authService.error">
<span id="bonuses-condition"></span>
<app-last-order
[lastOrder]="authService.userInfo?.last_purchase"
[loading]="authService.loading"
></app-last-order>
<a class="guest-card__loyalty-program" routerLink="loyality-program">
Подробнее о правилах
<br />
Программы лояльности
</a>
</ng-container>
<ng-container *ngIf="authService.error">
<img src="./assets/broken.jpg" alt="" />
<p>
Упс, что-то пошло не так..
Мы уже работаем над этой проблемой.
Попробуйте обновить страницу или зайти попозже.
Приносим извинения за неудобства.
</p>
</ng-container>
</div>
<app-footer></app-footer>
</ng-container>
<ng-container *ngIf="!authService.loading && !authService.userInfo">
<div class="not-found">
<p>Данные недоступны, попробуйте позже</p>
</div>
</ng-container>
<ng-container *ngIf="authService.loading">
<ng-container
*ngTemplateOutlet="spinner; context: { $implicit: 85 }"
></ng-container>
</ng-container>
<ng-template #spinner let-diameter>
<div class="center wrapper">
<mat-spinner [strokeWidth]="3" [diameter]="diameter"></mat-spinner>
</div>
</ng-template>