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/progress.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;

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

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

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

    return LocalProgress(
      inAsyncCall: _isLoading,
      child: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          leading: new IconButton(
            icon: new Icon(
              Icons.close,
            ),
            onPressed: () => Navigator.of(context).pop(),
          ),
          backgroundColor: primaryColor,
          title: Text(AppTranslations.of(context).text("rate.cal.title")),
        ),
        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:
                            Text('Cargo Type', style: TextStyle(fontSize: 15))),
                    Container(
                      width: 150.0,
                      child: DropdownButtonFormField(
                        decoration: InputDecoration(
                            fillColor: Colors.white,
                            hintText: shipmentRateModel.rates[0].description,
                            hintStyle: TextStyle(color: Colors.black87)),
                        items: shipmentRateModel.rates
                            .map((e) => DropdownMenuItem(
                                child: Text(e.description),
                                value: e.description))
                            .toList(),
                        onChanged: (selected) => {
                          setState(() {
                            cargoType = selected;
                          })
                        },
                      ),
                    ),
                  ],
                ),
              ),
              _row('Width (inches)', "", "", "10", input: true),
              _row('Height (inches)', "", "", "10", input: true),
              _row('Length (inches)', "", "", "10", input: true),
              _row('Actual Weight (pounds)', "", "", "0", input: true),
              Container(
                  padding: EdgeInsets.only(left: 25, top: 15, bottom: 5),
                  child: Row(
                    children: <Widget>[
                      Text('Shipment Weight', style: TextStyle(fontSize: 15)),
                      Spacer(),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.end,
                        children: <Widget>[
                          Padding(
                            padding: const EdgeInsets.only(bottom: 3.0),
                            child: Text(
                              '6',
                              style:
                                  TextStyle(color: primaryColor, fontSize: 16),
                            ),
                          ),
                          Text(
                            'pounds',
                            style: TextStyle(color: Colors.grey, fontSize: 16),
                          ),
                        ],
                      ),
                    ],
                  )),
              SizedBox(height: 50),
              Center(
                  child: Text(
                "Delivery fee:\$ 5",
                style: TextStyle(color: primaryColor, fontSize: 16),
              )),
              SizedBox(height: 20),
              Center(
                  child: Text(
                "Total estimated amount:\$ 41",
                style: TextStyle(color: primaryColor, fontSize: 20),
              ))
            ],
          ),
        ),
      ),
    );
  }

  _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,
                )),
          ],
        ));
  }
}
