import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:mohem_flutter_app/classes/colors.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/dashboard/menu_entries.dart';
import 'package:mohem_flutter_app/models/member_information_list_model.dart';
import 'package:mohem_flutter_app/models/profile_menu.model.dart';

class ProfileInFo extends StatefulWidget {
  ProfileInFo(this.memberInfo);

  MemberInformationListModel memberInfo;

  @override
  State<ProfileInFo> createState() => _ProfileInFoState();
}

class _ProfileInFoState extends State<ProfileInFo> {
  static List<GetMenuEntriesList> menuData = [];
  String data = '.';
  double sliderValue = 75;
  List<ProfileMenu> menu = [
    ProfileMenu(name: LocaleKeys.profile_personalInformation.tr(), icon: 'personal-info.svg', route: AppRoutes.personalInfo, dynamicUrl: '', menuEntries: getMenuEntries('')),
    ProfileMenu(name: LocaleKeys.profile_basicDetails.tr(), icon: 'basic-details.svg', route: AppRoutes.basicDetails, menuEntries: getMenuEntries('BASIC_DETAILS')),
    ProfileMenu(name: LocaleKeys.profile_contactDetails.tr(), icon: 'contact-details.svg', route: AppRoutes.contactDetails, dynamicUrl: '', menuEntries: getMenuEntries('ADDRESS')),
    ProfileMenu(name: LocaleKeys.profile_familyDetails.tr(), icon: 'family-members.svg', route: AppRoutes.familyMembers, dynamicUrl: '', menuEntries: getMenuEntries('CONTACT')),
  ];

  @override
  void setState(VoidCallback fn) {
    super.setState(fn);
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        16.height,
        widget.memberInfo.eMPLOYEENAME!.toText22(),
        ("${widget.memberInfo.eMPLOYEENUMBER!} | ${widget.memberInfo.jOBNAME!}").toText13(color: MyColors.grey80Color),
        widget.memberInfo.eMPLOYEEEMAILADDRESS!.toText13(),
        12.height,
        const Divider(height: 8, thickness: 8, color: MyColors.lightGreyEFColor),
        12.height,
        LocaleKeys.completingYear.tr().toText11(),
        Row(children: [
          appreciationTime(LocaleKeys.year.tr(), widget.memberInfo.sERVICEYEARS.toString()),
          appreciationTime(LocaleKeys.month.tr(), widget.memberInfo.sERVICEMONTHS.toString()),
          appreciationTime(LocaleKeys.day.tr(), widget.memberInfo.sERVICEDAYS.toString()),
        ]).paddingOnly(bottom: 12, top: 12),
        const Divider(height: 8, thickness: 8, color: MyColors.lightGreyEFColor),
        Column(
          //  mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            (LocaleKeys.profile_profileCompletionPer.tr() + ' 75%').toText16(),
            8.height,
            Row(
              children: [
                for (var i = 0; i < 4; i++)
                  if (i < 3) Expanded(child: drawSlider(Color(0xff2BB8A6))) else Expanded(child: drawSlider(const Color(0xffefefef)))
              ],
            ),
            14.height,
            LocaleKeys.profile_completeProfile.tr().toText16(color: MyColors.textMixColor, isUnderLine: true),
          ],
        ).paddingOnly(left: 21, right: 21, bottom: 18, top: 12),
        const Divider(height: 8, thickness: 8, color: MyColors.lightGreyEFColor),
        ListView.separated(
            padding: EdgeInsets.zero,
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            itemBuilder: (cxt, index) => Row(
                  children: [
                    SvgPicture.asset('assets/images/' + menu[index].icon, width: 20, height: 20),
                    16.width,
                    menu[index].name.toText16().expanded,
                    16.width,
                    const Icon(Icons.arrow_forward, color: MyColors.darkIconColor)
                  ],
                ).onPress(() {
                  Navigator.pushNamed(context, menu[index].route);
                }).paddingOnly(left: 21, right: 21, top: 21),
            separatorBuilder: (cxt, index) => 12.height,
            itemCount: menu.length),
      ],
    );
  }

  Widget drawSlider(color) {
    return Row(children: [
      Expanded(
          flex: 1,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(10),
            child: Container(
              height: 6,
              width: 20,
              color: color,
            ),
          )),
      Container(height: 6, width: 3, color: Colors.white),
    ]);
  }

  Widget appreciationTime(String title, String value) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        title.toText13(color: MyColors.grey80Color),
        value.padLeft(2, '0').toText20(color: MyColors.textMixColor),
      ],
    ).expanded;
  }
}

GetMenuEntriesList getMenuEntries(String type) {
  List<GetMenuEntriesList> data = _ProfileInFoState.menuData.where((GetMenuEntriesList test) => test.functionName == type).toList();
  if (data.isNotEmpty) {
    return data[0];
  } else {
    return GetMenuEntriesList();
  }
}