129 lines
5.0 KiB
HTML
129 lines
5.0 KiB
HTML
<div class="page">
|
|
<div class="card">
|
|
|
|
<div class="card__header">
|
|
<a class="back" routerLink="/" aria-label="Назад">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M15 18l-6-6 6-6" />
|
|
</svg>
|
|
</a>
|
|
<h1 class="card__title">Новый Фастчек</h1>
|
|
<p class="card__subtitle">Укажите сумму для пополнения</p>
|
|
</div>
|
|
|
|
<div class="card__body">
|
|
|
|
<!-- Payment methods -->
|
|
<div class="field">
|
|
<span class="field__label">Способ оплаты</span>
|
|
<div class="methods">
|
|
<button type="button" class="method" [class.method--active]="payment() === 'sbp'"
|
|
(click)="selectPayment('sbp', true)" aria-label="СБП">
|
|
<img class="method__logo"
|
|
src="https://sbp.nspk.ru/storage/settings/common/logo/0645d335-8b62-43a1-9a33-0d4c9d1dc0e0.svg"
|
|
alt="СБП" />
|
|
</button>
|
|
<button type="button" class="method method--disabled" disabled aria-label="WeChat Pay">
|
|
<img class="method__logo" src="/wechat-pay.svg" alt="WeChat Pay" />
|
|
</button>
|
|
<button type="button" class="method method--disabled" disabled aria-label="Visa">
|
|
<img class="method__logo" src="/visa.svg" alt="Visa" />
|
|
</button>
|
|
<button type="button" class="method method--disabled" disabled aria-label="MasterCard">
|
|
<img class="method__logo" src="/mastercard.svg" alt="Mastercard" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Currencies -->
|
|
<div class="field">
|
|
<span class="field__label">Валюта</span>
|
|
<div class="currencies">
|
|
<button type="button" class="chip" [class.chip--active]="currency() === 'RUB'"
|
|
(click)="selectCurrency('RUB', true)">
|
|
<!-- <span class="chip__flag">🇷🇺</span> -->
|
|
<span class="chip__sign">₽</span>
|
|
<span class="chip__code">RUB</span>
|
|
</button>
|
|
<button type="button" class="chip chip--disabled" disabled>
|
|
<!-- <span class="chip__flag">🇨🇳</span> -->
|
|
<span class="chip__sign">¥</span>
|
|
<span class="chip__code">CNY</span>
|
|
</button>
|
|
<button type="button" class="chip chip--disabled" disabled>
|
|
<!-- <span class="chip__flag">🇺🇸</span> -->
|
|
<span class="chip__sign">$</span>
|
|
<span class="chip__code">USD</span>
|
|
</button>
|
|
<button type="button" class="chip chip--disabled" disabled>
|
|
<!-- <span class="chip__flag">🇪🇺</span> -->
|
|
<span class="chip__sign">€</span>
|
|
<span class="chip__code">EUR</span>
|
|
</button>
|
|
<button type="button" class="chip chip--disabled" disabled>
|
|
<!-- <span class="chip__flag">🇦🇲</span> -->
|
|
<span class="chip__sign">֏</span>
|
|
<span class="chip__code">AMD</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="field__label" for="amount">Сумма платежа</label>
|
|
<div class="input-wrap" [class.input-wrap--error]="error()">
|
|
<span class="input-wrap__prefix">₽</span>
|
|
<input
|
|
id="amount"
|
|
type="number"
|
|
class="input-wrap__input"
|
|
[ngModel]="amount()"
|
|
(ngModelChange)="onAmountChange($event)"
|
|
min="1"
|
|
step="1"
|
|
inputmode="numeric"
|
|
placeholder="0"
|
|
autofocus
|
|
/>
|
|
</div>
|
|
@if (error()) {
|
|
<span class="field__error">{{ error() }}</span>
|
|
}
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="field__label" for="note">Примечание</label>
|
|
<textarea
|
|
id="note"
|
|
class="note-input"
|
|
[ngModel]="note()"
|
|
(ngModelChange)="onNoteChange($event)"
|
|
placeholder="Причина платежа..."
|
|
rows="3"
|
|
maxlength="500"
|
|
></textarea>
|
|
</div>
|
|
|
|
<button class="pay-btn" type="button" (click)="createCheck()" [disabled]="loading()">
|
|
<span class="pay-btn__icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M12 5v14M5 12h14" />
|
|
</svg>
|
|
</span>
|
|
{{ loading() ? 'Создание…' : 'Создать Фастчек' }}
|
|
</button>
|
|
</div>
|
|
|
|
<div class="card__footer">
|
|
<span class="secure-badge">
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
|
|
</svg>
|
|
Защищённое соединение
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|