import 'package:flutter/material.dart';
import 'package:ftc_mobile_app/dialogs/app_dialogs.dart';
import 'package:ftc_mobile_app/dialogs/widgets/holidays_data_dialog.dart';
import 'package:ftc_mobile_app/ftc_mobile_app.dart';
import 'package:ftc_mobile_app/utilities/extensions/custom_extensions.dart';
import 'package:ftc_mobile_app/view/custom_widgets/my_circle_image.dart';
import 'package:get/get.dart';
import '../../../models/staffWorkload/StaffWorkloadResponse.dart';

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

  @override
  State<ViewProfileScreen> createState() => _ViewProfileScreenState();
}

class _ViewProfileScreenState extends State<ViewProfileScreen> {
  final controller = Get.put(ViewProfileScreenController());

  @override
  Widget build(BuildContext context) {
    return ObxValue((RxBool isEditable) {
      final editable = isEditable();

      return CustomScaffold(
        backgroundColor: CustomAppColors.kPrimaryColor,
        screenKey: controller.screenKey,
        onScreenTap: controller.removeFocus,
        showAppBar: true,
        appBar:
            // isEditable() ?
            CustomAppBarTitleOnly(context, titleText: "Your Profile"),
        // : CustomAppBarWithAction(
        //     context,
        //     titleText: 'Your Profile',
        //     actionText: '\u270E Edit',
        //     actionTextColor: Get.theme.primaryColor,
        //     onActionTap: () {
        //       isEditable.value = true;
        //     },
        //   ),
        body: SingleChildScrollView(
          child: Obx(() {
            if (controller.detail()?.user == null) {
              return FrequentFunctions.noWidget;
            }

            final detail = controller.detail()!;

            return Padding(
              padding: REdgeInsets.symmetric(horizontal: 20),
              child: Column(
                children: [
                  Center(
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        MyCircleImage(
                          imageSize: 80.r,
                          url:
                              "${WebUrls.baseUrl}${detail.user!.profilePictureUrl ?? ""}",
                          errorWidget: CustomImageWidget(
                            imagePath: AssetsManager.kPersonMainIcon,
                            imageColor: CustomAppColors.kDarkBlueTextColor,
                            height: 80.r,
                            width: 80.r,
                          ),
                        ),
                        4.verticalSpace,
                        CustomTextWidget(
                          text: detail.user!.displayName,
                          fontWeight: FontWeight.w500,
                          fontColor: Colors.black,
                        )
                      ],
                    ),
                  ),
                  // Container(
                  //   padding: EdgeInsets.only(left: 18.w, top: 15.h),
                  //   child: Row(
                  //     children: [
                  //       // Obx(
                  //       //   () => TabBarWidget(
                  //       //     title: "Profile (Client View)",
                  //       //     selected: controller.viewProfileClient.value,
                  //       //     onTapFunction: () {
                  //       //       controller.viewProfileClient.value = true;
                  //       //     },
                  //       //   ),
                  //       // ),
                  //       // SizedBox(
                  //       //   width: 12.w,
                  //       // ),
                  //       // Expanded(
                  //       //   child: SizedBox(
                  //       //     width: ,
                  //       //     child: Obx(
                  //       //       () => TabBarWidget(
                  //       //         title: "Staff Profile",
                  //       //         selected: controller.viewProfileClient.isFalse,
                  //       //         onTapFunction: () =>
                  //       //             controller.viewProfileClient.value = false,
                  //       //       ),
                  //       //     ),
                  //       //   ),
                  //       // ),
                  //
                  //       Expanded(
                  //         child: SizedBox(
                  //           width: 12.w,
                  //         ),
                  //       ),
                  //       InkWell(
                  //         onTap: () {},
                  //         borderRadius: 20.toRadius(),
                  //         child: Padding(
                  //           padding: REdgeInsets.symmetric(horizontal: 12, vertical: 6),
                  //           child: Row(
                  //             mainAxisSize: MainAxisSize.min,
                  //             children: [
                  //               CustomImageWidget(
                  //                 imagePath: AssetsManager.kPencilIcon,
                  //                 width: 10.w,
                  //                 height: 10.h,
                  //               ),
                  //               4.horizontalSpace,
                  //               CustomTextWidget(
                  //                   text: "Edit",
                  //                   isExpanded: false,
                  //                   fontSize: 10.sp,
                  //                   fontWeight: FontWeight.w700,
                  //                   fontColor: CustomAppColors.kSecondaryColor),
                  //             ],
                  //           ),
                  //         ),
                  //       ),
                  //       12.horizontalSpace,
                  //     ],
                  //   ),
                  // ),
                  16.verticalSpace,
                  Padding(
                    padding: EdgeInsets.symmetric(
                      vertical: 6.r,
                    ),
                    child: CustomTextFieldWidget(
                      controller: controller.nameTEC,
                      heading: "Name",
                      isEnabled: editable,
                    ),
                    // child: isEditable()
                    //     ? CustomTextFieldWidget(
                    //         controller: controller.nameTEC,
                    //         heading: "Name",
                    //       )
                    //     : SingleItem(
                    //         heading: "Name", value: detail.user!.displayName),
                  ),
                  16.verticalSpace,
                  Obx(
                    () => controller.viewProfileClient.isTrue
                        ? profileClientView
                        : Column(
                            children: [
                              Row(
                                children: [
                                  Expanded(
                                    child: CustomTextFieldWidget(
                                      controller: controller.emailTEC,
                                      heading: "Email",
                                      isEnabled: false,
                                    ),
                                    // child: SingleItem(
                                    //     heading: "Email",
                                    //     value: detail.user!.email ?? ""),
                                  ),
                                  8.horizontalSpace,
                                  Expanded(
                                    child: CustomTextFieldWidget(
                                      controller: controller.phoneTEC,
                                      heading: "Phone",
                                      isEnabled: editable,
                                    ),
                                    // child: SingleItem(
                                    //     heading: "Phone",
                                    //     value:
                                    //         (detail.user!.phoneNumber ?? "")),
                                  ),
                                ],
                              ),
                              16.verticalSpace,
                              // SingleItem(
                              //     heading: "Address",
                              //     value:
                              //         detail.user!.modelId?.homeAddress ?? ""),
                              CustomTextFieldWidget(
                                controller: controller.addressTEC,
                                heading: "Address",
                                isEnabled: false,
                              ),
                              16.verticalSpace,
                              CustomTextFieldWidget(
                                controller: TextEditingController(
                                    text: detail.kin ?? ""),
                                heading: "Next of kin",
                                isEnabled: false,
                              ),
                              16.verticalSpace,
                              // SingleItem(
                              //     heading: "Next of kin",
                              //     value: detail.kin ?? ""),
                              SingleItem(
                                heading: "Total Holidays Left",
                                value:
                                    "${detail.staffWorkLoads?.firstOrNull?.holidayAlwnNoOfDys ?? "0"} Days (${detail.staffWorkLoads?.firstOrNull?.holidayAlwnNoOfHours ?? "0"} hours)",
                                onTap: () {
                                  if (detail.staffWorkLoads?.firstOrNull !=
                                      null) {}
                                  _onTotalHolidaysBoxTap(
                                      detail.staffWorkLoads!.first);
                                },
                              ),
                              SingleItem(
                                  heading: "",
                                  value: "Training",
                                  onTap: () {
                                    Get.toNamed(
                                        CustomRouteNames.kTrainingsScreen);
                                  }),
                              // SingleItem(
                              //     heading: "",
                              //     value: "COVID Checks",
                              //     onTap: () {}),
                              12.verticalSpace,
                              Obx(() {
                                return Align(
                                  alignment: Alignment.centerLeft,
                                  child: IgnorePointer(
                                    ignoring: true,
                                    child: CustomCheckBox(
                                      checkBoxValue: controller.covidCheck(),
                                      titleText: "COVID Check",
                                      onTap: () {
                                        // controller.covidCheck.toggle();
                                      },
                                    ),
                                  ),
                                );
                              }),
                            ],
                          ),
                  ),
                  20.verticalSpace,
                  editable
                      ? AppDialog.buttonsBar(
                              onButton1Tap: () {
                                isEditable(false);
                              },
                              onButton2Tap: () {},
                              button1Text: "Cancel",
                              button2Text: "Update")
                          .paddingOnly(bottom: 12.r)
                      : FrequentFunctions.noWidget,

                  CustomAppButton(
                    buttonText: "LOGOUT",
                    buttonColor: CustomAppColors.kRedColor,
                    borderColor: CustomAppColors.kRedColor,
                    textColor: CustomAppColors.kPrimaryColor,
                    onTap: () {
                      controller.logoutPressed();
                    },
                  ),

                  18.verticalSpace,
                ],
              ),
            );
          }),
        ),
      );
    }, controller.isEditable);
  }

  Column get profileClientView {
    return const Column(
      children: [
        BuildDetailsWidget(
          title: "My Experience",
          details:
              "A quick preview of the text will be shown here. A quick preview of the text will be shown here.  shown here. A quick preview of the text will be shown here. A quick preview of the text will be shown here. A quick preview of the text will be shown here.",
        ),
        BuildDetailsWidget(
          title: "About Me",
          details:
              "A quick preview of the text will be shown here. A quick preview of the text will be shown here.  shown here. A quick preview of the text will be shown here. A quick preview of the text will be shown here. A quick preview of the text will be shown here.",
        ),
        BuildDetailsWidget(
          title: "Things I like to do in my spare time",
          details:
              "A quick preview of the text will be shown here. A quick preview of the text will be shown here.  shown here. A quick preview of the text will be shown here. A quick preview of the text will be shown here. A quick preview of the text will be shown here.",
        ),
      ],
    );
  }

  _onTotalHolidaysBoxTap(StaffWorkLoads? workLoads) {
    DateTime date = DateTime.now();
    if (workLoads?.endDate.isNotNullOrEmpty() == true) {
      date = DateTime.parse(workLoads!.endDate!);
    }

    final holidayData = HolidayModel(
      carriedOver: "${workLoads?.carriedOverHours ?? 0} hours",
      holidayEntitlement:
          "${workLoads?.holidayEntitlement?.numberOfWeeks ?? 0} weeks (${workLoads?.holidayEntitlement?.numberOfDays ?? 0} days, ${workLoads?.holidayEntitlement?.numberOfHours ?? 0} hours)",
      holidayAllowance:
          "${workLoads?.holidayAlwnNoOfDys ?? 0} days (${workLoads?.holidayAlwnNoOfHours ?? 0} hours)",
      remainingHolidays:
          "${workLoads?.holidaysRemaining ?? 0} days (${workLoads?.holidayAlwnNoOfHours ?? 0} hours)",
      timeLeftBeforeYearEnd: "${date.difference(DateTime.now()).inDays} days",
    );

    showDialog(
        context: context,
        builder: (BuildContext context) {
          return HolidaysDataDialog(holidayModel: holidayData);
        });
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }
}

