import 'package:fcs/domain/entities/invoice.dart';
import 'package:fcs/helpers/theme.dart';
import 'package:fcs/localization/app_translations.dart';
import 'package:fcs/pages/widgets/local_text.dart';
import 'package:fcs/pages/widgets/multi_img_controller.dart';
import 'package:fcs/pages/widgets/multi_img_file.dart';
import 'package:fcs/pages/widgets/my_data_table.dart';
import 'package:fcs/pages/widgets/number_cell.dart';
import 'package:fcs/pages/widgets/progress.dart';
import 'package:flutter/material.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';

class PaymentPage extends StatefulWidget {
  final Invoice invoice;
  PaymentPage({this.invoice});

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

class _PaymentPageState extends State<PaymentPage> {
  TextEditingController _addressEditingController = new TextEditingController();
  TextEditingController _fromTimeEditingController =
      new TextEditingController();
  TextEditingController _toTimeEditingController = new TextEditingController();
  TextEditingController _noOfPackageEditingController =
      new TextEditingController();
  TextEditingController _weightEditingController = new TextEditingController();
  MultiImgController multiImgController = MultiImgController();
  var dateFormatter = new DateFormat('dd MMM yyyy');

  Invoice _invoice = new Invoice();
  bool _isLoading = false;
  List<String> _receipts = [
    "assets/buying_online_with_first_last_name.png",
  ];
  bool isNew;

  @override
  void initState() {
    if (widget.invoice != null) {
      _invoice = widget.invoice;
      // multiImgController.setImageUrls = _receipts;
    }
    super.initState();
  }

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

  final DateFormat dateFormat = DateFormat("d MMM yyyy");

  @override
  Widget build(BuildContext context) {
    // var images = isNew ? [] : _images;
    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("pm_.title")),
        ),
        body: Card(
          child: Column(
            children: <Widget>[
              Padding(
                padding: const EdgeInsets.all(15.0),
                child: Container(
                    child: Row(
                  children: <Widget>[
                    LocalText(context, 'pm.total.amount',
                        color: Colors.black, fontSize: 16),
                    Text(
                      ' \$ ${_invoice.amount}',
                      style: TextStyle(
                          color: primaryColor,
                          fontSize: 16,
                          fontWeight: FontWeight.bold),
                    )
                  ],
                )),
              ),
              Padding(
                padding: const EdgeInsets.all(15.0),
                child: Container(
                    child: Row(
                  children: <Widget>[
                    LocalText(context, 'pm.remaining_balance',
                        color: Colors.black, fontSize: 16),
                    Text(
                      ' \$ ${_invoice.amount - _invoice.receipts[0].amount}',
                      style: TextStyle(
                          color: primaryColor,
                          fontSize: 16,
                          fontWeight: FontWeight.bold),
                    )
                  ],
                )),
              ),
              Expanded(
                child: ListView(
                  children: [
                    ExpansionTile(
                      title: LocalText(context, 'pm.attachment',
                          color: Colors.black, fontSize: 16),
                      children: <Widget>[
                        Padding(
                          padding: EdgeInsets.only(left: 20),
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.start,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: <Widget>[
                              Container(
                                padding: EdgeInsets.only(top: 8),
                                child: Text(
                                  '${dateFormatter.format(_invoice.receipts[0].date)} ',
                                  style: TextStyle(
                                      color: Colors.black, fontSize: 16),
                                ),
                              ),
                              Container(
                                  padding: EdgeInsets.only(left: 10),
                                  child: MultiImageFile(
                                    enabled: true,
                                    controller: multiImgController,
                                    title: "Receipt File",
                                  )),
                            ],
                          ),
                        ),
                        SizedBox(
                          height: 25,
                        ),
                      ],
                    ),
                    ExpansionTile(
                      title: LocalText(context, 'pm.receipt',
                          color: Colors.black, fontSize: 16),
                      children: <Widget>[
                        Container(
                          child: SingleChildScrollView(
                            scrollDirection: Axis.horizontal,
                            child: MyDataTable(
                              headingRowHeight: 40,
                              columnSpacing: 20,
                              columns: [
                                MyDataColumn(
                                  label: LocalText(
                                    context,
                                    "pm.date",
                                    color: Colors.grey,
                                  ),
                                ),
                                MyDataColumn(
                                  label: LocalText(
                                    context,
                                    "pm.amount",
                                    color: Colors.grey,
                                  ),
                                ),
                              ],
                              rows: getPackageRow(context),
                            ),
                          ),
                        ),
                        SizedBox(height: 25),
                      ],
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  List<MyDataRow> getPackageRow(BuildContext context) {
    return _invoice.receipts.map((r) {
      return MyDataRow(
        onSelectChanged: (bool selected) {},
        cells: [
          MyDataCell(
            new Text(dateFormatter.format(r.date), style: textStyle),
          ),
          MyDataCell(NumberCell(r.amount))
        ],
      );
    }).toList();
  }
}
