change patient manager to use layout builder

Frontend/patient_manager/lib/mih_packages/patient_profile/builder/build_patient_list.dart

@@ -350,6 +350,7 @@ class _BuildPatientsListState extends State<BuildPatientsList> {
   @override
   Widget build(BuildContext context) {
     return ListView.separated(
+      shrinkWrap: true,
       separatorBuilder: (BuildContext context, index) {
         return Divider(
           color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/patient_manager/lib/mih_packages/patient_profile/builder/build_patient_queue_list.dart

@@ -165,6 +165,7 @@ class _BuildPatientsListState extends State<BuildPatientQueueList> {
   @override
   Widget build(BuildContext context) {
     return ListView.separated(
+      shrinkWrap: true,
       separatorBuilder: (BuildContext context, index) {
         return Divider(
           color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),

Frontend/patient_manager/lib/mih_packages/patient_profile/patient_manager.dart

@@ -4,6 +4,10 @@ import 'package:intl/intl.dart';
 
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
+import 'package:patient_manager/mih_components/mih_layout/mih_action.dart';
+import 'package:patient_manager/mih_components/mih_layout/mih_body.dart';
+import 'package:patient_manager/mih_components/mih_layout/mih_header.dart';
+import 'package:patient_manager/mih_components/mih_layout/mih_layout_builder.dart';
 import 'package:patient_manager/mih_packages/patient_profile/builder/build_patient_list.dart';
 import 'package:patient_manager/mih_packages/patient_profile/builder/build_patient_queue_list.dart';
 import 'package:patient_manager/mih_components/mih_pop_up_messages/mih_loading_circle.dart';
@@ -119,34 +123,14 @@ class _PatientManagerState extends State<PatientManager> {
 
   Widget displayPatientList(List<Patient> patientsList, String searchString) {
     if (searchString.isNotEmpty && searchString != "") {
-      return Container(
+      return BuildPatientsList(
-        height: 500,
-        decoration: BoxDecoration(
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-          borderRadius: BorderRadius.circular(25.0),
-          border: Border.all(
-            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            width: 3.0,
-          ),
-        ),
-        child: BuildPatientsList(
         patients: patientsList,
         signedInUser: widget.arguments.signedInUser,
         business: widget.arguments.business,
         arguments: widget.arguments,
-        ),
       );
     }
-    return Container(
+    return Center(
-      //height: 500,
-      decoration: BoxDecoration(
-        color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        borderRadius: BorderRadius.circular(25.0),
-        border: Border.all(
-            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            width: 3.0),
-      ),
-      child: Center(
       child: Text(
         "Enter ID or Medical Aid No. of Patient",
         style: TextStyle(
@@ -154,11 +138,10 @@ class _PatientManagerState extends State<PatientManager> {
             color: MzanziInnovationHub.of(context)!.theme.messageTextColor()),
         textAlign: TextAlign.center,
       ),
-      ),
     );
   }
 
-  Widget patientSearch(double w, double h) {
+  Widget patientSearch() {
     return KeyboardListener(
       focusNode: _focusNode,
       autofocus: true,
@@ -168,15 +151,13 @@ class _PatientManagerState extends State<PatientManager> {
           submitPatientForm();
         }
       },
-      child: SizedBox(
-        width: w,
-        height: h - 157,
       child: Column(mainAxisSize: MainAxisSize.max, children: [
-          const SizedBox(height: 5),
         const Text(
           "Patient Search",
           style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
         ),
+        Divider(color: MzanziInnovationHub.of(context)!.theme.secondaryColor()),
+
         //spacer
         const SizedBox(height: 10),
         MIHSearchField(
@@ -195,22 +176,7 @@ class _PatientManagerState extends State<PatientManager> {
           builder: (context, snapshot) {
             //print("patient Liust  ${snapshot.data}");
             if (snapshot.connectionState == ConnectionState.waiting) {
-                return Expanded(
+              return const Mihloadingcircle();
-                  child: Container(
-                    //height: 500,
-                    decoration: BoxDecoration(
-                      color:
-                          MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                      borderRadius: BorderRadius.circular(25.0),
-                      border: Border.all(
-                          color: MzanziInnovationHub.of(context)!
-                              .theme
-                              .secondaryColor(),
-                          width: 3.0),
-                    ),
-                    child: const Mihloadingcircle(),
-                  ),
-                );
             } else if (snapshot.connectionState == ConnectionState.done &&
                 snapshot.hasData) {
               List<Patient> patientsList;
@@ -222,74 +188,35 @@ class _PatientManagerState extends State<PatientManager> {
                 //print(patientsList);
               }
 
-                return Expanded(
+              return displayPatientList(patientsList, searchString);
-                  child: displayPatientList(patientsList, searchString),
-                );
             } else {
-                return Expanded(
+              return Center(
-                  child: Container(
-                    //height: 500,
-                    decoration: BoxDecoration(
-                      color:
-                          MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                      borderRadius: BorderRadius.circular(25.0),
-                      border: Border.all(
-                          color: MzanziInnovationHub.of(context)!
-                              .theme
-                              .secondaryColor(),
-                          width: 3.0),
-                    ),
-                    child: Center(
                 child: Text(
                   "$errorCode: Error pulling Patients Data\n$baseUrl/patients/search/$searchString\n$errorBody",
                   style: TextStyle(
                       fontSize: 25,
-                            color: MzanziInnovationHub.of(context)!
+                      color:
-                                .theme
+                          MzanziInnovationHub.of(context)!.theme.errorColor()),
-                                .errorColor()),
                   textAlign: TextAlign.center,
                 ),
-                    ),
-                  ),
               );
             }
           },
         ),
       ]),
-      ),
     );
   }
 
   Widget displayQueueList(List<PatientQueue> patientQueueList) {
     if (patientQueueList.isNotEmpty) {
-      return Container(
+      return BuildPatientQueueList(
-        height: 500,
-        decoration: BoxDecoration(
-          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-          borderRadius: BorderRadius.circular(25.0),
-          border: Border.all(
-            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            width: 3.0,
-          ),
-        ),
-        child: BuildPatientQueueList(
         patientQueue: patientQueueList,
         signedInUser: widget.arguments.signedInUser,
         business: widget.arguments.business,
         businessUser: widget.arguments.businessUser,
-        ),
       );
     }
-    return Container(
+    return Center(
-      height: 500,
-      decoration: BoxDecoration(
-        color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
-        borderRadius: BorderRadius.circular(25.0),
-        border: Border.all(
-            color: MzanziInnovationHub.of(context)!.theme.secondaryColor(),
-            width: 3.0),
-      ),
-      child: Center(
       child: Text(
         "No Appointments for $formattedDate",
         style: TextStyle(
@@ -297,20 +224,17 @@ class _PatientManagerState extends State<PatientManager> {
             color: MzanziInnovationHub.of(context)!.theme.messageTextColor()),
         textAlign: TextAlign.center,
       ),
-      ),
     );
   }
 
-  Widget patientQueue(double w, double h) {
+  Widget patientQueue() {
-    return SizedBox(
+    return Column(mainAxisSize: MainAxisSize.max, children: [
-      width: w,
-      height: h - 157,
-      child: Column(mainAxisSize: MainAxisSize.max, children: [
       //const SizedBox(height: 15),
       const Text(
         "Waiting Room",
         style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
       ),
+      Divider(color: MzanziInnovationHub.of(context)!.theme.secondaryColor()),
       const SizedBox(height: 10),
       MIHDateField(
         controller: queueDateController,
@@ -324,22 +248,7 @@ class _PatientManagerState extends State<PatientManager> {
         builder: (context, snapshot) {
           //print("patient Queue List  ${snapshot.hasData}");
           if (snapshot.connectionState == ConnectionState.waiting) {
-              return Expanded(
+            return const Mihloadingcircle();
-                child: Container(
-                  height: 500,
-                  decoration: BoxDecoration(
-                    color:
-                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                    borderRadius: BorderRadius.circular(25.0),
-                    border: Border.all(
-                        color: MzanziInnovationHub.of(context)!
-                            .theme
-                            .secondaryColor(),
-                        width: 3.0),
-                  ),
-                  child: const Mihloadingcircle(),
-                ),
-              );
           } else if (snapshot.connectionState == ConnectionState.done) {
             List<PatientQueue> patientQueueList;
             // if (searchString == "") {
@@ -350,41 +259,21 @@ class _PatientManagerState extends State<PatientManager> {
             //   print(patientQueueList);
             // }
 
-              return Expanded(
+            return displayQueueList(patientQueueList);
-                child: displayQueueList(patientQueueList),
-              );
           } else {
-              return Expanded(
+            return Center(
-                child: Container(
-                  //height: 500,
-                  decoration: BoxDecoration(
-                    color:
-                        MzanziInnovationHub.of(context)!.theme.primaryColor(),
-                    borderRadius: BorderRadius.circular(25.0),
-                    border: Border.all(
-                        color: MzanziInnovationHub.of(context)!
-                            .theme
-                            .secondaryColor(),
-                        width: 3.0),
-                  ),
-                  child: Center(
               child: Text(
                 "$errorCode: Error pulling Patients Data\n$baseUrl/patients/search/$searchString\n$errorBody",
                 style: TextStyle(
                     fontSize: 25,
-                          color: MzanziInnovationHub.of(context)!
+                    color: MzanziInnovationHub.of(context)!.theme.errorColor()),
-                              .theme
-                              .errorColor()),
                 textAlign: TextAlign.center,
               ),
-                  ),
-                ),
             );
           }
         },
       ),
-      ]),
+    ]);
-    );
   }
 
   void refreshQueue() {
@@ -425,59 +314,34 @@ class _PatientManagerState extends State<PatientManager> {
     }
   }
 
-  Widget showSelection(int index, double screenWidth, double screenHeight) {
+  Widget showSelection(int index) {
     if (index == 0) {
       return SizedBox(
         //width: 660,
-        child: patientQueue(screenWidth, screenHeight),
+        child: patientQueue(),
       );
     } else {
       return SizedBox(
         //width: 660,
-        child: patientSearch(screenWidth, screenHeight),
+        child: patientSearch(),
       );
     }
   }
 
-  @override
+  MIHAction getActionButton() {
-  void dispose() {
+    return MIHAction(
-    searchController.dispose();
+      icon: Icons.arrow_back,
-    queueDateController.dispose();
+      iconSize: 35,
-    super.dispose();
+      onTap: () {
+        Navigator.of(context).pop();
+      },
+    );
   }
 
-  @override
+  MIHHeader getHeader() {
-  void initState() {
+    return MIHHeader(
-    patientSearchResults = fetchPatients("abc");
+      headerAlignment: MainAxisAlignment.end,
-    queueDateController.addListener(checkforchange);
+      headerItems: [
-    setState(() {
-      formattedDate = formatter.format(now);
-      queueDateController.text = formattedDate;
-    });
-
-    super.initState();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final screenWidth = MediaQuery.of(context).size.width;
-    final screenHeight = MediaQuery.of(context).size.height;
-    return Scaffold(
-      // appBar: const MIHAppBar(
-      //   barTitle: "Patient Manager",
-      //   propicFile: null,
-      // ),
-      body: Stack(
-        children: [
-          Column(
-            mainAxisAlignment: MainAxisAlignment.start,
-            crossAxisAlignment: CrossAxisAlignment.center,
-            children: [
-              const SizedBox(height: 5),
-              Row(
-                crossAxisAlignment: CrossAxisAlignment.end,
-                mainAxisAlignment: MainAxisAlignment.end,
-                children: [
         IconButton(
           onPressed: () {
             setState(() {
@@ -510,27 +374,115 @@ class _PatientManagerState extends State<PatientManager> {
           ),
         ),
       ],
-              ),
-              Padding(
-                padding: EdgeInsets.symmetric(horizontal: 15),
-                child: showSelection(_selectedIndex, screenWidth, screenHeight),
-              ),
-            ],
-          ),
-          Positioned(
-            top: 5,
-            left: 5,
-            width: 50,
-            height: 50,
-            child: IconButton(
-              onPressed: () {
-                Navigator.of(context).pop();
-              },
-              icon: const Icon(Icons.arrow_back),
-            ),
-          )
-        ],
-      ),
     );
   }
+
+  MIHBody getBody() {
+    return MIHBody(
+      borderOn: true,
+      bodyItems: [
+        showSelection(_selectedIndex),
+      ],
+    );
+  }
+
+  @override
+  void dispose() {
+    searchController.dispose();
+    queueDateController.dispose();
+    super.dispose();
+  }
+
+  @override
+  void initState() {
+    patientSearchResults = fetchPatients("abc");
+    queueDateController.addListener(checkforchange);
+    setState(() {
+      formattedDate = formatter.format(now);
+      queueDateController.text = formattedDate;
+    });
+
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+    final screenHeight = MediaQuery.of(context).size.height;
+    return MIHLayoutBuilder(
+      actionButton: getActionButton(),
+      header: getHeader(),
+      body: getBody(),
+    );
+    // return Scaffold(
+    //   // appBar: const MIHAppBar(
+    //   //   barTitle: "Patient Manager",
+    //   //   propicFile: null,
+    //   // ),
+    //   body: Stack(
+    //     children: [
+    //       Column(
+    //         mainAxisAlignment: MainAxisAlignment.start,
+    //         crossAxisAlignment: CrossAxisAlignment.center,
+    //         children: [
+    //           const SizedBox(height: 5),
+    //           Row(
+    //             crossAxisAlignment: CrossAxisAlignment.end,
+    //             mainAxisAlignment: MainAxisAlignment.end,
+    //             children: [
+    //               IconButton(
+    //                 onPressed: () {
+    //                   setState(() {
+    //                     _selectedIndex = 0;
+    //                   });
+    //                 },
+    //                 icon: const Icon(
+    //                   Icons.people,
+    //                   size: 35,
+    //                 ),
+    //               ),
+    //               IconButton(
+    //                 onPressed: () {
+    //                   setState(() {
+    //                     _selectedIndex = 1;
+    //                   });
+    //                 },
+    //                 icon: const Icon(
+    //                   Icons.search,
+    //                   size: 35,
+    //                 ),
+    //               ),
+    //               IconButton(
+    //                 onPressed: () {
+    //                   refreshQueue();
+    //                 },
+    //                 icon: const Icon(
+    //                   Icons.refresh,
+    //                   size: 35,
+    //                 ),
+    //               ),
+    //             ],
+    //           ),
+    //           Padding(
+    //             padding: EdgeInsets.symmetric(horizontal: 15),
+    //             child: showSelection(_selectedIndex, screenWidth, screenHeight),
+    //           ),
+    //         ],
+    //       ),
+    //       Positioned(
+    //         top: 5,
+    //         left: 5,
+    //         width: 50,
+    //         height: 50,
+    //         child: IconButton(
+    //           onPressed: () {
+    //             Navigator.of(context).pop();
+    //           },
+    //           icon: const Icon(Icons.arrow_back),
+    //         ),
+    //       )
+    //     ],
+    //   ),
+    // );
+  }
 }