import 'package:diplomaticquarterapp/core/viewModels/medical/reports_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/pages/feedback/appointment_history.dart';
import 'package:diplomaticquarterapp/uitl/date_uitl.dart';
import 'package:diplomaticquarterapp/widgets/avatar/large_avatar.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/StarRating.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class MedicalReports extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    void confirmBox(
        AppointmentHistory model, ReportsViewModel reportsViewModel) {
      showDialog(
        context: context,
        child: ConfirmDialog(
          appointmentHistory: model,
          onOkSelected: (model) => reportsViewModel.insertRequestForMedicalReport(model),
        ),
      );
    }

    return BaseView<ReportsViewModel>(
      onModelReady: (model) => model.getPatentAppointmentHistory(),
      builder: (_, model, widget) => AppScaffold(
        baseViewModel: model,
        isShowAppBar: true,
        appBarTitle: 'Medical Reports',
        body: ListView.builder(
          itemCount: model.appointHistoryList.length,
          itemBuilder: (context, index) => Padding(
            padding: const EdgeInsets.all(8.0),
            child: Container(
              width: double.infinity,
              margin: EdgeInsets.only(left: 8, right: 8, top: 3),
              decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: Colors.white, width: 2),
                  shape: BoxShape.rectangle,
                  borderRadius: BorderRadius.all(
                    Radius.circular(8.0),
                  )),
              child: Row(
                children: <Widget>[
                  Expanded(
                    flex: 1,
                    child: Container(
                      margin: EdgeInsets.only(left: 5, right: 5),
                      child: LargeAvatar(
                        width: 50,
                        height: 50,
                        name: model.appointHistoryList[index].doctorNameObj,
                        url: model.appointHistoryList[index].doctorImageURL,
                      ),
                    ),
                  ),
                  Expanded(
                    flex: 4,
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          SizedBox(
                            height: 12,
                          ),
                          Texts(model.appointHistoryList[index].projectName),
                          Texts(model.appointHistoryList[index].clinicName),
                          Texts(DateUtil.getMonthDayYearDateFormatted(
                              model.appointHistoryList[index].appointmentDate)),
                          StarRating(
                              totalAverage: model
                                  .appointHistoryList[index].actualDoctorRate
                                  .toDouble(),
                              forceStars: true),
                          SizedBox(
                            height: 12,
                          ),
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    flex: 1,
                    child: InkWell(
                      onTap: () =>
                          confirmBox(model.appointHistoryList[index], model),
                      child: Container(
                        width: 80,
                        height: 50,
                        decoration: BoxDecoration(
                          color: Colors.black54,
                          border:
                              Border.all(color: Colors.transparent, width: 2),
                          shape: BoxShape.rectangle,
                          borderRadius: BorderRadius.all(
                            Radius.circular(8.0),
                          ),
                        ),
                        child: Center(
                          child: Texts(
                            'Request',
                            fontSize: 12,
                            color: Colors.white,
                          ),
                        ),
                      ),
                    ),
                  ),
                  SizedBox(
                    width: 12,
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class ConfirmDialog extends StatefulWidget {
  final Function(AppointmentHistory) onOkSelected;
  final AppointmentHistory appointmentHistory;

  ConfirmDialog({this.onOkSelected, this.appointmentHistory});

  @override
  _ConfirmDialogState createState() => _ConfirmDialogState();
}

class _ConfirmDialogState extends State<ConfirmDialog> {
  @override
  Widget build(BuildContext context) {
    return SimpleDialog(
      title: Text('Confirm'),
      children: <Widget>[
        Container(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Texts('Request a medical report'),
              SizedBox(
                height: 5.0,
              ),
              Divider(
                height: 2.5,
                color: Colors.grey[500],
              ),
              SizedBox(
                height: 5,
              ),
              Row(
                // mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  Expanded(
                    flex: 1,
                    child: InkWell(
                      onTap: () => Navigator.pop(context),
                      child: Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Container(
                          child: Center(
                            child: Texts(
                              'cancel',
                              color: Colors.red,
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                  Container(
                    width: 1,
                    height: 30,
                    color: Colors.grey[500],
                  ),
                  Expanded(
                    flex: 1,
                    child: InkWell(
                      onTap: () {
                        widget.onOkSelected(widget.appointmentHistory);
                        Navigator.pop(context);
                      },
                      child: Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Center(
                          child: Texts(
                            'ok',
                            fontWeight: FontWeight.w400,
                          ),
                        ),
                      ),
                    ),
                  ),
                ],
              )
            ],
          ),
        )
      ],
    );
  }
}