import 'package:doctor_app_flutter/config/size_config.dart';
import 'package:doctor_app_flutter/core/model/patient/patiant_info_model.dart';
import 'package:doctor_app_flutter/core/model/procedure/procedure_template_details_model.dart';
import 'package:doctor_app_flutter/core/viewModel/procedure_View_model.dart';
import 'package:doctor_app_flutter/screens/base/base_view.dart';
import 'package:doctor_app_flutter/screens/patients/patient_search/patient_search_header.dart';
import 'package:doctor_app_flutter/utils/translations_delegate_base_utils.dart';
import 'package:doctor_app_flutter/utils/utils.dart';
import 'package:doctor_app_flutter/widgets/shared/app_scaffold_widget.dart';
import 'package:doctor_app_flutter/widgets/shared/app_texts_widget.dart';
import 'package:doctor_app_flutter/widgets/shared/buttons/app_buttons_widget.dart';
import 'package:doctor_app_flutter/widgets/shared/loader/gif_loader_dialog_utils.dart';
import 'package:doctor_app_flutter/widgets/shared/text_fields/TextFields.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import '../../../config/config.dart';

class ProcedureCheckOutScreen extends StatefulWidget {
  final List<ProcedureTempleteDetailsModel>? items;
  final ProcedureViewModel? previousProcedureViewModel;
  final PatiantInformtion? patient;
  final String addButtonTitle;
  final String toolbarTitle;

  ProcedureCheckOutScreen(
      {this.items,
      this.previousProcedureViewModel,
      this.patient,
      required this.addButtonTitle,
      required this.toolbarTitle});

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

class _ProcedureCheckOutScreenState extends State<ProcedureCheckOutScreen> {
  List<String> remarksList = [];
  final TextEditingController remarksController = TextEditingController();
  List<int> typeList = [];

  @override
  Widget build(BuildContext context) {
    return BaseView<ProcedureViewModel>(
      builder:
          (BuildContext context, ProcedureViewModel model, Widget? child) =>
              AppScaffold(
        backgroundColor: Color(0xffF8F8F8).withOpacity(0.9),
        isShowAppBar: true,
        appBar: PatientSearchHeader(
          title: widget.toolbarTitle ?? 'Add Procedure',
        ),
        body: SingleChildScrollView(
          child: Center(
            child: FractionallySizedBox(
              widthFactor: 0.95,
              child: Column(
                children: [
                  SizedBox(
                    height: 30,
                  ),
                  ListView.builder(
                      scrollDirection: Axis.vertical,
                      itemCount: widget.items!.length,
                      physics: BouncingScrollPhysics(),
                      shrinkWrap: true,
                      itemBuilder: (BuildContext ctxt, int index) {
                        final TextEditingController remarksControllerNew =
                            TextEditingController(
                                text: widget.items![index].remarks);

                        return Container(
                          margin: EdgeInsets.only(bottom: 15.0),
                          decoration: BoxDecoration(
                              color: Colors.white,
                              borderRadius:
                                  BorderRadius.all(Radius.circular(10.0))),
                          child: ExpansionTile(
                            initiallyExpanded: true,
                            title: Row(
                              children: [
                                Expanded(
                                    child: AppText(
                                  Utils.convertToTitleCase(
                                      widget.items![index].procedureName!),
                                  fontWeight: FontWeight.w700,
                                  color: AppGlobal.appTextColor,
                                )),
                              ],
                            ),
                            children: [
                              Container(
                                child: Padding(
                                  padding: EdgeInsets.symmetric(horizontal: 12),
                                  child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Row(
                                        children: [
                                          Padding(
                                            padding: const EdgeInsets.symmetric(
                                                horizontal: 11),
                                            child: AppText(
                                              TranslationBase.of(context)
                                                  .orderType,
                                              fontWeight: FontWeight.w700,
                                              color: Color(0xff2B353E),
                                            ),
                                          ),
                                        ],
                                      ),
                                      Row(
                                        children: [
                                          Radio(
                                            activeColor: Color(0xFFD02127),
                                            value: 0,
                                            groupValue: widget
                                                .items![index].selectedType,
                                            onChanged: (value) {
                                              widget.items![index]
                                                  .selectedType = 0;
                                              setState(() {
                                                widget.items![index].type =
                                                    value.toString();
                                              });
                                            },
                                          ),
                                          AppText(
                                            'routine',
                                            color: Color(0xff575757),
                                            fontWeight: FontWeight.w600,
                                          ),
                                          Radio(
                                            activeColor: Color(0xFFD02127),
                                            groupValue: widget
                                                .items![index].selectedType,
                                            value: 1,
                                            onChanged: (value) {
                                              widget.items![index]
                                                  .selectedType = 1;
                                              setState(() {
                                                widget.items![index].type =
                                                    value.toString();
                                              });
                                            },
                                          ),
                                          AppText(
                                            TranslationBase.of(context).urgent,
                                            color: Color(0xff575757),
                                            fontWeight: FontWeight.w600,
                                          ),
                                        ],
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              SizedBox(
                                height: 2.0,
                              ),
                              Padding(
                                padding: EdgeInsets.symmetric(
                                    horizontal: 12, vertical: 15.0),
                                child: TextFields(
                                  hintText: TranslationBase.of(context).remarks,
                                  controller: remarksControllerNew,
                                  onChanged: (value) {
                                    widget.items![index].remarks = value;
                                  },
                                  minLines: 3,
                                  maxLines: 5,
                                  borderWidth: 0.5,
                                  borderColor: Colors.grey[500]!,
                                ),
                              ),
                              SizedBox(
                                height: 19.0,
                              ),
                              //DividerWithSpacesAround(),
                            ],
                          ),
                        );
                      }),
                  SizedBox(
                    height: 90,
                  ),
                ],
              ),
            ),
          ),
        ),

        ///TODO Elham* use our custom bottomsheet
        bottomSheet: Container(
          margin: EdgeInsets.all(SizeConfig.widthMultiplier! * 5),
          child: Wrap(
            alignment: WrapAlignment.center,
            children: <Widget>[
              AppButton(
                title: widget.addButtonTitle ??
                    TranslationBase.of(context).addSelectedProcedures,
                color: AppGlobal.appGreenColor,
                fontWeight: FontWeight.w700,
                onPressed: () async {
                  GifLoaderDialogUtils.showMyDialog(context);
                  await widget.previousProcedureViewModel!.addProcedures(
                      widget.previousProcedureViewModel!,
                      widget.items!,
                      widget.patient!,
                      remarksController,
                      isLocalBusy: true);
                  GifLoaderDialogUtils.hideDialog(context);
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}
