import 'package:fcs/helpers/theme.dart';
import 'package:fcs/pages/carton/model/carton_model.dart';
import 'package:fcs/pages/widgets/local_popup_menu_button.dart';
import 'package:fcs/pages/widgets/local_popupmenu.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:provider/provider.dart';

import 'box_editor.dart';
import 'box_list_row.dart';

class BoxList extends StatefulWidget {
  @override
  _BoxListState createState() => _BoxListState();
}

class _BoxListState extends State<BoxList> {
  bool _isLoading = false;
  var _controller = ScrollController();

  @override
  void initState() {
    super.initState();
    _controller.addListener(() async {
      if (_controller.position.pixels == _controller.position.maxScrollExtent) {
        Provider.of<CartonModel>(context, listen: false).loadMore();
      }
    });
    Provider.of<CartonModel>(context, listen: false).initData();
  }

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

  @override
  Widget build(BuildContext context) {
    var boxModel = Provider.of<CartonModel>(context);
    final popupMenu = LocalPopupMenuButton(
      popmenus: [
        LocalPopupMenu(
            id: 1,
            textKey: "box.popupmenu.active",
            selected: boxModel.selectedIndex == 1),
        LocalPopupMenu(
            id: 2,
            textKey: "box.popupmenu.delivered",
            selected: boxModel.selectedIndex == 2)
      ],
      popupMenuCallback: (p) => this.setState(() {
        boxModel.selectedIndex = p.id;
      }),
    );
    return LocalProgress(
      inAsyncCall: _isLoading,
      child: DefaultTabController(
        length: 2,
        child: Scaffold(
          appBar: AppBar(
            centerTitle: true,
            leading: new IconButton(
              icon: new Icon(CupertinoIcons.back),
              onPressed: () => Navigator.of(context).pop(),
            ),
            backgroundColor: primaryColor,
            title: LocalText(context, "boxes.name",
                color: Colors.white, fontSize: 20),
            actions: <Widget>[
              IconButton(
                icon: Icon(
                  Icons.search,
                  color: Colors.white,
                ),
                iconSize: 30, onPressed: () {},
                // onPressed: () => showPlacesSearch(context),
              ),
              popupMenu
            ],
          ),
          floatingActionButton: FloatingActionButton.extended(
            onPressed: () {
              _newBox();
            },
            icon: Icon(Icons.add),
            label: LocalText(context, "boxes.new", color: Colors.white),
            backgroundColor: primaryColor,
          ),
          body: Column(
            children: [
              Expanded(
                child: RefreshIndicator(
                  child: new ListView.separated(
                      physics: AlwaysScrollableScrollPhysics(),
                      controller: _controller,
                      separatorBuilder: (context, index) => Divider(
                            color: Colors.black,
                          ),
                      scrollDirection: Axis.vertical,
                      padding: EdgeInsets.only(top: 15),
                      shrinkWrap: true,
                      itemCount: boxModel.boxes.length,
                      itemBuilder: (BuildContext context, int index) {
                        return BoxListRow(box: boxModel.boxes[index]);
                      }),
                  onRefresh: () => boxModel.refresh(),
                ),
              ),
              boxModel.isLoading
                  ? Container(
                      padding: EdgeInsets.all(8),
                      color: primaryColor,
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Text("Loading...",
                              style: TextStyle(color: Colors.white)),
                        ],
                      ),
                    )
                  : Container(),
            ],
          ),
        ),
      ),
    );
  }

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