import 'package:fcs/domain/entities/fcs_shipment.dart';
import 'package:fcs/helpers/theme.dart';
import 'package:fcs/pages/carton/model/carton_model.dart';
import 'package:fcs/pages/widgets/local_app_bar.dart';
import 'package:fcs/pages/widgets/local_text.dart';
import 'package:fcs/pages/widgets/progress.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_vector_icons/flutter_vector_icons.dart';
import 'package:provider/provider.dart';
import '../../domain/constants.dart';
import '../../domain/entities/carton.dart';
import '../../pagination/paginator_listview.dart';
import '../carton_search/carton_search.dart';
import '../fcs_shipment/model/fcs_shipment_model.dart';
import 'carton_editor.dart';
import 'carton_filter.dart';
import 'carton_info.dart';
import 'widget/carton_list_row.dart';

class CartonList extends StatefulWidget {
  @override
  _CartonListState createState() => _CartonListState();
}

class _CartonListState extends State<CartonList> {
  bool _isLoading = false;
  List<FcsShipment> _shipments = [];
  FcsShipment? _selectedShipment;
  bool _down = true;

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

  _init() async {
    var model = context.read<CartonModel>();
    _shipments = await context.read<FcsShipmentModel>().getShipments();
    _shipments.insert(0, model.defaultShipment);
    if (_shipments.length > shipmentCountForCartonFilter) {
      _shipments.insert(_shipments.length,
          FcsShipment(shipmentNumber: "See All", id: see_all));
    }

    _selectedShipment = model.shipment ?? model.defaultShipment;
    model.loadPaginationCartons();

    if (mounted) {
      setState(() {});
    }
  }

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

