import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:agora_rtc_engine/rtc_engine.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:will_play/utils/auth.dart';
import 'package:will_play/views/palRoom/PalRoom.dart';

import '../../utils/http_util.dart';

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

  @override
  State<CreateRoomPage> createState() => _CreateRoomPageState();
}

class _CreateRoomPageState extends State<CreateRoomPage> {
  final _formKey = GlobalKey<FormState>();
  final _roomName = TextEditingController();
  bool flag = false;

  List patternList = [
    RadioModel(
      true,
      '普通',
    ),
    RadioModel(
      false,
      '相亲',
    ),
    RadioModel(
      false,
      '拍卖',
    ),
    RadioModel(
      false,
      'KTV',
    ),
  ];

  List tagList = [
    RadioModel(
      true,
      '交友',
    ),
    RadioModel(
      false,
      '音乐',
    ),
    RadioModel(
      false,
      '游戏',
    ),
    RadioModel(
      false,
      '连麦聊',
    ),
  ];

  var Timer;

  void _create(roomName) {
    MyHttpUtil().post(
      "/chat/api/room/create",
      data: {"name": roomName},
    ).then((res) {
      var roomId = res.data;
      // print(roomId);

      Timer = Timer.periodic(Duration(seconds: 1), (timer) async {
        _lodingCreate(roomId);
      });

      // Timer = Timer.periodic(Duration(seconds: 1), (timer) async {
      //   var resp = await MyHttpUtil().get(
      //     "/chat/api/room/create/$roomId",
      //   );
      //   String userName = await Storage.get('userName');
      //   print(userName);
      //   print(resp.data);
      //   if (resp.data == true) {
      //     // onJoin(userName, roomName, ClientRole.Broadcaster); // 参数1：用户名； 参数2：频道名； 参数3：身份；
      //     Timer?.cancel();
      //     Timer = null;
      //   }
      // });
    });
  }

  void _lodingCreate(roomId) async {
    var resp = await MyHttpUtil().get(
      "/chat/api/room/create/$roomId",
    );
    String userName = await Storage.get('userName');
    print(userName);
    print(resp.data);
    if (resp.data == true) {
      // onJoin(userName, roomName, ClientRole.Broadcaster); // 参数1：用户名； 参数2：频道名； 参数3：身份；
      Timer?.cancel();
      Timer = null;
    }
  }

  @override
  void dispose() {
    super.dispose();
    Timer?.cancel();
    Timer = null;
  }

