import 'dart:ui';

import 'package:Parlando/apis/api_response.dart';
import 'package:Parlando/login/login_router.dart';
import 'package:Parlando/membership/models/membership_entity.dart';
import 'package:Parlando/membership/models/order_entity.dart';
import 'package:Parlando/membership/models/pay_entity.dart';
import 'package:Parlando/membership/view_models/membership_view_model.dart';
import 'package:Parlando/net/dio_utils.dart';
import 'package:Parlando/net/http_api.dart';
import 'package:Parlando/res/constant.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flustars/flustars.dart';
import 'package:flutter/material.dart';
import 'package:Parlando/res/resources.dart';
import 'package:Parlando/routers/fluro_navigator.dart';
import 'package:Parlando/extension/int_extension.dart';
import 'package:Parlando/util/toast_utils.dart';
import 'package:flutter_braintree/flutter_braintree.dart';
import 'package:provider/provider.dart';

class MembershipPage extends StatefulWidget {
  const MembershipPage({Key? key}) : super(key: key);

  @override
  MembershipPageState createState() => MembershipPageState();
}

class MembershipPageState extends State<MembershipPage>
    with WidgetsBindingObserver {
  bool _isLoading = false;

  @override
  void initState() {
    super.initState();
    if (SpUtil.containsKey(Constant.userToken)!) {
      Provider.of<MembershipViewProvider>(context, listen: false)
          .setSelectedMembership(null);
      Provider.of<MembershipViewProvider>(context, listen: false)
          .fetchMembershipData('0');
    } else {
      NavigatorUtils.push(context, LoginRouter.loginPage, replace: true);
    }
  }

  @override
  Widget build(BuildContext context) {
    ApiResponse apiResponse =
        Provider.of<MembershipViewProvider>(context).response;
    switch (apiResponse.status) {
      case Status.LOADING:
        return const Center(child: CircularProgressIndicator());
      case Status.COMPLETED:
        MembershipData mb = apiResponse.data as MembershipData;
        return SafeArea(
          child: Scaffold(
            backgroundColor: Colors.black,
            body: Container(
              alignment: Alignment.topCenter,
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: CachedNetworkImageProvider(mb.bgImages!),
                  fit: BoxFit.fill,
                ),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    child: IconButton(
                      onPressed: () {
                        NavigatorUtils.goBack(context);
                      },
                      icon: const Icon(
                        Icons.arrow_back_ios,
                        color: Colors.white,
                      ),
                    ),
                  ),
                  const Spacer(),
                  Container(
                    margin: EdgeInsets.symmetric(
                        vertical: 60.px, horizontal: 20.px),
                    height: MediaQuery.of(context).size.height / 2,
                    width: double.infinity,
                    decoration: BoxDecoration(
                      color: Colors.grey.shade200.withOpacity(0.1),
                      border: Border.all(
                        color: Colors.grey.shade50,
                        width: 0.5,
                      ), // 边色与边宽度
                    ),
                    child: ClipRect(
                      child: BackdropFilter(
                        filter: ImageFilter.blur(
                          sigmaX: 10.0,
                          sigmaY: 10.0,
                        ),
                        child: Container(
                          decoration: BoxDecoration(
                            color: Colors.grey.shade200.withOpacity(0.1),
                          ),
                          child: Padding(
                            padding: EdgeInsets.all(10.px),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                Text(
                                  mb.title!,
                                  style: TextStyle(
                                    fontSize: 18.px,
                                    color: Colors.white,
                                  ),
                                ),
                                Gaps.vGap24,
                                // TODO 如果会员则显示会员详情
                                Expanded(
                                  child: ListView.builder(
                                    itemExtent: 48.0,
                                    itemBuilder: (_, index) {
                                      return _buildItem(mb.goodsList![index]);
                                    },
                                    itemCount: mb.goodsList!.length,
                                  ),
                                ),
                                Gaps.vGap24,
                                Text(
                                  mb.intro!,
                                  style: TextStyle(
                                    fontSize: 14.px,
                                    color: Colors.white,
                                  ),
                                ),
                                Gaps.vGap10,
                                Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceBetween,
                                  mainAxisSize: MainAxisSize.min,
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    TextButton(
                                      onPressed: () {},
                                      child: Text(
                                        "服务协议",
                                        style: TextStyle(
                                          fontSize: 14.px,
                                          color: Colors.white,
                                        ),
                                      ),
                                    ),
                                    Container(
                                      width: 0.6,
                                      height: 15.0,
                                      color: Colours.line,
                                    ),
                                    TextButton(
                                      onPressed: () {},
                                      child: Text(
                                        "隐私政策",
                                        style: TextStyle(
                                          fontSize: 14.px,
                                          color: Colors.white,
                                        ),
                                      ),
                                    ),
                                    Container(
                                      width: 0.6,
                                      height: 15.0,
                                      color: Colours.line,
                                    ),
                                    TextButton(
                                      onPressed: () {},
                                      child: Text(
                                        "恢复购买",
                                        style: TextStyle(
                                          fontSize: 14.px,
                                          color: Colors.white,
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        );
      case Status.ERROR:
        return Center(
          child: Text('暂时无法获取数据，请稍候再试！${apiResponse.message}'),
        );
      case Status.INITIAL:
      default:
        return const Center(
          child: Text('正在获取数据....'),
        );
    }
  }

  Widget _buildItem(MembershipDataGoodsList goods) {
    return Flex(
      direction: Axis.horizontal,
      children: [
        Text(
          goods.name!,
          style: const TextStyle(
            color: Colors.white,
            fontSize: 15.0,
          ),
        ),
        Gaps.hGap10,
        Expanded(
          flex: 1,
          child: Align(
            alignment: Alignment.centerRight,
            child: Text(
              goods.price!,
              style: const TextStyle(
                color: Colors.white,
                fontSize: 15.0,
              ),
            ),
          ),
        ),
        Gaps.hGap32,
        ElevatedButton(
          child: const Text(
            "开通",
            style: TextStyle(color: Colors.white, fontSize: 15.0),
          ),
          onPressed: () {
            DioUtils.instance.requestNetwork<OrderEntity>(
              Method.post,
              HttpApi.order,
              params: {'goods_id': goods.id},
              onSuccess: (data) {
                String orderSn = data!.data!.orderSn!;
                DioUtils.instance.requestNetwork<PayEntity>(
                  Method.get,
                  "${HttpApi.pay}?order_sn=$orderSn&pay_type=paypal",
                  params: [],
                  onSuccess: (data) {
                    String id = data!.data!.id!;
                    payPalRequest(id);
                    _isLoading = false;
                  },
                  onError: (code, msg) {
                    Toast.show(msg.toString());
                    _isLoading = false;
                    setState(() {});
                  },
                );
                _isLoading = false;
              },
              onError: (code, msg) {
                Toast.show(msg.toString());
                _isLoading = false;
                setState(() {});
              },
            );
          },
        ),
      ],
    );
  }

  Future<void> payPalRequest(String key) async {
    final request = BraintreePayPalRequest(
      amount: '0.01',
      currencyCode: 'CNY',
      billingAgreementDescription: '贝宝支付很无敌',
    );
    BraintreePaymentMethodNonce? result = await Braintree.requestPaypalNonce(
      key,
      request,
    );
    if (result != null) {
      print('Nonce: ${result.nonce}');
    } else {
      print('PayPal flow was canceled.');
    }
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {}

  @override
  void dispose() {
    super.dispose();
  }
}