import 'dart:convert';

import 'package:barcode_scan_fix/barcode_scan.dart';
import 'package:diplomaticquarterapp/core/enum/viewstate.dart';
import 'package:diplomaticquarterapp/core/viewModels/pharmacy_categorise_view_model.dart';
import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/pages/landing/landing_page_pharmcy.dart';
import 'package:diplomaticquarterapp/pages/parent_categorise_page.dart';
import 'package:diplomaticquarterapp/uitl/app_toast.dart';
import 'package:diplomaticquarterapp/uitl/utils.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/material.dart';
import 'package:provider/provider.dart';

import 'base/base_view.dart';
import 'final_products_page.dart';

class PharmacyCategorisePage extends StatefulWidget {
  @override
  _PharmacyCategorisePageState createState() => _PharmacyCategorisePageState();
}

class _PharmacyCategorisePageState extends State<PharmacyCategorisePage> {
  String idCategorise;

  @override
  Widget build(BuildContext context) {
    ProjectViewModel projectViewModel = Provider.of(context);
    return BaseView<PharmacyCategoriseViewModel>(
      onModelReady: (model) => model.getCategorise(),
      builder: (BuildContext context, PharmacyCategoriseViewModel model,
              Widget child) =>
          AppScaffold(
        isShowDecPage: false,
        baseViewModel: model,
        body: Column(
          children: [
            Expanded(
              child: Container(
                height: 400,
                margin: EdgeInsets.only(bottom: 22),
                child: GridView.builder(
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 2,
                    crossAxisSpacing: 0.5,
                    mainAxisSpacing: 1.0,
                    childAspectRatio: 3.2,
                  ),
                  itemCount: model.categorise.length,
                  itemBuilder: (BuildContext context, int index) {
                    return Padding(
                      padding: EdgeInsets.all(4.0),
                      child: InkWell(
                        child: Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(5),
                            color: Colors.grey.withOpacity(0.24),
                          ),
                          child: Padding(
                            padding: EdgeInsets.symmetric(horizontal: 10.0),
                            child: Texts(
                              projectViewModel.isArabic
                                  ? model.categorise[index].namen
                                  : model.categorise[index].name,
                              fontWeight: FontWeight.w600,
                            ),
                          ),
                        ),
                        onTap: () => {
                          Navigator.push(
                            context,
                            FadePage(
                              page: model.categorise[index].id != '12'
                                  ? ParentCategorisePage(
                                      id: model.categorise[index].id,
                                      titleName: model.categorise[index].name,
                                    )
                                  : FinalProductsPage(
                                      id: model.categorise[index].id,
                                    ),
                            ),
                          ),
                        },
                      ),
                    );
                  },
                ),
              ),
            ),
            Container(
                height: 140,
                child: Column(
                  children: [
                    Divider(
                        height: 2.0,
                        thickness: 1.0,
                        color: Colors.black12.withOpacity(0.14)),
                    SizedBox(
                      height: 10.0,
                    ),
                    Row(
                      children: [
                        Expanded(
                          child: Padding(
                            padding: EdgeInsets.all(4.0),
                            child: InkWell(
                              onTap: () {
                                Navigator.push(
                                  context,
                                  FadePage(
                                    page: FinalProductsPage(
                                      id: "",
                                      productType: 6,
                                    ),
                                  ),
                                );
                              },
                              child: Container(
                                height: 50.0,
                                width: 55.0,
                                decoration: BoxDecoration(
                                  borderRadius: BorderRadius.circular(5.0),
                                  color:
                                      Colors.green.shade300.withOpacity(0.34),
                                ),
                                child: Padding(
                                  padding:
                                      EdgeInsets.symmetric(horizontal: 10.0),
                                  child: Texts(
                                    projectViewModel.isArabic
                                        ? 'الاكثر مبيعا'
                                        : 'Best Sellers',
                                    fontWeight: FontWeight.w600,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                        Expanded(
                          child: Padding(
                            padding: EdgeInsets.all(4.0),
                            child: InkWell(
                              onTap: () {
                                Navigator.push(
                                  context,
                                  FadePage(
                                    page: FinalProductsPage(
                                      id: "",
                                      productType: 4,
                                    ),
                                  ),
                                );
                              },
                              child: Container(
                                height: 50.0,
                                width: 55.0,
                                decoration: BoxDecoration(
                                  color: Colors.orangeAccent.shade200
                                      .withOpacity(0.34),
                                  borderRadius: BorderRadius.circular(5.0),
                                ),
                                child: Padding(
                                  padding:
                                      EdgeInsets.symmetric(horizontal: 10.0),
                                  child: Texts(
                                    projectViewModel.isArabic
                                        ? 'الاكثر مشاهدة'
                                        : 'Most Viewed',
                                    fontWeight: FontWeight.w600,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                    Row(
                      children: [
                        Expanded(
                          child: Padding(
                            padding: EdgeInsets.all(4.0),
                            child: InkWell(
                              onTap: () {
                                Navigator.push(
                                  context,
                                  FadePage(
                                    page: FinalProductsPage(
                                      id: "",
                                      productType: 5,
                                    ),
                                  ),
                                );
                              },
                              child: Container(
                                height: 50.0,
                                width: 55.0,
                                decoration: BoxDecoration(
                                  color: Colors.blue.shade200.withOpacity(0.34),
                                  borderRadius: BorderRadius.circular(5.0),
                                ),
                                child: Padding(
                                  padding:
                                      EdgeInsets.symmetric(horizontal: 10.0),
                                  child: Texts(
                                    projectViewModel.isArabic
                                        ? 'منتجات جديدة'
                                        : 'New Products',
                                    fontWeight: FontWeight.w600,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                        Expanded(
                          child: Padding(
                            padding: EdgeInsets.all(4.0),
                            child: InkWell(
                              onTap: () {
                                Navigator.push(
                                  context,
                                  FadePage(
                                    page: FinalProductsPage(
                                      id: "",
                                      productType: 3,
                                    ),
                                  ),
                                );
                              },
                              child: Container(
                                height: 50.0,
                                width: 55.0,
                                decoration: BoxDecoration(
                                  color:
                                      Colors.purple.shade200.withOpacity(0.34),
                                  borderRadius: BorderRadius.circular(5.0),
                                ),
                                child: Padding(
                                  padding:
                                      EdgeInsets.symmetric(horizontal: 10.0),
                                  child: Texts(
                                    projectViewModel.isArabic
                                        ? 'شوهد مؤخرا'
                                        : 'Recently Viewed',
                                    fontWeight: FontWeight.w600,
                                  ),
                                ),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                )),
          ],
        ),
      ),
    );
  }

  _scanQrAndGetPatient(
    BuildContext context,
    PharmacyCategoriseViewModel model,
  ) async {
    //TODO fix it
    /// When give qr we will change this method to get data
    /// var result = await BarcodeScanner.scan();
    /// int patientID = get from qr result
    String result = await BarcodeScanner.scan();
    var data = json.decode(result);
    if (data != null) {
      var qRParkingID = data['QRParkingID'];
      await model.scanQr();
      if (model.state == ViewState.ErrorLocal) {
        Utils.showErrorToast(model.error);
      } else {
        AppToast.showSuccessToast(message: model.scanList[0].id);
        {
          Navigator.push(
            context,
            FadePage(page: LandingPagePharmacy()),
          );
        }
      }
    }
  }
}