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/profile_api_client.dart';
import 'package:mohem_flutter_app/app_state/app_state.dart';
import 'package:mohem_flutter_app/classes/colors.dart';
import 'package:mohem_flutter_app/classes/utils.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/extensions/string_extensions.dart';
import 'package:mohem_flutter_app/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/models/hierarchy_lists.dart';
import 'package:mohem_flutter_app/widgets/app_bar_widget.dart';
import 'package:url_launcher/url_launcher.dart';

class HierarchyScreen extends StatefulWidget {
  @override
  State<HierarchyScreen> createState() => _HierarchyScreenState();
}

class _HierarchyScreenState extends State<HierarchyScreen> {
  SupervisorHierarchyLists? hierarchyList;

  @override
  void initState() {
    super.initState();
    getData("221142");
  }

  void getData(String selectedId) async {
    Utils.showLoading(context);
    try {
      hierarchyList = await ProfileApiClient().getHierarchy(selectedId);
      hierarchyList!.supervisorHierarchyList!.removeWhere((element) => element.lvl == 1);
      hierarchyList!.supervisorHierarchyList = hierarchyList!.supervisorHierarchyList!.reversed.toList();
      // hierarchyList!.subordinateHierarchyList!.clear();
      setState(() {});
      Utils.hideLoading(context);
    } catch (ex) {
      Utils.hideLoading(context);
      Utils.handleException(ex, context, null);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBarWidget(
        context,
        title: LocaleKeys.profile_personalInformation.tr(),
      ),
      backgroundColor: MyColors.backgroundColor,
      body: hierarchyList == null
          ? const Center(child: SizedBox())
          : SizedBox(
              height: double.infinity,
              width: double.infinity,
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    ListView.builder(
                      itemBuilder: (BuildContext context, int index) {
                        return Row(
                          children: [
                            SizedBox(
                              height: 78 + 12,
                              child: Stack(
                                children: [
                                  Align(
                                    alignment: (index == 0) ? Alignment.bottomCenter : Alignment.topCenter,
                                    child: SizedBox(
                                      // height: index == 0
                                      //     ? 40 + 6
                                      //     : (index == hierarchyList!.supervisorHierarchyList!.length - 1)
                                      //         ? 40 + 6
                                      //         : 78 + 6,
                                      height: index == 0
                                          ? 40 + 6
                                          : (index == hierarchyList!.supervisorHierarchyList!.length - 1)
                                              ? 40 + 6
                                              : 78 + 6 + 6,
                                      child: Container(
                                        height: double.infinity,
                                        color: Colors.black,
                                        width: 2,
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                            ),
                            const SizedBox(
                              width: 16,
                              child: Divider(
                                color: Colors.black,
                                thickness: 2,
                              ),
                            ),
                            Expanded(
                              child: Container(
                                width: double.infinity,
                                padding: const EdgeInsets.all(12),
                                margin: const EdgeInsets.only(top: 12),
                                decoration: BoxDecoration(
                                  color: Colors.white,
                                  borderRadius: const BorderRadius.all(Radius.circular(12)),
                                  border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
                                ),
                                child: Row(
                                  children: [
                                    hierarchyList?.supervisorHierarchyList![index].employeeImage == null
                                        ? SvgPicture.asset(
                                            "assets/images/user.svg",
                                            height: 52,
                                            width: 52,
                                          )
                                        : CircleAvatar(
                                            radius: 52 / 2,
                                            backgroundImage: MemoryImage(Utils.dataFromBase64String(hierarchyList?.supervisorHierarchyList![index].employeeImage)),
                                            backgroundColor: Colors.black,
                                          ),
                                    12.width,
                                    Expanded(
                                      child: Row(
                                        children: [
                                          Expanded(
                                            child: Column(
                                              crossAxisAlignment: CrossAxisAlignment.start,
                                              mainAxisAlignment: MainAxisAlignment.center,
                                              children: [
                                                hierarchyList!.supervisorHierarchyList![index].employeeName.toString().toText14(isBold: true, maxlines: 1),
                                                hierarchyList!.supervisorHierarchyList![index].positionName.toString().toText12(isBold: false, maxLine: 1),
                                              ],
                                            ),
                                          ),
                                          IconButton(
                                            onPressed: () {
                                              launch("tel://${hierarchyList!.supervisorHierarchyList![index].employeeMobileNumber}");
                                            },
                                            icon: Icon(
                                              Icons.phone,
                                              color: MyColors.gradiantEndColor,
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                          ],
                        );
                      },
                      itemCount: hierarchyList?.supervisorHierarchyList?.length ?? 0,
                      padding: const EdgeInsets.only(left: 12, right: 12, top: 12),
                      physics: const NeverScrollableScrollPhysics(),
                      shrinkWrap: true,
                    ),
                    ListView.builder(
                      itemBuilder: (BuildContext context, int index) {
                        return InkWell(
                          onTap: (hierarchyList!.subordinateHierarchyList![index].numOfSubordinates == 0)
                              ? null
                              : () {
                                  getData(hierarchyList!.subordinateHierarchyList![index].employeeNumber.toString());
                                },
                          child: Padding(
                            padding: EdgeInsets.only(
                                left: AppState().isArabic(context)
                                    ? 0
                                    : index == 0
                                        ? 28
                                        : 58,
                                right: !AppState().isArabic(context)
                                    ? 0
                                    : index == 0
                                        ? 28
                                        : 58),
                            child: Row(
                              children: [
                                SizedBox(
                                  height: 78 + 12,
                                  child: Stack(
                                    children: [
                                      Align(
                                        alignment: (index == 0) ? Alignment.topCenter : Alignment.topCenter,
                                        child: SizedBox(
                                          height: index == 0
                                              ? 40 + 6
                                              : (index == hierarchyList!.subordinateHierarchyList!.length - 1)
                                                  ? 40 + 6
                                                  : 78 + 6 + 6,
                                          child: Container(
                                            height: double.infinity,
                                            color: Colors.black,
                                            width: 2,
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                const SizedBox(
                                  width: 18,
                                  child: Divider(
                                    color: Colors.black,
                                    thickness: 2,
                                  ),
                                ),
                                Expanded(
                                  child: Container(
                                    width: double.infinity,
                                    padding: const EdgeInsets.all(12),
                                    margin: const EdgeInsets.only(top: 12),
                                    decoration: BoxDecoration(
                                      color: Colors.white,
                                      borderRadius: const BorderRadius.all(Radius.circular(12)),
                                      border: Border.all(color: MyColors.lightGreyEDColor, width: 1),
                                    ),
                                    child: Row(
                                      children: [
                                        hierarchyList?.subordinateHierarchyList![index].employeeImage == null
                                            ? SvgPicture.asset(
                                                "assets/images/user.svg",
                                                height: 52,
                                                width: 52,
                                              )
                                            : CircleAvatar(
                                                radius: 52 / 2,
                                                backgroundImage: MemoryImage(Utils.dataFromBase64String(hierarchyList?.subordinateHierarchyList![index].employeeImage)),
                                                backgroundColor: Colors.black,
                                              ),
                                        12.width,
                                        Expanded(
                                          child: Row(
                                            children: [
                                              Expanded(
                                                child: Column(
                                                  crossAxisAlignment: CrossAxisAlignment.start,
                                                  mainAxisAlignment: MainAxisAlignment.center,
                                                  children: [
                                                    hierarchyList!.subordinateHierarchyList![index].employeeName.toString().toText14(isBold: true, maxlines: 1),
                                                    hierarchyList!.subordinateHierarchyList![index].positionName.toString().toText12(isBold: false, maxLine: 1),
                                                  ],
                                                ),
                                              ),
                                              8.width,
                                              Column(
                                                children: [
                                                  InkWell(
                                                    onTap: () {
                                                      launch("tel://${hierarchyList!.subordinateHierarchyList![index].employeeMobileNumber}");
                                                    },
                                                    child: const Padding(
                                                      padding: EdgeInsets.only(bottom: 10),
                                                      child: Icon(
                                                        Icons.phone,
                                                        color: MyColors.gradiantEndColor,
                                                      ),
                                                    ),
                                                  ),
                                                  if (hierarchyList!.subordinateHierarchyList![index].numOfSubordinates != 0)
                                                    Container(
                                                      decoration: const BoxDecoration(
                                                        color: MyColors.gradiantEndColor,
                                                        borderRadius: BorderRadius.all(Radius.circular(12)),
                                                      ),
                                                      width: 18,
                                                      height: 18,
                                                      alignment: Alignment.center,
                                                      child: hierarchyList!.subordinateHierarchyList![index].numOfSubordinates.toString().toTextAuto(isBold: true, color: Colors.white, fontSize: 10),
                                                    ),
                                                ],
                                              ),
                                            ],
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                        );
                      },
                      itemCount: hierarchyList?.subordinateHierarchyList?.length ?? 0,
                      padding: const EdgeInsets.only(left: 12, right: 12, bottom: 12),
                      physics: const NeverScrollableScrollPhysics(),
                      shrinkWrap: true,
                    ),
                  ],
                ),
              ),
            ),
    );
  }
}
