import 'dart:ui';

import 'package:diplomaticquarterapp/core/model/ImagesInfo.dart';
import 'package:diplomaticquarterapp/core/viewModels/medical/reports_view_model.dart';
import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/pages/base/base_view.dart';
import 'package:diplomaticquarterapp/pages/medical/reports/report_list_widget.dart';
import 'package:diplomaticquarterapp/pages/medical/reports/reports_page.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/buttons/button.dart';
import 'package:diplomaticquarterapp/widgets/data_display/text.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:diplomaticquarterapp/widgets/transitions/fade_page.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class HomeReportPage extends StatefulWidget {
  @override
  _HomeReportPageState createState() => _HomeReportPageState();
}

class _HomeReportPageState extends State<HomeReportPage>
    with SingleTickerProviderStateMixin {
  TabController _tabController;
  List<ImagesInfo> imagesInfo = List();

  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 4, vsync: this);
  }

  @override
  void dispose() {
    super.dispose();
    _tabController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    ProjectViewModel projectViewModel = Provider.of(context);
    imagesInfo.add(ImagesInfo(
        imageEn:
            'https://hmgwebservices.com/Images/MobileApp/imges-info/medical-reorts/en/0.png',
        imageAr:
            'https://hmgwebservices.com/Images/MobileApp/imges-info/medical-reorts/ar/0.png'));
    imagesInfo.add(ImagesInfo(
        imageEn:
            'https://hmgwebservices.com/Images/MobileApp/imges-info/medical-reorts/en/1.png',
        imageAr:
            'https://hmgwebservices.com/Images/MobileApp/imges-info/medical-reorts/ar/1.png'));
    imagesInfo.add(ImagesInfo(
        imageEn:
            'https://hmgwebservices.com/Images/MobileApp/imges-info/medical-reorts/en/2.png',
        imageAr:
            'https://hmgwebservices.com/Images/MobileApp/imges-info/medical-reorts/ar/2.png'));
    return BaseView<ReportsViewModel>(
      onModelReady: (model) => model.getReports(), //model.getPrescriptions(),
      builder: (_, model, widget) => AppScaffold(
        isShowAppBar: true,
        appBarTitle: TranslationBase.of(context).newMedReport,
        title: TranslationBase.of(context).medReport,
        description: TranslationBase.of(context).infoMonthReport,
        baseViewModel: model,
        imagesInfo: imagesInfo,
        body: Scaffold(
          extendBodyBehindAppBar: true,
          appBar: PreferredSize(
            preferredSize: Size.fromHeight(65.0),
            child: Stack(
              children: <Widget>[
                Positioned(
                  bottom: 1,
                  left: 0,
                  right: 0,
                  child: BackdropFilter(
                    filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
                    child: Container(
                      color: Theme.of(context)
                          .scaffoldBackgroundColor
                          .withOpacity(0.8),
                      height: 70.0,
                    ),
                  ),
                ),
                Center(
                  child: Container(
                    height: 60.0,
                    margin: EdgeInsets.only(top: 10.0),
                    width: MediaQuery.of(context).size.width * 0.9,
                    decoration: BoxDecoration(
                        border: Border(
                          bottom: BorderSide(
                              color: Theme.of(context).dividerColor,
                              width: 0.7),
                        ),
                        color: Colors.white),
                    child: Center(
                      child: TabBar(
                        isScrollable: true,
                        controller: _tabController,
                        indicatorWeight: 5.0,
                        indicatorSize: TabBarIndicatorSize.tab,
                        labelColor: Theme.of(context).primaryColor,
                        unselectedLabelColor: Colors.grey[800],
                        tabs: [
                          Container(
                            width: MediaQuery.of(context).size.width * 0.20,
                            child: Center(
                              child: Texts(TranslationBase.of(context).requested,fontSize: 11,),
                            ),
                          ),
                          Container(
                            width: MediaQuery.of(context).size.width * 0.20,
                            child: Center(
                              child: Texts(TranslationBase.of(context).ready,fontSize: 11,),
                            ),
                          ),
                          Container(
                            width: MediaQuery.of(context).size.width * 0.20,
                            child: Center(
                              child:
                                  Texts(TranslationBase.of(context).completed,fontSize: 11,),
                            ),
                          ),
                          Container(
                            width: MediaQuery.of(context).size.width * 0.20,
                            child: Center(
                              child:
                                  Texts(TranslationBase.of(context).cancelled,fontSize: 11,),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          body: Column(
            children: <Widget>[
              if(model.user!=null)
              Expanded(
                child: TabBarView(
                  physics: BouncingScrollPhysics(),
                  controller: _tabController,
                  children: <Widget>[
                    ReportListWidget(
                      reportList: model.reportsOrderRequestList,
                      emailAddress: model.user.emailAddress
                    ),
                    ReportListWidget(
                      reportList: model.reportsOrderReadyList,
                      emailAddress: model.user.emailAddress
                    ),
                    ReportListWidget(
                      reportList: model.reportsOrderCompletedList,
                        emailAddress: model.user.emailAddress
                    ),
                    ReportListWidget(
                      reportList: model.reportsOrderCanceledList,
                        emailAddress: model.user.emailAddress
                    ),
                  ],
                ),
              ),
              SizedBox(
                height: 110,
              )
            ],
          ),
          bottomSheet: projectViewModel.havePrivilege(21) ?Container(
            width: double.infinity,
            height: 90,
            margin: EdgeInsets.all(8.0),
            child: Button(
              label: TranslationBase.of(context).requestMedicalReport,
              backgroundColor: Colors.grey[800],
              onTap: () => Navigator.push(
                context,
                FadePage(
                  page: MedicalReports(),
                ),
              ),
            ),
          ):null,
        ),
      ),
    );
  }
}