import 'package:cssd/config/colors.dart';
import 'package:cssd/utils/scan.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';

import '../../config/routes.dart';
import '../../models/cycles_models.dart';
import '../../providers/connectivity.dart';
import '../../providers/cycles.dart';
import '../../widgets/CycleScreens/Add/add_label_box.dart';
import '../../widgets/CycleScreens/Add/date_picker.dart';
import '../../widgets/CycleScreens/Add/save_button.dart';
import '../../widgets/Global/internet_error.dart';

class CycleAddScreen extends StatefulWidget {
  // static const route = '/CycleAddScreen';

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

class _CycleAddScreenState extends State<CycleAddScreen> {
  final _cycleNumberFocusNode = FocusNode();
  final _descriptionFocosNode = FocusNode();
  TextEditingController descriptionCTRL = new TextEditingController();
  TextEditingController cycleNumberCTRL = new TextEditingController();
  TextEditingController striizerIdCTRL = new TextEditingController();
  TextEditingController dateCTRL = new TextEditingController();
  DateTime? dateTimeFrom;
  final _form = GlobalKey<FormState>();

  bool isInit = true;
  CycleFilterObject? filters;

  List<TextEditingController> labelsCTRL = [TextEditingController()];
  int curLabelVal = 1;

  @override
  void initState() {
    descriptionCTRL.text = '';
    cycleNumberCTRL.text = '';
    dateCTRL.text = DateFormat('y-M-d').format(DateTime.now());
    striizerIdCTRL.text = '';
    // dateValue = DateFormat('y-M-d').format(DateTime.now());
    super.initState();
  }

  @override
  void didChangeDependencies() async {
    if (isInit) {
      // var _id = ModalRoute.of(context).settings.arguments;
      var cycleProviderObject = Provider.of<CyclesProvider>(context);
      cycleProviderObject.resetLabelVals();
      cycleProviderObject.getLabelFilters().then(
        (result) {
          setState(
            () {
              // labelValues =
              //     filters.hospital == '' ? labelVals[0] : filters.hospital;
              isInit = false;
            },
          );
        },
      );
    }
    super.didChangeDependencies();
  }

