import 'package:dating_touchme_app/components/page_appbar.dart';
import 'package:dating_touchme_app/controller/mine/withdraw_controller.dart';
import 'package:dating_touchme_app/extension/ex_widget.dart';
import 'package:dating_touchme_app/generated/assets.dart';
import 'package:dating_touchme_app/model/mine/bank_card_data.dart';
import 'package:dating_touchme_app/pages/mine/add_bankcard_page.dart';
import 'package:dating_touchme_app/pages/mine/withdraw_history_page.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

class WithdrawPage extends StatelessWidget {
  final num availableWithdrawBalance;
  const WithdrawPage({super.key, required this.availableWithdrawBalance});

  String maskKeepLast(String s, int keep) {
    if (s.length <= keep) return s;
    return '*' * (s.length - keep) + s.substring(s.length - keep);
  }

  @override
  Widget build(BuildContext context) {
    return GetX<WithdrawController>(
      init: WithdrawController(),
      builder: (controller){
        return Scaffold(
          appBar: PageAppbar(title: "提现"),
          body: SingleChildScrollView(
            child: Column(
              children: [
                Container(
                  padding: EdgeInsetsGeometry.symmetric(
                      horizontal: 16.w,
                      vertical: 19.w
                  ),
                  margin: EdgeInsets.only(
                      bottom: 17.w
                  ),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        "到账银行卡",
                        style: TextStyle(
                          fontSize: 12.w,
                        ),
                      ),
                      SizedBox(width: 24.w,),
                      Expanded(
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            if(controller.nowBankCard.value.id != null) Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text(
                                  "${controller.nowBankCard.value.bankName}（${controller.nowBankCard.value.cardNum!.substring(controller.nowBankCard.value.cardNum!.length - 4)}）",
                                  style: TextStyle(
                                      fontSize: 13.w,
                                      fontWeight: FontWeight.w500
                                  ),
                                ),
                              ],
                            ),
                            if(controller.nowBankCard.value.id == null) Text(
                              "点击选择银行卡",
                              style: TextStyle(
                                  fontSize: 12.w,
                                  color: const Color.fromRGBO(153, 153, 153, 1)
                              ),
                            ),
                            Icon(
                              Icons.keyboard_arrow_right,
                              size: 15.w,
                              color: const Color.fromRGBO(153, 153, 153, 1),
                            )
                          ],
                        ),
                      )
                    ],
                  ).onTap(() {
                    showModalBottomSheet(
                        context: Get.context!,
                        builder: (BuildContext context) {
                          return Obx(() {
                            return Container(
                              height: 357.w,
                              color: Colors.white,
                              child: Column(
                                children: [
                                  Container(
                                    height: 37.w,
                                    color: const Color.fromRGBO(247, 247, 247, 1),
                                    padding: EdgeInsetsGeometry.symmetric(
                                        horizontal: 16.w
                                    ),
                                    child: Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text(
                                          "取消",
                                          style: TextStyle(
                                              fontSize: 14.w,
                                              color: const Color.fromRGBO(153, 153, 153, 1)
                                          ),
                                        ).onTap((){
                                          Navigator.pop(context);
                                        }),
                                        Text(
                                          "选择到账银行卡",
                                          style: TextStyle(
                                              fontSize: 14.w,
                                              fontWeight: FontWeight.w500
                                          ),
                                        ),
                                        Text(
                                          "取消",
                                          style: TextStyle(
                                              fontSize: 14.w,
                                              color: const Color.fromRGBO(153, 153, 153, 0)
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                  Expanded(
                                    child: SingleChildScrollView(
                                      child: Container(
                                        padding: EdgeInsets.all(16.w),
                                        child: Column(
                                          children: [
                                            ...controller.bankCardList.map((e){
                                              return cardItem(e, controller).onTap((){
                                                controller.nowBankCard.value = e;
                                                Get.back();
                                              });
                                            }),
                                            addCard().onTap((){
                                              Get.to(() => AddBankcardPage())?.then((e){
                                                controller.getBankCard();
                                              });
                                            }),
                                          ],
                                        ),
                                      ),
                                    ),
                                  )
                                ],
                              ),
                            );
                          });
                        }
                    );
                  }),
                ),
                Container(
                  padding:  EdgeInsetsGeometry.symmetric(
                      horizontal: 16.w
                  ),
                  child: Column(
                    children: [
                      Row(
                        mainAxisAlignment: MainAxisAlignment.start,
                        children: [
                          Text(
                            "提现金额",
                            style: TextStyle(
                                fontSize: 12.w,
                                color: Colors.black
                            ),
                          )
                        ],
                      ),
                      SizedBox(height: 12.w,),
                      Row(
                        children: [
                          Text(
                            "￥",
                            style: TextStyle(
                                fontSize: 24.w,
                                color: Colors.black,
                                fontWeight: FontWeight.w500
                            ),
                          ),
                          Expanded(
                            child: TextField(
                              controller: controller.withdrawMoneyController.value,
                              keyboardType: const TextInputType.numberWithOptions(decimal: true),
                              inputFormatters: [
                                DecimalTextInputFormatter(decimalRange: 2),
                              ],
                              style: TextStyle(
                                  fontSize: ScreenUtil().setWidth(22),
                                  height: 1
                              ),
                              decoration: InputDecoration(
                                contentPadding: EdgeInsets.symmetric(
                                    vertical: 0,
                                    horizontal: 0
                                ),
                                hintText: "请输入提现金额",
                                hintStyle: TextStyle(
                                    color: Colors.grey
                                ),

                                border: const OutlineInputBorder(
                                  borderSide: BorderSide.none, // 这将移除边框 // 可选：设置圆角
                                ),
                                // 如果你希望聚焦时和未聚焦时都没有边框，也可以设置 focusedBorder 和 enabledBorder
                                focusedBorder: const OutlineInputBorder(
                                  borderSide: BorderSide.none,
                                  borderRadius: BorderRadius.all(Radius.circular(4.0)),
                                ),
                                enabledBorder: const OutlineInputBorder(
                                  borderSide: BorderSide.none,
                                  borderRadius: BorderRadius.all(Radius.circular(4.0)),
                                ),
                              ),
                              onChanged: (value){
                                controller.withdrawMoney.value = value;
                              },
                            ),
                          )
                        ],
                      ),
                      SizedBox(height: 16.w,),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Row(
                                children: [
                                  Text(
                                    "可提现金额：${availableWithdrawBalance}元",
                                    style: TextStyle(
                                        fontSize: 12.w,
                                        color: const Color.fromRGBO(153, 153, 153, 1)
                                    ),
                                  ),
                                  Text(
                                    "全部提现",
                                    style: TextStyle(
                                        fontSize: 12.w,
                                        color: const Color.fromRGBO(25, 114, 248, 1)
                                    ),
                                  ).onTap((){
                                    controller.withdrawMoney.value = availableWithdrawBalance.toString();
                                    controller.withdrawMoneyController.value.value = TextEditingValue(
                                      text: controller.withdrawMoney.value,
                                      selection: TextSelection.fromPosition(TextPosition(offset: controller.withdrawMoney.value.length)),
                                    );
                                  })
                                ],
                              ),
                              Text(
                                "提现记录",
                                style: TextStyle(
                                    fontSize: 12.w,
                                    color: const Color.fromRGBO(25, 114, 248, 1)
                                ),
                              ).onTap((){
                                Get.to(() => WithdrawHistoryPage());
                              })
                            ],
                          ),
                          Text(
                            "收益到账后满 3 天方可申请提现，提现金额最低 50 元",
                            style: TextStyle(
                                fontSize: 12.w,
                                color: const Color.fromRGBO(153, 153, 153, 1)
                            ),
                          )
                        ],
                      ),
                      SizedBox(height: 40.w,),
                      Container(
                        width: 350.w,
                        height: 42.w,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.all(Radius.circular(42.w)),
                            color: const Color.fromRGBO(117, 98, 249, 1)
                        ),
                        child: Center(
                          child: Text(
                            "提现",
                            style: TextStyle(
                                fontSize: 14.w,
                                color: Colors.white,
                                fontWeight: FontWeight.w500
                            ),
                          ),
                        ),
                      ).onTap(() async {
                        if(controller.nowBankCard.value.id == null){
                          SmartDialog.showToast('请先选择到账银行卡');
                          return;
                        }
                        if(controller.withdrawMoney.value == ""){
                          SmartDialog.showToast('请输入提现金额');
                          return;
                        }
                        if(double.parse(controller.withdrawMoney.value) < 50){
                          SmartDialog.showToast('最低提现金额为50元');
                          return;
                        }
                        await controller.getServiceFee();
                        Navigator.of(context).push(
                          TDSlidePopupRoute(
                              slideTransitionFrom: SlideTransitionFrom.center,
                              builder: (context) {
                                return Obx((){
                                  return Material(
                                    borderRadius: BorderRadius.circular(TDTheme.of(context).radiusLarge),
                                    child: Container(
                                      decoration: BoxDecoration(
                                        color: TDTheme.of(context).bgColorContainer,
                                        borderRadius:
                                        BorderRadius.circular(TDTheme.of(context).radiusLarge),
                                      ),
                                      width: 287.w,
                                      padding: EdgeInsets.all(12.w),
                                      child: Column(
                                        mainAxisSize: MainAxisSize.min,
                                        children: [
                                          Text(
                                            "温馨提示",
                                            style: TextStyle(
                                              fontSize: 18.w,
                                              fontWeight: FontWeight.w500
                                            ),
                                          ),
                                          SizedBox(height: 12.w,),
                                          Text(
                                            "提现金额",
                                            style: TextStyle(
                                                fontSize: 14.w,
                                            ),
                                          ),
                                          RichText(
                                            text: TextSpan(
                                              children: [
                                                TextSpan(
                                                  text: "￥",
                                                  style: TextStyle(
                                                    fontSize: 14.w,
                                                    fontWeight: FontWeight.w700,
                                                    color: const Color.fromRGBO(51, 51, 51, 1)
                                                  )
                                                ),
                                                TextSpan(
                                                    text: "${controller.serviceFeeData.value.withdrawAmount}",
                                                    style: TextStyle(
                                                        fontSize: 18.w,
                                                        fontWeight: FontWeight.w700,
                                                        color: const Color.fromRGBO(51, 51, 51, 1)
                                                    )
                                                ),
                                              ]
                                            ),
                                          ),
                                          SizedBox(height: 12.w,),
                                          RichText(
                                            text: TextSpan(
                                                children: [
                                                  TextSpan(
                                                      text: "到账银行卡：",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, .5)
                                                      )
                                                  ),
                                                  TextSpan(
                                                      text: "${controller.nowBankCard.value.bankName}（${controller.nowBankCard.value.cardNum!.substring(controller.nowBankCard.value.cardNum!.length - 4)}）",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, 1)
                                                      )
                                                  ),
                                                ]
                                            ),
                                          ),
                                          SizedBox(height: 12.w,),
                                          RichText(
                                            text: TextSpan(
                                                children: [
                                                  TextSpan(
                                                      text: "到账金额：",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, .5)
                                                      )
                                                  ),
                                                  TextSpan(
                                                      text: "￥${controller.serviceFeeData.value.arrivalAmount}",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, 1)
                                                      )
                                                  ),
                                                ]
                                            ),
                                          ),
                                          SizedBox(height: 12.w,),
                                          RichText(
                                            text: TextSpan(
                                                children: [
                                                  TextSpan(
                                                      text: "提现手续费：",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, .5)
                                                      )
                                                  ),
                                                  TextSpan(
                                                      text: "￥${controller.serviceFeeData.value.withdrawServiceFee} ",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, 1)
                                                      )
                                                  ),
                                                  TextSpan(
                                                      text: " 费率：",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, .5)
                                                      )
                                                  ),
                                                  TextSpan(
                                                      text: "${controller.serviceFeeData.value.withdrawServiceFeePct}%",
                                                      style: TextStyle(
                                                          fontSize: 14.w,
                                                          color: const Color.fromRGBO(51, 51, 51, 1)
                                                      )
                                                  ),
                                                ]
                                            ),
                                          ),
                                          SizedBox(height: 40.w,),
                                          Container(
                                            width: 255.w,
                                            height: 42.w,
                                            decoration: BoxDecoration(
                                                borderRadius: BorderRadius.all(Radius.circular(42.w)),
                                                color: const Color.fromRGBO(117, 98, 249, 1)
                                            ),
                                            child: Center(
                                              child: Text(
                                                "确认提现",
                                                style: TextStyle(
                                                    fontSize: 14.w,
                                                    color: Colors.white,
                                                    fontWeight: FontWeight.w500
                                                ),
                                              ),
                                            ),
                                          ).onTap((){
                                            controller.withdrawSubmit();
                                          })
                                        ],
                                      ),
                                    ),
                                  );
                                });
                              }),
                        );
                      })
                    ],
                  ),
                )
              ],
            ),
          ),
        );
      },
    );
  }

  Widget cardItem(BankCardData item, WithdrawController controller){
    return Container(
      padding: EdgeInsets.only(
          bottom: 12.w
      ),
      margin: EdgeInsets.only(
          bottom: 20.w
      ),
      decoration: BoxDecoration(
          border: Border(
              bottom: BorderSide(
                  width: 1,
                  color: const Color.fromRGBO(238, 238, 238, 1)
              )
          )
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row (
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    "${item.bankName}",
                    style: TextStyle(
                        fontSize: 14.w,
                        fontWeight: FontWeight.w500
                    ),
                  ),
                  Text(
                    "${maskKeepLast(item.cardNum ?? "", 4)}",
                    style: TextStyle(
                        fontSize: 14.w,
                        color: const Color.fromRGBO(153, 153, 153, 1)
                    ),
                  ),
                ],
              )
            ],
          ),
          if(item.id == controller.nowBankCard.value.id) Icon(
            Icons.check,
            size: 20.w,
            color: const Color.fromRGBO(238, 129, 27, 1),
          )
        ],
      ),
    );
  }

  Widget addCard(){
    return Container(
      padding: EdgeInsets.only(
          bottom: 12.w
      ),
      margin: EdgeInsets.only(
          bottom: 20.w
      ),
      decoration: BoxDecoration(
          border: Border(
              bottom: BorderSide(
                  width: 1,
                  color: const Color.fromRGBO(238, 238, 238, 1)
              )
          )
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row (
            children: [
              Image.asset(
                Assets.imagesBankcardIcon,
                width: 16.w,
              ),
              SizedBox(width: 10.w,),
              Text(
                "使用新卡提现",
                style: TextStyle(
                    fontSize: 14.w,
                    fontWeight: FontWeight.w500
                ),
              ),
            ],
          ),
          Icon(
            Icons.keyboard_arrow_right,
            size: 20.w,
            color: const Color.fromRGBO(153, 153, 153, 1),
          )
        ],
      ),
    );
  }
}

class DecimalTextInputFormatter extends TextInputFormatter {
  DecimalTextInputFormatter({this.decimalRange = 2});

  final int decimalRange;

  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue,
      TextEditingValue newValue,
      ) {
    final text = newValue.text;

    // 允许空
    if (text.isEmpty) return newValue;

    // 只允许数字和小数点
    if (!RegExp(r'^\d*\.?\d*$').hasMatch(text)) {
      return oldValue;
    }

    // 只允许一个小数点
    if ('.'.allMatches(text).length > 1) {
      return oldValue;
    }

    // 限制小数位数
    if (text.contains('.')) {
      final parts = text.split('.');
      if (parts.length > 1 && parts[1].length > decimalRange) {
        return oldValue;
      }
    }

    return newValue;
  }
}