import 'package:deus_app/common/style/gsy_style.dart';
import 'package:deus_app/common/utils/ConstantString.dart';
import 'package:deus_app/model/drop_menu_item.dart';
import 'package:flutter/material.dart';

class MyDrawer extends StatefulWidget {
  final _CallBack callback;

  const MyDrawer({super.key,required this.callback});

  @override
  State createState() {
    return _myDrawer();
  }
}

DropMenuItem boy = DropMenuItem('男', 1);
DropMenuItem girl = DropMenuItem('女', 2);
DropMenuItem sexSelect = DropMenuItem('男', 1);
List<DropMenuItem> sexMenuItems = [boy, girl];

typedef _CallBack = void Function(int selectIndex, String selectStr);

class _myDrawer extends State<MyDrawer> {

  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: MediaQuery.removePadding(
        context: context,
        //移除抽屉菜单顶部默认留白
        removeTop: true,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(top: 50.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    '设备名称',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: 40,
                    child: TextField(
                      decoration: InputDecoration(
                        border: OutlineInputBorder(),
                      ),
                      style: TextStyle(fontSize: 14),
                      onChanged: (value) {
                        _device = value;
                      },
                    ),
                  ),
                  flex: 7,
                ),
              ]),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    '展示名称',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: 40,
                    child: TextField(
                      decoration: InputDecoration(border: OutlineInputBorder()),
                      style: TextStyle(fontSize: 14),
                      onChanged: (value) {
                        _username = value;
                      },
                    ),
                  ),
                  flex: 7,
                ),
              ]),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    'devicekey',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  child: Container(
                    height: 40,
                    child: TextField(
                      decoration: InputDecoration(border: OutlineInputBorder()),
                      style: TextStyle(fontSize: 14),
                      onChanged: (value) {
                        _deviceKey = value;
                      },
                    ),
                  ),
                  flex: 7,
                ),
              ]),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    '产品名称',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  flex: 7,
                  child: Container(
                    height: 40,
                    child: TextField(
                      decoration: InputDecoration(border: OutlineInputBorder()),
                      style: TextStyle(fontSize: 14),
                      onChanged: (value) {
                        setState(() {
                          _product = value;
                        });
                      },
                    ),
                  ),
                ),
              ]),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    '设备类型',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  flex: 7,
                  child: Container(
                    child: dropDownButtonsColumn(sexMenuItems, '性别', sexSelect),
                  ),
                ),
              ]),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    '设备状态',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  flex: 7,
                  child: Container(
                    child: dropDownButtonsColumn(sexMenuItems, '性别', sexSelect),
                  ),
                ),
              ]),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 20.0, left: 10, right: 10),
              child: Row(children: [
                Expanded(
                  flex: 2,
                  child: Text(
                    '启用状态',
                    style: TextStyle(
                      color: Colors.black,
                      fontSize: GSYConstant.minTextSize,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ),
                Expanded(
                  flex: 7,
                  child: Container(
                    child: dropDownButtonsColumn(sexMenuItems, '性别', sexSelect),
                  ),
                ),
              ]),
            ),
            SizedBox(
              height: 60,
            ),
            Row(
              crossAxisAlignment: CrossAxisAlignment.end,
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                TextButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  child: Text(ConstantString.cancel),
                  style: ButtonStyle(
                      backgroundColor:
                          MaterialStateProperty.all<Color>(Color(0xFF4875EC)),
                      foregroundColor:
                          MaterialStateProperty.all<Color>(Colors.white),
                      minimumSize: MaterialStateProperty.all(Size(80, 40)),
                      padding: MaterialStateProperty.all(EdgeInsets.zero)),
                ),

                SizedBox(
                  width: 20,
                ),

                TextButton(
                  onPressed: () {
                    if (widget.callback != null) {
                      widget.callback(0,"aaa");
                    }
                  },
                  child: Text(ConstantString.query),
                  style: ButtonStyle(
                      backgroundColor:
                          MaterialStateProperty.all<Color>(Color(0xFF4875EC)),
                      foregroundColor:
                          MaterialStateProperty.all<Color>(Colors.white),
                      minimumSize: MaterialStateProperty.all(Size(80, 40)),
                      padding: MaterialStateProperty.all(EdgeInsets.zero)),
                ),
                SizedBox(
                  width: 20,
                ),

                // new GSYFlexButton(
                //   text: ConstantString.query,
                //   color: Color(0xFF4875EC),
                //   textColor: GSYColors.textWhite,
                //   fontSize: 14,
                //   onPress:()=>Navigator.pop(context),
                // ),
              ],
            )
          ],
        ),
      ),
    );
  }

  static const SEX = ['男', '女', '保密'];
  String _device = '', _username = '', _deviceKey = '', _product = '';

  Widget dropDownButtonsColumn(List<DropMenuItem> list, String hint, DropMenuItem select) {
    return Container(
      height: 40,
      //gives the height of the dropdown button
      width: MediaQuery.of(context).size.width,
      //gives the width of the dropdown button
      decoration: BoxDecoration(
        border: new Border.all(
          color: Colors.grey, //边框颜色
          width: 1.0, //边框粗细
        ),
        borderRadius:
            const BorderRadius.all(const Radius.circular(4.0)), //边框的弧度
      ),
      // padding: const EdgeInsets.symmetric(horizontal: 13), //you can include padding to control the menu items
      child: Theme(
          data: Theme.of(context).copyWith(
              // canvasColor: Colors.white, // background color for the dropdown items
              buttonTheme: ButtonTheme.of(context).copyWith(
            alignedDropdown:
                true, //If false (the default), then the dropdown's menu will be wider than its button.
          )),
          child: DropdownButtonHideUnderline(
            // to hide the default underline of the dropdown button
            child: DropdownButton<String>(
              iconEnabledColor: Color(0xFF595959),
              // icon color of the dropdown button
              items: list.map((dropMenuItem) {
                return DropdownMenuItem<String>(
                  value: dropMenuItem.label,
                  child: Text(
                    dropMenuItem.label,
                    style: TextStyle(fontSize: 15),
                  ),
                );
              }).toList(),
              hint: Text(
                hint,
                style: TextStyle(fontSize: 15),
              ),
              // setting hint
              onChanged: (String? value) {
                setState(() {
                  sexSelect.label = value!; // saving the selected value
                });
              },
              value: sexSelect.label, // displaying the selected value
            ),
          )),
    );
  }
}

abstract class OnClickListener {
  void onConfirm();
}