  @override
  Widget build(BuildContext context) {
    final _media = MediaQuery.of(context);
    // final double _pixelRatio = (_media.size.height / _media.size.width * 7 / 5);
    final double _devicewidth = _media.size.width;
    final double _deviceBlockSize = _devicewidth / 100;
    return Consumer<CyclesProvider>(builder: (context, cyclesProvider, _) {
      return SafeArea(
        child: GestureDetector(
          onTap: () {
            FocusManager.instance.primaryFocus?.unfocus();
          },
          child: Scaffold(
            appBar: AppBar(
              titleSpacing: -10,
              title: Text(
                'Cycles',
                style: TextStyle(
                  color: Colors.white,
                ),
              ),
              backgroundColor: Colors.black,
              leading: IconButton(
                icon: Icon(
                  Icons.keyboard_arrow_left,
                  color: Colors.white,
                  size: 35,
                ),
                onPressed: () {
                  cyclesProvider.resetLoadingButton();
                  Navigator.of(context)
                      .pushReplacementNamed(Routes.cycleResultScreen);
                },
              ),
            ),
            body: Consumer<ConnectivityProvider>(
              builder: (ct, connection, _) {
                return connection.conStatus != 'offline'
                    ? isInit
                        ? Center(
                            child: CircularProgressIndicator(
                              color: Colors.black,
                            ),
                          )
                        : Form(
                            key: _form,
                            child: Padding(
                              padding: EdgeInsets.all(20),
                              child: ListView(
                                // crossAxisAlignment: CrossAxisAlignment.start,
                                children: <Widget>[
                                  Text(
                                    'Add a Cycle',
                                    style: TextStyle(
                                      fontWeight: FontWeight.w700,
                                      fontSize: 6 * _deviceBlockSize,
                                      letterSpacing: 3,
                                    ),
                                  ),
                                  SizedBox(
                                    height: 20,
                                  ),
                                  Row(
                                    children: [
                                      Flexible(
                                        flex: 8,
                                        child: TextFormField(
                                          validator: (val) {
                                            if (val!.isEmpty) {
                                              return 'Strilizer ID required!';
                                            }
                                            return null;
                                          },
                                          controller: striizerIdCTRL,
                                          decoration: InputDecoration(
                                            icon: Icon(
                                              FontAwesomeIcons.sortNumericDown,
                                              size: 7 * _deviceBlockSize,
                                            ),
                                            labelStyle: TextStyle(
                                              fontWeight: FontWeight.w100,
                                              fontSize: 4 * _deviceBlockSize,
                                            ),
                                            isDense: true,
                                            labelText: 'Strilizer ID',
                                            contentPadding:
                                                EdgeInsets.symmetric(
                                              vertical: 2,
                                              horizontal: 3,
                                            ),
                                          ),
                                          style: TextStyle(
                                            fontWeight: FontWeight.w700,
                                            fontSize: 5 * _deviceBlockSize,
                                          ),
                                          keyboardType:
                                              TextInputType.visiblePassword,
                                          textInputAction: TextInputAction.next,
                                          onFieldSubmitted: (_) {
                                            FocusScope.of(context).requestFocus(
                                                _cycleNumberFocusNode);
                                          },
                                        ),
                                      ),
                                      Flexible(
                                        flex: 1,
                                        child: InkWell(
                                          onTap: () {
                                            scan().then(
                                              (String result) {
                                                if (result == 'cancel') {
                                                  print('cancel');
                                                } else if (result == 'error') {
                                                  print('error');
                                                } else if (result == 'access') {
                                                  print('access');
                                                } else {
                                                  print(result);
                                                  striizerIdCTRL.text = result;
                                                }
                                              },
                                            );
                                          },
                                          child: Container(
                                            padding: EdgeInsets.all(8),
                                            decoration: BoxDecoration(
                                              shape: BoxShape.circle,
                                              color: Colors.black,
                                            ),
                                            child: Icon(
                                              Icons.qr_code_scanner,
                                              size: 5 * _deviceBlockSize,
                                              color: Colors.white,
                                            ),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                  SizedBox(
                                    height: 20,
                                  ),
                                  TextFormField(
                                    validator: (val) {
                                      if (val!.isEmpty) {
                                        return 'Cycle number required!';
                                      }
                                      return null;
                                    },
                                    controller: cycleNumberCTRL,
                                    decoration: InputDecoration(
                                      icon: Icon(
                                        FontAwesomeIcons.sortNumericDown,
                                        size: 7 * _deviceBlockSize,
                                      ),
                                      labelStyle: TextStyle(
                                        fontWeight: FontWeight.w100,
                                        fontSize: 4 * _deviceBlockSize,
                                      ),
                                      isDense: true,
                                      labelText: 'Cycle Number',
                                      contentPadding: EdgeInsets.symmetric(
                                          vertical: 2, horizontal: 3),
                                    ),
                                    style: TextStyle(
                                      fontWeight: FontWeight.w700,
                                      fontSize: 5 * _deviceBlockSize,
                                    ),
                                    focusNode: _cycleNumberFocusNode,
                                    keyboardType: TextInputType.number,
                                    textInputAction: TextInputAction.next,
                                    onFieldSubmitted: (_) {
                                      FocusScope.of(context)
                                          .requestFocus(_descriptionFocosNode);
                                    },
                                  ),
                                  SizedBox(
                                    height: 30,
                                  ),
                                  CycleAddDatePicker(
                                    dateCTRL: dateCTRL,
                                    deviceBlockSize: _deviceBlockSize,
                                  ),
                                  SizedBox(
                                    height: 20.0,
                                  ),
                                  Container(
                                    margin: EdgeInsets.symmetric(vertical: 10),
                                    child: Text(
                                      'Labels included',
                                      style: TextStyle(
                                        color: kPink,
                                        letterSpacing: 2,
                                        fontSize: 5 * _deviceBlockSize,
                                      ),
                                    ),
                                  ),
                                  Consumer<CyclesProvider>(
                                    builder: (ctx, cycleProvider, _) =>
                                        ListView.builder(
                                      physics: NeverScrollableScrollPhysics(),
                                      shrinkWrap: true,
                                      itemBuilder: (ctx, index) => AddLabelBox(
                                        text: 'Select Labels included',
                                        iconColor: kPinkSub,
                                        deviceBlockSize: _deviceBlockSize,
                                        values:
                                            cycleProvider.labelValues[index],
                                        vals: cycleProvider.labelVals,
                                        initialLabelValue:
                                            cycleProvider.initialLabelValue,
                                        index: index,
                                        hasRemoveButton:
                                            cycleProvider.labelValues.length > 1
                                                ? true
                                                : false,
                                      ),
                                      itemCount:
                                          cycleProvider.labelValues.length,
                                    ),
                                  ),
                                  SizedBox(
                                    height: 30,
                                  ),
                                  TextFormField(
                                    controller: descriptionCTRL,
                                    decoration: InputDecoration(
                                      icon: Icon(
                                        FontAwesomeIcons.alignLeft,
                                        size: 7 * _deviceBlockSize,
                                      ),
                                      labelStyle: TextStyle(
                                        fontWeight: FontWeight.w100,
                                        fontSize: 4 * _deviceBlockSize,
                                      ),
                                      isDense: true,
                                      labelText: 'Description',
                                      contentPadding: EdgeInsets.symmetric(
                                          vertical: 2, horizontal: 3),
                                    ),
                                    style: TextStyle(
                                      fontWeight: FontWeight.w700,
                                      fontSize: 5 * _deviceBlockSize,
                                    ),
                                    keyboardType: TextInputType.multiline,
                                    focusNode: _descriptionFocosNode,
                                    minLines: 1,
                                    maxLines: 5,
                                  ),
                                  SizedBox(
                                    height: 70,
                                  ),
                                  CycleAddSaveButton(
                                    form: _form,
                                    labelValues: Provider.of<CyclesProvider>(
                                      context,
                                      listen: false,
                                    ).labelValues,
                                    cycleNumberCTRL: cycleNumberCTRL,
                                    dateValue: dateCTRL.text,
                                    descriptionCTRL: descriptionCTRL,
                                    striizerIdCTRL: striizerIdCTRL,
                                    deviceBlockSize: _deviceBlockSize,
                                  ),
                                  SizedBox(
                                    height: 100,
                                  ),
                                ],
                              ),
                            ),
                          )
                    : ConnectionErrorBox();
              },
            ),
          ),
        ),
      );
    });
  }
}