import 'package:barcode_scan2/barcode_scan2.dart';
import 'package:diplomaticquarterapp/config/shared_pref_kay.dart';
import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/services/livecare_services/livecare_provider.dart';
import 'package:diplomaticquarterapp/theme/colors.dart';
import 'package:diplomaticquarterapp/uitl/gif_loader_dialog_utils.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:diplomaticquarterapp/widgets/buttons/defaultButton.dart';
import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:provider/provider.dart';

import '../../uitl/utils.dart';

class PharmaLiveCareIntroPage extends StatefulWidget {
  const PharmaLiveCareIntroPage({Key key}) : super(key: key);

  @override
  State<PharmaLiveCareIntroPage> createState() => _PharmaLiveCareIntroPageState();
}

class _PharmaLiveCareIntroPageState extends State<PharmaLiveCareIntroPage> {
  ProjectViewModel projectViewModel;
  String pharmacyLiveCareQRCode = "";

  @override
  Widget build(BuildContext context) {
    projectViewModel = Provider.of(context);
    return AppScaffold(
      appBarTitle: TranslationBase.of(context).pharmaLiveCare,
      isShowAppBar: true,
      showNewAppBarTitle: true,
      showNewAppBar: true,
      body: SingleChildScrollView(
        child: Container(
          margin: EdgeInsets.only(left: 20.0, right: 20.0, top: 20.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(child: Text(TranslationBase.of(context).pharmaLiveCare1, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0, letterSpacing: -0.64, color: CustomColors.darkGrey))),
              Container(
                  margin: EdgeInsets.only(top: 7.0),
                  child: Text(TranslationBase.of(context).pharmaLiveCareDesc1, style: TextStyle(fontSize: 14.0, letterSpacing: -0.64, color: CustomColors.textColor, fontWeight: FontWeight.w600))),
              Container(
                  margin: EdgeInsets.only(top: 20.0),
                  child: Text(TranslationBase.of(context).wherePharmaLiveCare, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0, letterSpacing: -0.64, color: CustomColors.darkGrey))),
              Container(
                  margin: EdgeInsets.only(top: 7.0),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Image.asset(
                        "assets/images/new/booth_image.png",
                      ),
                      Container(
                          width: MediaQuery.of(context).size.width * 0.6,
                          margin: EdgeInsets.only(left: 10.0, right: 10.0),
                          child: Text(TranslationBase.of(context).pharmaLiveCareDesc2,
                              style: TextStyle(fontSize: 14.0, letterSpacing: -0.64, color: CustomColors.textColor, fontWeight: FontWeight.w600))),
                    ],
                  )),
              Container(
                  margin: EdgeInsets.only(top: 20.0),
                  child: Text(TranslationBase.of(context).howPharmaLiveCare, style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0, letterSpacing: -0.64, color: CustomColors.darkGrey))),
              Container(
                  margin: EdgeInsets.only(top: 7.0),
                  child: Text(TranslationBase.of(context).pharmaLiveCareDesc3, style: TextStyle(fontSize: 14.0, letterSpacing: -0.64, color: CustomColors.textColor, fontWeight: FontWeight.w600))),
              Container(
                margin: EdgeInsets.only(top: 7.0),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                        margin: EdgeInsets.only(top: 7.0),
                        padding: EdgeInsets.fromLTRB(14.0, 5.0, 14.0, 5.0),
                        decoration: BoxDecoration(color: CustomColors.green, borderRadius: BorderRadius.all(Radius.circular(100.0))),
                        child: Text("1", style: TextStyle(fontSize: 16.0, letterSpacing: -0.64, color: CustomColors.white, fontWeight: FontWeight.w600))),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: SvgPicture.asset("assets/images/new/qr_code.svg", width: 40),
                        ),
                        Container(
                            margin: EdgeInsets.only(left: 5.0, right: 5.0),
                            child: Text(TranslationBase.of(context).pharmaLiveCareScanQR,
                                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0, letterSpacing: -0.64, color: CustomColors.darkGrey))),
                        Container(
                            width: MediaQuery.of(context).size.width * 0.7,
                            margin: EdgeInsets.only(left: 5.0, right: 5.0),
                            child: Text(TranslationBase.of(context).pharmaLiveCareScanQR1,
                                style: TextStyle(fontSize: 14.0, letterSpacing: -0.64, color: CustomColors.textColor, fontWeight: FontWeight.w600))),
                      ],
                    ),
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 7.0),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                        margin: EdgeInsets.only(top: 7.0),
                        padding: EdgeInsets.fromLTRB(12.0, 5.0, 12.0, 5.0),
                        decoration: BoxDecoration(color: CustomColors.green, borderRadius: BorderRadius.all(Radius.circular(100.0))),
                        child: Text("2", style: TextStyle(fontSize: 16.0, letterSpacing: -0.64, color: CustomColors.white, fontWeight: FontWeight.w600))),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: SvgPicture.asset("assets/images/new/payment.svg", width: 40),
                        ),
                        Container(
                            margin: EdgeInsets.only(left: 5.0, right: 5.0),
                            child: Text(TranslationBase.of(context).pharmaLiveCareMakePayment,
                                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0, letterSpacing: -0.64, color: CustomColors.darkGrey))),
                        Container(
                            width: MediaQuery.of(context).size.width * 0.7,
                            margin: EdgeInsets.only(left: 5.0, right: 5.0),
                            child: Text(TranslationBase.of(context).pharmaLiveCareMakePayment1,
                                style: TextStyle(fontSize: 14.0, letterSpacing: -0.64, color: CustomColors.textColor, fontWeight: FontWeight.w600))),
                      ],
                    ),
                  ],
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 7.0),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                        margin: EdgeInsets.only(top: 7.0),
                        padding: EdgeInsets.fromLTRB(12.0, 5.0, 12.0, 5.0),
                        decoration: BoxDecoration(color: CustomColors.green, borderRadius: BorderRadius.all(Radius.circular(100.0))),
                        child: Text("3", style: TextStyle(fontSize: 16.0, letterSpacing: -0.64, color: CustomColors.white, fontWeight: FontWeight.w600))),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: SvgPicture.asset("assets/images/new/pharmaicon.svg", width: 40),
                        ),
                        Container(
                            width: MediaQuery.of(context).size.width * 0.7,
                            margin: EdgeInsets.only(left: 5.0, right: 5.0),
                            child: Text(TranslationBase.of(context).pharmaLiveCareJoinConsultation,
                                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0, letterSpacing: -0.64, color: CustomColors.darkGrey))),
                        Container(
                            width: MediaQuery.of(context).size.width * 0.7,
                            margin: EdgeInsets.only(left: 5.0, right: 5.0),
                            child: Text(TranslationBase.of(context).pharmaLiveCareJoinConsultation1,
                                style: TextStyle(fontSize: 14.0, letterSpacing: -0.64, color: CustomColors.textColor, fontWeight: FontWeight.w600))),
                      ],
                    ),
                  ],
                ),
              ),
              SizedBox(
                height: 100.0,
              )
            ],
          ),
        ),
      ),
      bottomSheet: Container(
        height: MediaQuery.of(context).size.height * 0.08,
        width: double.infinity,
        color: Colors.white,
        child: Column(
          children: <Widget>[
            Container(
              width: MediaQuery.of(context).size.width * 0.9,
              child: DefaultButton(TranslationBase.of(context).pharmaLiveCareScanQR, () {
                readQRCode();
              }),
            ),
          ],
        ),
      ),
    );
  }

  readQRCode() async {
    pharmacyLiveCareQRCode = (await BarcodeScanner.scan())?.rawContent;
    if (pharmacyLiveCareQRCode != "") {
      GifLoaderDialogUtils.showMyDialog(context);
      LiveCareService service = new LiveCareService();
      service.getPatientInfoByQR(pharmacyLiveCareQRCode, context).then((res) {
        GifLoaderDialogUtils.hideDialog(context);
      }).catchError((err) {
        GifLoaderDialogUtils.hideDialog(context);
        print(err);
        startPharmacyLiveCareProcess();
      });
    } else {}
  }

  startPharmacyLiveCareProcess() {
    sharedPref.setString(LIVECARE_CLINIC_DATA, "Pharmacy LiveCare" + "-" + "501" + "-" + "1");
    Navigator.pop(context, "pharmacy/$pharmacyLiveCareQRCode");
  }
}
