import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:keyboard/base/base_view.dart';
import 'package:flutter/material.dart';
import 'package:keyboard/module/login/login_controller.dart';
import 'package:keyboard/dialog/login/login_dialog_controller.dart';
import 'package:get/get.dart';
import '../../data/consts/web_url.dart';
import '../../resource/assets.gen.dart';
import '../../resource/string.gen.dart';
import '../../widget/click_text_span.dart';

class LoginDialogView extends BaseView<LoginDialogController> {
  const LoginDialogView({super.key});

  static var TAG = "LoginDialog";

  @override
  backgroundColor() => Colors.transparent;

  @override
  Widget buildBody(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(24.r),
          topRight: Radius.circular(24.r),
        ),
      ),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Stack(
            children: [
              Container(
                width: 360.w,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: Assets.images.bgLoginDialog.provider(),
                    fit: BoxFit.contain,
                    alignment: Alignment.topCenter,
                  ),
                ),
                child: Obx(() {
                  return Column(
                    children: [
                      SizedBox(height: 131.h),
                      controller.isInstallWechat.value ? _buildWeChatButton() : SizedBox(),
                      SizedBox(height: 12.h),
                      _buildAppleButton(),
                      SizedBox(height: 31.h),
                      _buildPhoneLoginButton(),
                      SizedBox(height: 10.h),
                      _buildPrivacy(),
                    ],
                  );
                }),
              ),
              Positioned(
                  right: 13.w,
                  top: 13.w,
                  child: InkWell(onTap: controller.clickClose,
                    child: Assets.images.iconLoginDialogClose.image(
                      width: 24.w,
                      height: 24.w,
                    ),)
              ),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildPhoneLoginButton() {
    return InkWell(
      onTap: () {
        controller.clickPhoneLogin();
      },
      child: Column(
        children: [
          Container(
            width: 44.w,
            height: 44.w,
            decoration: ShapeDecoration(
              color: const Color(0xFFF5F4F9),
              shape: OvalBorder(),
            ),
            child: Center(
              child: Assets.images.iconLoginDialogPhoneLogo.image(
                width: 20.w,
                height: 20.w,
              ),
            ),
          ),
          Text(
            '手机号登录',
            textAlign: TextAlign.center,
            style: TextStyle(
              color: Colors.black.withValues(alpha: 128),
              fontSize: 12,
              fontFamily: 'Source Han Sans CN',
              fontWeight: FontWeight.w400,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildWeChatButton() {
    return InkWell(
      onTap: () {
        controller.clickWxLogin();
      },
      child: Container(
        width: 312.w,
        height: 48.h,
        decoration: ShapeDecoration(
          color: const Color(0xFF32DB78),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(50.r),
          ),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          spacing: 4,
          children: [
            Assets.images.iconLoginDialogWechatLogoWhite.image(
              width: 26.w,
              height: 26.w,
            ),
            Text(
              StringName.wechatLogin,
              textAlign: TextAlign.center,
              style: TextStyle(
                color: Colors.white,
                fontSize: 16.sp,
                fontWeight: FontWeight.w500,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildAppleButton() {
    return InkWell(
      onTap: () {
        controller.clickAppleLogin();
      },
      child: Container(
        width: 312.w,
        height: 48.h,
        decoration: ShapeDecoration(
          color: const Color(0xFFF0F1F3),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(50.r),
          ),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          spacing: 4,
          children: [
            Assets.images.iconLoginDialogApple.image(
              width: 14.w,
              height: 14.w,
            ),
            Text(
              StringName.useAppleLogin,
              textAlign: TextAlign.center,
              style: TextStyle(
                color: Color(0xFF000000).withAlpha(204),
                fontSize: 16.sp,
                fontWeight: FontWeight.w500,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildPrivacy() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Obx(() {
          return GestureDetector(
            behavior: HitTestBehavior.opaque,
            onTap: () {
              controller.clickAgree();
            },
            child: Padding(
              padding: EdgeInsets.symmetric(vertical: 20.w,horizontal: 20.w),
              child:
              controller.isAgree
                  ? Assets.images.iconLoginAgreePrivacy.image(
                width: 12.w,
                height: 12.w,
              )
                  : Container(
                padding: EdgeInsets.all(1.w),
                width: 12.w,
                height: 12.w,
                child: Container(
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    border: Border.all(
                      color: Colors.black.withAlpha(153),
                      width: 1.w,
                    ),
                  ),
                ),
              ),
            ),
          );
        }),
        Transform.translate(offset: Offset(-15.w,0),child:  Text.rich(
          TextSpan(
            children: [
              TextSpan(
                text: StringName.textSpanIHaveReadAndAgree,
                style: TextStyle(
                  color: Colors.black.withAlpha(128),
                  fontSize: 12.sp,
                  fontWeight: FontWeight.w400,
                ),
              ),
              ClickTextSpan(
                text: StringName.textSpanPrivacyPolicy,
                url: WebUrl.privacyPolicy,
                fontSize: 12.sp,
                color: Colors.black.withAlpha(204),
              ),

              TextSpan(
                text: StringName.textSpanAnd,
                style: TextStyle(
                  color: Colors.black.withAlpha(128),
                  fontSize: 12.sp,
                  fontWeight: FontWeight.w400,
                ),
              ),

              ClickTextSpan(
                text: StringName.textSpanServiceTerms,
                url: WebUrl.serviceAgreement,
                color: Colors.black.withAlpha(204),
                fontSize: 12.sp,
              ),
            ],
          ),
        ),),
      ],
    );
  }
}