import 'package:fcs/domain/entities/invoice.dart';
import 'package:fcs/helpers/theme.dart';
import 'package:fcs/localization/app_translations.dart';
import 'package:fcs/pages/main/util.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/cupertino.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) {
    final saveBox = fcsButton(context, getLocalString(context, 'btn.save'));

    return LocalProgress(
      inAsyncCall: _isLoading,
      child: Scaffold(
        appBar: AppBar(
          centerTitle: true,
          leading: new IconButton(
            icon: new Icon(CupertinoIcons.back),
            onPressed: () => Navigator.of(context).pop(),
          ),
          backgroundColor: primaryColor,
          title: Text(AppTranslations.of(context).text("pm_.title")),
        ),
        body: ListView(
          padding: const EdgeInsets.all(15.0),
          children: <Widget>[
            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),
                )
              ],
            )),
            Container(
                padding: const EdgeInsets.only(top: 15.0),
                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),
                    )
                  ],
                )),
            SizedBox(height: 10),
            Divider(),
            SizedBox(height: 10),
            LocalText(context, 'pm.attachment',
                color: primaryColor, fontSize: 16, fontWeight: FontWeight.bold),
            Padding(
              padding: EdgeInsets.only(left: 20, top: 10),
              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),
                    ),
                  ),
                  Expanded(
                    child: Container(
                        padding: EdgeInsets.only(left: 10),
                        child: MultiImageFile(
                          enabled: true,
                          controller: multiImgController,
                          title: "Receipt File",
                        )),
                  ),
                ],
              ),
            ),
            SizedBox(height: 25),
            Divider(),
            SizedBox(height: 10),
            LocalText(context, 'pm.receipt',
                color: primaryColor, fontSize: 16, fontWeight: FontWeight.bold),
            Container(
              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),
            // saveBox,
            // SizedBox(height: 10),
          ],
        ),
      ),
    );
  }

  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();
  }
}