import 'package:country_code_picker/country_code_picker.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:mc_common_app/classes/app_state.dart';
import 'package:mc_common_app/classes/consts.dart';
import 'package:mc_common_app/extensions/int_extensions.dart';
import 'package:mc_common_app/extensions/string_extensions.dart';
import 'package:mc_common_app/generated/locale_keys.g.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/utils/enums.dart';
import 'package:mc_common_app/utils/utils.dart';
import 'package:mc_common_app/view_models/ad_view_model.dart';
import 'package:mc_common_app/views/advertisement/bottom_sheets/ad_special_service_sheet.dart';
import 'package:mc_common_app/widgets/common_widgets/custom_add_button_widget.dart';
import 'package:mc_common_app/widgets/common_widgets/info_bottom_sheet.dart';
import 'package:mc_common_app/widgets/extensions/extensions_widget.dart';
import 'package:mc_common_app/widgets/txt_field.dart';
import 'package:provider/provider.dart';
import 'package:easy_localization/easy_localization.dart';

class AdDuration extends StatelessWidget {
  const AdDuration({super.key});

  void onAddSpecialServiceButtonTapped(BuildContext context, AdVM adVM) {
    showModalBottomSheet(
        context: context,
        isScrollControlled: true,
        enableDrag: true,
        builder: (BuildContext context) {
          return const BottomSheetAdSpecialServiceContent();
        });
  }

  void reservePriceInfoClicked(BuildContext context) {
    showModalBottomSheet(
        context: context,
        isScrollControlled: true,
        enableDrag: true,
        builder: (BuildContext context) {
          return InfoBottomSheet(
            title: LocaleKeys.reserveAdPriceInfo.tr().toText(fontSize: 24, isBold: true),
            description: Flexible(
                child: GlobalConsts.reserveAdPriceInfo.toText(
              textAlign: TextAlign.justify,
              fontSize: 16,
              color: MyColors.lightTextColor,
              isBold: false,
            )),
          );
        });
  }

