import 'dart:async';

import 'package:common_utils/common_utils.dart';
import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:one_key/constant/state.dart';
import 'package:one_key/models/area.dart';
import 'package:one_key/models/notebook_detail.dart';
import 'package:one_key/models/tableOuter.dart';
import 'package:one_key/pages/table/area_item_table.dart';
import 'package:one_key/provider/table_manager_model.dart';
import 'package:one_key/res/colors.dart';
import 'package:one_key/utils/dialog_util.dart';
import 'package:one_key/utils/event_bus.dart';
import 'package:one_key/route/navigator_util.dart';
import 'package:one_key/utils/utils.dart';
import 'package:one_key/widgets/MyDivider.dart';
import 'package:one_key/widgets/app_bar.dart';
import 'package:one_key/widgets/area_item.dart';
import 'package:one_key/widgets/common_button.dart';
import 'package:one_key/widgets/page_exception.dart';
import 'package:one_key/widgets/system_app_bar.dart';
import 'package:one_key/widgets/table_item.dart';
import 'package:one_key/models/table.dart' as t;
import 'package:one_key/widgets/v_empty_view.dart';
import 'package:provider/provider.dart';
import 'dart:convert' as convert;
import 'package:scrollable_positioned_list/scrollable_positioned_list.dart';

const scrollDuration = Duration(microseconds: 500);

class TableManagerPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return new TableManagerPageState();
  }
}

class TableManagerPageState extends State<TableManagerPage> {
  TableManagerModel tableManagerModel;
  final ItemScrollController itemScrollController = ItemScrollController();
  bool isTap = false;
  int min;
  int max;
  int _selectIndex;
  ScrollController _areaController = ScrollController();

