import 'package:driverapp/core/viewModels/orders_view_model.dart';
import 'package:driverapp/pages/delivery/information_page.dart';
import 'package:driverapp/widgets/others/app_scaffold_widget.dart';
import 'package:driverapp/widgets/others/rounded_container.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

import '../base/base_view.dart';

class OrdersListScreen extends StatefulWidget {
  @override
  _OrdersListScreenState createState() => _OrdersListScreenState();
}

class _OrdersListScreenState extends State<OrdersListScreen> {
  @override
  Widget build(BuildContext context) {
    return BaseView<OrdersViewModel>(
      onModelReady: (model) => model.getPendingOrders(),
      builder: (BuildContext context, OrdersViewModel model, Widget child) =>
          AppScaffold(
        isShowAppBar: true,
        appBarTitle: 'Your Delivery Que',
        titleColor: Colors.black,
        body: Column(
          children: <Widget>[
            Expanded(
              child: ListView.builder(
                shrinkWrap: true,
                scrollDirection: Axis.vertical,
                itemCount: model.orders == null ? 0 : model.orders.length,
                itemBuilder: (BuildContext context, int index) {
                  return Padding(
                    padding: EdgeInsets.symmetric(horizontal: 12.2),
                    child: InkWell(
                      child: RoundedContainer(
                        height: MediaQuery.of(context).size.height * 0.109,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: <Widget>[
                            Expanded(
                              flex: 1,
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  Padding(
                                    padding: EdgeInsets.only(
                                        left: 10.0, bottom: 5.0),
                                    child: Image.asset(
                                      'assets/images/location.png',
                                      height:
                                          MediaQuery.of(context).size.height *
                                              0.06,
                                      width: MediaQuery.of(context).size.width *
                                          0.05,
                                    ),
                                  )
                                ],
                              ),
                            ),
                            if (model.orders.length != 0)
                              Expanded(
                                flex: 3,
                                child: Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: <Widget>[
                                    Padding(
                                      padding: EdgeInsets.only(top: 5.0),
                                      child: Text(
                                        model.orders[index].firstName +
                                            ' ' +
                                            model.orders[index].lastName,
                                        style: TextStyle(fontSize: 18.0),
                                      ),
                                    ),
                                    Text(
                                      model.orders[index].mobileNumber,
                                      style: TextStyle(
                                        color: Color(0xff30B7B9),
                                        fontWeight: FontWeight.w600,
                                        fontSize: 15.0,
                                      ),
                                    ),
                                    Expanded(
                                      child: Text(
                                        'Olaya ST, Behind kfc next to king ,',
                                        style: TextStyle(color: Colors.black45),
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            Padding(
                              padding: EdgeInsets.all(10.0),
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  Expanded(
                                    child: CircleAvatar(
                                      backgroundColor: Colors.black45,
                                      radius: 28.0,
                                      child: CircleAvatar(
                                        backgroundColor: Colors.white,
                                        maxRadius: 24.1,
                                        child: Padding(
                                          padding: const EdgeInsets.all(8.0),
                                          child: Text(
                                            '3 K.m \n away',
                                            style: TextStyle(
                                                color: Color(0xff30B7B9),
                                                fontSize: 10.5,
                                                fontWeight: FontWeight.w400),
                                          ),
                                        ),
                                      ),
                                    ),
                                  )
                                ],
                              ),
                            ),
                          ],
                        ),
                      ),
                      onTap: () {
                        Navigator.push(
                            context,
                            MaterialPageRoute(
                                builder: (context) =>
                                    InformationPage(model.orders[index])));
                      },
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}