  @override
  Widget build(BuildContext context) {
    return Consumer(
      builder: (BuildContext context, AdVM adVM, Widget? child) {
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                LocaleKeys.adDuration.tr().toText(fontSize: 18, isBold: true),
                8.height,

                if (AppState().userType != UserType.providerDealer) ...[
                  TxtField(
                    isBackgroundEnabled: true,
                    isButtonEnable: false,
                    isNeedBorder: false,
                    hint: LocaleKeys.adDuration.tr(),
                    value: adVM.vehicleAdDurationId.selectedOption,
                    isNeedClickAll: true,
                    postFixDataColor: MyColors.darkTextColor,
                    onTap: () async {
                      final formattedDate = await Utils.pickDateFromDatePicker(context);
                      adVM.updateSelectionDurationStartDate(formattedDate);
                    },
                  ),
                ],
                // Builder(builder: (context) {
                //   List<DropValue> vehicleAdsDurationsDrop = [];
                //   for (var element in adVM.vehicleAdsDurations) {
                //     vehicleAdsDurationsDrop.add(DropValue(element.id?.toInt() ?? 0, element.name ?? "", ""));
                //   }
                //   return DropdownField(
                //     (DropValue value) => adVM.updateVehicleAdDurationId(SelectionModel(selectedId: value.id, selectedOption: value.value)),
                //     errorValue: adVM.vehicleAdDurationId.errorValue,
                //     list: vehicleAdsDurationsDrop,
                //     hint: "Select Duration",
                //     dropdownValue: adVM.vehicleAdDurationId.selectedId != -1 ? DropValue(adVM.vehicleAdDurationId.selectedId, adVM.vehicleAdDurationId.selectedOption, "") : null,
                //   );
                // }),
                8.height,

                TxtField(
                  errorValue: adVM.adStartDateError,
                  hint: LocaleKeys.startDate.tr(),
                  value: adVM.selectionDurationStartDate,
                  isNeedClickAll: true,
                  postfixData: Icons.calendar_month_rounded,
                  postFixDataColor: MyColors.darkTextColor,
                  onTap: () async {
                    final formattedDate = await Utils.pickDateFromDatePicker(context);
                    adVM.updateSelectionDurationStartDate(formattedDate);
                  },
                ),
              ],
            ).toWhiteContainer(width: double.infinity, allPading: 12, margin: const EdgeInsets.symmetric(horizontal: 21, vertical: 4)),
            // Column(
            //   crossAxisAlignment: CrossAxisAlignment.start,
            //   children: [
            //     "Reservable Ad".toText(fontSize: 18, isBold: true),
            //     8.height,
            //     Builder(builder: (context) {
            //       List<DropValue> adReservableOptions = [];
            //       adReservableOptions.add(DropValue(1, "Yes", ""));
            //       adReservableOptions.add(DropValue(0, "No", ""));
            //       return DropdownField(
            //         (DropValue value) => adVM.updateVehicleAdReservableId(SelectionModel(selectedId: value.id, selectedOption: value.value)),
            //         errorValue: adVM.vehicleAdReservableId.errorValue,
            //         list: adReservableOptions,
            //         hint: "Reservable",
            //         dropdownValue: adVM.vehicleAdReservableId.selectedId != -1 ? DropValue(adVM.vehicleAdReservableId.selectedId, adVM.vehicleAdReservableId.selectedOption, "") : null,
            //       );
            //     }),
            //     if (adVM.vehicleAdReservableId.selectedId == 1) ...[
            //       8.height,
            //       TxtField(
            //         postfixData: Icons.info_outline_rounded,
            //         postFixDataColor: MyColors.grey77Color,
            //         onPostFixPressed: () => reservePriceInfoClicked(context),
            //         value: adVM.adReserveAmount,
            //         errorValue: adVM.adReservePriceError,
            //         keyboardType: TextInputType.number,
            //         hint: "Ad Reserve Price",
            //         onChanged: (v) => adVM.updateAdReservePriceAmount(v),
            //       ),
            //     ],
            //   ],
            // ).toWhiteContainer(width: double.infinity, allPading: 12, margin: const EdgeInsets.symmetric(horizontal: 21, vertical: 10)),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                LocaleKeys.contactDetails.tr().toText(fontSize: 18, isBold: true),
                8.height,
                LocaleKeys.showyournumbertoBuyers.tr().toText(fontSize: 14),
                6.height,
                Container(
                  width: 38,
                  height: 25,
                  decoration: BoxDecoration(
                    color: adVM.isPhoneNumberShown ? MyColors.darkPrimaryColor : MyColors.white,
                    borderRadius: BorderRadius.circular(25.0),
                    border: Border.all(color: MyColors.black, width: 1),
                  ),
                  child: Transform.scale(
                    scale: 0.6,
                    child: CupertinoSwitch(
                      activeColor: MyColors.darkPrimaryColor,
                      trackColor: MyColors.white,
                      thumbColor: MyColors.greyButtonColor,
                      value: adVM.isPhoneNumberShown,
                      onChanged: (value) {
                        adVM.updateIsPhoneNumberShownStatus(value);
                      },
                    ),
                  ),
                ),
                if (adVM.isPhoneNumberShown) ...[
                  10.height,
                  TxtField(
                    preFixWidget: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [adVM.adPhoneNumberDialCode.toText(fontSize: 14)],
                    ).paddingOnly(left: 15, right: 15),
                    postfixWidget: SizedBox(
                      width: 110,
                      child: Row(
                        children: [
                          CountryCodePicker(
                            onChanged: (CountryCode code) => adVM.updateAdPhoneNumberDialCode(code.dialCode ?? ""),
                            hideMainText: true,
                            initialSelection: '+966',
                            showOnlyCountryWhenClosed: false,
                            alignLeft: false,
                          ),
                          const Icon(
                            Icons.arrow_forward_ios_outlined,
                            size: 18,
                            color: MyColors.darkTextColor,
                          ).paddingOnly(right: 5)
                        ],
                      ),
                    ),
                    errorValue: adVM.adPhoneNumberError,
                    hint: '123456789',
                    keyboardType: TextInputType.number,
                    value: adVM.adPhoneNumber,
                    onChanged: (v) => adVM.updateAdPhoneNumber(v),
                  ),
                  10.height,
                  Row(
                    children: [
                      SizedBox(
                        height: 40.0,
                        width: 30.0,
                        child: Transform.scale(
                          scale: 1.3,
                          child: Checkbox(
                            value: adVM.isNumberOnWhatsApp,
                            activeColor: !adVM.isNumberOnWhatsApp ? MyColors.lightTextColor : MyColors.darkPrimaryColor,
                            onChanged: (value) {
                              adVM.updateIsNumberOnWhatsAppStatus(value ?? false);
                            },
                          ),
                        ),
                      ),
                      const SizedBox(width: 10),
                      LocaleKeys.isNumberRegisteredWhatsApp.tr().toString().toText()
                    ],
                  ),
                ],
              ],
            ).toWhiteContainer(width: double.infinity, allPading: 12, margin: const EdgeInsets.symmetric(horizontal: 21, vertical: 4)),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                LocaleKeys.selectSpecialServices.tr().toText(fontSize: 18, isBold: true),
                8.height,
                CustomAddButton(
                  needsBorder: true,
                  bgColor: MyColors.white,
                  onTap: () {
                    onAddSpecialServiceButtonTapped(context, adVM);
                  },
                  text: LocaleKeys.addService.tr(),
                  icon: Container(
                    height: 24,
                    width: 24,
                    decoration: const BoxDecoration(shape: BoxShape.circle, color: MyColors.darkTextColor),
                    child: const Icon(Icons.add, color: MyColors.white),
                  ),
                ),
                20.height,
                ListView.builder(
                  physics: const NeverScrollableScrollPhysics(),
                  shrinkWrap: true,
                  itemCount: adVM.specialServiceCards.length,
                  itemBuilder: (BuildContext context, int index) {
                    SpecialServiceCard specialServicesCard = adVM.specialServiceCards[index];
                    return Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Column(
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                Expanded(
                                  child: specialServicesCard.serviceSelectedId!.selectedOption.toText(fontSize: 16, isBold: true),
                                ),
                                Align(
                                  alignment: Alignment.topRight,
                                  child: MyAssets.closeWithOrangeBg.buildSvg(
                                    fit: BoxFit.fill,
                                    height: 30,
                                    width: 30,
                                  ),
                                ).onPress(() => adVM.removeSpecialServiceCard(index))
                              ],
                            ),
                            Builder(builder: (context) {
                              return Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  if (specialServicesCard.serviceSelectedId!.selectedId != 1 && specialServicesCard.serviceSelectedId!.selectedId != 3) ...[
                                    // Row(
                                    //   crossAxisAlignment: CrossAxisAlignment.start,
                                    //   children: [
                                    //     "Duration: ".toText(fontSize: 12, color: MyColors.lightTextColor, isBold: true),
                                    //     (specialServicesCard.duration ?? "").toText(fontSize: 12, isBold: true).expand(),
                                    //   ],
                                    // ),
                                    if (specialServicesCard.description != null && specialServicesCard.description!.isNotEmpty) ...[
                                      4.height,
                                      Row(
                                        crossAxisAlignment: CrossAxisAlignment.start,
                                        children: [
                                          ("${LocaleKeys.description.tr()}: ").toText(fontSize: 12, color: MyColors.lightTextColor, isBold: true),
                                          (specialServicesCard.description ?? "").toText(fontSize: 12, isBold: true).expand(),
                                        ],
                                      ),
                                    ],
                                  ],
                                  // if ((specialServicesCard.serviceSelectedId!.selectedId == 1 || specialServicesCard.serviceSelectedId!.selectedId == 3)) ...[
                                  //   Row(
                                  //     crossAxisAlignment: CrossAxisAlignment.start,
                                  //     children: [
                                  //       const Icon(
                                  //         weight: 2,
                                  //         Icons.location_on_outlined,
                                  //         color: MyColors.primaryColor,
                                  //         size: 17,
                                  //       ),
                                  //       "${specialServicesCard.duration} km".toText(fontSize: 10, color: MyColors.primaryColor),
                                  //     ],
                                  //   ),
                                  //   8.height,
                                  //   Row(
                                  //     crossAxisAlignment: CrossAxisAlignment.start,
                                  //     children: [
                                  //       "Branch Address: ".toText(fontSize: 12, color: MyColors.lightTextColor, isBold: true),
                                  //       (specialServicesCard.address ?? "").toText(fontSize: 12, isBold: true).expand(),
                                  //     ],
                                  //   ),
                                  //   Row(
                                  //     crossAxisAlignment: CrossAxisAlignment.start,
                                  //     children: [
                                  //       "Appointment Time: ".toText(fontSize: 12, color: MyColors.lightTextColor, isBold: true),
                                  //       "${specialServicesCard.serviceDate} - ${specialServicesCard.serviceTime}".toText(fontSize: 12, isBold: true).expand(),
                                  //     ],
                                  //   ),
                                  // ],
                                  6.height,
                                  Row(
                                    crossAxisAlignment: CrossAxisAlignment.end,
                                    children: [
                                      (specialServicesCard.serviceSelectedId!.itemPrice).toText(fontSize: 20, isBold: true),
                                      2.width,
                                      LocaleKeys.sar.tr().toText(color: MyColors.lightTextColor, fontSize: 14),
                                    ],
                                  ),
                                ],
                              );
                            }),
                            3.height,
                            const Divider(thickness: 1.5)
                          ],
                        ),
                        10.height,
                      ],
                    );
                  },
                ),
              ],
            ).toWhiteContainer(width: double.infinity, allPading: 12, margin: const EdgeInsets.symmetric(horizontal: 21, vertical: 4)),
          ],
        );
      },
    );
  }
}
