diplomatic-quarter/lib/pages/ToDoList/widgets/upcomingCard.dart

import 'package:diplomaticquarterapp/pages/MyAppointments/AppointmentDetails.dart';
import 'package:flutter/material.dart';
import 'package:rating_bar/rating_bar.dart';

class TodoListCard extends StatefulWidget {
  @override
  _TodoListCardState createState() => _TodoListCardState();
}

class _TodoListCardState extends State<TodoListCard> {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.all(10.0),
      child: Card(
        margin: EdgeInsets.fromLTRB(8.0, 16.0, 8.0, 8.0),
        color: Colors.white,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10),
        ),
        child: Container(
          width: MediaQuery.of(context).size.width,
          padding: EdgeInsets.all(10.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Row(
                children: <Widget>[
                  Image.asset("assets/images/new-design/time_icon.png",
                      width: 20.0, height: 20.0),
                  Container(
                    margin: EdgeInsets.only(left: 10.0, right: 30.0),
                    child: Text("Monday, 31 August 2020 09:30",
                        style: TextStyle(fontSize: 12.0)),
                  ),
                  Image.asset(
                      "assets/images/new-design/hospital_address_icon.png",
                      width: 20.0,
                      height: 20.0),
                  Container(
                    margin: EdgeInsets.only(left: 10.0, right: 10.0),
                    child: Text("Olaya Hospital",
                        style: TextStyle(fontSize: 12.0)),
                  ),
                ],
              ),
              Container(
                margin: EdgeInsets.only(top: 5.0),
                child: Divider(
                  color: Colors.grey[500],
                ),
              ),
              Flex(
                direction: Axis.horizontal,
                children: <Widget>[
                  Expanded(
                    flex: 1,
                    child: Container(
                      height: MediaQuery.of(context).size.height * 0.1,
                      margin: EdgeInsets.only(top: 5.0),
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(100.0),
                        child: Image.network(
                            "https://hmgwebservices.com/Images/MobileImages/OALAY/2477.png",
                            fit: BoxFit.fill),
                      ),
                    ),
                  ),
                  Expanded(
                    flex: 3,
                    child: Container(
                      margin:
                          EdgeInsets.only(top: 20.0, left: 20.0, right: 20.0),
                      height: MediaQuery.of(context).size.height * 0.1,
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Text("Dr. EYAD ISMAIL ABU-JAYAD",
                              style: TextStyle(
                                  fontSize: 14.0,
                                  color: Colors.black,
                                  fontWeight: FontWeight.bold,
                                  letterSpacing: 1.0)),
                          Container(
                            margin: EdgeInsets.only(top: 3.0, bottom: 3.0),
                            child: Text("General Practioner",
                                style: TextStyle(
                                    fontSize: 12.0,
                                    color: Colors.grey[600],
                                    letterSpacing: 1.0)),
                          ),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            mainAxisSize: MainAxisSize.max,
                            children: <Widget>[
                              RatingBar.readOnly(
                                initialRating: 4.0,
                                size: 20.0,
                                filledColor: Colors.yellow[700],
                                emptyColor: Colors.grey[500],
                                isHalfAllowed: true,
                                halfFilledIcon: Icons.star_half,
                                filledIcon: Icons.star,
                                emptyIcon: Icons.star,
                              ),
                            ],
                          ),
                        ],
                      ),
                    ),
                  ),
                  Expanded(
                    flex: 1,
                    child: Container(
                      height: MediaQuery.of(context).size.height * 0.1,
                      margin: EdgeInsets.only(top: 20.0),
                      child: Column(
                        children: <Widget>[
                          Image.asset(
                              "assets/images/new-design/confirm_button.png",
                              width: 50.0,
                              height: 50.0),
                          Container(
                            margin: EdgeInsets.only(top: 5.0),
                            child: Text("Confirm",
                                textAlign: TextAlign.center,
                                style: TextStyle(fontSize: 12.0)),
                          )
                        ],
                      ),
                    ),
                  )
                ],
              ),
              Divider(
                color: Colors.grey[500],
              ),
              Flex(
                direction: Axis.horizontal,
                children: <Widget>[
                  Expanded(
                    flex: 2,
                    child: Container(
                      child: Text(
                          "Please confirm the appointment to avoid cancellation",
                          style: TextStyle(
                              fontSize: 12.0, color: Colors.grey[700])),
                    ),
                  ),
                  Expanded(
                    flex: 1,
                    child: GestureDetector(
                      onTap: () {
                        navigateToAppointmentDetails(context);
                      },
                      child: Container(
                        child: Text("More Details",
                            textAlign: TextAlign.end,
                            style: TextStyle(
                                fontSize: 12.0,
                                color: Colors.red[600],
                                decoration: TextDecoration.underline)),
                      ),
                    ),
                  )
                ],
              )
            ],
          ),
        ),
      ),
    );
  }

  Future navigateToAppointmentDetails(context) async {
    Navigator.push(
        context, MaterialPageRoute(builder: (context) => AppointmentDetails()));
  }

}