import 'package:flutter/material.dart';
import 'package:fun_selfie_app/utils/common_toast.dart';
import 'package:fun_selfie_app/widgets/home_button.dart';
import 'package:fun_selfie_app/widgets/common_form_item.dart';

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

  @override
  State<StatefulWidget> createState() => _PhotoOverPageState();
}

class _PhotoOverPageState extends State<PhotoOverPage> {
  final TextEditingController printNum = TextEditingController();
  Widget renderImgBox(String imgSrc) {
    final screenSize = MediaQuery.of(context).size;
    return Container(
      padding: const EdgeInsets.only(top: 20),
      constraints: BoxConstraints(
          maxHeight: screenSize.height * 0.4, maxWidth: screenSize.width / 4),
      child: Image(
        image: AssetImage(imgSrc),
        fit: BoxFit.fill,
        width: (screenSize.width) / 4,
      ),
    );
  }

  Widget heightButton(
      String txt, Color? backgroundColor, VoidCallback? onPressed) {
    return SizedBox(
      height: 60,
      child: OutlinedButton(
        style: ButtonStyle(
            shadowColor: MaterialStateProperty.all(Colors.transparent),
            backgroundColor: MaterialStateProperty.all(backgroundColor)),
        onPressed: onPressed,
        child: Text(
          txt,
          style: const TextStyle(
              fontSize: 20, color: Color.fromRGBO(121, 72, 234, 1)),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final screenSize = MediaQuery.of(context).size;
    return Scaffold(
        body: Container(
      width: screenSize.width,
      height: screenSize.height,
      color: const Color.fromARGB(100, 229, 229, 229),
      child: Stack(children: <Widget>[
        Padding(
            padding: const EdgeInsets.all(10),
            child: Row(
              children: [
                Container(
                    width: (screenSize.width / 4) + 40,
                    color: const Color(0xffFF5833),
                    child: SingleChildScrollView(
                        child: Column(children: [
                      renderImgBox('static/images/photo_img1.png'),
                      renderImgBox('static/images/photo_img2.png'),
                      renderImgBox('static/images/photo_img3.png'),
                      renderImgBox('static/images/photo_img4.png'),
                    ]))),
                Container(
                    width: (screenSize.width - (screenSize.width / 3)),
                    alignment: Alignment.center,
                    child: SizedBox(
                        width: (screenSize.width / 3),
                        child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: <Widget>[
                              Image(
                                  image: const AssetImage(
                                      'static/images/qrcode.png'),
                                  fit: BoxFit.fill,
                                  width: (screenSize.width) / 5,
                                  height: (screenSize.width) / 5),
                              const SizedBox(height: 40),
                              const Text(
                                '手机扫码看照片直播',
                                style: TextStyle(
                                    fontSize: 24,
                                    color: Color.fromRGBO(121, 72, 234, 100)),
                              ),
                              const SizedBox(height: 40),
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceEvenly,
                                children: [
                                  heightButton('打印',
                                      const Color.fromARGB(14, 98, 0, 238), () {
                                    CommonToast.okToast('打印');
                                  }),
                                  heightButton('打印多张', Colors.transparent, () {
                                    showAlertDialog(
                                      context,
                                    );
                                  }),
                                  heightButton('不满意重拍', Colors.transparent, () {
                                    Navigator.pushNamed(context, "/takePhoto");
                                  }),
                                  heightButton('返回',
                                      const Color.fromARGB(14, 98, 0, 238), () {
                                    Navigator.pushNamed(
                                        context, "/photography");
                                  }),
                                ],
                              )
                            ]))),
              ],
            )),
        const HomeButton()
      ]),
    ));
  }

  Future<void> showAlertDialog(BuildContext context) async {
    return showDialog<void>(
      context: context,
      barrierDismissible: false, // 点击对话框外部时，是否关闭对话框
      builder: (BuildContext context) {
        return AlertDialog(
          title: const Text('打印多张'),
          content: SizedBox(
            width: 400,
            child: CommonFormItem(
              label: '打印数量',
              hitText: '请输入',
              controller: printNum,
              validator: (v) => (v == '') ? "请输入" : null,
            ),
          ),
          actions: <Widget>[
            TextButton(
              child: const Text('取消',
                  style: TextStyle(
                      color: Color.fromARGB(255, 98, 0, 238), fontSize: 20)),
              onPressed: () {
                printNum.text = '';
                Navigator.of(context).pop();
              },
            ),
            TextButton(
              child: const Text('确定',
                  style: TextStyle(
                      color: Color.fromARGB(255, 98, 0, 238), fontSize: 20)),
              onPressed: () {
                if (printNum.text == '') {
                  CommonToast.errToast('请填写打印数量');
                  return;
                } else {
                  RegExp numbers = RegExp(r"\d+$");
                  if (!numbers.hasMatch(printNum.text)) {
                    CommonToast.errToast('请填写正整数');
                    return;
                  }
                }
                Navigator.of(context).pop();
              },
            ),
          ],
        );
      },
    );
  }
}