class SingleItem extends StatelessWidget {
  const SingleItem({
    super.key,
    required this.heading,
    required this.value,
    this.onTap,
  });

  final String heading;
  final String value;
  final VoidCallback? onTap;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: REdgeInsets.symmetric(vertical: 10.0),
      child: InkWell(
        onTap: onTap,
        child: Container(
          decoration: BoxDecoration(
              border: Border.all(color: CustomAppColors.kSmokeColor)),
          padding: EdgeInsets.symmetric(horizontal: 10.w, vertical: 10.h),
          child: Row(
            children: [
              Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  (heading.isEmpty)
                      ? FrequentFunctions.noWidget
                      : CustomTextWidget(
                          alignment: Alignment.topLeft,
                          textAlign: TextAlign.left,
                          text: heading,
                          fontWeight: FontWeight.w500,
                          isExpanded: false,
                          fontSize: 10.sp,
                          fontColor: CustomAppColors.kLightTextColor,
                        ).paddingOnly(bottom: 4),
                  CustomTextWidget(
                    alignment: Alignment.topLeft,
                    textAlign: TextAlign.left,
                    text: value,
                    fontWeight: FontWeight.w600,
                    isExpanded: false,
                    fontSize: 13.sp,
                    fontColor: CustomAppColors.kDarkBlueTextColor,
                  ),
                ],
              ),
              onTap != null ? const Spacer() : Container(),
              onTap != null
                  ? Transform.rotate(
                      angle: 3.1415 * 3.5,
                      child: const Icon(
                        Icons.arrow_drop_down,
                      ),
                    )
                  : Container(),
            ],
          ),
        ),
      ),
    );
  }
}

