changes

Co-authored-by: Copilot <copilot@github.com>
removed default
2026-05-05 11:31:51 +04:00 · 2026-05-05 11:23:07 +04:00
6 changed files with 112 additions and 42 deletions
--- a/src/app/fastcheck.service.ts
+++ b/src/app/fastcheck.service.ts
@@ -2,7 +2,7 @@

 export interface FastcheckData {
  fastcheck: string;
-  amount: number;
+  amount: number | null;
  code: string;
  expiration?: string;
 }
--- a/src/app/pages/create-page/create-page.html
+++ b/src/app/pages/create-page/create-page.html
@@ -122,17 +122,25 @@
        }
      </button>

-      <!-- QR section: shown after QR is created -->
-      @if (qrImageUrl()) {
-        <div class="qr-section">
-          <p class="qr-section__label">{{ 'create.qr_label' | translate }}</p>
-          <img class="qr-section__img" [src]="qrImageUrl()!" width="240" height="240" alt="QR" />
-          @if (qrPolling()) {
-            <p class="qr-section__hint">{{ 'create.qr_waiting' | translate }}</p>
-          }
-        </div>
+<!-- QR popup overlay -->
+@if (qrImageUrl()) {
+  <div class="qr-overlay" (click)="closeQr()">
+    <div class="qr-modal" (click)="$event.stopPropagation()">
+      <button class="qr-modal__close" type="button" (click)="closeQr()" aria-label="Close">
+        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+             stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+          <path d="M18 6L6 18M6 6l12 12"/>
+        </svg>
+      </button>
+      <p class="qr-modal__label">{{ 'create.qr_label' | translate }}</p>
+      <img class="qr-modal__img" [src]="qrImageUrl()!" width="260" height="260" alt="QR" />
+      @if (qrPolling()) {
+        <p class="qr-modal__hint">{{ 'create.qr_waiting' | translate }}</p>
      }
    </div>
+  </div>
+}
+    </div>

    <div class="card__footer">
      <span class="secure-badge">
--- a/src/app/pages/create-page/create-page.scss
+++ b/src/app/pages/create-page/create-page.scss
@@ -175,12 +175,49 @@
 }

 // ─── QR section ─────────────────────────────────────────────────────────────
