import 'package:hmg_patient_app/core/model/blooddonation/blood_donation_free_slots_response.dart'; import 'package:hmg_patient_app/core/model/blooddonation/blood_donation_projects_list_response.dart'; import 'package:hmg_patient_app/core/service/blood/blood_donation_service.dart'; import 'package:hmg_patient_app/core/viewModels/project_view_model.dart'; import 'package:hmg_patient_app/models/Appointments/FreeSlot.dart'; import 'package:hmg_patient_app/models/Appointments/timeSlot.dart'; import 'package:hmg_patient_app/pages/Blood/blood_donation_appointment_terms_conditions.dart'; import 'package:hmg_patient_app/services/appointment_services/GetDoctorsList.dart'; import 'package:hmg_patient_app/theme/colors.dart'; import 'package:hmg_patient_app/uitl/app_toast.dart'; import 'package:hmg_patient_app/uitl/date_uitl.dart'; import 'package:hmg_patient_app/uitl/gif_loader_dialog_utils.dart'; import 'package:hmg_patient_app/uitl/translations_delegate_base.dart'; import 'package:hmg_patient_app/uitl/utils_new.dart'; import 'package:hmg_patient_app/widgets/buttons/custom_text_button.dart'; import 'package:hmg_patient_app/widgets/buttons/defaultButton.dart'; import 'package:hmg_patient_app/widgets/dialogs/confirm_dialog.dart'; import 'package:hmg_patient_app/widgets/dialogs/radio_selection_dialog.dart'; import 'package:hmg_patient_app/widgets/others/app_scaffold_widget.dart'; import 'package:hmg_patient_app/widgets/transitions/fade_page.dart'; import 'package:flutter/material.dart'; import 'package:intl/intl.dart'; import 'package:provider/provider.dart'; import 'package:syncfusion_flutter_calendar/calendar.dart'; import '../AlHabibMedicalService/h2o/h20_setting.dart'; class BloodDonationBookAppointment extends StatefulWidget { const BloodDonationBookAppointment(); static bool areSlotsAvailable = false; static DateTime? selectedAppoDateTime; static String? selectedDate; static String? selectedTime; @override State createState() => _BloodDonationBookAppointmentState(); } class _BloodDonationBookAppointmentState extends State with TickerProviderStateMixin { Map? _events; AnimationController? _animationController; CalendarController? _calendarController; List bloodDonationProjectsListResponse = []; int _selectedProjectID = 0; int _clinicID = 0; int _doctorID = 0; String selectedProjectName = ""; List docFreeSlots = []; List dayEvents = []; var selectedDate = ""; dynamic selectedDateJSON; dynamic jsonFreeSlots; int selectedButtonIndex = 0; List bloodDonationFreeSlotsResponse = []; ProjectViewModel? projectViewModel; ScrollController? _scrollController; var checkedValue = false; @override void initState() { final _selectedDay = DateTime.now(); super.initState(); _events = { _selectedDay: ['Event A0'] }; _scrollController = new ScrollController(); _calendarController = CalendarController(); _animationController = AnimationController( vsync: this, duration: const Duration(milliseconds: 50), ); WidgetsBinding.instance.addPostFrameCallback((_) { getBloodDonationProjectsList(); }); } @override Widget build(BuildContext context) { projectViewModel = Provider.of(context); return AppScaffold( isShowAppBar: true, showNewAppBar: true, backgroundColor: Color(0xffF7F7F7), showNewAppBarTitle: true, isShowDecPage: true, description: TranslationBase.of(context).bloodDonationInfo, appBarTitle: TranslationBase.of(context).bloodD, body: SingleChildScrollView( child: Padding( padding: EdgeInsets.all(21), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text(TranslationBase.of(context).selectHospitalBloodDonation, style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.w600, letterSpacing: -0.64)), mHeight(12), CommonDropDownView( TranslationBase.of(context).selectProject, selectedProjectName, () { List list = []; bloodDonationProjectsListResponse.forEach((element) { list.add(RadioSelectionDialogModel(element.projectName!, element.projectID!)); }); showDialog( context: context, builder: (cxt) => RadioSelectionDialog( listData: list, selectedIndex: 0, onValueSelected: (index) { print(index); _selectedProjectID = index; selectedProjectName = bloodDonationProjectsListResponse.firstWhere((element) => element.projectID == index).projectName!; getBloodDonationFreeSlots(); setState(() {}); }, ), ); }, ).withBorderedContainer, mHeight(12), Container( decoration: cardRadius(12), child: _buildTableCalendarWithBuilders(projectViewModel!), ), mHeight(12), Text(selectedDate, style: TextStyle(fontSize: 16.0, fontWeight: FontWeight.w600, letterSpacing: -0.64)), mHeight(8), BloodDonationBookAppointment.areSlotsAvailable ? Container( height: 40, child: ListView.builder( controller: _scrollController, scrollDirection: Axis.horizontal, itemCount: dayEvents.length, itemBuilder: (context, index) { return Container( margin: EdgeInsets.only(right: (index == dayEvents.length - 1) ? 0 : 5.0, left: index == 0 ? 0 : 5), child: ButtonTheme( shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(5.0), side: BorderSide( color: index == selectedButtonIndex ? CustomColors.green : Colors.black, //Color of the border style: BorderStyle.solid, //Style of the border width: 1.5, //width of the border ), ), minWidth: MediaQuery.of(context).size.width * 0.2, child: index == selectedButtonIndex ? getSelectedButton(index) : getNormalButton(index)), ); }, ), ) : Center( child: Padding( padding: const EdgeInsets.only(left: 12.0, right: 12.0), child: Text(TranslationBase.of(context).noSlotsError, style: TextStyle(fontSize: 14.0, fontWeight: FontWeight.w600, letterSpacing: -0.46, color: CustomColors.grey)), ), ), SizedBox(height: 16), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text( TranslationBase.of(context).viewTermsConditions + ":", style: TextStyle(fontWeight: FontWeight.w600, color: Color(0xff2E303A), fontSize: 14, letterSpacing: -0.56), ), InkWell( onTap: () { Navigator.of(context).push(FadePage(page: BloodDonationAppointmentTermsConditions())); }, child: Text( TranslationBase.of(context).clickHere, style: TextStyle(fontWeight: FontWeight.w600, color: Colors.blue, fontSize: 14, letterSpacing: -0.56), ), ) ], ), SizedBox(height: 12), Row( children: [ Checkbox( onChanged: (bool? value) { setState(() { checkedValue = value!; }); }, value: checkedValue, activeColor: Color(0xFFc5272d), ), Text( TranslationBase.of(context).iAgreeToTheTermsAndConditions, style: TextStyle(fontSize: 14.0, fontWeight: FontWeight.bold), ), ], ), ], ), ), ), bottomSheet: Container( color: Colors.white, height: MediaQuery.of(context).size.height * 0.081, width: double.infinity, padding: EdgeInsets.all(12.0), child: Column( children: [ Container( width: MediaQuery.of(context).size.width * 0.9, child: DefaultButton( TranslationBase.of(context).bookAppo, () async { if (BloodDonationBookAppointment.areSlotsAvailable) { if (checkedValue) { insertBloodDonationAppointment(); } else { AppToast.showErrorToast(message: TranslationBase.of(context).pleaseAcceptTerms); } } else { AppToast.showErrorToast(message: TranslationBase.of(context).selectSlot); } }, textColor: Colors.white, color: CustomColors.green, ), ), ], ), ), ); } void insertBloodDonationAppointment() { DoctorsListService service = new DoctorsListService(); final timeSlot = BloodDonationBookAppointment.selectedAppoDateTime; GifLoaderDialogUtils.showMyDialog(context); service .insertAppointment(_doctorID, _clinicID, _selectedProjectID, BloodDonationBookAppointment.selectedTime!, BloodDonationBookAppointment.selectedDate!, 45, projectViewModel!.isArabic ? 1 : 2, context, null, null, null, projectViewModel) .then((res) { GifLoaderDialogUtils.hideDialog(context); if (res['MessageStatus'] == 1) { AppToast.showSuccessToast(message: TranslationBase.of(context).bookedSuccess); Navigator.of(context).pop(); } else { ConfirmDialog dialog = new ConfirmDialog( context: context, confirmMessage: res['ErrorEndUserMessage'], okText: TranslationBase.of(context).ok, cancelText: TranslationBase.of(context).cancel_nocaps, okFunction: () async { // openAppSettings(); Navigator.pop(context); }, cancelFunction: () => {}); dialog.showAlertDialog(context); // AppToast.showErrorToast(message: res['ErrorEndUserMessage']); } }).catchError((err) { GifLoaderDialogUtils.hideDialog(context); ConfirmDialog dialog = new ConfirmDialog( context: context, confirmMessage: err, okText: TranslationBase.of(context).ok, cancelText: TranslationBase.of(context).cancel_nocaps, okFunction: () async { // openAppSettings(); Navigator.pop(context); }, cancelFunction: () => {}); dialog.showAlertDialog(context); }); } void _onDaySelected(DateTime day, ProjectViewModel projectViewModel) { final DateFormat formatter = DateFormat('yyyy-MM-dd'); setState(() { this.selectedDate = DateUtil.getWeekDayMonthDayYearDateFormatted(day, projectViewModel.isArabic ? "ar" : "en"); openTimeSlotsPickerForDate(day, docFreeSlots); BloodDonationBookAppointment.selectedDate = formatter.format(day); _calendarController!.selectedDate = day; print(BloodDonationBookAppointment.selectedDate); }); } Widget _buildTableCalendarWithBuilders(ProjectViewModel projectViewModel) { return SfCalendar( controller: _calendarController, minDate: DateTime.now(), showNavigationArrow: true, headerStyle: CalendarHeaderStyle(textAlign: TextAlign.center, textStyle: TextStyle(fontSize: 14.0, fontWeight: FontWeight.w600, letterSpacing: -0.46)), viewHeaderStyle: ViewHeaderStyle(dayTextStyle: TextStyle(fontSize: 12.0, fontWeight: FontWeight.w600, letterSpacing: -0.46, color: CustomColors.black)), view: CalendarView.month, todayHighlightColor: CustomColors.green, selectionDecoration: containerColorRadiusBorderWidthCircular(Colors.transparent, 4, CustomColors.green, 2.5), cellBorderColor: Colors.white, dataSource: MeetingDataSource(_getDataSource()), monthViewSettings: const MonthViewSettings(appointmentDisplayMode: MonthAppointmentDisplayMode.indicator, showTrailingAndLeadingDates: false, appointmentDisplayCount: 1), onTap: (CalendarTapDetails details) { _calendarController!.selectedDate = details.date; _onDaySelected(details.date!, projectViewModel); }, ); } Widget getNormalButton(int index) { return CustomTextButton( backgroundColor: Colors.white, elevation: 0, side: BorderSide( color: Colors.black, //Color of the border style: BorderStyle.solid, //Style of the border width: 1.5 //width of the border ), onPressed: () { final timeslot = dayEvents[index]; BloodDonationBookAppointment.selectedAppoDateTime = timeslot.end; setState(() { selectedButtonIndex = index; BloodDonationBookAppointment.selectedTime = dayEvents[index].isoTime; print(BloodDonationBookAppointment.selectedTime); }); }, child: Text(dayEvents[index].isoTime!, style: TextStyle(fontSize: 12.0, color: Color(0xFF60686b))), ); } Widget getSelectedButton(int index) { return CustomTextButton( backgroundColor: CustomColors.green, elevation: 0, side: BorderSide( color: CustomColors.green, //Color of the border style: BorderStyle.solid, //Style of the border width: 1.5 //width of the border ), onPressed: () { setState(() { selectedButtonIndex = index; BloodDonationBookAppointment.selectedTime = dayEvents[index].isoTime; print(BloodDonationBookAppointment.selectedTime); }); }, child: Text(dayEvents[index].isoTime!, style: TextStyle(fontSize: 12.0, color: Colors.white)), ); } getBloodDonationFreeSlots() { BloodDonationService service = new BloodDonationService(); GifLoaderDialogUtils.showMyDialog(context); service.getBloodDonationFreeSlots(134, _selectedProjectID).then((res) { GifLoaderDialogUtils.hideDialog(context); if (res["MessageStatus"] == 1) { res['BD_FreeSlots'].forEach((element) { bloodDonationFreeSlotsResponse.add(BloodDonationFreeSlotsResponseModel.fromJson(element)); }); print(bloodDonationFreeSlotsResponse.length); _getJSONSlots().then((value) => { setState(() => {_clinicID = bloodDonationFreeSlotsResponse[0].clinicID!, _doctorID = bloodDonationFreeSlotsResponse[0].doctorID!, _events!.clear(), _events = value}) }); } else { AppToast.showErrorToast(message: res["ErrorEndUserMessage"]); } }).catchError((err) { GifLoaderDialogUtils.hideDialog(context); print(err); }); } openTimeSlotsPickerForDate(DateTime dateStart, List freeSlots) { dayEvents.clear(); DateTime dateStartObj = new DateTime(dateStart.year, dateStart.month, dateStart.day, 0, 0, 0, 0, 0); freeSlots.forEach((v) { if (v.start == dateStartObj) dayEvents.add(v); }); setState(() { if (dayEvents.length != 0) { BloodDonationBookAppointment.areSlotsAvailable = true; selectedButtonIndex = 0; BloodDonationBookAppointment.selectedTime = dayEvents[selectedButtonIndex].isoTime; } else BloodDonationBookAppointment.areSlotsAvailable = false; }); } Future> _getJSONSlots() async { Map _eventsParsed; List slotsList = []; DateTime date; final DateFormat formatter = DateFormat('HH:mm'); final DateFormat dateFormatter = DateFormat('yyyy-MM-dd'); for (var i = 0; i < bloodDonationFreeSlotsResponse.length; i++) { date = DateUtil.convertStringToDate(bloodDonationFreeSlotsResponse[i].freeTimeSlots); slotsList.add(FreeSlot(date, ['slot'])); docFreeSlots.add(TimeSlot(isoTime: formatter.format(date), start: new DateTime(date.year, date.month, date.day, 0, 0, 0, 0), end: date)); } _eventsParsed = Map.fromIterable(slotsList, key: (e) => e.slot, value: (e) => e.event); setState(() { BloodDonationBookAppointment.selectedDate = dateFormatter.format(DateUtil.convertStringToDate(bloodDonationFreeSlotsResponse[0].freeTimeSlots)); selectedDate = DateUtil.getMonthDayYearDateFormatted(DateUtil.convertStringToDate(bloodDonationFreeSlotsResponse[0].freeTimeSlots)); selectedDateJSON = bloodDonationFreeSlotsResponse[0].freeTimeSlots; }); openTimeSlotsPickerForDate(DateUtil.convertStringToDate(selectedDateJSON), docFreeSlots); _calendarController!.selectedDate = DateUtil.convertStringToDate(selectedDateJSON); return _eventsParsed; } getBloodDonationProjectsList() { BloodDonationService service = new BloodDonationService(); GifLoaderDialogUtils.showMyDialog(context); service.getBloodDonationProjectsList().then((res) { GifLoaderDialogUtils.hideDialog(context); print(res['BD_getProjectsHaveBDClinics']); if (res["MessageStatus"] == 1) { res['BD_getProjectsHaveBDClinics'].forEach((element) { bloodDonationProjectsListResponse.add(BloodDonationProjectsListResponse.fromJson(element)); }); print(bloodDonationProjectsListResponse.length); } else { AppToast.showErrorToast(message: res["ErrorEndUserMessage"]); } }).catchError((err) { GifLoaderDialogUtils.hideDialog(context); print(err); }); } List _getDataSource() { final List meetings = []; _events!.forEach((key, value) { final DateTime startTime = DateTime(key.year, key.month, key.day, 9, 0, 0); final DateTime endTime = startTime.add(const Duration(minutes: 20)); meetings.add(Meeting("", startTime, endTime, CustomColors.green, false, "")); }); return meetings; } } class MeetingDataSource extends CalendarDataSource { MeetingDataSource(List source) { appointments = source; } @override DateTime getStartTime(int index) { return _getMeetingData(index).from; } @override DateTime getEndTime(int index) { return _getMeetingData(index).to; } @override String getSubject(int index) { return _getMeetingData(index).eventName; } @override Color getColor(int index) { return _getMeetingData(index).background; } @override bool isAllDay(int index) { return _getMeetingData(index).isAllDay; } Meeting _getMeetingData(int index) { final dynamic meeting = appointments![index]; Meeting? meetingData; if (meeting is Meeting) { meetingData = meeting; } return meetingData!; } } class Meeting { Meeting(this.eventName, this.from, this.to, this.background, this.isAllDay, this.notes); String eventName; DateTime from; DateTime to; Color background; bool isAllDay; String notes; }