import 'package:fcs/helpers/theme.dart';
import 'package:fcs/localization/app_translations.dart';
import 'package:fcs/pages/rates/model/shipment_rate_model.dart';
import 'package:fcs/pages/widgets/display_text.dart';
import 'package:fcs/pages/widgets/length_picker.dart';
import 'package:fcs/pages/widgets/local_text.dart';
import 'package:fcs/pages/widgets/local_title.dart';
import 'package:fcs/pages/widgets/progress.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:provider/provider.dart';

import 'package:flutter/material.dart';

class ShipmentRatesCal extends StatefulWidget {
  ShipmentRatesCal();

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

class _ShipmentRatesCalState extends State<ShipmentRatesCal> {
  bool _isLoading = false;
  String cargoType;
  TextEditingController _widthController = new TextEditingController();
  TextEditingController _heightController = new TextEditingController();
  TextEditingController _lengthController = new TextEditingController();
  double shipmentWeight = 0;
  double volumetricRatio = 0;

  @override
  void initState() {
    super.initState();

    //for shipment weight
    volumetricRatio = Provider.of<ShipmentRateModel>(context, listen: false)
        .rate
        .volumetricRatio;
    // _lengthController.addListener(_calShipmentWeight);
    // _widthController.addListener(_calShipmentWeight);
    // _heightController.addListener(_calShipmentWeight);
    _lengthController.text = '10';
    _widthController.text = '10';
    _heightController.text = '10';
  }

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

  @override
  Widget build(BuildContext context) {
    var shipmentRateModel = Provider.of<ShipmentRateModel>(context);

    final lengthBox = LengthPicker(
      controller: _lengthController,
      lableKey: "box.length",
    );
    final widthBox = LengthPicker(
      controller: _widthController,
      lableKey: "box.width",
    );
    final heightBox = LengthPicker(
      controller: _heightController,
      lableKey: "box.height",
    );

    final dimBox = Row(
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.only(right: 8.0),
          child: Icon(FontAwesome.arrow_circle_right, color: primaryColor),
        ),
        SizedBox(child: lengthBox, width: 80),
        SizedBox(child: widthBox, width: 80),
        SizedBox(child: heightBox, width: 80),
      ],
    );

    final shipmentWeightBox = DisplayText(
      text: shipmentWeight != null ? shipmentWeight.toStringAsFixed(0) : "6",
      labelTextKey: "box.shipment_weight",
      iconData: MaterialCommunityIcons.weight,
    );

    final actualWeightBox = DisplayText(
      text: shipmentWeight != null ? shipmentWeight.toStringAsFixed(0) : "",
      labelTextKey: "box.actual_weight",
      iconData: MaterialCommunityIcons.weight,
    );

    return LocalProgress(
      inAsyncCall: _isLoading,
      child: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          leading: new IconButton(
            icon: new Icon(CupertinoIcons.back, color: primaryColor),
            onPressed: () => Navigator.of(context).pop(),
          ),
          backgroundColor: Colors.white,
          shadowColor: Colors.transparent,
          title: LocalText(context, 'rate.cal.title',
              color: primaryColor, fontSize: 20),
        ),
        body: Padding(
          padding: const EdgeInsets.all(8.0),
          child: ListView(
            children: <Widget>[
              Container(
                padding: EdgeInsets.only(top: 5, left: 25),
                child: Row(
                  children: <Widget>[
                    Expanded(
                        child: LocalText(context, 'rate.cargo.type',
                            color: Colors.grey, fontSize: 15)),
                    Container(
                      width: 150.0,
                      child: DropdownButtonFormField(
                        decoration: InputDecoration(
                            fillColor: Colors.white,
                            hintText: shipmentRateModel.rate.cargoTypes[0].name,
                            hintStyle: TextStyle(color: Colors.black87)),
                        items: shipmentRateModel.rate.cargoTypes
                            .map((e) => DropdownMenuItem(
                                child: Text(e.name), value: e.name))
                            .toList(),
                        onChanged: (selected) => {
                          setState(() {
                            cargoType = selected;
                          })
                        },
                      ),
                    ),
                  ],
                ),
              ),
              // LocalTitle(textKey: "box.dimension"),
              dimBox,
              shipmentWeightBox,
              actualWeightBox,

              SizedBox(height: 50),
              Center(
                  child: Container(
                alignment: Alignment.center,
                width: 150,
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    LocalText(context, "rate.delivery_fee",
                        color: primaryColor, fontSize: 16),
                    Text(
                      ':\$ 5',
                      style: TextStyle(
                        color: primaryColor,
                        fontSize: 16,
                      ),
                    )
                  ],
                ),
              )),
              SizedBox(height: 20),
              Center(
                  child: Container(
                width: 220,
                alignment: Alignment.center,
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    LocalText(context, "rate.total_estimated_amount",
                        color: primaryColor, fontSize: 16),
                    Text(
                      ':\$ 41',
                      style: TextStyle(
                        color: primaryColor,
                        fontSize: 16,
                      ),
                    )
                  ],
                ),
              ))
            ],
          ),
        ),
      ),
    );
  }

  _row(String desc, String price, String unit, String value, {bool input}) {
    return Container(
        padding: EdgeInsets.only(left: 25, top: 5, bottom: 5),
        child: Row(
          children: <Widget>[
            Text('$desc ', style: TextStyle(fontSize: 15)),
            Spacer(),
            Column(
              crossAxisAlignment: CrossAxisAlignment.end,
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.only(bottom: 3.0),
                  child: Text(
                    '$price',
                    style: TextStyle(color: primaryColor, fontSize: 14),
                  ),
                ),
                Text(
                  '$unit',
                  style: TextStyle(color: Colors.grey, fontSize: 14),
                ),
                // TextFormField(),
              ],
            ),
            SizedBox(
              width: 50,
            ),
            Container(
                width: 50,
                child: TextFormField(
                  initialValue: value,
                  textAlign: TextAlign.end,
                )),
          ],
        ));
  }
}