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

import '../network/NetworkConfig.dart';

class AddNoteDialog extends StatefulWidget {
 final Function onTap;

  const AddNoteDialog({
    super.key,
    required this.onTap,
  });

  @override
  State<AddNoteDialog> createState() => _AddNoteDialogState();
}

class _AddNoteDialogState extends State<AddNoteDialog> {
  final TextEditingController _businessNameController = TextEditingController();

  final TextEditingController _portNumber1Controller = TextEditingController();
  final TextEditingController _portNumber2Controller = TextEditingController();
  final TextEditingController _portNumber3Controller = TextEditingController();

  // final List<String> items2 = ['电视', '光缆', '大会员', '电信', '联通'];

  String selectedValue = "";
  String selectedValue2 = "";

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    selectedValue = NetworkConfig.diverItems.first;
    selectedValue2 = NetworkConfig.businessItems.first;
  }

  @override
  void dispose() {
    // TODO: implement dispose
    _businessNameController.dispose();
    _portNumber1Controller.dispose();
    _portNumber2Controller.dispose();
    _portNumber3Controller.dispose();
    super.dispose();
  }

  submitInfo() {
    if (_businessNameController.text == "") {
      EasyLoading.showToast("请输入业务名称");
      return;
    }

    if (_portNumber1Controller.text == "" || _portNumber2Controller.text == "" || _portNumber3Controller.text == "") {
      EasyLoading.showToast("请输入端口号");
      return;
    }

    widget.onTap(_businessNameController.text, selectedValue, selectedValue2,
        "${_portNumber1Controller.text}/${_portNumber2Controller.text}/${_portNumber3Controller.text}");

    Navigator.pop(context);
  }

  @override
  Widget build(BuildContext context) {
    final bottomInset = MediaQuery.of(context).viewInsets.bottom;
    return Material(
      type: MaterialType.transparency, //透明类型
      color: const Color(0x1A000000),
      child: Center(
        child: ClipRRect(
          borderRadius: BorderRadius.circular(10),
          child: Container(
            width: 307,
            color: Colors.white,
            padding: EdgeInsets.only(left: 5, right: 5, top: 5, bottom: bottomInset),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Container(
                  child: Text(
                    "添加备注",
                    style: TextStyle(fontWeight: FontWeight.w600),
                  ),
                ),

                ///
                Container(
                  alignment: Alignment.centerLeft,
                  margin: EdgeInsets.all(10),
                  child: Text(
                    "业务名称",
                    style: TextStyle(fontSize: 12),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 10, right: 10),
                  padding: EdgeInsets.symmetric(horizontal: 5),
                  height: 35,
                  alignment: Alignment.center,
                  decoration: BoxDecoration(color: Color(0xFFEBEBEB), borderRadius: BorderRadius.all(Radius.circular(7))),
                  child: TextField(
                    cursorColor: Color(0xFF1A73EC),
                    controller: _businessNameController,
                    decoration: InputDecoration(
                      isDense: true,
                      contentPadding: EdgeInsets.zero,
                      hintText: '请输入业务名称',
                      border: InputBorder.none,
                      enabledBorder: InputBorder.none,
                      focusedBorder: InputBorder.none,
                      hintStyle: TextStyle(color: Color(0xFF999999), fontSize: 12),
                    ),
                    style: TextStyle(fontSize: 12),
                  ),
                ),

                ///设备型号
                Container(
                  alignment: Alignment.centerLeft,
                  margin: EdgeInsets.all(10),
                  child: Text(
                    "设备型号",
                    style: TextStyle(fontSize: 12),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 10, right: 10),
                  padding: EdgeInsets.symmetric(horizontal: 5),
                  height: 35,
                  alignment: Alignment.center,
                  decoration: BoxDecoration(color: Color(0xFFEBEBEB), borderRadius: BorderRadius.all(Radius.circular(7))),
                  child: DropdownButton<String>(
                    value: selectedValue,
                    // 当前选中的值
                    icon: const Icon(Icons.arrow_drop_down, color: Colors.blue),
                    hint: const Text('请选择设备型号'),
                    underline: Container(),
                    isExpanded: true,
                    dropdownColor: const Color(0xFFEBEBEB),
                    onChanged: (String? newValue) {
                      // 当选择改变时，更新状态
                      setState(() {
                        selectedValue = newValue!;
                      });
                    },
                    items: NetworkConfig.diverItems.map<DropdownMenuItem<String>>((String value) {
                      return DropdownMenuItem<String>(
                        value: value,
                        child: Text(
                          value,
                          style: const TextStyle(fontSize: 12, fontWeight: FontWeight.w400),
                        ),
                      );
                    }).toList(),
                  ),
                ),

                ///
                Container(
                  alignment: Alignment.centerLeft,
                  margin: EdgeInsets.all(10),
                  child: Text(
                    "业务类型",
                    style: TextStyle(fontSize: 12),
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 10, right: 10),
                  padding: EdgeInsets.symmetric(horizontal: 5),
                  height: 35,
                  alignment: Alignment.center,
                  decoration: BoxDecoration(color: Color(0xFFEBEBEB), borderRadius: BorderRadius.all(Radius.circular(7))),
                  child: DropdownButton<String>(
                    value: selectedValue2,
                    // 当前选中的值
                    icon: const Icon(Icons.arrow_drop_down, color: Colors.blue),
                    hint: const Text('请选择业务类型'),
                    underline: Container(),
                    isExpanded: true,
                    dropdownColor: const Color(0xFFEBEBEB),
                    onChanged: (String? newValue) {
                      // 当选择改变时，更新状态
                      setState(() {
                        selectedValue2 = newValue!;
                      });
                    },
                    items: NetworkConfig.businessItems.map<DropdownMenuItem<String>>((String value) {
                      return DropdownMenuItem<String>(
                        value: value,
                        child: Text(
                          value,
                          style: const TextStyle(fontSize: 12, fontWeight: FontWeight.w400),
                        ),
                      );
                    }).toList(),
                  ),
                ),

                ///
                Container(
                  alignment: Alignment.centerLeft,
                  margin: EdgeInsets.all(10),
                  child: Text(
                    "端口号数",
                    style: TextStyle(fontSize: 12),
                  ),
                ),
                Row(
                  children: [
                    Expanded(
                      flex: 1,
                      child: Container(
                        margin: EdgeInsets.only(left: 10, right: 10),
                        padding: EdgeInsets.symmetric(horizontal: 5),
                        height: 35,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(color: Color(0xFFEBEBEB), borderRadius: BorderRadius.all(Radius.circular(5))),
                        child: TextField(
                          cursorColor: Color(0xFF1A73EC),
                          controller: _portNumber1Controller,
                          keyboardType: TextInputType.number,
                          decoration: const InputDecoration(
                            isDense: true,
                            contentPadding: EdgeInsets.zero,
                            hintText: '1号端口数',
                            border: InputBorder.none,
                            enabledBorder: InputBorder.none,
                            focusedBorder: InputBorder.none,
                            hintStyle: TextStyle(color: Color(0xFF999999), fontSize: 12),
                          ),
                          style: TextStyle(fontSize: 12),
                        ),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      child: Container(
                        margin: const EdgeInsets.only(left: 10, right: 10),
                        padding: const EdgeInsets.symmetric(horizontal: 5),
                        height: 35,
                        alignment: Alignment.center,
                        decoration: const BoxDecoration(color: Color(0xFFEBEBEB), borderRadius: BorderRadius.all(Radius.circular(5))),
                        child: TextField(
                          cursorColor: const Color(0xFF1A73EC),
                          controller: _portNumber2Controller,
                          keyboardType: TextInputType.number,
                          decoration: const InputDecoration(
                            isDense: true,
                            contentPadding: EdgeInsets.zero,
                            hintText: '2号端口数',
                            border: InputBorder.none,
                            enabledBorder: InputBorder.none,
                            focusedBorder: InputBorder.none,
                            hintStyle: TextStyle(color: Color(0xFF999999), fontSize: 12),
                          ),
                          style: TextStyle(fontSize: 12),
                        ),
                      ),
                    ),
                    Expanded(
                      flex: 1,
                      child: Container(
                        margin: const EdgeInsets.only(left: 10, right: 10),
                        padding: const EdgeInsets.symmetric(horizontal: 5),
                        height: 35,
                        alignment: Alignment.center,
                        decoration: const BoxDecoration(color: Color(0xFFEBEBEB), borderRadius: BorderRadius.all(Radius.circular(5))),
                        child: TextField(
                          cursorColor: const Color(0xFF1A73EC),
                          controller: _portNumber3Controller,
                          keyboardType: TextInputType.number,
                          decoration: const InputDecoration(
                            isDense: true,
                            contentPadding: EdgeInsets.zero,
                            hintText: '3号端口数',
                            border: InputBorder.none,
                            enabledBorder: InputBorder.none,
                            focusedBorder: InputBorder.none,
                            hintStyle: TextStyle(color: Color(0xFF999999), fontSize: 12),
                          ),
                          style: TextStyle(fontSize: 12),
                        ),
                      ),
                    ),
                  ],
                ),

                Container(
                  margin: EdgeInsets.symmetric(vertical: 10),
                  child: Row(
                    children: [
                      Expanded(
                        flex: 1,
                        child: GestureDetector(
                          onTap: () {
                            Navigator.pop(context);
                          },
                          child: Container(
                            height: 32,
                            alignment: Alignment.center,
                            margin: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
                            decoration: BoxDecoration(
                              color: Colors.grey,
                              borderRadius: BorderRadius.all(Radius.circular(6)),
                            ),
                            child: Text(
                              "取消",
                              style: TextStyle(fontSize: 14, color: Colors.white),
                            ),
                          ),
                        ),
                      ),
                      Expanded(
                        flex: 2,
                        child: GestureDetector(
                          onTap: () {
                            submitInfo();
                          },
                          child: Container(
                            height: 32,
                            alignment: Alignment.center,
                            margin: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
                            decoration: BoxDecoration(
                              color: Color(0xFF1A73EC),
                              borderRadius: BorderRadius.all(Radius.circular(6)),
                            ),
                            child: Text(
                              "提交",
                              style: TextStyle(fontSize: 14, color: Colors.white),
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}