import 'package:doctor_app_flutter/config/config.dart';
import 'package:doctor_app_flutter/core/viewModel/patient-doctor-referral-viewModel.dart';
import 'package:doctor_app_flutter/models/patient/PatientArrivalEntity.dart';
import 'package:doctor_app_flutter/models/patient/patiant_info_model.dart';
import 'package:doctor_app_flutter/screens/base/base_view.dart';
import 'package:doctor_app_flutter/util/date-utils.dart';
import 'package:doctor_app_flutter/util/dr_app_toast_msg.dart';
import 'package:doctor_app_flutter/util/translations_delegate_base.dart';
import 'package:doctor_app_flutter/widgets/shared/app_buttons_widget.dart';
import 'package:doctor_app_flutter/widgets/shared/app_scaffold_widget.dart';
import 'package:doctor_app_flutter/widgets/shared/app_texts_widget.dart';
import 'package:doctor_app_flutter/widgets/shared/dialogs/dailog-list-select.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:hexcolor/hexcolor.dart';

import '../../../QR_reader_screen.dart';

class PatientMakeReferralScreen extends StatefulWidget {
  // previous design page is: ReferPatientScreen
  @override
  _PatientMakeReferralScreenState createState() =>
      _PatientMakeReferralScreenState();
}

class _PatientMakeReferralScreenState extends State<PatientMakeReferralScreen> {
  PatiantInformtion patient;
  List<dynamic> referToList;
  dynamic _referTo;
  dynamic _selectedBranch;
  dynamic _selectedClinic;
  dynamic _selectedDoctor;
  DateTime appointmentDate;
  final _remarksController = TextEditingController();
  PatientArrivalEntity _selectedPatientArrivalEntity;

  @override
  void initState() {
    super.initState();
    referToList = List();
    dynamic sameBranch = {"id": 1, "name": "Same Branch"};
    dynamic otherBranch = {"id": 2, "name": "Other Branch"};
    referToList.add(sameBranch);
    referToList.add(otherBranch);
    appointmentDate = DateTime.now();
  }

