import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:get/get.dart';
import 'package:worker_client/models/app.dart';
import 'package:worker_client/models/bankCardList.dart';
import 'package:worker_client/models/entities/Bank.dart';
import 'package:worker_client/models/entities/BankCard.dart';
import 'package:worker_client/services/bank.dart';
import 'package:worker_client/widgets/MyButton/index.dart';
import 'package:worker_client/widgets/layout/BasicPage.dart';
import 'package:flutter_picker/flutter_picker.dart';

class AddBankPage extends BasicPage {
  AddBankPage({Key? key}) : super(key: key) {
    naviTitle = '我的银行卡';
  }
  final bankList = Rx<List<Bank>>([]);
  dynamic pickerData = [];
  int index = 0;
  final bankCard = Rx<Map>({});
  AppController store = AppController.t;
  BankCardListController bankCardListStore = BankCardListController.t;
  RegExp exp = RegExp(r'^1[3456789]\d{9}$');

  //表单校验
  bool handleRule() {
    if (bankCard.value['owerName'] == null) {
      Fluttertoast.showToast(msg: '请输入持卡人姓名');
      return false;
    }
    if (bankCard.value['cardNo'] == null) {
      Fluttertoast.showToast(msg: '请输入卡号');
      return false;
    }
    if (bankCard.value['ownerBank'] == null) {
      Fluttertoast.showToast(msg: '请选择开户行');
      return false;
    }
    if (bankCard.value['phone'] == null ||
        !exp.hasMatch(bankCard.value['phone'])) {
      Fluttertoast.showToast(msg: '请输入正确手机号');
      return false;
    }
    bankCard.value['personId'] = store.user().personId;
    return true;
  }

  showPicker(BuildContext context) {
    Picker picker = Picker(
        height: 295.w,
        itemExtent: 40.h,
        adapter: PickerDataAdapter<String>(pickerdata: pickerData),
        selecteds: [index],
        changeToFirst: true,
        onCancel: () {},
        confirmText: '确定',
        cancelText: '取消',
        cancelTextStyle:
            const TextStyle(color: Color(0xff7f7f7f), fontSize: 20),
        confirmTextStyle:
            const TextStyle(color: Color(0xff07c160), fontSize: 20),
        textStyle: const TextStyle(color: Color(0xff191919), fontSize: 20),
        selectedTextStyle:
            const TextStyle(color: Color(0xff191919), fontSize: 20),
        onConfirm: (Picker picker, List<int> value) {
          index = value.first;
          bankCard({
            ...bankCard(),
            'ownerBank': bankList.value[index].name.toString()
          });
        });
    picker.showModal(context);
  }

  @override
  void beforeShow() {
    super.beforeShow();
    getBankList({'pageSize': 500}).then(
      (res) {
        var list = <Bank>[];
        res['records'].forEach((item) {
          list.add(Bank.fromJson(item));
          pickerData.add(Bank.fromJson(item).name);
        });
        bankList(list);
      },
    );
  }

