import 'dart:async';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';

import '../../beans/game_history_bean.dart';
import '../../common/func.dart';
import '../game/game_info_page.dart';
import 'me_model.dart';

///游玩历史
class GameHistoryPage extends StatefulWidget {
  const GameHistoryPage({super.key});

  @override
  State<GameHistoryPage> createState() => _GameHistoryPageState();
}

class _GameHistoryPageState extends State<GameHistoryPage> {
  late StreamSubscription subscription;
  final MeModel _viewModel = MeModel();

  List<GameHistoryBean> dataList = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    subscription = _viewModel.streamController.stream.listen((event) {
      String code = event['code'];
      if (code.isNotEmpty) {
        switch (code) {
          case "getGameHistory":
            dataList = event['data'];
            break;
        }
        EasyLoading.dismiss();
        setState(() {});
      }
    });
    FunctionUtil.loading();
    _viewModel.getGameHistory();
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    subscription.cancel();
  }

  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;

    final h50 = size.width / 7.2;
    final s16 = size.width / 22.5;
    final l14 = size.width / 25.71428571428571;
    final w19 = size.width / 18.94736842105263;
    final h26 = size.width / 13.84615384615385;
    final w152 = size.width / 2.3684210526315;
    final h76 = size.width / 4.7368421052631;
    final t30 = size.width / 12;
    final s13 = size.width / 27.692307692307;
    final t130 = size.width / 2.7692307692307;

    return Scaffold(
      backgroundColor: const Color(0xFF17181A),
      body: Column(
        children: [
          Container(
            width: size.width,
            height: h50,
            margin: EdgeInsets.only(top: MediaQuery.of(context).padding.top),
            child: Stack(
              alignment: Alignment.center,
              children: [
                Text(
                  "游玩历史",
                  style: TextStyle(fontSize: s16, color: Color(0xFFD6D6D7)),
                ),
                Positioned(
                  left: l14,
                  child: GestureDetector(
                    onTap: () {
                      Navigator.pop(context);
                    },
                    child: Image(
                      width: w19,
                      height: h26,
                      image: AssetImage('assets/images/btn_fanhui.png'),
                    ),
                  ),
                )
              ],
            ),
          ),
          Expanded(
            child: dataList.isNotEmpty
                ? Container(
                    margin: EdgeInsets.only(left: l14, right: l14),
                    child: ListView.builder(
                        padding: EdgeInsets.zero,
                        itemCount: dataList.length,
                        itemBuilder: (context, index) {
                          return _item(dataList[index], context);
                        }),
                  )
                : Container(
                    margin: EdgeInsets.only(top: t130),
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        Image(width: w152, height: h76, image: const AssetImage('assets/images/ic_no_data.png')),
                        Container(
                          margin: EdgeInsets.only(top: t30),
                          child: Text(
                            "暂无数据",
                            style: TextStyle(fontSize: s13, color: const Color(0xFF868686)),
                          ),
                        )
                      ],
                    ),
                  ),
          ),
        ],
      ),
    );
  }

  _item(GameHistoryBean data, context) {
    final size = MediaQuery.of(context).size;
    final h99 = size.width / 3.636363636363636;
    final t18 = size.width / 20;
    final l16 = size.width / 22.5;
    final w50 = size.width / 7.2;
    final t80 = size.width / 4.5;
    final s14 = size.width / 25.714285714285;
    final l10 = size.width / 36;
    final s9 = size.width / 40;

    return GestureDetector(
      onTap: () {
        Navigator.push(
            context,
            MaterialPageRoute(
              //导航打开新视图
              builder: (context) => GameInfoPage(
                gameId: "${data.gameId}",
              ),
            ));
      },
      child: Container(
        height: h99,
        margin: EdgeInsets.only(top: t18),
        decoration: const BoxDecoration(color: Color(0xFF202530), borderRadius: BorderRadius.all(Radius.circular(11))),
        child: Stack(
          children: [
            Positioned(
                left: l16,
                top: l16,
                child: Row(
                  children: [
                    CachedNetworkImage(
                      width: w50,
                      height: w50,
                      imageUrl: '${data.gameIconImage}',
                      errorWidget: (context, url, error) => const Icon(Icons.error),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: l10),
                      child: Text(
                        "${data.gameName}",
                        style: TextStyle(fontSize: s14, color: Color(0xFFD6D6D7)),
                      ),
                    ),
                  ],
                )),
            Positioned(
                left: l16,
                top: t80,
                child: Text(
                  "${data.playtime}",
                  style: TextStyle(fontSize: s9, color: Color(0xFF9D9D9D)),
                ))
          ],
        ),
      ),
    );
  }
}