import 'dart:convert';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/cm_module/utilities/service_request_utils.dart';
import 'package:test_sa/dashboard_latest/dashboard_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/enums/user_types.dart';
import 'package:test_sa/models/lookup.dart';
import 'package:test_sa/models/new_models/gas_refill_model.dart';
import 'package:test_sa/models/new_models/mapped_sites.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/common_widgets/app_filled_button.dart';
import 'package:test_sa/new_views/common_widgets/app_text_form_field.dart';
import 'package:test_sa/new_views/common_widgets/single_item_drop_down_menu.dart';
import 'package:test_sa/providers/gas_request_providers/cylinder_size_provider.dart';
import 'package:test_sa/providers/gas_request_providers/cylinder_type_provider.dart';
import 'package:test_sa/providers/gas_request_providers/gas_types_provider.dart';
import 'package:test_sa/providers/gas_request_providers/site_provider.dart';
import 'package:test_sa/providers/loading_list_notifier.dart';

import 'package:test_sa/cm_module/views/components/action_button/footer_action_button.dart';
import 'package:test_sa/views/widgets/images/multi_image_picker.dart';
import '../../controllers/providers/api/gas_refill_provider.dart';
import '../common_widgets/default_app_bar.dart';

class GasRefillRequestForm extends StatefulWidget {
  static const String routeName = "/gas_refill_request_form";

  const GasRefillRequestForm({Key? key}) : super(key: key);

  @override
  State<GasRefillRequestForm> createState() => _GasRefillRequestFormState();
}

class _GasRefillRequestFormState extends State<GasRefillRequestForm> {
  late GasRefillDetails _currentDetails;
  late GasRefillModel _gasModel;
  Lookup? _requestedQuantity;
  final TextEditingController _commentController = TextEditingController();
  GasRefillProvider? _gasRefillProvider;
  List<File> _files = [];

  static List<Lookup> gasQuantity = [
    Lookup(name: "1", id: 1, value: 1),
    Lookup(name: "2", id: 2, value: 2),
    Lookup(name: "3", id: 3, value: 3),
    Lookup(name: "4", id: 4, value: 4),
    Lookup(name: "5", id: 5, value: 5)
  ];

