import 'package:electronic_assistant/base/base_page.dart';
import 'package:electronic_assistant/resource/assets.gen.dart';
import 'package:electronic_assistant/resource/colors.gen.dart';
import 'package:electronic_assistant/resource/string.gen.dart';
import 'package:electronic_assistant/utils/expand.dart';
import 'package:electronic_assistant/utils/toast_util.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart';

import 'controller.dart';

class HomePage extends BasePage<HomePageController> {
  HomePage({super.key});

  BuildContext? todoTargetContext;

  @override
  Widget? buildBody(BuildContext context) {
    return Stack(
      children: [
        buildBgBox(),
        buildTopGradient(),
        SafeArea(
          child: Column(
            children: [
              Container(
                width: 1.sw,
                padding: const EdgeInsets.all(12).w,
                child: buildOperationBar(),
              ),
              Expanded(
                  child: CustomScrollView(
                slivers: [
                  buildTalkRecordTitle(),
                  SliverToBoxAdapter(
                    child: Container(
                      height: 0.3111.sw,
                      margin: EdgeInsets.only(bottom: 15.h),
                      child: buildTalkRecord(),
                    ),
                  ),
                  buildTalkTodoTitle(),
                  SliverAnimatedList(
                      itemBuilder: _buildTodoItem, initialItemCount: 20),
                  buildSeeMoreView(),
                ],
              ))
            ],
          ),
        )
      ],
    );
  }

  SliverToBoxAdapter buildSeeMoreView() {
    return SliverToBoxAdapter(
      child: Container(
        alignment: Alignment.center,
        padding: const EdgeInsets.only(top: 12, bottom: 36).w,
        child: RichText(
          text: TextSpan(
            text: StringName.homeTalkTodo1.tr,
            style:
                TextStyle(color: ColorName.secondaryTextColor, fontSize: 12.sp),
            children: <TextSpan>[
              TextSpan(
                  text: StringName.homeTalkTodo2.tr,
                  style:
                      TextStyle(color: ColorName.colorPrimary, fontSize: 12.sp),
                  recognizer: TapGestureRecognizer()
                    ..onTap = () {
                      ToastUtil.showToast('点击了全部');
                    }),
            ],
          ),
        ),
      ),
    );
  }

  SliverToBoxAdapter buildTalkTodoTitle() {
    return SliverToBoxAdapter(
        child: Column(
      children: [
        SizedBox(height: 9.w),
        buildTitle(StringName.homeTalkTodoTitle.tr, () {
          ToastUtil.showToast('待办事项 查看全部');
        }),
        SizedBox(height: 12.w)
      ],
    ));
  }

  SliverToBoxAdapter buildTalkRecordTitle() {
    return SliverToBoxAdapter(
      child: Column(
        children: [
          SizedBox(height: 7.w),
          buildTitle(StringName.homeTalkRecord.tr, () {
            ToastUtil.showToast('谈话记录 查看全部');
          }),
          SizedBox(height: 12.w)
        ],
      ),
    );
  }

  Row buildOperationBar() {
    return Row(children: [buildGoLogin(), const Spacer(), buildGoStore()]);
  }

