import 'package:fis_i18n/i18n.dart';
import 'package:fis_theme/theme.dart';
import 'package:fis_ui/base_define/page.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/values/font_sizes.dart';
import 'package:flutter/material.dart';
import 'package:flyinsono/architecture/define.dart';
import 'package:flyinsono/architecture/router/desktop/names.dart';
import 'package:flyinsono/architecture/router/router.dart';
import 'package:flyinsono/views/desktop/laboratory/particles/particles_bg.dart';
import 'package:get/get.dart' hide Node;

import 'index.dart';

class LaboratoryPage extends FisView<LaboratoryController> implements FPage {
  const LaboratoryPage({Key? key}) : super(key: key);

  @override
  String get pageName => 'LaboratoryPage';

  @override
  FWidget build(BuildContext context) {
    return QuickFWidget(
      Stack(
        children: [
          /// 蓝色渐变背景色
          Container(
            decoration: BoxDecoration(
              gradient: LinearGradient(
                colors: [
                  Color.fromARGB(255, 89, 146, 172),
                  Color.fromARGB(255, 39, 82, 146),
                  Color.fromARGB(255, 3, 59, 104),
                  Color.fromARGB(255, 17, 34, 64),
                  Color.fromARGB(255, 6, 27, 63),
                  Color.fromARGB(255, 17, 34, 64),
                  Color.fromARGB(255, 9, 61, 104),
                  Color.fromARGB(255, 45, 75, 125),
                ],
                begin: Alignment.topLeft,
                end: Alignment.bottomRight,
              ),
            ),
          ),
          ParticleBackground(
            key: UniqueKey(),
            // awayRadius: 1000,
            numberOfParticles: 300,
            speedOfParticles: 2,
            height: Get.height,
            width: Get.width,
            // onTapAnimation: true,
            particleColor: Colors.white.withOpacity(0.8),
            awayAnimationDuration: Duration(milliseconds: 100),
            maxParticleSize: 4,
            isRandSize: true,
            isRandomColor: true,
            randColorList: [
              Colors.white.withOpacity(0.6),
              Colors.white.withOpacity(0.8),
              Colors.white.withOpacity(0.9),
              Colors.white.withOpacity(0.3)
            ],
            awayAnimationCurve: Curves.slowMiddle,
            enableHover: true,
            hoverColor: Colors.white,
            hoverRadius: 90,
            connectDots: true, //not recommended
          ),
          Center(
            child: FContainer(
              child: FRow(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  _buildHoverInkWell(
                    onTap: () async {
                      await router.to(
                        RouteNames.Laboratory.AiLaboratoryFolder,
                        id: NavIds.HOME,
                      );
                    },
                    child: _buildQuickFWidget(
                      'assets/images/fly.png',
                      i18nBook.laboratory.feifeiAIAnalysisAssistant.t,
                    ),
                  ),
                  const FSizedBox(width: 50),
                  _buildHoverInkWell(
                    onTap: () async {
                      await router.to(
                        RouteNames.Laboratory.LaboratoryReportFolder,
                        id: NavIds.HOME,
                      );
                    },
                    child: _buildQuickFWidget(
                      'assets/images/laboratory4.png',
                      i18nBook.laboratory.comprehensiveImageAnalysis.t,
                      false,
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  /// 构建 HOVER-INKWELL 组件
  FWidget _buildHoverInkWell({
    required VoidCallback onTap,
    required Widget child,
  }) {
    return FHoverInkWell(
      onTap: onTap,
      child: child,
    );
  }

  /// 构建 QuickFWidget
  FWidget _buildQuickFWidget(String icon, String title,
      [bool? isFeifei = true]) {
    return FContainer(
      width: 350,
      height: 350,
      child: FColumn(
        children: [
          FContainer(
            padding: EdgeInsets.only(top: 15),
            child: QuickFWidget(
              AspectRatio(
                aspectRatio: 10 / 8.2, // 调整宽高比例，防止图片过高
                child: FContainer(
                  child: FImage.asset(
                    icon,
                    fit: isFeifei! ? BoxFit.contain : BoxFit.fitHeight,
                  ),
                ),
              ),
            ),
          ),
          FContainer(
            padding: EdgeInsets.only(top: 15),
            child: FText(
              title,
              style: TextStyle(
                color: Colors.white,
                fontSize: FFontSizes.H4,
                shadows: [
                  BoxShadow(
                    color: Colors.black.withOpacity(0.8),
                    offset: Offset(2, 2),
                    blurRadius: 3,
                    spreadRadius: 1,
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

class FHoverInkWell extends FStatefulWidget {
  final Widget child;
  final VoidCallback onTap;

  FHoverInkWell({required this.child, required this.onTap});

  @override
  _HoverInkWellState createState() => _HoverInkWellState();
}

class _HoverInkWellState extends FState<FHoverInkWell> {
  bool _isHover = false;

  @override
  FWidget build(BuildContext context) {
    return FMouseRegion(
      onEnter: (_) {
        setState(() {
          _isHover = true;
        });
      },
      onExit: (_) {
        setState(() {
          _isHover = false;
        });
      },
      child: FInkWell(
        onTap: widget.onTap,
        child: AnimatedContainer(
          duration: Duration(milliseconds: 200),
          decoration: BoxDecoration(
            border: Border.all(
              width: 3,
              color: _isHover
                  ? FTheme.ins.colorScheme.primary
                  : Colors.transparent,
            ),
            borderRadius: BorderRadius.all(
              Radius.circular(8),
            ),
          ),
          child: widget.child,
        ),
      ),
    );
  }
}

class Images {
  static const background = 'assets/images/background.gif';
  static const laboratory1 = 'assets/images/fly.png';
  static const reportAnalysis = 'assets/images/laboratory4.png';
}
