import 'package:battle/route.dart';
import 'package:flutter/material.dart';

import '../data/card.dart';

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with SingleTickerProviderStateMixin {
  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 3, vsync: this);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(
          '逻辑狗AI对抗',
          style: TextStyle(color: Theme.of(context).colorScheme.primary),
        ),
        centerTitle: true,
        backgroundColor: Theme.of(context).colorScheme.surface,
      ),
      body: Column(
        children: [
          SizedBox(
            width: double.infinity,
            height: 64,
            child: TabBar(
              controller: _tabController,
              tabs: const [
                Tab(text: '小班下'),
                Tab(text: '中班下'),
                Tab(text: '大班下'),
              ],
            ),
          ),
          const SizedBox(height: 16),
          Expanded(
            child: TabBarView(
              controller: _tabController,
              children: [
                GridView.count(
                  crossAxisCount: 2,
                  mainAxisSpacing: 8.0,
                  crossAxisSpacing: 8.0,
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  childAspectRatio: 1 / 1.6,
                  children: smallCardList.map(_buildCard).toList(),
                ),
                GridView.count(
                  crossAxisCount: 2,
                  mainAxisSpacing: 8.0,
                  crossAxisSpacing: 8.0,
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  childAspectRatio: 1 / 1.6,
                  children: middleCardList.map(_buildCard).toList(),
                ),
                GridView.count(
                  crossAxisCount: 2,
                  mainAxisSpacing: 8.0,
                  crossAxisSpacing: 8.0,
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  childAspectRatio: 1 / 1.6,
                  children: seniorCardList.map(_buildCard).toList(),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildCard(CardItem card) {
    return GestureDetector(
      onTap: () => GameRouter(
        cardName: card.cardName,
        assetPath: card.assetPath,
        answer: card.answer,
      ).push(context),
      child: Card(
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(4)),
        clipBehavior: Clip.antiAlias,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Image.asset(card.assetPath),
            Expanded(
              child: Align(
                alignment: Alignment.centerLeft,
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 8.0),
                  child: Text(card.cardName),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}