manager-app/lib/Screens/Configurations/section_reorderList.dart

import 'package:flutter/material.dart';
import 'package:manager_app/Components/string_input_container.dart';
import 'package:manager_app/Models/managerContext.dart';
import 'package:manager_app/Screens/Configurations/listView_card_section.dart';
import 'package:manager_app/Screens/Configurations/new_section_popup.dart';
import 'package:manager_app/app_context.dart';
import 'package:manager_app/constants.dart';
import 'package:managerapi/api.dart';
import 'package:provider/provider.dart';

class SectionReorderList extends StatefulWidget {
  final String configurationId;
  final List<SectionDTO> sectionsIn;
  final ValueChanged<List<SectionDTO>> onChangedOrder;
  const SectionReorderList({
    Key key,
    this.configurationId,
    this.sectionsIn,
    this.onChangedOrder,
  }) : super(key: key);

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

class _SectionReorderListState extends State<SectionReorderList> {
  List<SectionDTO> sections;
  String filterSearch = '';

  @override
  void initState() {
    super.initState();
    sections = new List<SectionDTO>.from(widget.sectionsIn);
  }

  void _onReorder(int oldIndex, int newIndex) {
    setState(
        () {
          if (newIndex > oldIndex) {
            newIndex -= 1;
          }
          final SectionDTO item = sections.removeAt(oldIndex);
          sections.insert(newIndex, item);

          var i = 0;
          sections.forEach((section) {
            section.order = i;
            i++;
          });

          widget.onChangedOrder(sections);
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    final appContext = Provider.of<AppContext>(context);
    Size size = MediaQuery.of(context).size;

    ManagerAppContext managerAppContext = appContext.getContext();
    ConfigurationDTO currentConfiguration = managerAppContext.selectedConfiguration;

    return Stack(
      children: [
        Padding(
          padding: const EdgeInsets.only(left: 10.0, right: 10.0, bottom: 10.0, top: 15.0),
          child: Container(
            height: size.height*0.3,
            child: ReorderableListView.builder(
              itemCount: sections.length,
              onReorder: _onReorder,
              scrollDirection: Axis.horizontal,
              padding: const EdgeInsets.symmetric(vertical: 20.0),
              itemBuilder: (context, index) {
                //final String productName = _products[index];
                return ListViewCardSections(
                    sections,
                    index,
                    Key('$index'),
                    appContext,
                        (section) {
                      setState(() {
                        ManagerAppContext managerAppContext = appContext.getContext();
                        managerAppContext.selectedSection = section;
                        appContext.setContext(managerAppContext);
                      });
                    }
                );
              },
              /*children: List.generate(
                sections.length,
                    (index) {
                  return ListViewCardSections(
                      sections,
                      index,
                      Key('$index'),
                      appContext,
                      (section) {
                        setState(() {
                          ManagerAppContext managerAppContext = appContext.getContext();
                          managerAppContext.selectedSection = section;
                          appContext.setContext(managerAppContext);
                        });
                      }
                  );
                },
              ),*/
            ),
          ),
        ),
        Positioned(
          top: 10,
          left: 10,
          child: Text(
            "Sections",
            style: TextStyle(fontSize: 15),
          ),
        ),
        Positioned(
          bottom: -20,
          left: 10,
          child: Container(
            height: size.height*0.1,
            child: StringInputContainer(
              label: "Recherche:",
              isSmall: true,
              fontSize: 15,
              fontSizeText: 15,
              onChanged: (String value) {
                setState(() {
                  filterSearch = value;
                  filterResource();
                });
              },
            ),
          ),
        ),
        Positioned(
          bottom: 10,
          right: 10,
          child: InkWell(
            onTap: () {
              showNewSection(widget.configurationId, appContext, context, false, null, currentConfiguration.isMobile);
            },
            child: Container(
              height: MediaQuery.of(context).size.width * 0.04,
              width: MediaQuery.of(context).size.width * 0.04,
              child: Icon(
                Icons.add,
                color: kTextLightColor,
                size: 30.0,
              ),
              decoration: BoxDecoration(
                color: kSuccess,
                shape: BoxShape.rectangle,
                borderRadius: BorderRadius.circular(20.0),
                boxShadow: [
                  BoxShadow(
                    color: kSecond,
                    spreadRadius: 0.5,
                    blurRadius: 5,
                    offset: Offset(0, 1.5), // changes position of shadow
                  ),
                ],
              ),
            ),
          ),
        )
      ],
    );
  }

  void filterResource() {
    sections = filterSearch.isEmpty ? widget.sectionsIn: widget.sectionsIn.where((SectionDTO section) => section.label.toUpperCase().contains(filterSearch.toUpperCase())).toList();
  }
}