class TabBarWidget extends StatelessWidget {
  const TabBarWidget({
    super.key,
    required this.selected,
    required this.title,
    this.onTapFunction,
  });

  final bool selected;
  final String title;
  final VoidCallback? onTapFunction;

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: onTapFunction,
      child: Container(
        // width: 141.w,
        height: 22.h,
        padding: EdgeInsets.symmetric(horizontal: 12.w),
        decoration: BoxDecoration(
          color: selected
              ? CustomAppColors.kSecondaryColor
              : CustomAppColors.kPrimaryColor,
          borderRadius: BorderRadius.circular(20.r),
          border: Border.all(
              color: selected
                  ? CustomAppColors.kSecondaryColor
                  : CustomAppColors.kSmokeColor),
        ),
        child: CustomTextWidget(
          text: title,
          isExpanded: false,
          fontColor: selected
              ? CustomAppColors.kPrimaryColor
              : CustomAppColors.kBlackColor,
          fontSize: 14.sp,
          fontWeight: FontWeight.w500,
        ),
      ),
    );
  }
}

class BuildDetailsWidget extends StatelessWidget {
  const BuildDetailsWidget({
    super.key,
    required this.details,
    required this.title,
  });

  final String title;
  final String details;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 8.h, horizontal: 20.w),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            padding: EdgeInsets.only(bottom: 8.h),
            child: CustomTextWidget(
                isExpanded: false,
                text: title,
                fontWeight: FontWeight.w600,
                fontColor: CustomAppColors.kDarkBlueTextColor,
                fontSize: 14.sp),
          ),
          Container(
            padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 12.h),
            decoration: BoxDecoration(
                border: Border.all(color: CustomAppColors.kLightTextColor),
                borderRadius: BorderRadius.circular(10.r)),
            child: CustomTextWidget(
              alignment: Alignment.centerLeft,
              textAlign: TextAlign.left,
              text: details,
              isExpanded: false,
              fontSize: 10.sp,
              fontColor: CustomAppColors.kBlackColor,
            ),
          ),
        ],
      ),
    );
  }
}