import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:project_telephony/base/base_style.dart';
import 'package:project_telephony/ui/home/home_page.dart';
import 'package:project_telephony/ui/login/login_page.dart';
import 'package:project_telephony/ui/user/members_page.dart';
import 'package:project_telephony/ui/user/privacy_rights_page.dart';
import 'package:project_telephony/ui/widget/image_scaffold.dart';
import 'package:project_telephony/ui/widget/plone_bottom.dart';
import 'package:project_telephony/utils/headers.dart';

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

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

@override
void initState() {}

class _UserPageState extends State<UserPage> {
  bool bl = true;
  bool vle = false;
  @override
  Widget build(BuildContext context) {
    return CloudScaffold(
      systemStyle: const SystemUiOverlayStyle(
        statusBarIconBrightness: Brightness.dark,
        // systemNavigationBarColor: Colors.white,
      ),
      path: Assets.images.bg.path,
      bodyColor: Colors.white,
      extendBody: true,
      body: Column(children: [
        _getUser(),
        72.hb,
        _getBanner(),
        120.hb,
        _getSwitch(Assets.icons.switch1.path, "功能开关", true),
        _getSwitch(Assets.icons.privacy.path, "隐私政策", false),
        _getSwitch(Assets.icons.permissions.path, "权限说明", false),
        // const Spacer(),
        182.hb,
        PloneBottom(
          border: false,
          onTap: () {
            Get.to(() => const HomePage());
          },
          textColor: const Color(0xFF1890FF),
          color1: const Color(0xFFEBF5FF),
          color2: const Color(0xFFEBF5FF),
          text: "退出登录",
        )
      ]),
    );
  }

  //头像
  _getUser() {
    return GestureDetector(
      onTap: () {
        Get.to(() => const LoginPage());
      },
      child: Container(
        margin: EdgeInsets.only(left: 64.w, right: 64.w, top: 216.w),
        child: Row(
          children: [
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  bl ? "登录/注册" : "xxxxx",
                  style: TextStyle(
                      fontSize: BaseStyle.fontSize48,
                      color: BaseStyle.color333333,
                      fontWeight: FontWeight.bold),
                ),
                24.hb,
                Text(
                  bl ? "登录获取更多信息" : "欢迎您登录短信帮手",
                  style: TextStyle(
                      fontSize: BaseStyle.fontSize28,
                      color: BaseStyle.color333333),
                )
              ],
            ),
            const Spacer(),
            Container(
              child: ClipOval(
                child: Image.asset(
                  Assets.images.portrait.path,
                  height: 128.w,
                  width: 128.w,
                  fit: BoxFit.cover,
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

//banner
  _getBanner() {
    return SizedBox(
      // margin: EdgeInsets.symmetric(horizontal: 32.w),
      height: 144.w,
      child: Stack(children: [
        Align(
            child: SizedBox(
          width: 622.w,
          child: Image.asset(
            Assets.images.banner.path,
            fit: BoxFit.fill,
          ),
        )),
        Positioned(
            child: Container(
          padding: EdgeInsets.symmetric(horizontal: 112.w, vertical: 24.w),
          // margin: EdgeInsets.symmetric(horizontal: 64.w, vertical: 16.w),
          // padding: EdgeInsets.symmetric(),
          child: Row(
            children: [_getText(), const Spacer(), _getBotton()],
          ),
        ))
      ]),
    );
  }

//banner botton
  _getBotton() {
    return GestureDetector(
      onTap: () {
        Get.to(() => const MembersPage());
      },
      child: Container(
          padding: EdgeInsets.symmetric(horizontal: 32.w, vertical: 16.w),
          decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(30.w),
              gradient: const LinearGradient(
                  colors: [Color(0xFFFFF6D8), Color(0xFFFFEAB0)],
                  begin: Alignment.centerLeft,
                  end: Alignment.centerRight)),
          child: Text(
            "立即开通",
            style: TextStyle(
                color: const Color(0xFF001F3F), fontSize: BaseStyle.fontSize24),
          )),
    );
  }

//banner 文字
  _getText() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        _getVip(),
        16.hb,
        Text(
          "解锁全部功能",
          style: TextStyle(color: Colors.white, fontSize: BaseStyle.fontSize24),
        )
      ],
    );
  }

  _getVip() {
    return Row(
      children: [
        const Text(
          "vip",
          style: TextStyle(color: Color(0xFFFFEAB0)),
        ),
        Container(
          width: 8.w,
          height: 8.w,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(4),
            color: const Color(0xFFFFEAB0),
          ),
        ),
        const Text(
          "未开通会员",
          style: TextStyle(color: Color(0xFFFFEAB0)),
        )
      ],
    );
  }

//内容
  _getSwitch(String url, String name, bool pd) {
    return GestureDetector(
      onTap: () {
        pd
            ? ""
            : Get.to(() => PrivacyRightsPage(
                  name: name,
                ));
      },
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 32.w),
        child: ListTile(
            // onTap: (() {}),
            leading: Image.asset(
              url,
              height: 54.w,
              width: 56.w,
              fit: BoxFit.fill,
            ),
            title: Text(
              name,
              style: TextStyle(
                  color: BaseStyle.color333333,
                  fontSize: BaseStyle.fontSize34,
                  fontWeight: FontWeight.bold),
            ),
            trailing: pd
                ? Switch(
                    value: vle,
                    onChanged: (value) {
                      setState(() {
                        vle = value;
                      });
                    })
                : const Icon(Icons.keyboard_arrow_right)),
      ),
    );
  }
}