    final shipmentFilterBox = Align(
      alignment: Alignment.topLeft,
      child: SingleChildScrollView(
        padding: const EdgeInsets.only(left: 15, right: 15),
        scrollDirection: Axis.horizontal,
        physics: const BouncingScrollPhysics(),
        child: Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.max,
            children: _shipments.map((g) {
              return Padding(
                padding: const EdgeInsets.all(5.0),
                child: ActionChip(
                  shape: StadiumBorder(
                      side: BorderSide(
                          color: g.id == see_all
                              ? Colors.transparent
                              : _selectedShipment?.id == g.id
                                  ? primaryColor
                                  : Colors.grey.shade300)),
                  padding: const EdgeInsets.all(8),
                  onPressed: () {
                    _filterShipment(g);
                  },
                  label: Text(g.shipmentNumber ?? "",
                      style: TextStyle(
                          color: g.id == see_all
                              ? primaryColor
                              : _selectedShipment?.id == g.id
                                  ? primaryColor
                                  : labelColor,
                          fontWeight: FontWeight.normal,
                          fontSize: 14,
                          fontFamily: "Poppins")),
                ),
              );
            }).toList()),
      ),
    );

    return LocalProgress(
      inAsyncCall: _isLoading,
      child: Scaffold(
        appBar: LocalAppBar(labelKey: "boxes.name", actions: [
          IconButton(
              icon: Icon(
                Icons.search,
                color: Colors.white,
              ),
              iconSize: 30,
              onPressed: () {
                searchCarton(context, callbackCartonSelect: (c) {
                  Navigator.push(
                    context,
                    CupertinoPageRoute(
                        builder: (context) => CartonInfo(carton: c)),
                  );
                });
              }),
          _filterWidget(context)
        ]),
        floatingActionButton: FloatingActionButton.extended(
          onPressed: () {
            _newBox();
          },
          icon: Icon(Icons.add),
          label: LocalText(context, "boxes.new", color: Colors.white),
          backgroundColor: primaryColor,
        ),
        body: Column(
          children: [
            AnimatedSwitcher(
              duration: const Duration(milliseconds: 300),
              transitionBuilder: (Widget child, Animation<double> animation) =>
                  FadeTransition(
                opacity: animation,
                child: SizeTransition(
                  child: child,
                  sizeFactor: animation,
                  axis: Axis.vertical,
                ),
              ),
              child: _down
                  ? Column(
                      children: [
                        shipmentFilterBox,
                        Wrap(
                          runSpacing: 8,
                          children: [
                            cartonModel.filterByConsingee != null
                                ? Padding(
                                    padding: const EdgeInsets.only(left: 15),
                                    child: Row(
                                      children: [
                                        Wrap(
                                          children: [
                                            Row(
                                              children: [
                                                const Text("Consignee: ",
                                                    style: TextStyle(
                                                        fontSize: 12,
                                                        color: Colors.grey)),
                                                Text(
                                                    cartonModel
                                                            .filterByConsingee!
                                                            .name ??
                                                        "",
                                                    style: const TextStyle(
                                                        fontSize: 12,
                                                        color: Colors.black)),
                                                const SizedBox(width: 3),
                                                Text(
                                                    cartonModel
                                                            .filterByConsingee!
                                                            .fcsID ??
                                                        "",
                                                    style: const TextStyle(
                                                        fontSize: 12,
                                                        color: labelColor)),
                                              ],
                                            )
                                          ],
                                        ),
                                        Padding(
                                          padding:
                                              const EdgeInsets.only(left: 5),
                                          child: InkResponse(
                                            radius: 30,
                                            onTap: () {
                                              context
                                                  .read<CartonModel>()
                                                  .clearFilterConsignee();
                                            },
                                            child: const Icon(
                                                AntDesign.closecircleo,
                                                size: 20,
                                                color: dangerColor),
                                          ),
                                        )
                                      ],
                                    ),
                                  )
                                : const SizedBox(),
                            cartonModel.filterBySender != null
                                ? Padding(
                                    padding: const EdgeInsets.only(left: 15),
                                    child: Row(
                                      children: [
                                        Wrap(
                                          children: [
                                            Row(
                                              children: [
                                                const Text("Sender: ",
                                                    style: TextStyle(
                                                        fontSize: 12,
                                                        color: Colors.grey)),
                                                Text(
                                                    cartonModel.filterBySender!
                                                            .name ??
                                                        "",
                                                    style: const TextStyle(
                                                        fontSize: 12,
                                                        color: Colors.black)),
                                                const SizedBox(width: 3),
                                                Text(
                                                    cartonModel.filterBySender!
                                                            .fcsID ??
                                                        "",
                                                    style: const TextStyle(
                                                        fontSize: 12,
                                                        color: labelColor)),
                                              ],
                                            )
                                          ],
                                        ),
                                        Padding(
                                          padding:
                                              const EdgeInsets.only(left: 5),
                                          child: InkResponse(
                                            radius: 30,
                                            onTap: () {
                                              context
                                                  .read<CartonModel>()
                                                  .clearFilterSender();
                                            },
                                            child: const Icon(
                                                AntDesign.closecircleo,
                                                size: 20,
                                                color: dangerColor),
                                          ),
                                        )
                                      ],
                                    ),
                                  )
                                : const SizedBox(),
                          ],
                        ),
                        Divider(color: Colors.grey.shade400),
                      ],
                    )
                  : const SizedBox(),
            ),
            Expanded(
              child: cartonModel.getBoxes == null
                  ? const SizedBox()
                  : PaginatorListView<Carton>(
                      paginatorListener: cartonModel.getBoxes!,
                      rowBuilder: (p) => CartonListRow(box: p),
                      color: primaryColor,
                      onScroll: ((down) {
                        if (_down == down) return;
                        setState(() {
                          _down = down;
                        });
                      }),
                    ),
            ),
          ],
        ),
      ),
    );
  }

  _newBox() {
    Navigator.push(
      context,
      CupertinoPageRoute(builder: (context) => CartonEditor()),
    );
  }

  Widget _filterWidget(BuildContext context) {
    var model = Provider.of<CartonModel>(context);
    return IconButton(
        icon: Stack(
          alignment: Alignment.center,
          children: <Widget>[
            const Icon(
              Icons.filter_list,
              color: Colors.white,
            ),
            model.filterByStatus != null ||
                    model.filterBySender != null ||
                    model.filterByConsingee != null ||
                    model.shipment != null
                ? Positioned(
                    bottom: 15,
                    right: 0,
                    child: Container(
                      width: 10,
                      height: 10,
                      decoration: const BoxDecoration(
                        shape: BoxShape.circle,
                        color: Colors.red,
                      ),
                    ),
                  )
                : Container()
          ],
        ),
        onPressed: () {
          _showFilter();
        });
  }

  _showFilter() async {
    bool? updated = await showModalBottomSheet(
        context: context,
        useRootNavigator: true,
        isScrollControlled: true,
        useSafeArea: true,
        shape: const RoundedRectangleBorder(
            borderRadius: BorderRadius.vertical(top: Radius.circular(10))),
        builder: (ctx) => DraggableScrollableSheet(
            initialChildSize: 0.6,
            minChildSize: 0.6,
            expand: false,
            builder: (_, controller) => CartonFilter(controller: controller)));
    var model = context.read<CartonModel>();
    if (updated ?? false) {
      setState(() {
        _selectedShipment = model.shipment ?? model.defaultShipment;
      });
    }
  }

  _filterShipment(FcsShipment shipment) async {
    if (shipment.id == see_all) {
      _showFilter();
      return;
    }

    setState(() {
      _selectedShipment = shipment;
    });

    await context.read<CartonModel>().filterCartonByShipment(_selectedShipment);
  }
}