  final ItemPositionsListener itemPositionsListener =
      ItemPositionsListener.create();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    LogUtil.v("table_manager_page initState");
    tableManagerModel = Provider.of<TableManagerModel>(context, listen: false);
    WidgetsBinding.instance.addPostFrameCallback((_) {
      tableManagerModel.initTime(context);
      EventBus().on("refresh_tablemanager", (arg) {
        //订座-完成预订 刷新管理桌位
        tableManagerModel.getReserveList(context);
        print(tableManagerModel);
      });
    });
  }

  Widget list(List data) => ScrollablePositionedList.builder(
        itemCount: data.length,
        itemBuilder: (context, index) => item(index),
        itemScrollController: itemScrollController,
        itemPositionsListener: itemPositionsListener,
        reverse: false,
        scrollDirection: Axis.vertical,
      );

  void scrollTo(int index) => itemScrollController.scrollTo(
      index: index,
      duration: scrollDuration,
      curve: Curves.easeInOutCubic,
      alignment: 0);

  void jumpTo(int index) =>
      itemScrollController.jumpTo(index: index, alignment: 0);

  /// Generate item number [i].
  Widget item(int i) {
    int heightSum;
    int length =
        tableManagerModel.areaTableMap[tableManagerModel.areas[i].name].length;
    if (length % 4 == 0) {
      heightSum = (length / 4).floor();
    } else {
      heightSum = (length / 4).floor() + 1;
    }
    return Container(
        height: ScreenUtil().setWidth(185) * heightSum +
            heightSum * 10 +
            ScreenUtil().setWidth(60 * 2),
        child: Column(
          children: [
            Container(
              alignment: Alignment.center,
              height: ScreenUtil().setWidth(30 * 2),
              child: Text(tableManagerModel.areas[i].name,
                  style: TextStyle(
                      fontSize: ScreenUtil().setWidth(30),
                      color: MyColours.color_666666)),
            ),
            Container(
                constraints: BoxConstraints(
                    minHeight: ScreenUtil().setWidth(185) * heightSum),
                height: ScreenUtil().setWidth(200) * heightSum + heightSum * 10,
                child: GridView.builder(
                  physics: NeverScrollableScrollPhysics(),
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 4,
                    childAspectRatio: 8 / 9,
                  ),
                  itemBuilder: (context, index) {
                    return Selector<TableManagerModel, t.Table>(
                      shouldRebuild: (pre, next) => true,
                      selector: (context, model) => model.currentTables[index],
                      builder: (context, table, _) {
                        return TableItem(table, onSelected: (table) {
                          if ((table as t.Table).selected) {
                            tableManagerModel.selectTables.add(table);
                          } else {
                            tableManagerModel.selectTables
                                .removeWhere((t) => t.id == table.id);
                          }
                          DialogUtil.showTableManagerDialog(context, table)
                              .then((value) {
                            if (value != null) {
                              switch (value) {
                                case 1: //查看详情
                                  NavigatorUtil.goNotebookDetailPage(context,
                                      tableManagerModel.tableMap[table.id].id);
                                  break;
                                case 2: //订座
                                  NavigatorUtil.goNoteBookChangePage(
                                      context,
                                      NotebookDetail.fromTableManager(
                                          tableManagerModel.getCurrDdateStr(),
                                          tableManagerModel.currTimeIndex
                                              .toString(),
                                          table),
                                      "");
                                  break;
                                case 3: //停用，启用桌位
                                  Map<String, String> params = {
                                    "id": (table as t.Table).id,
                                    "status": (table as t.Table).enable == "1"
                                        ? "0"
                                        : "1"
                                  };
                                  tableManagerModel
                                      .setSwitchStatus(context, params)
                                      .then((value) {
                                    if (value != null) {
                                      (table as t.Table).enable = ((int.parse(
                                                      (table as t.Table)
                                                          .enable) +
                                                  1) %
                                              2)
                                          .toString();
                                      if ((table as t.Table).enable == "1") {
                                        for (Area area
                                            in tableManagerModel.areas) {
                                          if (area.name ==
                                              tableManagerModel.currentArea) {
                                            if (table.sign != '5' &&
                                                table.sign != '1') {
                                              //已预订
                                              area.count++;
                                            }
                                            break;
                                          }
                                        }
                                      } else {
                                        for (Area area
                                            in tableManagerModel.areas) {
                                          if (area.name ==
                                              tableManagerModel.currentArea) {
                                            if (table.sign != '5' &&
                                                table.sign != '1') {
                                              //已预订
                                              area.count--;
                                            }
                                            break;
                                          }
                                        }
                                      }
                                      tableManagerModel.notifyListeners();
                                    }
                                  });
                                  break;
                              }
                            }
                          });
                        },
                            canSelected: false,
                            fromPage: 'table_manage',
                            tableMap: tableManagerModel.tableMap,
                            rid: "");
                      },
                    );
                  },
                  itemCount: tableManagerModel
                      .areaTableMap[tableManagerModel.areas[i].name].length,
                )),
          ],
        ));
  }

  @override
  Widget build(BuildContext context) {
    return Consumer<TableManagerModel>(
      builder: (context, model, child) {
        return Column(
          children: <Widget>[
            SystemAppBar("桌位", showLeading: false),
            Container(
              color: MyColours.color_ffffff,
              width: double.infinity,
              padding:
                  EdgeInsets.symmetric(vertical: ScreenUtil().setHeight(16)),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Expanded(
                    child: Center(
                      child: GestureDetector(
                        onTap: () {
                          DialogUtil.showCalendarDialog(
                                  context, tableManagerModel.dateTime)
                              .then((day) {
                            if (day != null) {
                              tableManagerModel.createDateText(context, day);
                            }
                          });
                        },
                        child: Container(
                          child: Text(
                            tableManagerModel.dateText,
                            style: TextStyle(
                                color: MyColours.color_199095,
                                fontSize: ScreenUtil().setSp(34)),
                          ),
                        ),
                      ),
                    ),
                  ),
                  MyDivider(
                    ScreenUtil().setWidth(2),
                    ScreenUtil().setHeight(68),
                    color: MyColours.color_E0E0E0,
                  ),
                  Expanded(
                    child: Padding(
                      padding: EdgeInsets.symmetric(
                          horizontal: ScreenUtil().setWidth(30)),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: <Widget>[
                          Offstage(
                              offstage:
                                  tableManagerModel.morning == "00:00-00:00"
                                      ? true
                                      : false,
                              child: Padding(
                                  padding: EdgeInsets.only(
                                      right: ScreenUtil().setWidth(18)),
                                  child: CommonButton(
                                    content: "早市",
                                    state: tableManagerModel.currTimeIndex == 1
                                        ? 1
                                        : 0,
                                    width: 92,
                                    height: 48,
                                    fontSize: 32,
                                    onPress: () {
                                      if (tableManagerModel.currTimeIndex == 1)
                                        return;
                                      tableManagerModel.currTimeIndex = 1;
                                      tableManagerModel.getReserveList(context);
                                    },
                                  ))),
                          Offstage(
                              offstage: tableManagerModel.noon == "00:00-00:00"
                                  ? true
                                  : false,
                              child: Padding(
                                  padding: EdgeInsets.only(
                                      right: ScreenUtil().setWidth(18)),
                                  child: CommonButton(
                                    content: "午市",
                                    state: tableManagerModel.currTimeIndex == 2
                                        ? 1
                                        : 0,
                                    width: 92,
                                    height: 48,
                                    fontSize: 32,
                                    onPress: () {
                                      if (tableManagerModel.currTimeIndex == 2)
                                        return;
                                      tableManagerModel.currTimeIndex = 2;
                                      tableManagerModel.getReserveList(context);
                                    },
                                  ))),
                          Offstage(
                            offstage: tableManagerModel.night == "00:00-00:00"
                                ? true
                                : false,
                            child: Container(
                                // padding: EdgeInsets.symmetric(
                                //     horizontal: ScreenUtil().setWidth(10)),
                                child: CommonButton(
                              content: "晚市",
                              state:
                                  tableManagerModel.currTimeIndex == 3 ? 1 : 0,
                              width: 92,
                              height: 48,
                              fontSize: 32,
                              onPress: () {
                                if (tableManagerModel.currTimeIndex == 3)
                                  return;
                                tableManagerModel.currTimeIndex = 3;
                                tableManagerModel.getReserveList(context);
                              },
                            )),
                          ),
                        ],
                      ),
                    ),
                  )
                ],
              ),
            ),
            Expanded(
              child: Consumer<TableManagerModel>(
                builder: (context, model, child) {
                  if (model.pageState != PageState.Success) {
                    return ExceptionPage(
                      pageState: model.pageState,
                      callback: () {
                        if (tableManagerModel.tableOuterList.isEmpty) {
                          tableManagerModel.getTableList(context);
                        } else {
                          tableManagerModel.getReserveList(context);
                        }
                      },
                      emptyMsg: "暂时没有桌位哦",
                      emptyImg: "empty_search",
                      showMsg: "加载中，请稍后...",
                    );
                  } else {
                    return Container(
                      color: MyColours.color_ffffff,
                      child: Column(children: <Widget>[
                        VEmptyView(20),
                        ValueListenableBuilder<Iterable<ItemPosition>>(
                            valueListenable:
                                itemPositionsListener.itemPositions,
                            builder: (context, positions, child) {
                              if (positions.isNotEmpty) {
                                // max = positions
                                //     .where((ItemPosition position) =>
                                //         position.itemLeadingEdge < 1)
                                //     .reduce((ItemPosition max,
                                //             ItemPosition position) =>
                                //         position.itemLeadingEdge >
                                //                 max.itemLeadingEdge
                                //             ? position
                                //             : max)
                                //     .index;
                                min = positions
                                    .where((ItemPosition position) =>
                                        position.itemTrailingEdge > 0)
                                    .reduce((ItemPosition min,
                                            ItemPosition position) =>
                                        position.itemTrailingEdge <
                                                min.itemTrailingEdge
                                            ? position
                                            : min)
                                    .index;

                                if (isTap) {
                                  if (min >= _selectIndex) {
                                    _selectIndex = min;
                                  } else {
                                    _selectIndex = _selectIndex;
                                  }
                                  isTap = false;
                                } else {
                                  _selectIndex = min;
                                }
                                tableManagerModel.currentArea =
                                    tableManagerModel.areas[_selectIndex].name;
                              }
                              return Container(
                                height: ScreenUtil().setWidth(50),
                                color: MyColours.color_ffffff,
                                margin: EdgeInsets.only(
                                    bottom: ScreenUtil().setWidth(20)),
                                child: ListView.builder(
                                  controller: _areaController,
                                  scrollDirection: Axis.horizontal,
                                  itemBuilder: (context, index) {
                                    if (index ==
                                            tableManagerModel.areas.length ||
                                        tableManagerModel.areas.length == 0) {
                                      return InkWell(
                                          onTap: () async {
                                            //添加区域弹框
                                            await DialogUtil
                                                .openCreateAreaDialog(context,
                                                    onTap: (value) async {
                                              print(value);
                                              //添加区域
                                              bool success =
                                                  await tableManagerModel
                                                      .addTableAreas(
                                                          context, value);
                                              print(success);
                                              if (success) {
                                                Utils.showToast('添加成功！');
                                                TableOuter tableOuter =
                                                    TableOuter();
                                                tableOuter.name = value;
                                                tableOuter.list = [];
                                                tableManagerModel.tableOuterList
                                                    .add(tableOuter);
                                                tableManagerModel.initData();
                                                Timer(
                                                    Duration(milliseconds: 500),
                                                    () => _areaController
                                                        .jumpTo(_areaController
                                                            .position
                                                            .maxScrollExtent));

                                                // await tableManagerModel
                                                //     .getTableList(context);
                                                // await tableManagerModel
                                                //     .initData();
                                              }
                                            });
                                          },
                                          child: DottedBorder(
                                            dashPattern: [5, 5, 5, 5],
                                            borderType: BorderType.RRect,
                                            radius: Radius.circular(
                                                ScreenUtil().setWidth(30)),
                                            // padding: EdgeInsets.all(ScreenUtil().setWidth(70)),
                                            color: MyColours.color_199095,
                                            strokeWidth:
                                                ScreenUtil().setWidth(2),
                                            child: ClipRRect(
                                              borderRadius: BorderRadius.all(
                                                  Radius.circular(ScreenUtil()
                                                      .setWidth(30))),
                                              child: Container(
                                                height: ScreenUtil()
                                                    .setWidth(50 * 2),
                                                width: ScreenUtil()
                                                    .setWidth(60 * 2),
                                                child: Column(
                                                  mainAxisAlignment:
                                                      MainAxisAlignment.center,
                                                  children: [
                                                    Image.asset(
                                                        Utils.getImgPath(
                                                            'add_store'),
                                                        width: ScreenUtil()
                                                            .setWidth(22)),
                                                  ],
                                                ),
                                              ),
                                            ),
                                          ));
                                    } else {
                                      return Selector<TableManagerModel, Area>(
                                        selector: (context, model) =>
                                            model.areas[index],
                                        builder: (context, area, _) {
                                          return AreaItemTable(area,
                                              tableManagerModel.currentArea,
                                              (area) {
                                            isTap = true;
                                            scrollTo(index);
                                            // setState(() {
                                            tableManagerModel.currentArea =
                                                tableManagerModel
                                                    .areas[index].name;
                                            tableManagerModel.currentTables =
                                                tableManagerModel.areaTableMap[
                                                    tableManagerModel
                                                        .currentArea];
                                            _selectIndex = index;
                                            // });
                                            // setState(() {
                                            //   tableManagerModel.currentArea =
                                            //       (area as Area).name;
                                            //   tableManagerModel.currentTables =
                                            //       tableManagerModel.areaTableMap[
                                            //           tableManagerModel
                                            //               .currentArea];
                                            // });
                                          });
                                        },
                                      );
                                    }
                                  },

                                  // itemExtent: ScreenUtil().setHeight(207),
                                  itemCount: tableManagerModel.areas.length + 1,
                                ),
                              );
                            }),
                        Expanded(
                          child: Container(
                              color: MyColours.color_ffffff,
                              padding: EdgeInsets.symmetric(
                                  horizontal: ScreenUtil().setWidth(40)),
                              width: double.infinity,
                              child: list(tableManagerModel.areas)),
                        ),
                        //   Expanded(
                        //     child: Container(
                        //         color: MyColours.color_e5e5e5,
                        //         padding: EdgeInsets.symmetric(
                        //             vertical: ScreenUtil().setHeight(10),
                        //             horizontal: ScreenUtil().setWidth(9)),
                        //         child: Column(
                        //           children: [
                        //             Expanded(
                        //                 child: GridView.builder(
                        //               gridDelegate:
                        //                   SliverGridDelegateWithFixedCrossAxisCount(
                        //                       crossAxisCount: 3,
                        //                       childAspectRatio: 8 / 9),
                        //               itemBuilder: (context, index) {
                        //                 return Selector<TableManagerModel,
                        //                     t.Table>(
                        //                   shouldRebuild: (pre, next) => true,
                        //                   selector: (context, model) =>
                        //                       model.currentTables[index],
                        //                   builder: (context, table, _) {
                        //                     return TableItem(table,
                        //                         onSelected: (table) {
                        //                       if ((table as t.Table).selected) {
                        //                         tableManagerModel.selectTables
                        //                             .add(table);
                        //                       } else {
                        //                         tableManagerModel.selectTables
                        //                             .removeWhere((t) =>
                        //                                 t.id == table.id);
                        //                       }
                        //                       DialogUtil.showTableManagerDialog(
                        //                               context, table)
                        //                           .then((value) {
                        //                         if (value != null) {
                        //                           switch (value) {
                        //                             case 1: //查看详情
                        //                               NavigatorUtil
                        //                                   .goNotebookDetailPage(
                        //                                       context,
                        //                                       tableManagerModel
                        //                                           .tableMap[
                        //                                               table.id]
                        //                                           .id);
                        //                               break;
                        //                             case 2: //订座
                        //                               NavigatorUtil.goNoteBookChangePage(
                        //                                   context,
                        //                                   NotebookDetail.fromTableManager(
                        //                                       tableManagerModel
                        //                                           .getCurrDdateStr(),
                        //                                       tableManagerModel
                        //                                           .currTimeIndex
                        //                                           .toString(),
                        //                                       table),
                        //                                   "");
                        //                               break;
                        //                             case 3: //停用，启用桌位
                        //                               Map<String, String>
                        //                                   params = {
                        //                                 "id": (table as t.Table)
                        //                                     .id,
                        //                                 "status": (table as t
                        //                                                 .Table)
                        //                                             .enable ==
                        //                                         "1"
                        //                                     ? "0"
                        //                                     : "1"
                        //                               };
                        //                               tableManagerModel
                        //                                   .setSwitchStatus(
                        //                                       context, params)
                        //                                   .then((value) {
                        //                                 if (value != null) {
                        //                                   (table as t.Table)
                        //                                           .enable =
                        //                                       ((int.parse((table as t.Table)
                        //                                                       .enable) +
                        //                                                   1) %
                        //                                               2)
                        //                                           .toString();
                        //                                   if ((table as t.Table)
                        //                                           .enable ==
                        //                                       "1") {
                        //                                     for (Area area
                        //                                         in tableManagerModel
                        //                                             .areas) {
                        //                                       if (area.name ==
                        //                                           tableManagerModel
                        //                                               .currentArea) {
                        //                                         if (table.sign !=
                        //                                                 '5' &&
                        //                                             table.sign !=
                        //                                                 '1') {
                        //                                           //已预订
                        //                                           area.count++;
                        //                                         }
                        //                                         break;
                        //                                       }
                        //                                     }
                        //                                   } else {
                        //                                     for (Area area
                        //                                         in tableManagerModel
                        //                                             .areas) {
                        //                                       if (area.name ==
                        //                                           tableManagerModel
                        //                                               .currentArea) {
                        //                                         if (table.sign !=
                        //                                                 '5' &&
                        //                                             table.sign !=
                        //                                                 '1') {
                        //                                           //已预订
                        //                                           area.count--;
                        //                                         }
                        //                                         break;
                        //                                       }
                        //                                     }
                        //                                   }
                        //                                   tableManagerModel
                        //                                       .notifyListeners();
                        //                                 }
                        //                               });
                        //                               break;
                        //                           }
                        //                         }
                        //                       });
                        //                     },
                        //                         canSelected: false,
                        //                         fromPage: 'table_manage',
                        //                         tableMap:
                        //                             tableManagerModel.tableMap,
                        //                         rid: "");
                        //                   },
                        //                 );
                        //               },
                        //               itemCount: tableManagerModel
                        //                   .currentTables.length,
                        //             )),
                        //           ],
                        //         )),
                        //   )
                        // ],
                      ]),
                    );
                  }
                },
              ),
            ),
          ],
        );
      },
    );
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    EventBus().off("refresh_tablemanager");
  }
}