import 'package:cs_resources/generated/l10n.dart';
import 'package:cs_resources/theme/app_colors_theme.dart';
import 'package:flutter/material.dart';
import 'package:auto_route/auto_route.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:router/ext/auto_router_extensions.dart';
import 'package:shared/utils/log_utils.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_appbar.dart';
import 'package:widgets/my_button.dart';
import 'package:widgets/my_text_view.dart';
import 'package:plugin_platform/platform_export.dart';

import '../../router/page/auth_page_router.dart';
import 'tenant_doc_view_model.dart';

@RoutePage()
class TenantDocPage extends HookConsumerWidget {
  TenantDocPage({Key? key}) : super(key: key);

  //启动当前页面
  static void startInstance({BuildContext? context}) {
    if (context != null) {
      context.router.push(TenantDocPageRoute());
    } else {
      appRouter.push(TenantDocPageRoute());
    }
  }

  // 为需要测量的控件创建 GlobalKey
  final GlobalKey _appbarKey = GlobalKey();
  final GlobalKey _titleKey = GlobalKey();
  final GlobalKey _descriptionKey = GlobalKey();
  final GlobalKey _description1Key = GlobalKey();
  final GlobalKey _description2Key = GlobalKey();
  final GlobalKey _nineGridKey = GlobalKey();
  final GlobalKey _buttonKey = GlobalKey();

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final viewModel = ref.read(tenantDocViewModelProvider.notifier);
    final state = ref.watch(tenantDocViewModelProvider);

    // 获取屏幕高度
    final screenHeight = MediaQuery.of(context).size.height;
    final statusBarHeight = MediaQuery.of(context).padding.top;
    final navigationBarHeight = MediaQuery.of(context).padding.bottom;

    useEffect(() {
      double usedHeight = 0;
      // 组件挂载时执行,获取控件高度
      WidgetsBinding.instance.addPostFrameCallback((_) {
        // 获取各个控件的高度
        usedHeight += _appbarKey.currentContext?.size?.height ?? 0;
        usedHeight += _titleKey.currentContext?.size?.height ?? 0;
        usedHeight += _descriptionKey.currentContext?.size?.height ?? 0;
        usedHeight += _description1Key.currentContext?.size?.height ?? 0;
        usedHeight += _description2Key.currentContext?.size?.height ?? 0;
        usedHeight += _nineGridKey.currentContext?.size?.height ?? 0;
        usedHeight += _buttonKey.currentContext?.size?.height ?? 0;

        // 计算剩余空间
        double remainingSpace = screenHeight - statusBarHeight - navigationBarHeight - usedHeight - 23 - 21;

        Log.d("计算剩余空间:$remainingSpace");

        if (remainingSpace > 0) {
          // 设置一个状态来存储剩余空间的高度
          viewModel.setRemainingSpace(remainingSpace);
        }
      });
      return () {
        // 组件卸载时执行
      };
    }, []);

    return Scaffold(
      appBar: MyAppBar.appBar(context, "", key: _appbarKey),
      backgroundColor: context.appColors.backgroundDefault,
      body: Container(
        padding: const EdgeInsets.symmetric(horizontal: 15),
        width: double.infinity,
        child: Column(
          mainAxisSize: MainAxisSize.max,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            MyTextView(
              key: _titleKey,
              S.current.upload_documents,
              fontSize: 23.5,
              marginTop: 23,
              marginBottom: 21,
              textAlign: TextAlign.center,
              isFontMedium: true,
              textColor: context.appColors.textBlack,
            ),

            MyTextView(
              key: _descriptionKey,
              S.current.upload_doc_desc,
              fontSize: 15,
              isFontMedium: true,
              textColor: context.appColors.textBlack,
            ),

            MyTextView(
              key: _description1Key,
              S.current.upload_doc_desc1,
              fontSize: 15,
              marginTop: 22,
              isFontMedium: true,
              textColor: context.appColors.textBlack,
            ),

            MyTextView(
              key: _description2Key,
              S.current.upload_doc_desc2,
              fontSize: 15,
              marginTop: 22,
              marginBottom: 24,
              isFontMedium: true,
              textColor: context.appColors.textBlack,
            ),

            ImageNineGrid(
              key: _nineGridKey,
              isSelectEnable: true,
              maxImages: 3,
              spacing: 10,
              aspectRatio: 108 / 80,
              initialImages: [],
              onImagesChanged: (list) {
                viewModel.setDocList(list);
              },
            ),

            SizedBox(
              height: state.remainingSpace, // 使用剩余空间的值
            ),

            //底部的按钮
            MyButton(
              key: _buttonKey,
              onPressed: viewModel.submitDoc,
              text: S.current.next,
              textColor: Colors.white,
              backgroundColor: context.appColors.btnBgDefault,
              fontWeight: FontWeight.w500,
              type: ClickType.throttle,
              fontSize: 16,
              minHeight: 50,
              radius: 5,
            ).marginOnly(top: 30, bottom: 30, left: 18, right: 18),
          ],
        ),
      ),
    );
  }
}