import 'dart:ui';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import '../../api/http.dart';
import '../../ui/widget/nav.dart';
import '../../utils/string_util.dart';
import '../../utils/ui_utils.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '提意见',
      theme: ThemeData(primaryColor: Color(0xFFF5F5F5)),
      home: AdviceSubmitPage(title: ''),
    );
  }
}

class AdviceSubmitPage extends StatefulWidget {
  AdviceSubmitPage({Key? key, required this.title}) : super(key: key);

  // This widget is the home page of your application. It is stateful, meaning
  // that it has a State object (defined below) that contains fields that affect
  // how it looks.

  // This class is the configuration for the state. It holds the values (in this
  // case the title) provided by the parent (in this case the App widget) and
  // used by the build method of the State. Fields in a Widget subclass are
  // always marked "final".

  final String title;

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

class _AdviceSubmitPageState extends State<AdviceSubmitPage>
    with SingleTickerProviderStateMixin {
  List<String> questions = ["账号问题", "定位问题", "其他问题"];

  final TextEditingController _contentController = TextEditingController();

  @override
  void initState() {
    super.initState();
  }

  BoxDecoration getItemDecoration(Color bgColor, Color shadowColor) {
    return BoxDecoration(
        borderRadius: BorderRadius.all(Radius.elliptical(10, 10)),
        color: bgColor,
        boxShadow: [
          BoxShadow(
              color: shadowColor,
              blurRadius: 2.0,
              offset: Offset(0.0, 5.0), //阴影y轴偏移量
              spreadRadius: 1 //阴影扩散程度
              )
        ]);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        resizeToAvoidBottomInset: false,
        backgroundColor: Color(0xFFFFFFFF),
        body: Container(
          child: Flex(
            direction: Axis.vertical,
            children: [
              TopNavBar(title: "提意见"),
              Container(
                padding: const EdgeInsets.fromLTRB(17.5, 15, 17.5, 15),
                decoration: BoxDecoration(
                    color: const Color(0xFFFAFAFA),
                    border: Border.all(color: Color(0xFFDBDBDB))),
                child: Flex(
                  direction: Axis.vertical,
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Wrap(
                      children: getQuestionTypes(),
                    ),
                    Container(
                      child: TextField(
                        controller: _contentController,
                        maxLines: 9,
                        maxLength: 200,
                        decoration: const InputDecoration(
                            focusedBorder: InputBorder.none,
                            border: InputBorder.none,
                            counterStyle: TextStyle(color: Color(0xFF666666)),
                            hintText: "请描述您要反馈的问题或意见",
                            hintStyle: TextStyle(
                                fontSize: 15, color: Color(0xFF999999))),
                        style:
                            TextStyle(color: Color(0xFF666666), fontSize: 15),
                        onChanged: (value) {},
                      ),
                    )
                  ],
                ),
              ),
              //按钮
              Container(
                margin: EdgeInsets.fromLTRB(18, 50, 18, 0),
                child: InkWell(
                  onTap: () {
                    var content = _contentController.text;
                    if (StringUtil.isNullOrEmpty(content)) {
                      ToastUtil.toast("请填写问题");
                      return;
                    }
                    var type;
                    if (checkIndex > -1) {
                      type = questions[checkIndex];
                    }

                    FeedBackApiUtil.advice(context, type, content).then((value) {
                      if (value == null) {
                        return;
                      }
                      if (value["code"] == 0) {
                        Navigator.of(context).pop();
                      } else {
                        ToastUtil.toast(value["msg"]);
                      }
                    });
                  },
                  child: Container(
                    height: 42.5,
                    alignment: Alignment.center,
                    decoration: const BoxDecoration(
                        color: Color(0xFF0E96FF),
                        borderRadius: BorderRadius.all(Radius.circular(10))),
                    child: const Text(
                      "提交反馈",
                      style: TextStyle(color: Colors.white, fontSize: 18),
                    ),
                  ),
                ),
              )
            ],
          ),
        ));
  }

  int checkIndex = -1;

  List<Widget> getQuestionTypes() {
    List<Widget> list = [];

    for (int i = 0; i < questions.length; i++) {
      list.add(InkWell(
          onTap: () {
            if (checkIndex == i) {
              setState(() {
                checkIndex = -1;
              });
            } else {
              setState(() {
                checkIndex = i;
              });
            }
          },
          child: Container(
            alignment: Alignment.center,
            padding: EdgeInsets.fromLTRB(10, 0, 10, 0),
            margin: EdgeInsets.fromLTRB(0, 0, 17.5, 0),
            height: 35,
            width: 80,
            decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(17.5),
                border: Border.all(
                    color: i == checkIndex
                        ? Color(0xFF0E96FF)
                        : Color(0xFFB4B4B4))),
            child: Text(
              questions[i],
              style: TextStyle(
                  color:
                      i == checkIndex ? Color(0xFF0E96FF) : Color(0xFF666666),
                  fontSize: 14),
            ),
          )));
    }

    return list;
  }
}