import 'package:dio/dio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/retrofit/data/base_data.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/view_widget/my_appbar.dart';
import 'package:huixiang/view_widget/round_button.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:shared_preferences/shared_preferences.dart';

class HelpFeedbackPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _HelpFeedbackPage();
  }
}

class _HelpFeedbackPage extends State<HelpFeedbackPage> {
  var _isExpanded = [false, false, false];

  ApiService apiService;

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

    SharedPreferences.getInstance().then((value) {
      apiService = ApiService(Dio(), context: context, token: value.getString("token"));
    });

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(
        title: S.of(context).bangzhuyufankui,
        titleColor: Colors.black,
        background: Color(0xFFF7F7F7),
        leadingColor: Colors.black,
      ),
      body: Container(
        decoration: new BoxDecoration(
          border: Border(
            bottom: BorderSide(
              color: Color(0xffF7F7F7),
            ),
          ),
          color: Color(0xffF7F7F7),
        ),
        child: Column(
          children: [
            Expanded(
              child: SingleChildScrollView(
                physics: BouncingScrollPhysics(),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisSize: MainAxisSize.max,
                  children: [
                    SizedBox(
                      height: 24.h,
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 16.w),
                      child: Text(
                        S.of(context).fankui,
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Color(0xFF353535),
                          fontSize: 16.sp,
                        ),
                      ),
                    ),
                    _feedback(),
                    Container(
                      margin: EdgeInsets.only(left: 16.w),
                      child: Text(
                        S.of(context).lianxishoujihao,
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Color(0xFF353535),
                          fontSize: 16.sp,
                        ),
                      ),
                    ),
                    _contactPhoneNumber(),
                    Container(
                      margin: EdgeInsets.only(left: 16.w, bottom: 20.h),
                      child: Text(
                        S.of(context).changjianwenti,
                        style: TextStyle(
                          fontWeight: MyFontWeight.semi_bold,
                          color: Color(0xFF353535),
                          fontSize: 16.sp,
                        ),
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.symmetric(horizontal: 16.w),
                      padding: EdgeInsets.all(16.w),
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(8.w),
                        boxShadow: [
                          BoxShadow(
                            color: Colors.black.withAlpha(12),
                            offset: Offset(0, 3),
                            blurRadius: 14,
                            spreadRadius: 0,
                          )
                        ],
                      ),
                      child: Column(
                        children: [
                          _commonProblem(S.of(context).ruhelingquyouhuiquan,
                             S.of(context).ruhelingquyouhuiquan1, 0),
                          _commonProblem(
                            S.of(context).ruhedihuanjifen,
                              S.of(context).ruhedihuanjifen1,
                              1),
                          _commonProblem(
                              S.of(context).ruheqiandao,
                              S.of(context).ruheqiandao1,
                              2),
                        ],
                      ),
                    ),
                    SizedBox(
                      height: 20.h,
                    ),
                  ],
                ),
              ),
              flex: 1,
            ),
            InkWell(
              onTap: () {
                if(phoneController.text == ""){
                  SmartDialog.showToast("请输入有效手机号码", alignment: Alignment.center);
                  return;
                }
                report();
              },
              child: Container(
                height: 54.h,
                alignment: Alignment.center,
                color: Color(0xFF32A060),
                child: RoundButton(
                  text: S.of(context).tijiao,
                  backgroup: Color(0xFF32A060),
                  textColor: Colors.white,
                  fontSize: 16.sp,
                  fontWeight: MyFontWeight.semi_bold,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  report() async {
    BaseData baseData = await apiService.report({
      "mobile": phoneController.text,
      "reportContent": editingController.text,
    }).catchError((onError) {});
    if (baseData != null && baseData.isSuccess) {
      SmartDialog.showToast("反馈成功");
      Navigator.of(context).pop();
    } else {
      SmartDialog.showToast("反馈成功");
      Navigator.of(context).pop();
    }
  }

  final TextEditingController editingController = TextEditingController();
  final TextEditingController phoneController = TextEditingController();
  int textLength = 0;

  ///反馈
  _feedback() {
    return Container(
      width: double.infinity,
      height: 186.h,
      margin: EdgeInsets.all(16.w),
      decoration: new BoxDecoration(
        color: Color(0xffffffff),
        borderRadius: BorderRadius.circular(4.0),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(12),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          ),
        ],
      ),
      child: Column(
        children: [
          Container(
            margin: EdgeInsets.fromLTRB(20.w, 5.h, 20.w, 0),
            alignment: Alignment.topLeft,
            child: TextField(
              maxLines: 5,
              controller: editingController,
              onChanged: (value) {
                setState(() {
                  textLength = value.length;
                });
              },
              maxLength: 50,
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: S.of(context).fankuilizi,
                hintStyle: TextStyle(
                  fontSize: 14.sp,
                    fontWeight: MyFontWeight.regular,
                  color: Color(0xffA29E9E),
                ),
              ),
            ),
          ),
          // Container(
          //   alignment: Alignment.bottomRight,
          //   padding: EdgeInsets.only(right: 20.w),
          //   child: Text(
          //     "$textLength/50",
          //     style: TextStyle(
          //       fontSize: 14.sp,
          //       fontWeight: FontWeight.w400,
          //       color: Color(0xffA29E9E),
          //     ),
          //   ),
          // ),
        ],
      ),
    );
  }

  ///联系电话
  _contactPhoneNumber() {
    return Container(
      width: double.infinity,
      margin: EdgeInsets.all(16.w),
      decoration: BoxDecoration(
        color: Color(0xffffffff),
        borderRadius: BorderRadius.circular(4.0),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(12),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          )
        ],
      ),
      child: Column(
        children: [
          Container(
            margin: EdgeInsets.fromLTRB(20.w, 0, 20.w, 0),
            alignment: Alignment.topLeft,
            child: TextField(
              controller: phoneController,
              inputFormatters: [LengthLimitingTextInputFormatter(11)],
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: S.of(context).qingshuruyouxiaoshoujihaoma,
                hintStyle: TextStyle(
                  fontSize: 14.sp,
                  fontWeight: MyFontWeight.regular,
                  color: Color(0xffA29E9E),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  ///常见问题
  _commonProblem(var title, var cnt, var index) {
    return Container(
      alignment: Alignment.center,
      child: Column(
        children: <Widget>[
          ExpansionPanelList(
            elevation: 0,
            children: <ExpansionPanel>[
              ExpansionPanel(
                headerBuilder: (context, isExpanded) {
                  return ListTile(
                    title: Text(title),
                  );
                },
                body: Padding(
                  padding: EdgeInsets.fromLTRB(15.w, 0, 8.w, 8.h),
                  child: Text(
                    cnt,
                    style: TextStyle(
                      fontSize: 14.sp,
                      fontWeight: MyFontWeight.regular,
                      color: Color(0xff8B8B8B),
                    ),
                  ),
                ),
                isExpanded: _isExpanded[index],
                canTapOnHeader: true,
              ),
            ],
            expansionCallback: (panelIndex, isExpanded) {
              setState(() {
                _isExpanded[index] = !isExpanded;
              });
            },
            animationDuration: kThemeAnimationDuration,
          ),
        ],
      ),
    );
  }
}