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

class LineUpDialog extends StatefulWidget {
  final Function onTap;
  final int num;

  LineUpDialog(Key key, {required this.onTap, required this.num}) : super(key: key);

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

class LineUpDialogState extends State<LineUpDialog> with SingleTickerProviderStateMixin {
  int nub = 2;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    nub = widget.num + 1;
  }

  void setNum(value) {
    // if (value < nub) {
    setState(() {
      nub = value + 1;
    });
    // }
  }

  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    final h314 = size.width / 1.1464968152866;
    final t29 = size.width / 12.413793103448;
    final w130 = size.width / 2.7692307692307;
    final w102 = size.width / 3.5294117647058;
    final h32 = size.width / 11.25;
    final t30 = size.width / 12;

    return Material(
      type: MaterialType.transparency,
      color: const Color(0x1A000000),
      child: Container(
        alignment: Alignment.bottomCenter,
        child: Container(
          width: size.width,
          height: h314,
          decoration: const BoxDecoration(
            color: Color(0xFF202530),
            borderRadius: BorderRadius.only(topLeft: Radius.circular(11), topRight: Radius.circular(11)),
          ),
          child: Column(
            children: [
              Container(
                margin: EdgeInsets.only(top: t29),
                child: const Text(
                  "排队中",
                  style: TextStyle(fontSize: 14, color: Color(0xFFD6D6D7)),
                ),
              ),
              SizedBox(
                width: w130,
                height: w130,
                child: Lottie.asset(
                  'assets/animation/line_up.json',
                  repeat: true,
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 10),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text(
                      "您当前位于第",
                      style: TextStyle(fontSize: 13, color: Color(0xFF9D9D9D)),
                    ),
                    Text(
                      " $nub ",
                      style: TextStyle(fontSize: 13, color: Color(0xFFFBB259)),
                    ),
                    Text(
                      "位",
                      style: TextStyle(fontSize: 13, color: Color(0xFF9D9D9D)),
                    ),
                  ],
                ),
              ),
              GestureDetector(
                onTap: () {
                  Navigator.pop(context);
                  widget.onTap();
                },
                child: Container(
                  width: w102,
                  height: h32,
                  margin: EdgeInsets.only(top: t30),
                  alignment: Alignment.center,
                  decoration: const BoxDecoration(
                    color: Color(0xFF074CE7),
                    borderRadius: BorderRadius.all(Radius.circular(18)),
                  ),
                  child: const Text(
                    "取消排队",
                    style: TextStyle(fontSize: 13, color: Colors.white),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}