  @override
  void initState() {
    super.initState();
    _gasRefillProvider ??= Provider.of<GasRefillProvider>(context, listen: false);
    _currentDetails = GasRefillDetails();
    _gasModel = GasRefillModel(gasRefillDetails: []);
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: DefaultAppBar(title: context.translation.newGasRefillRequest),
      body: Column(
        children: [
          12.height,
          SingleChildScrollView(
            child: Column(
              children: [
                SingleItemDropDownMenu<Lookup, GasTypesProvider>(
                  context: context,
                  title: context.translation.gasType,
                  initialValue: _currentDetails.gasType,
                  backgroundColor: AppColor.neutral100,
                  showShadow: false,
                  showAsBottomSheet: true,
                  onSelect: (value) {
                    _currentDetails.gasType = value;
                  },
                ),
                8.height,
                SingleItemDropDownMenu<Lookup, CylinderTypesProvider>(
                  context: context,
                  title: context.translation.cylinderType,
                  initialValue: _currentDetails.cylinderType,
                  backgroundColor: AppColor.neutral100,
                  showShadow: false,
                  onSelect: (value) {
                    _currentDetails.cylinderType = value;
                  },
                ),
                8.height,
                SingleItemDropDownMenu<Lookup, CylinderSizeProvider>(
                  context: context,
                  title: context.translation.cylinderSize,
                  initialValue: _currentDetails.cylinderSize,
                  showAsBottomSheet: true,
                  backgroundColor: AppColor.neutral100,
                  showShadow: false,
                  onSelect: (value) {
                    _currentDetails.cylinderSize = value;
                  },
                ),
                8.height,
                SingleItemDropDownMenu<Lookup, NullableLoadingProvider>(
                  context: context,
                  title: context.translation.quantity,
                  showAsBottomSheet: true,
                  initialValue: _requestedQuantity,
                  staticData: gasQuantity,
                  backgroundColor: AppColor.neutral100,
                  showShadow: false,
                  onSelect: (value) {
                    _requestedQuantity = value;
                    _currentDetails.requestedQty = value?.value;
                  },
                ),
                8.height,
                Row(
                  children: [
                    SingleItemDropDownMenu<MappedSite, MappedSiteProvider>(
                      context: context,
                      title: context.translation.site,
                      initialValue: _gasModel.mapSite,
                      showAsBottomSheet: true,
                      backgroundColor: AppColor.neutral100,
                      showShadow: false,
                      onSelect: (value) {
                        setState(() {
                          _gasModel.mapSite = value;
                          _gasModel.mappedBuilding = null;
                          _gasModel.mappedFloor = null;
                          _gasModel.mappedDepartment = null;
                        });
                      },
                    ).expanded,
                    8.width,
                    SingleItemDropDownMenu<MappedBuilding, NullableLoadingProvider>(
                      context: context,
                      title: context.translation.building,
                      initialValue: _gasModel.mappedBuilding,
                      enabled: _gasModel.mapSite?.buildings?.isNotEmpty ?? false,
                      staticData: _gasModel.mapSite?.buildings ?? [],
                      showAsBottomSheet: true,
                      backgroundColor: AppColor.neutral100,
                      showShadow: false,
                      onSelect: (value) {
                        setState(() {
                          _gasModel.mappedBuilding = value;
                          _gasModel.mappedFloor = null;
                          _gasModel.mappedDepartment = null;
                        });
                      },
                    ).expanded,
                  ],
                ),
                8.height,
                Row(
                  children: [
                    SingleItemDropDownMenu<MappedFloor, NullableLoadingProvider>(
                      context: context,
                      title: context.translation.floor,
                      initialValue: _gasModel.mappedFloor,
                      enabled: _gasModel.mappedBuilding?.floors?.isNotEmpty ?? false,
                      staticData: _gasModel.mappedBuilding?.floors ?? [],
                      showAsBottomSheet: true,
                      backgroundColor: AppColor.neutral100,
                      showShadow: false,
                      onSelect: (value) {
                        setState(() {
                          _gasModel.mappedFloor = value;
                          _gasModel.department = null;
                        });
                      },
                    ).expanded,
                    8.width,
                    SingleItemDropDownMenu<MappedDepartment, NullableLoadingProvider>(
                      context: context,
                      title: context.translation.department,
                      initialValue: _gasModel.mappedDepartment,
                      enabled: _gasModel.mappedFloor?.departments?.isNotEmpty ?? false,
                      staticData: _gasModel.mappedFloor?.departments ?? [],
                      showAsBottomSheet: true,
                      backgroundColor: AppColor.neutral100,
                      showShadow: false,
                      onSelect: (value) {
                        _gasModel.mappedDepartment = value;
                      },
                    ).expanded,
                  ],
                ),
                8.height,
                AppTextFormField(
                  labelText: context.translation.callComments,
                  labelStyle: AppTextStyles.tinyFont.copyWith(color: AppColor.neutral120),
                  textInputType: TextInputType.multiline,
                  alignLabelWithHint: true,
                  backgroundColor: AppColor.neutral100,
                  showShadow: false,
                  controller: _commentController,
                  onChange: (value) {
                    _gasModel.comment = value;
                  },
                  onSaved: (value) {},
                ),
                8.height,
                MultiFilesPicker(
                  label: context.translation.attachFiles,
                  files: _files,
                  buttonColor: AppColor.black10,
                  onlyImages: false,
                  buttonIcon: 'image-plus'.toSvgAsset(color: AppColor.neutral120),
                ),
              ],
            ).toShadowContainer(context, padding: 10).paddingOnly(start: 16, end: 16, top: 16),
          ).expanded,
          16.height,
          FooterActionButton.footerContainer(child: AppFilledButton(label: context.translation.submitRequest, maxWidth: true, onPressed: _submit)),
        ],
      ),
    );
  }

  Future<void> _submit() async {
    if (await validateRequest()) {
      _gasModel.gasRefillDetails = [];
      _gasModel.gasRefillDetails?.add(_currentDetails);
      _gasModel.gasRefillAttachments = [];
      for (var item in _files) {
        _gasModel.gasRefillAttachments?.add(GasRefillAttachments(
            id: 0, gasRefillId: _gasModel.id ?? 0, attachmentName: ServiceRequestUtils.isLocalUrl(item.path) ? "${item.path.split("/").last}|${base64Encode(item.readAsBytesSync())}" : item.path));
      }
      await _gasRefillProvider?.addGasRefillRequest(
        context: context,
        model: _gasModel,
      );
      if (_gasRefillProvider?.stateCode == 200) {
        DashBoardProvider dashBoardProvider = Provider.of<DashBoardProvider>(context, listen: false);
        dashBoardProvider.refreshDashboard(context: context, userType: UsersTypes.nurse);
      }
    }
  }

  Future<bool> validateRequest() async {
    if (_currentDetails.gasType == null) {
      await Fluttertoast.showToast(msg: "Please Select Gas Type");
      return false;
    }
    if (_gasModel.mapSite == null) {
      await Fluttertoast.showToast(msg: "Please Select Site");
      return false;
    }
    if (_gasModel.mappedBuilding == null) {
      await Fluttertoast.showToast(msg: "Please Select Building");
      return false;
    }
    if (_gasModel.mappedFloor == null) {
      await Fluttertoast.showToast(msg: "Please Select Floor");
      return false;
    }
    if (_gasModel.mappedDepartment == null) {
      await Fluttertoast.showToast(msg: "Please Select Department");
      return false;
    }
    return true;
  }