  @override
  Widget builder(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: EdgeInsets.fromLTRB(15.w, 10.h, 0, 0),
          child: Text(
            '请绑定持卡人本人的银行卡',
            style: TextStyle(
                fontSize: 14.sp,
                fontWeight: FontWeight.w500,
                color: const Color(0xff323232)),
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10.h),
          padding: EdgeInsets.symmetric(horizontal: 15.w),
          color: Colors.white,
          height: 54.h,
          child: Row(
            children: [
              Padding(
                padding: EdgeInsets.only(right: 25.w),
                child: Text(
                  '持 卡 人 姓 名：',
                  style: TextStyle(
                      fontSize: 16.sp,
                      color: const Color(0xFF333333),
                      fontWeight: FontWeight.w500),
                ),
              ),
              Expanded(
                child: TextFormField(
                  decoration: const InputDecoration(
                    contentPadding: EdgeInsets.symmetric(vertical: 4.0),
                    hintText: '请输入真实姓名',
                    border: OutlineInputBorder(borderSide: BorderSide.none),
                  ),
                  onChanged: (e) {
                    bankCard.value['owerName'] = e;
                  },
                ),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10.h),
          padding: EdgeInsets.symmetric(horizontal: 15.w),
          color: Colors.white,
          height: 54.h,
          child: Row(
            children: [
              Padding(
                padding: EdgeInsets.only(right: 25.w),
                child: Text(
                  '卡                号：',
                  style: TextStyle(
                      fontSize: 16.sp,
                      color: const Color(0xFF333333),
                      fontWeight: FontWeight.w500),
                ),
              ),
              Expanded(
                child: TextFormField(
                  keyboardType: TextInputType.number,
                  decoration: const InputDecoration(
                    contentPadding: EdgeInsets.symmetric(vertical: 4.0),
                    hintText: '请输入有效卡号',
                    border: OutlineInputBorder(borderSide: BorderSide.none),
                  ),
                  onChanged: (e) {
                    bankCard.value['cardNo'] = e;
                  },
                ),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10.h),
          padding: EdgeInsets.symmetric(horizontal: 15.w),
          color: Colors.white,
          height: 54.h,
          child: Row(
            children: [
              Padding(
                padding: EdgeInsets.only(right: 25.w),
                child: Text(
                  '开      户      行：',
                  style: TextStyle(
                      fontSize: 16.sp,
                      color: const Color(0xFF333333),
                      fontWeight: FontWeight.w500),
                ),
              ),
              Expanded(
                child: GestureDetector(
                  child: Obx(() => Text(bankCard.value['ownerBank'] == null
                      ? '请选择银行'
                      : bankCard.value['ownerBank'].toString())),
                  onTap: () {
                    showPicker(context);
                  },
                ),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(top: 10.h),
          padding: EdgeInsets.symmetric(horizontal: 15.w),
          color: Colors.white,
          height: 54.h,
          child: Row(
            children: [
              Padding(
                padding: EdgeInsets.only(right: 25.w),
                child: Text(
                  '预 留 手 机 号：',
                  style: TextStyle(
                      fontSize: 16.sp,
                      color: const Color(0xFF333333),
                      fontWeight: FontWeight.w500),
                ),
              ),
              Expanded(
                child: TextFormField(
                  keyboardType: TextInputType.number,
                  maxLength: 11,
                  decoration: const InputDecoration(
                    counterText: '',
                    //有就行了  如果文本框不设padding就会向右上偏移
                    contentPadding: EdgeInsets.symmetric(vertical: 1),
                    hintText: '请输入银行卡预留手机号',
                    border: OutlineInputBorder(borderSide: BorderSide.none),
                  ),
                  onChanged: (e) {
                    bankCard.value['phone'] = e;
                  },
                ),
              ),
            ],
          ),
        ),
        const Spacer(),
        Container(
          margin: EdgeInsets.only(left: 15.w, right: 15.w, bottom: 30.h),
          child: MyButton(
            pwith: 30.w,
            text: '绑定',
            type: 0,
            disable: false,
            onClick: () {
              if (handleRule()) {
                addBankCard(bankCard.value).then(
                  (e) {
                    bankList.value.forEach((item) {
                      if (item.name == e['ownerBank']) {
                        e['color1'] = item.color1;
                        e['color2'] = item.color2;
                        e['bankCode'] = item.bankCode;
                      }
                    });
                    List<BankCardModel> list = [];
                    for (var e in bankCardListStore.bankCardList()) {
                      list.add(e);
                    }
                    list.add(BankCardModel.fromJson(e));
                    bankCardListStore.bankCardList(list);
                    Get.back();
                    Fluttertoast.showToast(msg: '添加成功');
                  },
                );
              }
            },
          ),
        ),
      ],
    );
  }
}
