ServiceParkingPage.dart

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'dart:async';

class ServiceParkingPage extends StatefulWidget {

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

class _ServiceParkingPage extends State<ServiceParkingPage> {
  int _counter = 0;
  String dropdownValue1 = "Empty";
  String dropdownValue2 = "Near to far";
  String dropdownValue3 = "Low to high";
  List<ParkingItem> _parkingList;
  List<ParkingItem> sortedList;
  List<ParkingItem> backup = [];
  TextEditingController textController = new TextEditingController();

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  void _fetchData() async {
    var data = await http.get("http://157.230.131.4/gda-api-dev/parking.php");

    var jsonData = json.decode(data.body);

    List<ParkingItem> parkingList = [];

    for (var u in jsonData) {
      ParkingItem item = ParkingItem(u["location"], double.parse(u["distance"]),
          double.parse(u["price"]), u["availability"]);
      parkingList.add(item);
    }

    setState(() {
      _parkingList = parkingList;
    });
  }

  Future<List<ParkingItem>> _getParkingList() async {
    var data = _parkingList;
    backup.addAll(_parkingList);
    return _parkingList;
  }

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

  onSearchTextChanged(String input) async {
    List<ParkingItem> dummySearchList = List<ParkingItem>();
    dummySearchList.addAll(_parkingList);

    if (input.isNotEmpty){
      List<ParkingItem> dummy = List<ParkingItem>();
      dummySearchList.forEach((item){
        if (item.location.toLowerCase().contains(input.toLowerCase())){
          dummy.add(item);
        }
      });

      setState((){
        _parkingList.clear();
        _parkingList.addAll(dummy);
      });
      return;
    }
    else {
      setState(() {
        _parkingList.clear();
        _parkingList.addAll(backup);
      });
    }
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Parking'),
      ),
      body: Container(
          child: SafeArea(
              child: Padding (
                padding: const EdgeInsets.all(16.0),
                child: Column (
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: <Widget>[
                      SizedBox(
                        height: 120,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceAround,
                          children: <Widget>[
                            Expanded(
                              child: Card(
                                child: new ListTile(
                                  leading: new Icon(Icons.search),
                                  title: new TextField(
                                    controller: textController,
                                    decoration: new InputDecoration(
                                        hintText: 'Search', border: InputBorder.none),
                                    onChanged: onSearchTextChanged,
                                  ),
                                  trailing: new IconButton(icon: new Icon(Icons.cancel), onPressed: () {
                                    textController.clear();
                                    onSearchTextChanged('');
                                  },),
                                ),
                              ),
                            ),
                            SizedBox(
//                      height: 120,
                              child: Row(
                                children: <Widget>[
                                  Expanded(
                                    child: Padding(
                                      padding: const EdgeInsets.symmetric(horizontal: 3),
                                      child: DropdownButton<String>(
                                          value: dropdownValue1,
                                          onChanged: (String newValue) {
                                            setState(() {
                                              dropdownValue1 = newValue;
                                            });
                                          },
                                          items: <String>['Empty', 'Crowded']
                                              .map<DropdownMenuItem<String>>((String value) {
                                            return DropdownMenuItem<String>(
                                              value: value,
                                              child: Text(value),
                                            );
                                          })
                                              .toList(), isExpanded: false, hint: Text("Brand")
                                      ),
                                    ),
                                  ),

                                  Expanded(
                                    child: Padding(
                                      padding: const EdgeInsets.symmetric(horizontal: 3),
                                      child: DropdownButton<String>(
                                          value: dropdownValue2,
                                          onChanged: (String newValue) {
                                            setState(() {
                                              dropdownValue2 = newValue;

                                              if (dropdownValue2 == "Near to far"){
                                                sortedList = _parkingList;
                                                sortedList.sort((a,b) => a.distance.compareTo(b.distance));
                                              }
                                              else {
                                                sortedList = _parkingList;
                                                sortedList.sort((a,b) => b.distance.compareTo(a.distance));
                                              }
                                            });
                                          },
                                          items: <String>['Near to far', 'Far to near']
                                              .map<DropdownMenuItem<String>>((String value) {
                                            return DropdownMenuItem<String>(
                                              value: value,
                                              child: Text(value),
                                            );
                                          })
                                              .toList(), hint: Text("Location")
                                      ),
                                    ),
                                  ),

                                  Expanded(
                                    child: Padding(
                                      padding: const EdgeInsets.symmetric(horizontal: 3),
                                      child: DropdownButton<String>(
                                          value: dropdownValue3,
                                          onChanged: (String newValue) {
                                            setState(() {
                                              dropdownValue3 = newValue;

                                              if (dropdownValue3 == "Low to high"){
                                                sortedList = _parkingList;
                                                sortedList.sort((a,b) => a.price.compareTo(b.price));
                                              }
                                              else {
                                                sortedList = _parkingList;
                                                sortedList.sort((a,b) => b.price.compareTo(a.price));
                                              }
                                            });
                                          },
                                          items: <String>['Low to high', 'High to low']
                                              .map<DropdownMenuItem<String>>((String value) {
                                            return DropdownMenuItem<String>(
                                              value: value,
                                              child: Text(value),
                                            );
                                          })
                                              .toList(), hint: Text("Facilities")
                                      ),
                                    ),
                                  ),

                                ],
                              ),
                            ),

                            new Text(
                                "All brands > Wan Chai Stn > Cheapest", style: TextStyle(fontWeight: FontWeight.bold)
                            ),

                          ],
                        ),
                      ),
                   new Expanded(child: FutureBuilder(
                  future: _getParkingList(),
                  builder: (BuildContext context, AsyncSnapshot snapshot) {
                    if (snapshot.data == null) {
                      return Container(
                          child: Center(
                            child: new Column(
                              mainAxisSize: MainAxisSize.min,
                              children: [
                                new CircularProgressIndicator(),
                                new Text("Loading..."),
                              ],
                            ),
                          ));
                    }

                    return ListView.builder(
                        itemBuilder: (context, position) {
                          return Column(
                            children: <Widget>[
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: <Widget>[
                                  Column(
                                    crossAxisAlignment: CrossAxisAlignment.start,
                                    children: <Widget>[
                                      Padding(
                                        padding:
                                        const EdgeInsets.fromLTRB(12.0, 6.0, 12.0, 12.0),
                                        child: Text(
                                          _parkingList[position].location,
                                          style: TextStyle(fontSize: 18.0, fontWeight: FontWeight.bold),
                                        ),
                                      ),
                                      Padding(
                                        padding:
                                        const EdgeInsets.fromLTRB(12.0, 6.0, 12.0, 12.0),
                                        child: Text(
                                          _parkingList[position].distance.toString()+"KM",
                                          style: TextStyle(fontSize: 18.0),
                                        ),
                                      ),
                                    ],
                                  ),
                                  Padding(
                                    padding: const EdgeInsets.all(8.0),
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                      children: <Widget>[
                                        Text(
                                          "\$"+ _parkingList[position].price.toString(),
                                          style: TextStyle(color: Colors.grey),
                                        ),
                                        Padding(
                                          padding: const EdgeInsets.all(8.0),
                                          child:   Text(
                                            _parkingList[position].availability.toString(),
                                            style: TextStyle(color: Colors.grey),
                                          ),
                                        ),
                                      ],
                                    ),
                                  ),
                                ],
                              ),
                              Divider(
                                height: 2.0,
                                color: Colors.grey,
                              )
                            ],
                          );
                        },
                        itemCount: _parkingList.length
                    );
                  },
                ))
                    ]),
              )
          )
      ),

    );
  }
}

class ParkingItem {
  final String location;
  final double distance;
  final double price;
  final String availability;

  ParkingItem(this.location, this.distance, this.price, this.availability);

  String toString() {
    return "$location";
  }
}