  // 页面跳转方法：参数1：用户名； 参数2：频道名； 参数3：身份；
  Future<void> onJoin(userName, channelName, role) async {
    await _handleCameraAndMic(Permission.camera);
    await _handleCameraAndMic(Permission.microphone);

    await Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => PalRoomPage(
          userName: userName,
          channelName: channelName,
          role: role,
        ),
      ),
    );
  }

  // 判断是否开启权限方法
  Future<void> _handleCameraAndMic(Permission permission) async {
    PermissionStatus status = await permission.request();
    print('权限状态$status');
    if (!status.isGranted) {
      openAppSettings();
    }
  }

  @override
  Widget _buttonstyle(theme, parameter) {
    return Container(
      child: Stack(
        children: [
          Container(
            width: 80.0,
            height: 40.0,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.all(Radius.circular(2)),
              border: Border.all(
                  width: 1,
                  color: parameter.isSelected
                      ? theme
                      : Color.fromRGBO(222, 222, 222, 1)),
            ),
            child: Center(
              child: Text(
                "${parameter.buttonText}",
                style: TextStyle(
                    color: parameter.isSelected
                        ? theme
                        : Color.fromRGBO(51, 51, 51, 1)),
              ),
            ),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        elevation: 0, // z轴阴影
        titleSpacing: 0, // 标题与其他控件的间隔
        backgroundColor: Colors.white,
        leading: IconButton(
          icon: Icon(Icons.arrow_back_ios, color: Colors.black),
          onPressed: () => Navigator.of(context).pop(),
        ),
        title: Text(
          '创建派对房间',
          style: TextStyle(
              color: Color.fromRGBO(51, 51, 51, 1),
              fontSize: 16,
              fontWeight: FontWeight.bold),
        ),
      ),
      backgroundColor: Colors.white,
      resizeToAvoidBottomInset: false,
      body: Container(
        padding: EdgeInsets.all(15),
        child: Form(
          key: _formKey,
          // autovalidateMode: AutovalidateMode.onUserInteraction, // 自动验证
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Column(
                children: [
                  TextFormField(
                    controller: _roomName,
                    validator: (value) {
                      return value!.trim().isEmpty ? '请输入房间名' : null;
                    },
                    style: TextStyle(fontSize: 16.0),
                    textInputAction: TextInputAction.next,
                    decoration: InputDecoration(
                      hintText: '输入房间名',
                      hintStyle:
                          TextStyle(color: Color.fromRGBO(187, 187, 187, 1)),
                      contentPadding:
                          EdgeInsets.all(15.0), // 输入内容距离上下左右距离，该属性控制高度
                      fillColor: Color.fromRGBO(247, 248, 250, 1), // 输入框的背景填充颜色
                      filled: true,
                      suffixIcon: IconButton(
                        icon: Image.asset(
                          'images/createRoom/refresh.png',
                          width: 12.0,
                          height: 17.0,
                        ),
                        onPressed: () {
                          _roomName.clear();
                        },
                      ),
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(10),
                        borderSide: BorderSide.none,
                      ),
                    ),
                  ),
                  SizedBox(height: 25.0),

                  // 房间模式_单选框
                  Container(
                    padding: EdgeInsets.fromLTRB(0, 0, 0, 25),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          '房间模式',
                          textAlign: TextAlign.left,
                          style: TextStyle(
                            fontSize: 14.0,
                            color: Color.fromRGBO(153, 153, 153, 1),
                          ),
                        ),
                        SizedBox(height: 15),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: List<Widget>.generate(patternList.length,
                              (index) {
                            return InkWell(
                              child: _buttonstyle(
                                  Color.fromRGBO(21, 185, 208, 1),
                                  patternList[index]),
                              onTap: () {
                                setState(() {
                                  patternList.forEach(
                                      (element) => element.isSelected = false);
                                  print(patternList[index].buttonText);
                                  patternList[index].isSelected = true;
                                });
                              },
                            );
                          }),
                        ),
                      ],
                    ),
                  ),

                  // 房间标签_单选框
                  Container(
                    padding: EdgeInsets.fromLTRB(0, 0, 0, 25),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          '房间标签',
                          textAlign: TextAlign.left,
                          style: TextStyle(
                            fontSize: 14.0,
                            color: Color.fromRGBO(153, 153, 153, 1),
                          ),
                        ),
                        SizedBox(height: 15),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children:
                              List<Widget>.generate(tagList.length, (index) {
                            return InkWell(
                              child: _buttonstyle(
                                  Color.fromRGBO(239, 134, 146, 1),
                                  tagList[index]),
                              onTap: () {
                                setState(() {
                                  tagList.forEach(
                                      (element) => element.isSelected = false);
                                  print(tagList[index].buttonText);
                                  tagList[index].isSelected = true;
                                });
                              },
                            );
                          }),
                        ),
                      ],
                    ),
                  ),

                  Divider(
                    height: 1.0,
                    color: Color.fromRGBO(235, 235, 235, 1),
                  ),
                  SizedBox(height: 25.0),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        '房间密码',
                        style: TextStyle(color: Colors.black, fontSize: 16.0),
                      ),
                      CupertinoSwitch(
                        value: flag,
                        activeColor: Color.fromRGBO(21, 185, 208, 1),
                        onChanged: (value) {
                          setState(() {
                            flag = value;
                            print(flag);
                          });
                        },
                      ),
                    ],
                  ),
                  SizedBox(height: 40.0),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        '修改密码',
                        style: TextStyle(color: Colors.black, fontSize: 16.0),
                      ),
                      GestureDetector(
                        onTap: () {
                          print('箭头图标被点击');
                        },
                        child: Icon(
                          size: 16.0,
                          Icons.arrow_forward_ios,
                          color: Color.fromRGBO(153, 153, 153, 1),
                        ),
                      ),
                    ],
                  ),
                ],
              ),
              Column(
                children: [
                  Text(
                    '派对房间管理规范',
                    style: TextStyle(
                      color: Color.fromRGBO(153, 153, 153, 1),
                      fontSize: 12.0,
                    ),
                  ),
                  SizedBox(height: 5.0),
                  ElevatedButton(
                    child: const Text(
                      '创建',
                      style: TextStyle(fontSize: 16.0, color: Colors.white),
                    ),
                    style: ElevatedButton.styleFrom(
                      primary: Color.fromRGBO(21, 185, 208, 1),
                      minimumSize: Size(188, 50),
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(30)),
                    ),
                    onPressed: () {
                      if (_formKey.currentState!.validate()) {
                        _create(_roomName.text);
                        print('表单验证通过！');
                      }
                    },
                  ),
                  SizedBox(height: 52.0),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class RadioModel {
  bool isSelected;
  final String buttonText;
  RadioModel(
    this.isSelected,
    this.buttonText,
  );
}