-.qr-section {
+// ─── QR popup ───────────────────────────────────────────────────────────────
+.qr-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.55);
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  animation: overlay-in 0.2s ease;
+}
+
+.qr-modal {
+  position: relative;
+  background: #fff;
+  border-radius: 20px;
+  padding: 32px 28px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
-  gap: 10px;
-  padding: 16px 0 8px;
+  gap: 14px;
+  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
+  animation: modal-in 0.22s cubic-bezier(.34,1.56,.64,1);
+  max-width: 340px;
+  width: 90vw;
+
+  &__close {
+    position: absolute;
+    top: 12px;
+    right: 12px;
+    width: 36px;
+    height: 36px;
+    border-radius: 50%;
+    border: none;
+    background: #f1f5f9;
+    color: #475569;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: background 0.15s;
+    &:hover { background: #e2e8f0; }
+  }

  &__label {
    font-size: 13px;
@@ -202,6 +239,16 @@
  }
 }

+@keyframes overlay-in {
+  from { opacity: 0; }
+  to   { opacity: 1; }
+}
+
+@keyframes modal-in {
+  from { opacity: 0; transform: scale(0.85); }
+  to   { opacity: 1; transform: scale(1); }
+}
+
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.45; }
--- a/src/app/pages/create-page/create-page.ts
+++ b/src/app/pages/create-page/create-page.ts
@@ -66,7 +66,7 @@ export class CreatePage {
  minAmount = signal<number>(30);
  maxAmount = signal<number>(200_000);

-  amount = signal<number>(100);
+  amount = signal<number | null>(null);
  note = signal<string>('');
  error = signal<string>('');
  loading = signal<boolean>(false);
@@ -122,11 +122,11 @@ export class CreatePage {

  createCheck(): void {
    const val = this.amount();
-    if (!val || val < this.minAmount()) {
+    if (val !== null && val < this.minAmount()) {
      this.error.set(`${this.t('errors.invalid_amount')} (мин. ${this.minAmount()} ₽)`);
      return;
    }
-    if (val > this.maxAmount()) {
+    if (val !== null && val > this.maxAmount()) {
      this.error.set(`${this.t('errors.invalid_amount')} (макс. ${this.maxAmount().toLocaleString('ru')} ₽)`);
      return;
    }
@@ -145,7 +145,7 @@ export class CreatePage {
        `${QR_VITANOVA_API}/qr`,
        {
          qrtype: 'QRDynamic',
-          amount: val,
+          ...(val !== null ? { amount: val } : {}),
          currency: this.currency(),
          partnerqrID,
          qrDescription: this.note().trim(),
@@ -225,7 +225,7 @@ export class CreatePage {
            this.store.setCreated({
              fastcheck: res.fastcheck,
              code: res.code,
-              amount: this.amount(),
+              amount: this.amount() ?? null,
              expiration: res.expiration
            });
          }
@@ -235,12 +235,21 @@ export class CreatePage {
      });
  }

-  onAmountChange(value: number): void {
-    this.amount.set(value);
-    if (value > 0) this.error.set('');
+  onAmountChange(value: number | null): void {
+    this.amount.set(value || null);
+    if (value && value > 0) this.error.set('');
  }

  onNoteChange(value: string): void {
    this.note.set(value);
  }
+
+  closeQr(): void {
+    this.qrImageUrl.set(null);
+    this.qrPolling.set(false);
+    if (this.pollHandle !== null) {
+      clearInterval(this.pollHandle);
+      this.pollHandle = null;
+    }
+  }
 }
--- a/src/app/pages/fastcheck-page/fastcheck-page.html
+++ b/src/app/pages/fastcheck-page/fastcheck-page.html
@@ -55,27 +55,27 @@
        }
      </div>

-      <!-- Share row — shown once amount is known -->
-      @if (fastcheckAmount() !== null && !amountLoading()) {
-        <div class="share-row">
-          <button type="button" class="share-btn share-btn--email" (click)="shareByEmail()"
-                  [title]="'fastcheck.share_email' | translate">
-            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-                 stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-              <rect x="2" y="4" width="20" height="16" rx="2"/>
-              <path d="M2 7l10 7 10-7"/>
-            </svg>
-            {{ 'fastcheck.share_email' | translate }}
-          </button>
-          <button type="button" class="share-btn share-btn--tg" (click)="shareByTelegram()"
-                  [title]="'fastcheck.share_tg' | translate">
-            <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
-              <path d="M9.04 15.65l-.36 4.06c.51 0 .73-.22.99-.48l2.38-2.27 4.93 3.6c.9.5 1.55.24 1.79-.83l3.24-15.18h.01c.29-1.34-.48-1.86-1.36-1.54L1.13 9.66c-1.32.5-1.3 1.23-.22 1.56l4.92 1.53L17.27 5.6c.54-.34 1.03-.15.62.19"/>
-            </svg>
-            {{ 'fastcheck.share_tg' | translate }}
-          </button>
-        </div>
-      }
+      <!-- Share row — always visible, enabled once amount is known -->
+      <div class="share-row">
+        <button type="button" class="share-btn share-btn--email" (click)="shareByEmail()"
+                [disabled]="fastcheckAmount() === null || amountLoading()"
+                [title]="'fastcheck.share_email' | translate">
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+               stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+            <rect x="2" y="4" width="20" height="16" rx="2"/>
+            <path d="M2 7l10 7 10-7"/>
+          </svg>
+          {{ 'fastcheck.share_email' | translate }}
+        </button>
+        <button type="button" class="share-btn share-btn--tg" (click)="shareByTelegram()"
+                [disabled]="fastcheckAmount() === null || amountLoading()"
+                [title]="'fastcheck.share_tg' | translate">
+          <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
+            <path d="M9.04 15.65l-.36 4.06c.51 0 .73-.22.99-.48l2.38-2.27 4.93 3.6c.9.5 1.55.24 1.79-.83l3.24-15.18h.01c.29-1.34-.48-1.86-1.36-1.54L1.13 9.66c-1.32.5-1.3 1.23-.22 1.56l4.92 1.53L17.27 5.6c.54-.34 1.03-.15.62.19"/>
+          </svg>
+          {{ 'fastcheck.share_tg' | translate }}
+        </button>
+      </div>

      <!-- Code -->
      <div class="field">
--- a/src/app/pages/fastcheck-page/fastcheck-page.scss
+++ b/src/app/pages/fastcheck-page/fastcheck-page.scss
@@ -40,6 +40,12 @@
    border-color: #bfdbfe;
    &:hover { background: #dbeafe; border-color: #93c5fd; }
  }
+
+  &:disabled {
+    opacity: .4;
+    cursor: not-allowed;
+    pointer-events: none;
+  }
 }

 .btn {
Author	SHA1	Message	Date
sdarbinyan	b4ad6da49e	changes Co-authored-by: Copilot <copilot@github.com>	2026-05-05 11:31:51 +04:00
sdarbinyan	679e404dc8	removed default Co-authored-by: Copilot <copilot@github.com>	2026-05-05 11:23:07 +04:00