//older code....
// if (_gasModel.gasRefillDetails?.isEmpty ?? true)
//   AppFilledButton(
//     label: context.translation.add,
//     maxWidth: true,
//     textColor: Colors.white,
//     buttonColor: context.isDark ? AppColor.neutral60 : AppColor.neutral50,
//     onPressed: _add,
//   ),
// ListView.builder(
//   shrinkWrap: true,
//   itemCount: _gasModel.gasRefillDetails?.length,
//   padding: const EdgeInsets.only(top: 12, bottom: 24),
//   physics: const NeverScrollableScrollPhysics(),
//   itemBuilder: (context, index) {
//     return Column(
//       crossAxisAlignment: CrossAxisAlignment.start,
//       children: [
//         Row(
//           mainAxisAlignment: MainAxisAlignment.spaceBetween,
//           crossAxisAlignment: CrossAxisAlignment.start,
//           children: [
//             Column(
//               crossAxisAlignment: CrossAxisAlignment.start,
//               children: [
//                 (_gasModel.gasRefillDetails![index].gasType?.name ?? "").heading5(context),
//                 8.height,
//                 ("${context.translation.quantity}: ${_gasModel.gasRefillDetails![index].requestedQty}").bodyText(context),
//                 ("${context.translation.cylinderSize}: ${_gasModel.gasRefillDetails![index].cylinderSize?.name}").bodyText(context),
//                 ("${context.translation.cylinderType}: ${_gasModel.gasRefillDetails![index].cylinderType?.name}").bodyText(context),
//               ],
//             ),
//             Container(
//               height: 48.toScreenWidth,
//               width: 48.toScreenWidth,
//               decoration: BoxDecoration(
//                 borderRadius: BorderRadius.circular(100),
//                 border: Border.all(color: context.isDark ? AppColor.neutral50 : AppColor.neutral30),
//               ),
//               padding: EdgeInsets.symmetric(vertical: 12.toScreenHeight),
//               child: "trash".toSvgAsset(fit: BoxFit.fitHeight, color: context.isDark ? AppColor.red40 : AppColor.red50),
//             ).onPress(() {
//               _delete(index);
//             }),
//           ],
//         ),
//         const Divider().defaultStyle(context),
//         ("${context.translation.site}: ${_gasModel.site?.custName}").bodyText(context),
//         ("${context.translation.building}: ${_gasModel.building?.name}").bodyText(context),
//         ("${context.translation.floor}: ${_gasModel.floor?.name}").bodyText(context),
//         ("${context.translation.department}: ${_gasModel.department?.departmentName}").bodyText(context),
//       ],
//     ).toShadowContainer(context);
//   },
// ),
}