import 'package:flutter/material.dart';
import 'package:get/get.dart';

import '../constants.dart';
import '../utils/api.dart';
import '../utils/global.dart';
import '../utils/http_utils.dart';
import '../utils/size_fit.dart';
import 'component/top_container.dart';

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

  @override
  State<Account> createState() => _AccountState();
}

class _AccountState extends State<Account> with RouteAware {
  String email = '', phone = '';
  bool isBindPhone = false;
  @override
  void initState() {
    // TODO: implement initState
    getUserInfo();
    super.initState();
  }

  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    super.didChangeDependencies();
    Global().routeObserver!.subscribe(this, ModalRoute.of(context)!);
  }

  @override
  void didPopNext() {
    // TODO: implement didPopNext
    getUserInfo();
    super.didPopNext();
  }

  Future getUserInfo() async {
    var data = await HttpUtils.get(Api.userInfo);
    setState(() {
      if (data['email'] != null) {
        email = data['email'];
      }

      if (data['mobile_bind']) {
        isBindPhone = true;
      }
      phone = data['mobile'];
    });
  }

  @override
  Widget build(BuildContext context) {
    SizeFit.initialize(context);
    TextStyle textStyle = TextStyle(
        color: Colors.white, fontSize: 16.px, fontWeight: FontWeight.bold);
    return Material(
        color: kBgColor,
        child: TopContainer(
            child: Stack(children: [
          Column(children: [
            Container(
              width: 343.px,
              margin: EdgeInsets.only(top: 16.px),
              padding: EdgeInsets.all(20.px),
              decoration: BoxDecoration(
                  color: const Color(0xFF2C2C2E),
                  borderRadius: BorderRadius.circular(24.px)),
              child: Column(
                children: [
                  GestureDetector(
                    onTap: () {
                      if (!isBindPhone) {
                        Get.toNamed('/bind', parameters: {'type': 'sms'});
                      }
                    },
                    child: Row(
                      children: [
                        Image.asset(
                          'assets/images/bind_phone.png',
                          width: 24.px,
                          height: 24.px,
                        ),
                        SizedBox(
                          width: 8.px,
                        ),
                        Expanded(
                            child: Text(
                          '手机',
                          style: textStyle,
                        )),
                        Text(
                          isBindPhone ? phone : '立即绑定',
                          style: TextStyle(
                              color: isBindPhone
                                  ? const Color(0xFF74747A)
                                  : kBtnColor,
                              fontSize: 14.px),
                        )
                      ],
                    ),
                  ),
                  Container(
                    height: 1.px,
                    color: const Color(0xFF404040),
                    margin: EdgeInsets.only(top: 18.px, bottom: 18.px),
                  ),
                  GestureDetector(
                    onTap: (() {
                      if (email.isEmpty) {
                        Get.toNamed('/bind', parameters: {'type': 'email'});
                      }
                    }),
                    child: Row(
                      children: [
                        Image.asset(
                          'assets/images/bind_email.png',
                          width: 24.px,
                          height: 24.px,
                        ),
                        SizedBox(
                          width: 8.px,
                        ),
                        Expanded(
                            child: Text(
                          '邮箱',
                          style: textStyle,
                        )),
                        Text(
                          email.isNotEmpty ? email : '立即绑定',
                          style: TextStyle(
                              color: email.isNotEmpty
                                  ? const Color(0xFF74747A)
                                  : kBtnColor,
                              fontSize: 14.px),
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
            Container(
              width: 343.px,
              margin: EdgeInsets.only(top: 16.px),
              padding: EdgeInsets.all(20.px),
              decoration: BoxDecoration(
                  color: const Color(0xFF2C2C2E),
                  borderRadius: BorderRadius.circular(24.px)),
              child: Column(
                children: [
                  GestureDetector(
                    onTap: (() {
                      if (!isBindPhone) {
                        Get.toNamed('/bind', parameters: {'type': 'sms'});
                      }
                    }),
                    child: Row(
                      children: [
                        Image.asset(
                          'assets/images/bind_phone.png',
                          width: 24.px,
                          height: 24.px,
                        ),
                        SizedBox(
                          width: 8.px,
                        ),
                        Expanded(
                            child: Text(
                          '微信',
                          style: textStyle,
                        )),
                        Text(
                          '立即绑定',
                          style: TextStyle(color: kBtnColor, fontSize: 14.px),
                        )
                      ],
                    ),
                  ),
                  Container(
                    height: 1.px,
                    color: const Color(0xFF404040),
                    margin: EdgeInsets.only(top: 18.px, bottom: 18.px),
                  ),
                  GestureDetector(
                    child: Row(
                      children: [
                        Image.asset(
                          'assets/images/bind_email.png',
                          width: 24.px,
                          height: 24.px,
                        ),
                        SizedBox(
                          width: 8.px,
                        ),
                        Expanded(
                            child: Text(
                          'QQ',
                          style: textStyle,
                        )),
                        Text(
                          '立即绑定',
                          style: TextStyle(color: kBtnColor, fontSize: 14.px),
                        )
                      ],
                    ),
                  ),
                  Container(
                    height: 1.px,
                    color: const Color(0xFF404040),
                    margin: EdgeInsets.only(top: 18.px, bottom: 18.px),
                  ),
                  GestureDetector(
                    child: Row(
                      children: [
                        Image.asset(
                          'assets/images/bind_email.png',
                          width: 24.px,
                          height: 24.px,
                        ),
                        SizedBox(
                          width: 8.px,
                        ),
                        Expanded(
                            child: Text(
                          '微博',
                          style: textStyle,
                        )),
                        Text(
                          '立即绑定',
                          style: TextStyle(color: kBtnColor, fontSize: 14.px),
                        )
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ]),
        ])));
  }
}