bikeApp/src/app/tab1/tab1.page.ts

import { Component } from '@angular/core';
import { Router } from '@angular/router'; // 导入 Router 如果你需要导航

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page {

  selectedSegment: string = '竞赛模式';

  competitionModes = [
    {
      title: '场地自行车赛',
      description: '在室内赛车场进行，赛车场为椭圆盆形。',
      image: 'assets/images/j01.png',
    },
    {
      title: '公路自行车赛',
      description: '在有各种地形变化的公路上举行。',
      image: 'assets/images/j02.png',
    },
    {
      title: '山地自行车赛',
      description: '使用自行车进行越野赛，比赛场地崎岖不平。',
      image: 'assets/images/j03.png',
    },
    {
      title: '自行车马拉松',
      description: '对运动员耐力和毅力要求极高。',
      image: 'assets/images/j04.png',
    },
  ];

  exerciseModes = [
    {
      title: '耐力训练',
      description: '提高你的耐力，挑战更长的距离。',
      image: 'assets/images/s01.png',
    },
    {
      title: '速度训练',
      description: '专注于提高你的驾驶速度。',
      image: 'assets/images/s02.png',
    },
    {
      title: '技术训练',
      description: '专注于提高骑行技术，包括转弯、刹车和加速等。',
      image: 'assets/images/s03.png',
    },
    {
      title: '个性化训练',
      description: '根据用户的个人目标和能力定制训练计划。',
      image: 'assets/images/s04.png',
    },
  ];

  travelModes = [
    {
      title: '风景游',
      description: '欣赏沿途的美丽风景。',
      image: 'assets/images/l01.png',
    },
    {
      title: '城市游',
      description: '探索城市的每一个角落。',
      image: 'assets/images/l02.png',
    },
    {
      title: '定制游',
      description: '由官方制作的旅游路线。',
      image: 'assets/images/l03.png',
    },
    {
      title: '探险游',
      description: '探索野外的每一个角落。',
      image: 'assets/images/l04.png',
    },
  ];

  freeModes = [
    {
      title: '自由驾驶',
      description: '在开放的道路上自由驾驶。',
      image: 'assets/images/z01.png',
    },
    {
      title: '冒险模式',
      description: '挑战未知的道路与环境。',
      image: 'assets/images/z02.png',
    },
    {
      title: '团体骑行模式',
      description: '用户可以与朋友或其他玩家一起骑行，进行团体活动。',
      image: 'assets/images/z03.png',
    },
    {
      title: '教育模式',
      description: '结合骑行与教育，用户在骑行过程中学习相关知识，如环境保护、交通安全等。',
      image: 'assets/images/z04.png',
    },
  ];

  constructor(private router: Router) {} // 如果需要导航，可以注入 Router

  goToModePage(modeTitle: string) {
    const route = this.getModeRoute(modeTitle);
    if (route) {
      this.router.navigate([route]);
    }
  }

  getModeRoute(modeTitle: string): string {
    switch (modeTitle) {
      case '场地自行车赛':
        return 'venue-cycling';
      case '公路自行车赛':
        return 'road-cycling';
      case '山地自行车赛':
        return 'mountain-cycling';
      case '自行车马拉松':
        return 'cycling-marathon';
      default:
        return '';
    }
  }

  segmentChanged(event: any) {
    this.selectedSegment = event.detail.value;
  }

  viewRideRecords() {
    console.log('骑行记录按钮被点击');
    // 这里可以添加实际的逻辑，例如导航到骑行记录页面
    this.router.navigate(['/ride-records']); // 如果需要导航到骑行记录页面
  }
    
  //导航到教练页面的方法
  goToCoachDashboard() {
    this.router.navigate(['/coach-dashboard']);
  }
}