import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:mohem_flutter_app/api/my_team/my_team_api_client.dart';
import 'package:mohem_flutter_app/classes/colors.dart';
import 'package:mohem_flutter_app/classes/utils.dart';
import 'package:mohem_flutter_app/config/routes.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/extensions/widget_extensions.dart';
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/models/my_team/get_employee_subordinates_list.dart';
import 'package:mohem_flutter_app/widgets/app_bar_widget.dart';
import 'package:url_launcher/url_launcher.dart';

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

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

class _MyTeamState extends State<MyTeam> {
  String searchEmpEmail = "";
  String searchEmpName = "";
  String searchEmpNo = "";
  String? empId;
  List<GetEmployeeSubordinatesList> getEmployeeSubordinatesList = [];
  TextEditingController? _textEditingController = TextEditingController();
  List<GetEmployeeSubordinatesList> getEmployeeSListOnSearch = [];

  String dropdownValue = 'Name';

  void initState() {
    super.initState();
    getEmployeeSubordinates();
  }

  void getEmployeeSubordinates() async {
    try {
      Utils.showLoading(context);
      getEmployeeSubordinatesList = await MyTeamApiClient().getEmployeeSubordinates(searchEmpEmail.toString(), searchEmpName.toString(), searchEmpNo.toString());
      getEmployeeSListOnSearch = getEmployeeSubordinatesList;
      Utils.hideLoading(context);
      setState(() {});
    } catch (ex) {
      Utils.hideLoading(context);
      Utils.handleException(ex, context, null);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBarWidget(
          context,
          title: LocaleKeys.myTeamMembers.tr(),
          showMemberButton: true,
        ),
        backgroundColor: MyColors.backgroundColor,
        body: SingleChildScrollView(
          child: Column(
            children: [
              Container(
                margin: EdgeInsets.only(left: 21, right: 21, top: 20, bottom: 6),
                padding: EdgeInsets.only(left: 14, right: 14, top: 21, bottom: 21),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(15),
                  color: Color(0xffFFFFFF),
                  border: Border.all(
                    color: Color(0xffefefef),
                    width: 1,
                  ),
                ),
                child: Row(
                  children: [
                    Expanded(
                        child: TextField(
                          onChanged: dropdownValue == "Name"
                              ? (String value) {
                            getEmployeeSListOnSearch =
                                getEmployeeSubordinatesList.where((GetEmployeeSubordinatesList element) => element.eMPLOYEENAME!.toLowerCase().contains(value.toLowerCase())).toList();
                            setState(() {});
                          }
                              : (String value) {
                            getEmployeeSListOnSearch =
                                getEmployeeSubordinatesList.where((GetEmployeeSubordinatesList element) => element.eMPLOYEEEMAILADDRESS!.toLowerCase().contains(value.toLowerCase())).toList();
                            setState(() {});
                          },
                          controller: _textEditingController,
                          decoration: InputDecoration(
                            filled: true,
                            fillColor: Colors.white,
                            border: InputBorder.none,
                            enabledBorder: InputBorder.none,
                            focusedBorder: InputBorder.none,
                            // contentPadding: EdgeInsets.fromLTRB(10, 15, 10, 15),
                            hintText: LocaleKeys.searchBy.tr() + " $dropdownValue",
                            hintStyle: TextStyle(fontSize: 14.0, color: MyColors.grey57Color, fontWeight: FontWeight.w600),
                          ),
                        )),
                    Container(
                        height: 36,
                        width: 1,
                        color: Color(0xffC4C4C4),
                    ),
                    10.width,
                    dropDown(),
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(left: 21, right: 21),
                width: MediaQuery.of(context).size.width,
                child: SingleChildScrollView(
                  scrollDirection: Axis.vertical,
                  child: Column(
                    children: <Widget>[
                      _textEditingController!.text.isNotEmpty && getEmployeeSListOnSearch.isEmpty
                          ? Container(
                              child: LocaleKeys.noResultsFound.tr().toText16(color: MyColors.blackColor),
                            ).paddingOnly(top: 10)
                          : ListView.separated(
                              scrollDirection: Axis.vertical,
                              shrinkWrap: true,
                            //  padding: EdgeInsets.only(left: 21, right: 21),
                              physics: ScrollPhysics(),
                              separatorBuilder: (cxt, index) => 12.height,
                              itemCount: _textEditingController!.text.isNotEmpty ? getEmployeeSListOnSearch.length : getEmployeeSubordinatesList.length,
                              itemBuilder: (context, index) {
                                var phoneNumber = Uri.parse('tel:${getEmployeeSListOnSearch[index].eMPLOYEEMOBILENUMBER}');
                                return Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                    children: [
                                      CircleAvatar(
                                        radius: 25,
                                        backgroundImage: MemoryImage(Utils.getPostBytes(getEmployeeSListOnSearch[index].eMPLOYEEIMAGE)),
                                        backgroundColor: Colors.black,
                                      ),
                                      10.width,
                                      Column(
                                        crossAxisAlignment: CrossAxisAlignment.start,
                                        children: [
                                          // "Present".toText13(color: MyColors.greenColor),
                                          "${getEmployeeSListOnSearch[index].eMPLOYEENAME}".toText16(isBold: true, color: MyColors.grey3AColor),
                                          "${getEmployeeSListOnSearch[index].pOSITIONNAME}".toText10(isBold: true, color: MyColors.grey57Color),
                                        ],
                                      ).expanded,
                                      Column(
                                        children: [
                                          InkWell(
                                            onTap: () {
                                              launchUrl(phoneNumber);
                                            },
                                              child: SvgPicture.asset("assets/images/call.svg"),
                                          ),
                                          21.height,
                                          InkWell(
                                            onTap: () async {
                                              Navigator.pushNamed(context, AppRoutes.employeeDetails, arguments: getEmployeeSListOnSearch[index]);
                                            },
                                            child: Icon(Icons.arrow_forward_outlined, color: MyColors.grey3AColor),
                                          ),
                                        ],
                                      ),
                                    ],
                                  ).objectContainerView();
                              })
                    ],
                  ),
                ),
              )
            ],
          ),
        ));
  }

  Widget dropDown() {
    return
      DropdownButton<String>(
        value: dropdownValue,
        icon: const Icon(Icons.keyboard_arrow_down,
        color: MyColors.grey57Color).paddingOnly(left: 4),
        elevation: 16,
        onChanged: (String? newValue) {
          setState(() {
            dropdownValue = newValue!;
          });
        },
        items: <String>['Name', 'Email'].map<DropdownMenuItem<String>>((String value) {
          return DropdownMenuItem<String>(
            value: value,
            child: Text(value),
          );
        }).toList(),
        style: TextStyle(fontSize: 14.0, color: MyColors.grey57Color,
               fontWeight: FontWeight.w600),
      );
  }
}