car_customer_app/lib/views/provider/branch_detail_page.dart

import 'package:mc_common_app/view_models/appointments_view_model.dart';
import 'package:car_customer_app/views/provider/sheet/items_list_sheet.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:mc_common_app/classes/consts.dart';
import 'package:mc_common_app/config/routes.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/models/provider_branches_models/branch_detail_model.dart';
import 'package:mc_common_app/theme/colors.dart';
import 'package:mc_common_app/utils/navigator.dart';
import 'package:mc_common_app/widgets/bottom_sheet.dart';
import 'package:mc_common_app/widgets/button/show_fill_button.dart';
import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
import 'package:mc_common_app/widgets/extensions/extensions_widget.dart';
import 'package:provider/provider.dart';

class BranchDetailPage extends StatefulWidget {
  final BranchDetailModel branchDetailModel;

  BranchDetailPage({required this.branchDetailModel});

  @override
  State<BranchDetailPage> createState() => _BranchDetailPageState();
}

class _BranchDetailPageState extends State<BranchDetailPage> {
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    if (widget.branchDetailModel.branchServices!.length > 0) widget.branchDetailModel.branchServices?.first.isExpandedOrSelected = true;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar(
        title: "Branch Detail",
        onBackButtonTapped: () {
          context.read<AppointmentsVM>().resetCategorySelectionBottomSheet();
          Navigator.pop(context);
        },
      ),
      body: Column(
        children: [
          Expanded(
            child: SingleChildScrollView(
              child: Container(
                width: double.infinity,
                padding: EdgeInsets.all(21),
                child: Column(
                  children: [
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Image.asset(MyAssets.bnCar),
                        12.height,
                        "${widget.branchDetailModel.branchName} | ${widget.branchDetailModel.serviceProviderName}".toString().toText(
                              fontSize: 16,
                              isBold: true,
                            ),
                        Row(
                          children: [
                            (LocaleKeys.location.tr() + ":").toText(color: MyColors.lightTextColor, fontSize: 12),
                            4.width,
                            (widget.branchDetailModel.distanceKm.toString() + " km").toText(fontSize: 12, isBold: true),
                          ],
                        ),
                        Row(
                          children: [
                            ("Time" + ":").toText(color: MyColors.lightTextColor, fontSize: 12),
                            4.width,
                            "${widget.branchDetailModel.openTime} - ${widget.branchDetailModel.closeTime}".toText(fontSize: 12, isBold: true),
                          ],
                        ),
                        2.height,
                        Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                //TODO: Needs to implement url launcher
                                "Open Map Location".toText(
                                  fontSize: 12,
                                  isBold: true,
                                  color: MyColors.primaryColor,
                                  isUnderLine: true,
                                ),
                                4.width,
                                Image.asset(
                                  MyAssets.icRightUpPng,
                                  height: 6,
                                  width: 6,
                                  color: MyColors.primaryColor,
                                ),
                              ],
                            ).padding(EdgeInsets.symmetric(vertical: 6, horizontal: 2)),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                "Provider Profile".toText(
                                  fontSize: 12,
                                  isBold: true,
                                  color: MyColors.primaryColor,
                                  isUnderLine: true,
                                ),
                                2.width,
                                Icon(
                                  Icons.arrow_forward,
                                  size: 12,
                                  color: MyColors.primaryColor,
                                ),
                              ],
                            )
                                .padding(EdgeInsets.symmetric(vertical: 6, horizontal: 2))
                                .onPress(() => navigateWithName(context, AppRoutes.providerProfilePage, arguments: widget.branchDetailModel.serviceProviderId)),
                          ],
                        ),
                        20.height,
                        "Services Offer".toText(
                          fontSize: 16,
                          color: MyColors.lightTextColor,
                          isBold: true,
                        ),
                        if (widget.branchDetailModel.branchServices!.length == 0) "No Services Available".toText(fontSize: 12, isBold: true),
                        showServicesList(),
                      ],
                    ).toWhiteContainer(
                      width: double.infinity,
                      allPading: 12,
                    ),
                  ],
                ),
              ),
            ),
          ),
          ShowFillButton(
            title: "Book Appointment",
            maxWidth: double.infinity,
            margin: EdgeInsets.all(21),
            onPressed: () {
              navigateWithName(context, AppRoutes.bookAppointmenServicesView);
              context.read<AppointmentsVM>().updateSelectedBranch(widget.branchDetailModel);
            },
          ).toContainer(paddingAll: 0, backgroundColor: Colors.white),
        ],
      ),
    );
  }

  Widget showServicesList() {
    return ListView.separated(
      itemBuilder: (context, index) {
        return ExpansionTile(
          tilePadding: EdgeInsets.zero,
          title: (widget.branchDetailModel.branchServices![index].serviceDescription ?? "").toText(
            fontSize: 16,
            isBold: true,
          ),
          children: [
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                showItem("Allowing home service:", (widget.branchDetailModel.branchServices![index].isAllowAppointment ?? false) ? "Yes" : "No", valueColor: Colors.green),
                showItem("Home service range", widget.branchDetailModel.branchServices![index].customerLocationRange.toString() + "KM"),
                showItem("Charges per KM", widget.branchDetailModel.branchServices![index].customerLocationRange.toString() + "SAR"),
                8.height,
                ((widget.branchDetailModel.branchServices![index].itemsCount != null && widget.branchDetailModel.branchServices![index].itemsCount! > 0)
                        ? widget.branchDetailModel.branchServices![index].itemsCount.toString() + " items"
                        : "No" + " items")
                    .toText(
                  fontSize: 12,
                  isBold: true,
                  color: MyColors.primaryColor,
                  isUnderLine: true,
                ),
                20.height,
              ],
            ).onPress(() {
              if (widget.branchDetailModel.branchServices![index].itemsCount != null && widget.branchDetailModel.branchServices![index].itemsCount! > 0) {
                showMyBottomSheet(context, child: ItemsListSheet(widget.branchDetailModel.branchServices![index].serviceProviderServiceId ?? 0));
              }
            }),
          ],
          onExpansionChanged: (value) {
            setState(() {
              widget.branchDetailModel.branchServices![index].isExpandedOrSelected = value;
            });
          },
          backgroundColor: Colors.transparent,
          collapsedBackgroundColor: Colors.transparent,
          initiallyExpanded: widget.branchDetailModel.branchServices![index].isExpandedOrSelected,
          trailing: widget.branchDetailModel.branchServices![index].isExpandedOrSelected ? Icon(Icons.keyboard_arrow_up) : Icon(Icons.keyboard_arrow_down),
        );
      },
      separatorBuilder: (context, index) {
        return Divider(
          height: 1,
        );
      },
      itemCount: widget.branchDetailModel.branchServices!.length,
      physics: NeverScrollableScrollPhysics(),
      shrinkWrap: true,
    );
  }

  Widget showItem(String item, String value, {Color valueColor = Colors.black}) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        item.toText(fontSize: 12, color: MyColors.lightTextColor, isBold: true),
        4.width,
        value.toText(fontSize: 12, color: valueColor, isBold: true),
      ],
    );
  }
}