import 'dart:io';
import 'dart:typed_data';
import 'dart:ui';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:image_gallery_saver/image_gallery_saver.dart';
import 'package:one_key/provider/user_model.dart';
import 'package:one_key/widgets/round_button.dart';
import 'package:one_key/widgets/system_app_bar.dart';
import 'package:one_key/widgets/v_empty_view.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:provider/provider.dart';

import '../../../constant/state.dart';
import '../../../provider/finance_provider.dart';
import '../../../res/colors.dart';
import '../../../utils/screen_util.dart';
import '../../../utils/utils.dart';
import '../../../widgets/h_empty_view.dart';
import '../../../widgets/loading.dart';
import 'dart:ui' as ui;

/**
 * 收款码
 */

class PaymentCodePage extends StatefulWidget {
  const PaymentCodePage({super.key});

  @override
  State<PaymentCodePage> createState() => _PaymentCodePageState();
}

class _PaymentCodePageState extends State<PaymentCodePage> {
  FinanceProvider? financeProvider;

  final GlobalKey globalKey = GlobalKey();

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

    WidgetsBinding.instance.addPostFrameCallback((_) async {
      _createPayQrcode();
    });
  }

  _createPayQrcode() {
    financeProvider!.createPayQrcode(context);
  }

  /// 截图
  Future<Uint8List?> _capturePng(
    GlobalKey globalKey,
    // {
    // double pixelRatio = 2.0, //截屏的图片与原图的比例
    // }
  ) async {
    try {
      RenderRepaintBoundary boundary =
          globalKey.currentContext?.findRenderObject() as RenderRepaintBoundary;
      double dpr = ui.window.devicePixelRatio; // 获取当前设备的像素比
      var image = await boundary.toImage(pixelRatio: dpr);
      ByteData? byteData = await image.toByteData(format: ImageByteFormat.png);
      Uint8List? pngBytes = byteData?.buffer.asUint8List();
      return pngBytes;
    } catch (e) {
      print(e);
    }
    return null;
  }

  @override
  Widget build(BuildContext context) {
    financeProvider = Provider.of<FinanceProvider>(context, listen: true);
    return Scaffold(
        appBar: SystemAppBar('门店收款码'),
        backgroundColor: MyColours.color_ffffff,
        body: Column(
          children: [
            Expanded(
              child: SingleChildScrollView(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    //二维码图片

                    //
                    RepaintBoundary(
                        key: globalKey,
                        child: Column(
                          children: [
                            Container(
                              margin: EdgeInsets.symmetric(horizontal: w(57)),
                              padding: EdgeInsets.symmetric(
                                  horizontal: w(25), vertical: w(35)),
                              color: MyColours.color_09BB07,
                              child: Column(
                                children: [
                                  Text(
                                    '请使用微信扫一扫',
                                    style: TextStyle(
                                        color: MyColours.color_ffffff,
                                        fontSize: font(16),
                                        fontWeight: FontWeight.bold),
                                  ),
                                  VEmptyView(20),
                                  Consumer<FinanceProvider>(
                                      builder: (context, model, _) {
                                    if (model.pageState != PageState.Success) {
                                      return Container(
                                        height: w(210),
                                        child: Center(
                                            child: SizedBox(
                                                width:
                                                    ScreenUtil().setWidth(40),
                                                height:
                                                    ScreenUtil().setWidth(40),
                                                child:
                                                    CupertinoActivityIndicator(
                                                  color: MyColours.color_ffffff,
                                                ))),
                                      );
                                    } else {
                                      return Container(
                                          padding: EdgeInsets.symmetric(
                                              horizontal: w(21),
                                              vertical: w(16)),
                                          color: MyColours.color_ffffff,
                                          child: Column(
                                            children: [
                                              CachedNetworkImage(
                                                  imageUrl: financeProvider!
                                                      .paymentCodeUrl),
                                              // VEmptyView(28),
                                              Text(
                                                '${Provider.of<UserModel>(context).user!.sellername}',
                                                maxLines: 3,
                                                overflow: TextOverflow.ellipsis,
                                                style: TextStyle(
                                                    color:
                                                        MyColours.color_000000,
                                                    fontSize: font(14)),
                                              )
                                            ],
                                          ));
                                    }
                                  })
                                ],
                              ),
                            ),
                            Container(
                                margin: EdgeInsets.symmetric(horizontal: w(57)),
                                padding: EdgeInsets.symmetric(
                                    horizontal: w(25), vertical: w(11)),
                                decoration: BoxDecoration(
                                    color: MyColours.color_ffffff,
                                    border: Border.all(
                                        color: MyColours.color_09BB07,
                                        width: w(2))),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: [
                                    Image.asset(
                                      Utils.getImgPath('vector'),
                                      width: w(37),
                                    ),
                                    HEmptyView(12),
                                    Text(
                                      '微信支付',
                                      style: TextStyle(
                                          color: MyColours.color_515151,
                                          fontSize: font(28)),
                                    )
                                  ],
                                )),
                          ],
                        )),

                    VEmptyView(160),
                    Padding(
                        padding: EdgeInsets.symmetric(horizontal: w(16)),
                        child: Text(
                          '提示：',
                          textAlign: TextAlign.left,
                          style: TextStyle(
                              fontSize: w(16),
                              height: 1.5,
                              fontWeight: FontWeight.bold,
                              color: MyColours.color_000000),
                        )),
                    Padding(
                        padding: EdgeInsets.symmetric(horizontal: w(16)),
                        child: Text(
                          '请将收款码出示给顾客，顾客扫码支付时可以自动识别拥有的代金券，并自动在餐厅设定的规则下使用。',
                          textAlign: TextAlign.left,
                          style: TextStyle(
                              fontSize: w(14),
                              height: 1.5,
                              color: MyColours.color_000000),
                        ))
                  ],
                ),
              ),
            ),
            Container(
              padding: EdgeInsets.symmetric(vertical: w(13), horizontal: w(79)),
              child: RoundButton(
                text: '保存收款码图片',
                height: w(43),
                radius: r(5),
                gradientStart: MyColours.color_ffffff,
                gradientEnd: MyColours.color_ffffff,
                borderColor: MyColours.color_438E93,
                textColor: MyColours.color_438E93,
                isBold: true,
                fontSize: 32,
                onPressed: () {
                  Utils.getPickPermission(context, () async {
                    //获取截屏图像
                    //添加到图片数组中
                    Loading.showLoading(
                      context,
                    );
                    Uint8List? value = await _capturePng(globalKey);
                    if (value != null) {
                      print(value);
                      final result = await ImageGallerySaver.saveImage(value,
                          quality: 100);
                      if (result != null) {
                        Utils.showToast("保存成功");
                      } else {
                        print('error');
                        Utils.showToast("保存失败");
                        // toast("");
                      }
                      Loading.hideLoading(context);
                      // setState(() {});
                    }
                  }, Platform.isIOS ? Permission.photos : Permission.storage);
                },
              ),
            )
          ],
        ));
  }
}