  GestureDetector buildGoStore() {
    return GestureDetector(
        child: DecoratedBox(
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(16),
            ),
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2).w,
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  SizedBox(
                      width: 28.w,
                      height: 28.w,
                      child: Assets.images.iconCharge.image()),
                  SizedBox(width: 4.w),
                  SizedBox(
                      width: 28.w, child: Assets.images.iconChargeTxt.image()),
                  SizedBox(
                      width: 12.w,
                      height: 12.w,
                      child: Assets.images.iconChargeArrow.image()),
                ],
              ),
            )),
        onTap: () {
          ToastUtil.showToast('GoStore');
        });
  }

  GestureDetector buildGoLogin() {
    return GestureDetector(
      onTap: () {
        ToastUtil.showToast('GoLogin');
      },
      child: Row(
        children: [
          SizedBox(
              width: 0.1.sw,
              height: 0.1.sw,
              child: Assets.images.iconHomeLogged.image()),
          SizedBox(width: 8.w),
          Text(StringName.homeGoLogin.tr,
              style: TextStyle(
                  fontWeight: FontWeight.bold,
                  fontSize: 15.sp,
                  color: ColorName.primaryTextColor))
        ],
      ),
    );
  }

  Container buildTopGradient() {
    return Container(
        width: 1.sw,
        height: 112.h,
        decoration: BoxDecoration(
          gradient: LinearGradient(
            colors: ['#E8EBFF'.toColor(), '#00E8EBFF'.toColor()],
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            stops: const [0.3, 1.0],
          ),
        ) // 其他子小部件
        );
  }

  DecoratedBox buildBgBox() {
    return DecoratedBox(
        decoration: BoxDecoration(color: '#F6F6F6'.toColor()),
        child: Container(
          height: double.infinity,
        ));
  }

  Widget buildTalkRecord() {
    return SizedBox(
      width: 1.sw,
      child: CustomScrollView(
        scrollDirection: Axis.horizontal,
        slivers: [
          SliverToBoxAdapter(child: SizedBox(width: 12.w)),
          buildGoRecordView(),
          SliverAnimatedList(itemBuilder: _buildTalkItem, initialItemCount: 10)
        ],
      ),
    );
  }

  SliverToBoxAdapter buildGoRecordView() {
    return SliverToBoxAdapter(
        child: GestureDetector(
      onTap: () {
        showUnfinishedRecordPopup();
      },
      child: Container(
        margin: EdgeInsets.only(right: 8.w),
        decoration: BoxDecoration(
          color: Colors.white,
          border: Border.all(color: '#EBEBFF'.toColor(), width: 1),
          borderRadius: BorderRadius.circular(8.0),
        ),
        child: SizedBox(
          width: 100.w,
          height: double.infinity,
          child: Stack(
            children: [
              Positioned(
                right: 0,
                bottom: 0,
                child: SizedBox(
                  width: 48.w,
                  child: Assets.images.bgHomeQuickAudio.image(),
                ),
              ),
              Positioned.fill(
                  child: Align(
                alignment: Alignment.center,
                child: Column(
                  children: [
                    SizedBox(height: 20.h),
                    SizedBox(
                        width: 32.w,
                        height: 32.w,
                        child: Assets.images.iconAddTalk.image()),
                    SizedBox(height: 6.h),
                    Text(StringName.homeTalkAudio.tr,
                        style: TextStyle(
                            fontSize: 14.sp,
                            color: ColorName.colorPrimary,
                            fontWeight: FontWeight.bold)),
                    Builder(builder: (context) {
                      todoTargetContext = context;
                      return Text(StringName.homeTalkQuickAudio.tr,
                          style: TextStyle(
                              fontSize: 10.sp,
                              color: ColorName.secondaryTextColor));
                    })
                  ],
                ),
              )),
            ],
          ),
        ),
      ),
    ));
  }

  Widget _buildTodoItem(
      BuildContext context, int index, Animation<double> animation) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 17).w,
      margin: const EdgeInsets.only(left: 12, right: 12, bottom: 8).w,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          SizedBox(
              width: 20.w,
              height: 20.w,
              child: Assets.images.iconAgentChecked.image()),
          SizedBox(width: 8.w),
          Text('今天要完成某项任务',
              style: TextStyle(
                  fontSize: 15.sp,
                  fontWeight: FontWeight.bold,
                  color: ColorName.primaryTextColor)),
          const Spacer(),
          Container(
            decoration: BoxDecoration(
              gradient: LinearGradient(
                colors: ['#9075FF'.toColor(), '#4366FF'.toColor()],
                stops: const [0.3, 1.0],
              ),
              borderRadius: BorderRadius.circular(6),
            ),
            padding: const EdgeInsets.symmetric(horizontal: 9, vertical: 4).w,
            child: Text(
              StringName.homeTalkThinking.tr,
              style: TextStyle(fontSize: 13.sp, color: ColorName.white),
            ),
          )
        ],
      ),
    );
  }

  Widget _buildTalkItem(
      BuildContext context, int index, Animation<double> animation) {
    return Container(
        width: 258.w,
        margin: EdgeInsets.only(right: 8.w),
        decoration: BoxDecoration(
          color: Colors.white,
          border: Border.all(color: '#F0F0F0'.toColor(), width: 1),
          borderRadius: BorderRadius.circular(8),
        ),
        height: double.infinity,
        padding: EdgeInsets.symmetric(horizontal: 12.w),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                Container(
                    padding: const EdgeInsets.symmetric(horizontal: 6).w,
                    decoration: BoxDecoration(
                      color: '#DFE4FC'.toColor(),
                      borderRadius: BorderRadius.circular(4),
                    ),
                    child: Text(
                      StringName.homeTalkExample.tr,
                      style: TextStyle(
                          fontSize: 12.sp, color: ColorName.colorPrimary),
                    )),
                SizedBox(width: 6.w),
                Text('与吴总张总沟通活动策划',
                    style: TextStyle(
                        fontSize: 15.sp,
                        color: ColorName.colorPrimary,
                        fontWeight: FontWeight.bold))
              ],
            ),
            SizedBox(height: 5.h),
            Text(
                style: TextStyle(
                    fontSize: 12.sp, color: ColorName.secondaryTextColor),
                overflow: TextOverflow.ellipsis,
                maxLines: 2,
                '这个群，现在由我管理。目的是把你们训练成一个个社会高薪人士，从本周起，已经个个社会高薪人士，从本周起，已经个个社会高薪人士，从本周起，已经'),
            SizedBox(height: 8.h),
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Text('1m12s',
                    style: TextStyle(
                        fontSize: 12.sp, color: ColorName.tertiaryTextColor)),
                SizedBox(width: 6.w),
                Container(
                    width: 1, height: 9, color: ColorName.tertiaryTextColor),
                SizedBox(width: 6.w),
                Text('2024-04-15 10:04',
                    style: TextStyle(
                        fontSize: 12.sp, color: ColorName.tertiaryTextColor))
              ],
            )
          ],
        ));
  }

  Widget buildTitle(String titleName, VoidCallback onTap) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 12).w,
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Text(titleName,
              style: TextStyle(
                  fontWeight: FontWeight.bold,
                  fontSize: 17.sp,
                  color: ColorName.primaryTextColor)),
          const Spacer(),
          GestureDetector(
            onTap: onTap,
            child: Padding(
              padding: const EdgeInsets.symmetric(vertical: 6).w,
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    StringName.homeTalkSeeAll.tr,
                    style: TextStyle(
                        fontSize: 13.sp, color: ColorName.secondaryTextColor),
                  ),
                  SizedBox(
                      width: 16.w,
                      height: 16.w,
                      child: Assets.images.iconHomeTalkArrow.image()),
                ],
              ),
            ),
          )
        ],
      ),
    );
  }

  attachDialog(BuildContext? context, Alignment alignment) {
    SmartDialog.showAttach(
      targetContext: context,
      alignment: alignment,
      animationType: SmartAnimationType.fade,
      clickMaskDismiss: true,
      maskColor: Colors.transparent,
      bindPage: true,
      builder: (_) => Padding(
        padding: const EdgeInsets.only(top: 7).h,
        child: Stack(
          alignment: Alignment.topCenter,
          children: [
            SizedBox(
                width: 146.w,
                height: 66.w,
                child: Assets.images.bgAudioTodoPopup.image()),
            Container(
                alignment: Alignment.center,
                padding: const EdgeInsets.only(top: 17).w,
                width: 146.w,
                child: Text(StringName.homePopupTipsTxt.tr,
                    style: TextStyle(fontSize: 14.sp, color: Colors.white)))
          ],
        ),
      ),
    );
  }

  void showUnfinishedRecordPopup() {
    attachDialog(todoTargetContext, Alignment.bottomRight);
  }
}