import 'package:diplomaticquarterapp/core/viewModels/medical/medical_view_model.dart';
import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/models/Appointments/toDoCountProviderModel.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/services/authentication/auth_provider.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/uitl/utils.dart';
import 'package:diplomaticquarterapp/widgets/data_display/medical/time_line_widget.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class MedicalProfilePage extends StatefulWidget {
  @override
  _MedicalProfilePageState createState() => _MedicalProfilePageState();
}

class _MedicalProfilePageState extends State<MedicalProfilePage> {
  var authProvider = new AuthProvider();
  List<Medical> medical = List();
  ProjectViewModel projectViewModel;

  @override
  Widget build(BuildContext context) {
    projectViewModel = Provider.of(context);
    var appoCountProvider = Provider.of<ToDoCountProviderModel>(context);
    List<Widget> myMedicalList = Utils.myMedicalList(
        projectViewModel: projectViewModel,
        context: context,
        count: appoCountProvider.count,
        isLogin: projectViewModel.isLogin);
    return BaseView<MedicalViewModel>(
      onModelReady: (model) => model.getAppointmentHistory(),
      builder: (_, model, widget) => AppScaffold(
        isShowDecPage: false,
        baseViewModel: model,
        isHelp: true,
        body: Container(
          child: SingleChildScrollView(
            child: Column(
              children: <Widget>[
                Stack(
                  children: <Widget>[
                    Column(
                      children: <Widget>[
                        Container(
                          width: double.infinity,
                          height: 210,
                          child: Stack(
                            children: <Widget>[
                              Image.asset(
                                'assets/images/timeline_bg.png',
                                fit: BoxFit.cover,
                                width: double.infinity,
                                //  color:  Colors.black.withOpacity(0.0)
                              ),
                              if (model.isLogin)
                                ListView.builder(
                                  itemBuilder: (context, index) =>
                                      TimeLineWidget(
                                    isUp: index % 2 == 1,
                                    appoitmentAllHistoryResul: model
                                        .appoitmentAllHistoryResultList[index],
                                  ),
                                  itemCount: model
                                      .appoitmentAllHistoryResultList.length,
                                  scrollDirection: Axis.horizontal,
                                  reverse: projectViewModel.isArabic,
                                ),
                            ],
                          ),
                        ),
                        SizedBox(
                          height: 50,
                        ),
                        Padding(
                          padding: EdgeInsets.symmetric(vertical: 5.0),
                          child: GridView.builder(
                            shrinkWrap: true,
                            primary: false,
                            physics: NeverScrollableScrollPhysics(),
                            gridDelegate:
                                SliverGridDelegateWithFixedCrossAxisCount(
                              crossAxisCount: 3,
                              childAspectRatio: MediaQuery.of(context)
                                      .size
                                      .width /
                                  (MediaQuery.of(context).size.height / 2.20),
                            ),
                            itemCount: myMedicalList.length,
                            itemBuilder: (BuildContext context, int index) {
                              return myMedicalList[index];
                            },
                          ),
                        )
                      ],
                    ),
                    SizedBox(
                      height: MediaQuery.of(context).size.height * 0.12,
                    ),
                    if (model.user != null && model.isLogin)
                      Positioned(
                        top: 185,
                        left: 20,
                        right: 20,
                        child: Container(
                          width: double.infinity,
                          height: 80,
                          decoration: BoxDecoration(
                              color: Colors.grey[500],
                              shape: BoxShape.rectangle,
                              border: Border.all(
                                  color: Colors.transparent, width: 0.5),
                              borderRadius:
                                  BorderRadius.all(Radius.circular(9)),
                              image: DecorationImage(
                                  image: ExactAssetImage(
                                      'assets/images/bg_graphic.png'),
                                  fit: BoxFit.cover)),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            mainAxisAlignment: MainAxisAlignment.spaceAround,
                            children: <Widget>[
                              SizedBox(
                                height: 8,
                              ),
                              Texts(
                                model.user.firstName +
                                    " " +
                                    model.user.lastName,
                                color: Colors.white,
                                bold: true,
                              ),
                              Texts(
                                '${model.user.patientID}',
                                color: Colors.white,
                              ),
                            ],
                          ),
                        ),
                      ),
                    Positioned(
                      top: 2,
                      left: projectViewModel.isArabic ? 0 : 10,
                      right: projectViewModel.isArabic ? 10 : 0,
                      child: Texts(
                        TranslationBase.of(context).timeLine,
                        color: Colors.white,
                        fontSize: 14,
                        fontWeight: FontWeight.normal,
                      ),
                    )
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

class Medical {
  final String title;
  final String imagePath;
  final String subTitle;
  final Widget page;

  Medical({this.title, this.imagePath, this.subTitle, this.page});
}
