HMG_Patient_App_New/lib/presentation/appointments/my_appointments_page.dart

import 'dart:async';

import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
import 'package:hmg_patient_app_new/core/app_state.dart';
import 'package:hmg_patient_app_new/core/dependencies.dart';
import 'package:hmg_patient_app_new/core/utils/size_utils.dart';
import 'package:hmg_patient_app_new/core/utils/utils.dart';
import 'package:hmg_patient_app_new/extensions/string_extensions.dart';
import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';
import 'package:hmg_patient_app_new/features/my_appointments/my_appointments_view_model.dart';
import 'package:hmg_patient_app_new/generated/locale_keys.g.dart';
import 'package:hmg_patient_app_new/presentation/appointments/widgets/appointment_card.dart';
import 'package:hmg_patient_app_new/theme/colors.dart';
import 'package:hmg_patient_app_new/widgets/custom_tab_bar.dart';
import 'package:hmg_patient_app_new/widgets/shimmer/movies_shimmer_widget.dart';
import 'package:provider/provider.dart';

class MyAppointmentsPage extends StatefulWidget {
  const MyAppointmentsPage({super.key});

  @override
  State<MyAppointmentsPage> createState() => _MyAppointmentsPageState();
}

class _MyAppointmentsPageState extends State<MyAppointmentsPage> {
  late MyAppointmentsViewModel myAppointmentsViewModel;

