import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:mohem_flutter_app/api/mowadhafhi/mowadhafhi_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/generated/locale_keys.g.dart';
import 'package:mohem_flutter_app/models/mowadhafhi/get_tickets_list.dart';
import 'package:mohem_flutter_app/widgets/button/default_button.dart';

import '../../../widgets/app_bar_widget.dart';

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

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

class _MowadhafhiHomeState extends State<MowadhafhiHome> {
  List<GetTicketsByEmployeeList> getTicketsByEmployeeList = [];

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBarWidget(
        context,
        title: "Mowadhafhi Request",
      ),
      body: Container(
        margin: const EdgeInsets.only(top: 10.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisSize: MainAxisSize.min,
          children: [
            Expanded(
                child: ListView.separated(
                    physics: const BouncingScrollPhysics(),
                    shrinkWrap: true,
                    itemBuilder: (BuildContext context, int index) {
                      return InkWell(
                        onTap: () {
                          openRequestDetails(getTicketsByEmployeeList[index].ticketId!);
                        },
                        child: Container(
                          width: double.infinity,
                          // height: 100.0,
                          padding: const EdgeInsets.only(left: 12, right: 12, top: 10, bottom: 10),
                          margin: const EdgeInsets.only(left: 12, right: 12, top: 10, bottom: 10),
                          decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(10),
                            boxShadow: [
                              BoxShadow(
                                color: const Color(0xff000000).withOpacity(.05),
                                blurRadius: 26,
                                offset: const Offset(0, -3),
                              ),
                            ],
                          ),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  getTicketsByEmployeeList[index].ticketTypeName!.toText14(color: MyColors.grey57Color),
                                  getTicketsByEmployeeList[index].created!.split(" ")[0].toText12(color: MyColors.grey70Color),
                                ],
                              ),
                              Container(
                                padding: const EdgeInsets.only(top: 10.0),
                                child: getTicketsByEmployeeList[index].description!.toText12(color: MyColors.grey57Color),
                              ),
                              Container(
                                padding: const EdgeInsets.only(top: 10.0),
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    getTicketsByEmployeeList[index].ticketStatusInternalName!.toText14(color: MyColors.gradiantEndColor),
                                    SvgPicture.asset(
                                      "assets/images/arrow_next.svg",
                                      color: MyColors.darkIconColor,
                                    )
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      );
                    },
                    separatorBuilder: (BuildContext context, int index) => 12.height,
                    itemCount: getTicketsByEmployeeList.length ?? 0)),
            80.height
          ],
        ),
      ),
      bottomSheet: Container(
        decoration: const BoxDecoration(
          color: MyColors.white,
          boxShadow: [
            BoxShadow(color: MyColors.lightGreyEFColor, spreadRadius: 3),
          ],
        ),
        child: DefaultButton(LocaleKeys.createRequest.tr(), () async {
          openHRRequest();
        }).insideContainer,
      )
    );
  }

  void openRequestDetails(String itgTicketID) async {
    await Navigator.pushNamed(context, AppRoutes.mowadhafhiDetails, arguments: itgTicketID);
  }

  void openHRRequest() async {
    await Navigator.pushNamed(context, AppRoutes.mowadhafhiHRRequest).then((value) {
      getOpenTickets();
    });
  }

  void getOpenTickets() async {
    try {
      Utils.showLoading(context);
      getTicketsByEmployeeList.clear();
      getTicketsByEmployeeList = await MowadhafhiApiClient().getTicketsByEmployee();
      Utils.hideLoading(context);
      setState(() {});
    } catch (ex) {
      Utils.hideLoading(context);
      Utils.handleException(ex, context, null);
    }
  }
}