import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:hgdj/assets_tool/app_colors.dart';
import 'package:hgdj/hj_utils/screen.dart';
import 'package:hgdj/tools_base/loading/loading_center_widget.dart';
import 'package:hgdj/tools_base/widget/keep_alive_widget.dart';

import '../../hj_utils/widget_util.dart';
import 'ai_home_logic.dart';
import 'ai_record/ai_main_record_page.dart';

/// AI 科技首页：顶部功能 tab 网格 + 各功能子页
class AiHomePage extends StatelessWidget {
  const AiHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<AiHomeLogic>(
        init: AiHomeLogic(),
        builder: (logic) {
          return Stack(
            children: [
              Scaffold(
                  backgroundColor: Colors.transparent,
                  appBar: AppBar(
                    title: Text('AI科技'),
                    backgroundColor: AppColors.primaryColor,
                    actions: [
                      Center(
                        child: InkWell(
                          enableFeedback: false,
                          onTap: () => Get.to(
                            () => AIMainRecordPage(
                              aiType: logic.menus[logic.tabCtr.index].aiType,
                            ),
                          ),
                          child: Text(
                            '记录',
                            style: textStyle(
                                14,
                                Colors.white.withValues(alpha: 0.55),
                                FontWeight.w400),
                          ),
                        ),
                      ),
                      16.sizeBoxW
                    ],
                  ),
                  body: _buildContent(logic))
            ],
          );
        });
  }

  /// 内容区：加载中 / 加载失败 / tab 网格 + 子页
  Widget _buildContent(AiHomeLogic logic) {
    if (logic.isShowLoading) return const LoadingCenterWidget();
    if (logic.aiModList == null) {
      return CErrorWidget(retryOnTap: () => logic.loadData());
    }
    return Column(
      children: [
        _buildTabBar(logic),
        Expanded(
          child: TabBarView(
            controller: logic.tabCtr,
            children: logic.menus
                .map<Widget>((e) => logic.subPage(e).keepAlive)
                .toList(),
          ),
        )
      ],
    );
  }

  /// 顶部功能 tab 网格（id:'tab' 局部刷新选中态）
  Widget _buildTabBar(AiHomeLogic logic) {
    return GetBuilder<AiHomeLogic>(
      init: logic,
      id: 'tab',
      builder: (_) {
        return GridView.builder(
          shrinkWrap: true,
          padding: EdgeInsets.symmetric(horizontal: 16),
          physics: NeverScrollableScrollPhysics(),
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 3,
            childAspectRatio: 105 / 26,
            crossAxisSpacing: 14,
            mainAxisSpacing: 14,
          ),
          itemCount: logic.menus.length,
          itemBuilder: (context, index) {
            final isSelected = logic.tabCtr.index == index;
            final menu = logic.menus[index];
            return InkWell(
              enableFeedback: false,
              onTap: () {
                logic.tabCtr.animateTo(index);
                logic.update(['tab']);
              },
              child: AnimatedContainer(
                duration: const Duration(milliseconds: 250),
                curve: Curves.easeOut,
                alignment: Alignment.center,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(3),
                  color: isSelected
                      ? Color(0xffF68804)
                      : Colors.white.withValues(alpha: .1),
                  border: isSelected
                      ? null
                      : Border.all(
                          width: 1, color: Colors.white.withValues(alpha: .35)),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.asset(
                      menu.img ?? '',
                      width: 16,
                      color: Colors.white,
                    ),
                    4.sizeBoxW,
                    Text(
                      menu.aiTypeName ?? '',
                      style: textStyle(12, Colors.white, FontWeight.w400),
                    ),
                  ],
                ),
              ),
            );
          },
        );
      },
    );
  }
}