import 'dart:convert';

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:huixiang/data/user_info.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/qr/qr_share_image.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/view_widget/my_appbar.dart';
import 'package:shared_preferences/shared_preferences.dart';

class QrSharePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _QrSharePage();
  }
}

class _QrSharePage extends State<QrSharePage> {
  String? phone = "";

  @override
  void initState() {
    super.initState();

    SharedPreferences.getInstance().then((value) {
      String? user = value.getString('user');
      if (user?.isNotEmpty ?? false) {
        phone = UserInfo.fromJson(jsonDecode(user!)).inviteCode;
        setState(() {});
      }
    });

    buildImageInfo();
  }

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

  @override
  Widget build(BuildContext context) {
    if (height == 0) height = MediaQuery.of(context).size.height;
    return Scaffold(
      appBar: MyAppBar(
        title: "",
        titleColor: Colors.black,
        background: Color(0xFFF7F7F7),
        leadingColor: Colors.black,
        action: Container(
          alignment: Alignment.center,
          margin: EdgeInsets.only(right: 16.w),
          child: InkWell(
            onTap: () {
              if (phone?.isEmpty ?? true) return;
              SmartDialog.show(
                builder: (ctx) => QrShareImagePage(phone!),
                clickMaskDismiss: true,
              );
            },
            child: Icon(
              Icons.share,
              color: Colors.black,
              size: 24.w,
            ),
          ),
        ),
      ),
      body: SingleChildScrollView(
        child: Container(
          height: height,
          child: Stack(
            children: [
              Positioned(
                child: Image.asset(
                  "assets/image/qr_share_bg.webp",
                  fit: BoxFit.fill,
                ),
                top: 0,
                left: 0,
                bottom: 0,
                right: 0,
              ),
              Positioned(
                child: Container(
                  width: MediaQuery.of(context).size.width,
                  height: height * 0.635,
                  padding: EdgeInsets.symmetric(
                    vertical: 28.h,
                    horizontal: 19.w,
                  ),
                  child: Stack(
                    children: [
                      Positioned(
                        child: Image.asset(
                          "assets/image/qr_share_info_bg.webp",
                          fit: BoxFit.fill,
                        ),
                        top: 0,
                        left: 0,
                        bottom: 0,
                        right: 0,
                      ),
                      Column(
                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          shareTypeTitle(S.of(context).wodeyaoqingma),
                          Container(
                              margin: EdgeInsets.only(left: 16.w, right: 24.w),
                              child: GestureDetector(
                                child: SelectableText(
                                  // S.of(context).baocunsaoma,
                                  phone ?? "",
                                  textAlign: TextAlign.center,
                                  style: TextStyle(
                                    color: Color(0xFF2E3552),
                                    fontSize: 40.sp,
                                    fontWeight: MyFontWeight.semi_bold,
                                  ),
                                ),
                                onTap: this.copy(phone),
                              )),
                          // Container(
                          //   width: 152.w,
                          //   height: 152.w,
                          //   decoration: BoxDecoration(
                          //     border: Border.all(
                          //       color: Color(0xFF2E3552),
                          //       width: 1,
                          //     ),
                          //   ),
                          //   child: QrImage(
                          //     data: "http://mp.hx.lotus-wallet.com/pages/invite/index?mobile=${phone ?? ""}",
                          //     version: QrVersions.auto,
                          //     size: 200.w,
                          //     gapless: true,
                          //   ),
                          // ),
                          shareTypeTitle(S.of(context).haoyoujiangliguize),
                          Container(
                            margin: EdgeInsets.only(left: 16.w, right: 24.w),
                            child: Text(
                              // S.of(context).fenxiangyaoqing,
                              S.of(context).fenxiangyaoqingma,
                              textAlign: TextAlign.center,
                              style: TextStyle(
                                height: 1.5,
                                color: Color(0xFF2E3552),
                                fontSize: 16.sp,
                                fontWeight: MyFontWeight.regular,
                              ),
                            ),
                          ),
                          // Container(
                          //   margin: EdgeInsets.only(left: 16.w, right: 24.w),
                          //   child: Text(
                          //     // S.of(context).fenxiangyaoqing,
                          //     S.of(context).beiyaoqingdejiangli,
                          //     textAlign: TextAlign.center,
                          //     style: TextStyle(
                          //       color: Color(0xFF2E3552),
                          //       fontSize: 16.sp,
                          //       fontWeight: MyFontWeight.regular,
                          //     ),
                          //   ),
                          // ),
                          SizedBox(
                            height: 1.h,
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
                left: 0,
                bottom: 0,
                right: 0,
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget shareTypeTitle(typeText) {
    return Container(
      width: 140.w,
      height: 30.h,
      child: Text(
        typeText,
        style: TextStyle(
          fontWeight: MyFontWeight.regular,
          fontSize: 16.sp,
          color: Color(0xFF2E3552),
        ),
      ),
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: Color(0xFFFFC93B),
        border: Border.all(
          color: Color(0xFF2E3552),
          width: 1,
        ),
      ),
    );
  }

  double height = 0;

  buildImageInfo() async {
    Image image = Image.asset("assets/image/qr_share_bg_yq.webp");
    image.image
        .resolve(ImageConfiguration())
        .addListener(ImageStreamListener((ImageInfo info, bool _) {
      height = info.image.height.toDouble();
      setState(() {});
    }));
  }

  copy(String? phone) {
    if (phone?.isEmpty ?? true) {
      return;
    }
    Clipboard.setData(ClipboardData(text: phone!));
  }
}