  @override
  void initState() {
    scheduleMicrotask(() {
      myAppointmentsViewModel.initAppointmentsViewModel();
      myAppointmentsViewModel.getPatientAppointments(true, false);
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    myAppointmentsViewModel = Provider.of<MyAppointmentsViewModel>(context);
    return Scaffold(
      backgroundColor: AppColors.bgScaffoldColor,
      appBar: AppBar(
        title: "Appointments List".needTranslation.toText18(),
        backgroundColor: AppColors.bgScaffoldColor,
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                "Appointments List".needTranslation.toText24(isBold: true),
              ],
            ).paddingSymmetrical(24.h, 24.h),
            CustomTabBar(
              activeTextColor: Color(0xffED1C2B),
              activeBackgroundColor: Color(0xffED1C2B).withValues(alpha: .1),
              tabs: [
                CustomTabBarModel(null, "All Appt.".needTranslation),
                CustomTabBarModel(null, "Upcoming".needTranslation),
                CustomTabBarModel(null, "Completed".needTranslation),
              ],
              onTabChange: (index) {
                print(index);
                myAppointmentsViewModel.onTabChange(index);
              },
            ).paddingSymmetrical(24.h, 0.h),
            Consumer<MyAppointmentsViewModel>(builder: (context, myAppointmentsVM, child) {
              return getSelectedTabData(myAppointmentsVM.selectedTabIndex, myAppointmentsVM);
            }),
          ],
        ),
      ),
    );
  }

  Widget getSelectedTabData(int index, MyAppointmentsViewModel myAppointmentsVM) {
    switch (index) {
      case 0:
        //All Appointments Tab Data
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            SizedBox(height: 24.h),
            // Expandable list
            ListView.separated(
              shrinkWrap: true,
              physics: NeverScrollableScrollPhysics(),
              itemCount: myAppointmentsVM.isMyAppointmentsLoading
                  ? 5
                  : myAppointmentsVM.patientAppointmentsHistoryList.isNotEmpty
                      ? myAppointmentsVM.patientAppointmentsHistoryList.length
                      : 1,
              itemBuilder: (context, index) {
                return myAppointmentsVM.isMyAppointmentsLoading
                    ? const MoviesShimmerWidget().paddingSymmetrical(24.h, 0.h)
                    : myAppointmentsVM.patientAppointmentsHistoryList.isNotEmpty
                        ? AnimationConfiguration.staggeredList(
                            position: index,
                            duration: const Duration(milliseconds: 500),
                            child: SlideAnimation(
                              verticalOffset: 100.0,
                              child: FadeInAnimation(
                                child: AnimatedContainer(
                                  duration: Duration(milliseconds: 300),
                                  curve: Curves.easeInOut,
                                  margin: EdgeInsets.symmetric(vertical: 8.h),
                                  decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 24.h, hasShadow: true),
                                  child: AppointmentCard(
                                    patientAppointmentHistoryResponseModel: myAppointmentsVM.patientAppointmentsHistoryList[index],
                                    myAppointmentsViewModel: myAppointmentsViewModel,
                                  ),
                                ).paddingSymmetrical(24.h, 0.h),
                              ),
                            ),
                          )
                        : Utils.getNoDataWidget(context);
              },
              separatorBuilder: (BuildContext cxt, int index) => SizedBox(height: 16.h),
            ),
          ],
        );
      case 1:
        //Upcoming Appointments Tab Data
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            SizedBox(height: 24.h),
            // Expandable list
            ListView.separated(
              shrinkWrap: true,
              physics: NeverScrollableScrollPhysics(),
              itemCount: myAppointmentsVM.isMyAppointmentsLoading
                  ? 5
                  : myAppointmentsVM.patientUpcomingAppointmentsHistoryList.isNotEmpty
                      ? myAppointmentsVM.patientUpcomingAppointmentsHistoryList.length
                      : 1,
              itemBuilder: (context, index) {
                return myAppointmentsVM.isMyAppointmentsLoading
                    ? const MoviesShimmerWidget().paddingSymmetrical(24.h, 0.h)
                    : myAppointmentsVM.patientUpcomingAppointmentsHistoryList.isNotEmpty
                        ? AnimationConfiguration.staggeredList(
                            position: index,
                            duration: const Duration(milliseconds: 500),
                            child: SlideAnimation(
                              verticalOffset: 100.0,
                              child: FadeInAnimation(
                                child: AnimatedContainer(
                                  duration: Duration(milliseconds: 300),
                                  curve: Curves.easeInOut,
                                  margin: EdgeInsets.symmetric(vertical: 8.h),
                                  decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 24.h, hasShadow: true),
                                  child: AppointmentCard(
                                    patientAppointmentHistoryResponseModel: myAppointmentsVM.patientUpcomingAppointmentsHistoryList[index],
                                    myAppointmentsViewModel: myAppointmentsViewModel,
                                  ),
                                ).paddingSymmetrical(24.h, 0.h),
                              ),
                            ),
                          )
                        : Utils.getNoDataWidget(context);
              },
              separatorBuilder: (BuildContext cxt, int index) => SizedBox(height: 16.h),
            ),
          ],
        );
      case 2:
        //Completed Appointments Tab Data
        return Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            SizedBox(height: 24.h),
            // Expandable list
            ListView.separated(
              shrinkWrap: true,
              physics: NeverScrollableScrollPhysics(),
              itemCount: myAppointmentsVM.isMyAppointmentsLoading
                  ? 5
                  : myAppointmentsVM.patientArrivedAppointmentsHistoryList.isNotEmpty
                  ? myAppointmentsVM.patientArrivedAppointmentsHistoryList.length
                  : 1,
              itemBuilder: (context, index) {
                return myAppointmentsVM.isMyAppointmentsLoading
                    ? const MoviesShimmerWidget().paddingSymmetrical(24.h, 0.h)
                    : myAppointmentsVM.patientArrivedAppointmentsHistoryList.isNotEmpty
                    ? AnimationConfiguration.staggeredList(
                  position: index,
                  duration: const Duration(milliseconds: 500),
                  child: SlideAnimation(
                    verticalOffset: 100.0,
                    child: FadeInAnimation(
                      child: AnimatedContainer(
                        duration: Duration(milliseconds: 300),
                        curve: Curves.easeInOut,
                        margin: EdgeInsets.symmetric(vertical: 8.h),
                        decoration: RoundedRectangleBorder().toSmoothCornerDecoration(color: AppColors.whiteColor, borderRadius: 24.h, hasShadow: true),
                        child: AppointmentCard(
                          patientAppointmentHistoryResponseModel: myAppointmentsVM.patientArrivedAppointmentsHistoryList[index],
                          myAppointmentsViewModel: myAppointmentsViewModel,
                        ),
                      ).paddingSymmetrical(24.h, 0.h),
                    ),
                  ),
                )
                    : Utils.getNoDataWidget(context);
              },
              separatorBuilder: (BuildContext cxt, int index) => SizedBox(height: 16.h),
            ),
          ],
        );
      default:
        return Container();
    }
  }
}