// splash.page.ts
import { Component, AfterViewInit } from '@angular/core';
import { Router } from '@angular/router';
import { SplashService } from '../services/splash.service'; // 确保路径正确
import { trigger, state, style, animate, transition } from '@angular/animations';

@Component({
  selector: 'app-splash',
  templateUrl: './splash.page.html',
  styleUrls: ['./splash.page.scss'],
  animations: [
    trigger('splashAnimation', [
      state('true', style({ opacity: 1 })),
      state('false', style({ opacity: 0 })),
      transition('true => false', [
        animate('500ms ease-out')
      ]),
      transition('false => true', [
        animate('500ms ease-in')
      ])
    ])
  ]
})
export class SplashPage implements AfterViewInit {
  animationState = true;

  constructor(private router: Router, private splashService: SplashService) {}

  ngAfterViewInit() {
    this.startAnimation();
  }

  private startAnimation() {
    setTimeout(() => {
      this.animationState = false;
      // 在动画结束之后通知 Tab1 打开模态框并导航到 tab1
      setTimeout(() => {
        this.splashService.setOpenLoginModal(true);
        this.router.navigate(['/tabs/tab1']);
      }, 500);
    }, 5000); // 3秒后开始淡出
  }
}