  @override
  Widget build(BuildContext context) {
    final routeArgs = ModalRoute.of(context).settings.arguments as Map;
    patient = routeArgs['patient'];

    final screenSize = MediaQuery.of(context).size;

    return BaseView<PatientReferralViewModel>(
      onModelReady: (model) => model.getBranches(),
      builder: (_, model, w) => AppScaffold(
        baseViewModel: model,
        appBarTitle: TranslationBase.of(context).referPatient,
        body: SingleChildScrollView(
          child: Container(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: [
                Column(
                  children: [
                    Container(
                      height: 75,
                      child: AppText(
                        "This is where upper view for avatar.. etc placed",
                        fontWeight: FontWeight.normal,
                        fontSize: 16,
                      ),
                    ),
                    const Divider(
                      color: Color(0xffCCCCCC),
                      height: 1,
                      thickness: 2,
                      indent: 0,
                      endIndent: 0,
                    ),
                    Container(
                      margin:
                          EdgeInsets.symmetric(vertical: 16, horizontal: 16),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          SizedBox(
                            height: 16,
                          ),
                          AppText(
                            TranslationBase.of(context).referPatient,
                            fontWeight: FontWeight.bold,
                            fontSize: 16,
                          ),
                          SizedBox(
                            height: 16,
                          ),
                          Container(
                            height: screenSize.height * 0.070,
                            child: InkWell(
                              onTap: referToList != null
                                  ? () {
                                      ListSelectDialog dialog =
                                          ListSelectDialog(
                                        list: referToList,
                                        attributeName: 'name',
                                        attributeValueId: 'id',
                                        okText: TranslationBase.of(context).ok,
                                        okFunction: (selectedValue) {
                                          setState(() {
                                            _referTo = selectedValue;
                                            _selectedBranch = null;
                                            _selectedClinic = null;
                                            _selectedDoctor = null;
                                            model
                                                .getDoctorBranch()
                                                .then((value) {
                                              _selectedBranch = value;
                                              if (_referTo['id'] == 1) {
                                                model.getClinics(
                                                    _selectedBranch['ID']);
                                              }
                                            });
                                          });
                                        },
                                      );
                                      showDialog(
                                        barrierDismissible: false,
                                        context: context,
                                        builder: (BuildContext context) {
                                          return dialog;
                                        },
                                      );
                                    }
                                  : null,
                              child: TextField(
                                decoration: textFieldSelectorDecoration(
                                    TranslationBase.of(context).referTo,
                                    _referTo != null ? _referTo['name'] : null,
                                    true),
                                enabled: false,
                              ),
                            ),
                          ),
                          SizedBox(
                            height: 10,
                          ),
                          Container(
                            height: screenSize.height * 0.070,
                            child: InkWell(
                              onTap: model.branchesList != null &&
                                      model.branchesList.length > 0 &&
                                      _referTo != null &&
                                      _referTo['id'] == 2
                                  ? () {
                                      ListSelectDialog dialog =
                                          ListSelectDialog(
                                        list: model.branchesList,
                                        attributeName: 'Desciption',
                                        attributeValueId: 'ID',
                                        okText: TranslationBase.of(context).ok,
                                        okFunction: (selectedValue) {
                                          setState(() {
                                            _selectedBranch = selectedValue;
                                            _selectedClinic = null;
                                            _selectedDoctor = null;
                                            model.getClinics(
                                                _selectedBranch['ID']);
                                          });
                                        },
                                      );
                                      showDialog(
                                        barrierDismissible: false,
                                        context: context,
                                        builder: (BuildContext context) {
                                          return dialog;
                                        },
                                      );
                                    }
                                  : null,
                              child: TextField(
                                decoration: textFieldSelectorDecoration(
                                    TranslationBase.of(context).branch,
                                    _selectedBranch != null
                                        ? _selectedBranch['Desciption']
                                        : null,
                                    true),
                                enabled: false,
                              ),
                            ),
                          ),
                          SizedBox(
                            height: 10,
                          ),
                          Container(
                            height: screenSize.height * 0.070,
                            child: InkWell(
                              onTap: _selectedBranch != null &&
                                      model.clinicsList != null &&
                                      model.clinicsList.length > 0
                                  ? () {
                                      ListSelectDialog dialog =
                                          ListSelectDialog(
                                        list: model.clinicsList,
                                        attributeName: 'ClinicDescription',
                                        attributeValueId: 'ClinicID',
                                        okText: TranslationBase.of(context).ok,
                                        okFunction: (selectedValue) {
                                          setState(() {
                                            _selectedDoctor = null;
                                            _selectedClinic = selectedValue;
                                            model.getClinicDoctors(
                                                _selectedClinic['ClinicID']
                                                    .toString());
                                          });
                                        },
                                      );
                                      showDialog(
                                        barrierDismissible: false,
                                        context: context,
                                        builder: (BuildContext context) {
                                          return dialog;
                                        },
                                      );
                                    }
                                  : null,
                              child: TextField(
                                decoration: textFieldSelectorDecoration(
                                    TranslationBase.of(context).clinic,
                                    _selectedClinic != null
                                        ? _selectedClinic['ClinicDescription']
                                        : null,
                                    true),
                                enabled: false,
                              ),
                            ),
                          ),
                          SizedBox(
                            height: 10,
                          ),
                          Container(
                            height: screenSize.height * 0.070,
                            child: InkWell(
                              onTap: _selectedClinic != null &&
                                      model.doctorsList != null &&
                                      model.doctorsList.length > 0
                                  ? () {
                                      ListSelectDialog dialog =
                                          ListSelectDialog(
                                        list: model.doctorsList,
                                        attributeName: 'DoctorName',
                                        attributeValueId: 'DoctorID',
                                        okText: TranslationBase.of(context).ok,
                                        okFunction: (selectedValue) {
                                          setState(() {
                                            _selectedDoctor = selectedValue;
                                          });
                                        },
                                      );
                                      showDialog(
                                        barrierDismissible: false,
                                        context: context,
                                        builder: (BuildContext context) {
                                          return dialog;
                                        },
                                      );
                                    }
                                  : null,
                              child: TextField(
                                decoration: textFieldSelectorDecoration(
                                    TranslationBase.of(context).doctor,
                                    _selectedDoctor != null
                                        ? _selectedDoctor['DoctorName']
                                        : null,
                                    true),
                                enabled: false,
                              ),
                            ),
                          ),
                          SizedBox(
                            height: 10,
                          ),
                          Container(
                            height: screenSize.height * 0.070,
                            child: InkWell(
                              onTap: () => _selectDate(context, model),
                              child: TextField(
                                decoration: textFieldSelectorDecoration(
                                    TranslationBase.of(context)
                                        .chooseAppointment,
                                    _selectedPatientArrivalEntity != null
                                        ? "${TranslationBase.of(context).appointmentNo} ${_selectedPatientArrivalEntity.appointmentNo}"
                                        : null,
                                    true,
                                    suffixIcon: Icon(
                                      Icons.calendar_today,
                                      color: Colors.black,
                                    )),
                                enabled: false,
                              ),
                            ),
                          ),
                          SizedBox(
                            height: 10,
                          ),
                          Container(
                              child: TextField(
                            decoration: textFieldSelectorDecoration(
                                TranslationBase.of(context).remarks,
                                null,
                                false),
                            enabled: true,
                            controller: _remarksController,
                            inputFormatters: [
                              FilteringTextInputFormatter.allow(
                                  RegExp(ONLY_LETTERS))
                            ],
                            keyboardType: TextInputType.text,
                            minLines: 4,
                            maxLines: 6,
                          )),
                        ],
                      ),
                    ),
                  ],
                ),
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                  child: AppButton(
                    title: TranslationBase.of(context).refer,
                    color: HexColor("#B8382B"),
                    onPressed: () {
                      if (_selectedPatientArrivalEntity == null ||
                          _selectedBranch == null ||
                          _selectedClinic == null ||
                          _selectedDoctor == null ||
                          _remarksController.text == null) return;
                      model.makeReferral(
                          _selectedPatientArrivalEntity,
                          appointmentDate.toIso8601String(),
                          _selectedBranch['ID'],
                          _selectedClinic['ClinicID'],
                          _selectedDoctor['DoctorID'],
                          _remarksController.text).then((_) => Navigator.pop(context));
                    },
                  ),
                )
              ],
            ),
          ),
        ),
      ),
    );
  }

  _selectDate(BuildContext context, PatientReferralViewModel model) async {
    // https://medium.com/flutter-community/a-deep-dive-into-datepicker-in-flutter-37e84f7d8d6c   good reference
    // https://stackoverflow.com/a/63147062/6246772  to customize a date picker
    final DateTime picked = await showDatePicker(
      context: context,
      initialDate: appointmentDate,
      firstDate: appointmentDate.add(Duration(hours: 2)),
      lastDate: DateTime(2040),
      initialEntryMode: DatePickerEntryMode.calendar,
    );
    if (picked != null && picked != appointmentDate) {
      appointmentDate = picked;
      model
          .getPatientArrivalList(DateUtils.convertStringToDateFormat(
              appointmentDate.toString(), "yyyy-MM-dd"))
          .then((_) {
        if (model.patientArrivalList != null &&
            model.patientArrivalList.length > 0) {
          List<dynamic> appointments = model.getAppointmentsByPatientName(
              "${patient.firstName} ${patient.middleName} ${patient.lastName}");
          if (appointments.length > 0) {
            ListSelectDialog dialog = ListSelectDialog(
              list: appointments,
              attributeName: 'appointmentNo',
              attributeValueId: 'appointmentNo',
              okText: TranslationBase.of(context).ok,
              okFunction: (selectedValue) {
                setState(() {
                  _selectedPatientArrivalEntity =
                      PatientArrivalEntity.fromJson(selectedValue);
                });
              },
            );
            showDialog(
              barrierDismissible: false,
              context: context,
              builder: (BuildContext context) {
                return dialog;
              },
            );
          } else {
            setState(() {
              _selectedPatientArrivalEntity = null;
            });
            DrAppToastMsg.showErrorToast(
                TranslationBase.of(context).noAppointmentsErrorMsg);
          }
        } else {
          setState(() {
            _selectedPatientArrivalEntity = null;
          });
          DrAppToastMsg.showErrorToast(
              TranslationBase.of(context).noAppointmentsErrorMsg);
        }
      });
    }
  }

  InputDecoration textFieldSelectorDecoration(
      String hintText, String selectedText, bool isDropDown,
      {Icon suffixIcon}) {
    return InputDecoration(
      focusedBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Color(0xFFCCCCCC), width: 2.0),
        borderRadius: BorderRadius.circular(8),
      ),
      enabledBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Color(0xFFCCCCCC), width: 2.0),
        borderRadius: BorderRadius.circular(8),
      ),
      disabledBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Color(0xFFCCCCCC), width: 2.0),
        borderRadius: BorderRadius.circular(8),
      ),
      hintText: selectedText != null ? selectedText : hintText,
      suffixIcon: isDropDown
          ? suffixIcon != null
              ? suffixIcon
              : Icon(
                  Icons.arrow_drop_down,
                  color: Colors.black,
                )
          : null,
      hintStyle: TextStyle(
        fontSize: 14,
        color: Colors.grey.shade600,
      ),
    );
  }

  BoxDecoration containerBorderDecoration(
      Color containerColor, Color borderColor) {
    return BoxDecoration(
      color: containerColor,
      shape: BoxShape.rectangle,
      borderRadius: BorderRadius.all(Radius.circular(6)),
      border: Border.fromBorderSide(BorderSide(
        color: borderColor,
        width: 2.0,
      )),
    );
  }
}
