Просмотр исходного кода

fix: hide payment UI when login needed, use AfterViewInit for login modal

gangvy 5 месяцев назад
Родитель
Сommit
5e735992bd
2 измененных файлов с 14 добавлено и 6 удалено
  1. 1 1
      src/app/app.html
  2. 13 5
      src/app/app.ts

+ 1 - 1
src/app/app.html

@@ -43,7 +43,7 @@
   <div class="error-bar" *ngIf="errorMsg">{{errorMsg}}</div>
 
   <!-- Tier Selection -->
-  <ng-container *ngIf="!showSuccess">
+  <ng-container *ngIf="!showSuccess && !needLogin">
     <div class="section-title">选择套餐</div>
     <div class="tier-grid" *ngIf="!apig || !apig.priceStep">
       <div class="tier-card neu-raised skeleton" style="height:100px;"></div>

+ 13 - 5
src/app/app.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
+import { Component, OnInit, AfterViewInit, ViewChild, ElementRef } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { LoginModalComponent } from './login-modal.component';
 
@@ -45,7 +45,7 @@ interface OrderData {
   templateUrl: './app.html',
   styleUrl: './app.scss'
 })
-export class App implements OnInit {
+export class App implements OnInit, AfterViewInit {
   @ViewChild('qrCanvas', { static: false }) qrCanvasRef!: ElementRef<HTMLCanvasElement>;
   @ViewChild('loginModal') loginModalRef!: LoginModalComponent;
 
@@ -102,13 +102,21 @@ export class App implements OnInit {
     if (this.authId || (this.userId && this.apigId)) {
       // URL 已提供足够参数,直接加载
       this.loadApig();
-    } else if (this.apigId && !this.userId) {
+    }
+    // 其他情况在 ngAfterViewInit 中处理(等 ViewChild 就绪)
+  }
+
+  ngAfterViewInit(): void {
+    // 如果已经开始加载,不需要登录
+    if (this.authId || (this.userId && this.apigId)) return;
+
+    if (this.apigId && !this.userId) {
       // 有 apigId 但没有 user → 尝试自动登录或显示登录弹窗
       this.tryAutoLoginOrShowModal();
     } else {
-      // 什么参数都没有 → 显示登录弹窗
+      // 什么参数都没有(或只有 user 没有 apigId)→ 显示登录弹窗
       this.needLogin = true;
-      setTimeout(() => this.loginModalRef?.show(), 100);
+      this.loginModalRef?.show();
     }
   }