Cambio de Estructura

lib/core/models/mesas_model.dart

@@ -0,0 +1,43 @@
+import 'package:flutter/material.dart';
+import 'package:turquessa_mesas_hoster/core/models/basico_model.dart';
+import 'package:turquessa_mesas_hoster/core/models/mesa_model.dart';
+
+// enum EstadoPedido {
+//   disponible,
+//   surtida,
+//   preparacion,
+//   cobrado,
+// }
+
+// class Mesas extends Basico {
+//   String? nombre;
+//   EstadoPedido? tipo;
+//   String? folio;
+
+//   Mesas({
+//     this.nombre,
+//     this.tipo,
+//     this.folio,
+//   });
+
+//   @override
+//   Map<String, dynamic> toJson() {
+//     return {
+//       'nombre': nombre ?? '',
+//       'tipo': tipo.toString(),
+//       'folio': folio ?? '',
+//     }..addAll(super.toJson());
+//   }
+// }
+class TableItem extends Basico {
+  final int id;
+  final String name;
+
+  final String status;
+
+  TableItem({
+    required this.id,
+    required this.name,
+    required this.status,
+  });
+}

lib/mvvm/viewmodels/home_view_model.dart

@@ -0,0 +1,11 @@
+import 'package:flutter/material.dart';
+
+class HomeViewModel extends ChangeNotifier {
+  int _selectedIndex = 0;
+  int get selectedIndex => _selectedIndex;
+
+  void setIndex(int index) {
+    _selectedIndex = index;
+    notifyListeners();
+  }
+}

lib/mvvm/views/home/home_screen.dart

@@ -1,9 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:turquessa_mesas_hoster/utils/widgets/custom_appbar.dart';
-import '../../../utils/widgets/widgets.dart';
-import 'package:flutter/material.dart';
-import 'package:provider/provider.dart';
-import '../../../utils/themes.dart';
+import 'package:turquessa_mesas_hoster/core/models/mesas_model.dart';
 
 class HomeScreen extends StatefulWidget {
   const HomeScreen({super.key});
@@ -58,20 +55,117 @@ class Formulario extends State<HomeScreen> {
               ),
             ],
           ),
-          const Expanded(
+          Expanded(
             child: Center(
-                child: Padding(padding: EdgeInsets.symmetric(vertical: 10)
-                    // child: GridView,
+                child: GridView.builder(
+                    gridDelegate:
+                        const SliverGridDelegateWithFixedCrossAxisCount(
+                            crossAxisCount: 4,
+                            childAspectRatio: 1.0,
+                            crossAxisSpacing: 10.0,
+                            mainAxisSpacing: 10.0),
+                    padding: const EdgeInsets.all(10),
+                    itemCount: 8,
+                    itemBuilder: (context, index) {
+                      return TableCard(
+                        icon: Icons.table_chart,
+                        color: Colors.blue,
+                        title: 'Mesa ${index + 1}',
+                      );
+                    })),
+          ),
+          // if (selectedTable != null)
+          Expanded(
+              flex: 1,
+              child: Container(
+                margin: const EdgeInsets.all(10),
+                decoration: BoxDecoration(
+                  color: Colors.white,
+                  borderRadius: BorderRadius.circular(10),
+                  boxShadow: [
+                    BoxShadow(
+                      color: Colors.grey.withOpacity(0.2),
+                      blurRadius: 5,
+                      spreadRadius: 1,
                     )
-
-                // child: Image(
-                //   image: AssetImage('assets/logo.png'),
-                //   height: 400,
-                // ),
+                  ],
                 ),
+                // child: TablaDetalles(table: selectedTable!),
+              )),
+        ],
+      ),
+    );
+  }
+}
+
+class TableCard extends StatelessWidget {
+  final IconData icon;
+  final Color color;
+  final String title;
+  const TableCard(
+      {super.key,
+      required this.icon,
+      required this.color,
+      required this.title});
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      color: color,
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: [
+          Icon(
+            icon,
+            size: 50,
+            color: Colors.white,
           ),
+          Text(
+            title,
+            style: const TextStyle(color: Colors.white, fontSize: 20),
+          )
         ],
       ),
     );
   }
 }
+
+class TableDetailsPanel extends StatelessWidget {
+  final TableItem table;
+
+  const TableDetailsPanel({
+    Key? key,
+    required this.table,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        // Encabezado del panel
+        Container(
+          padding: const EdgeInsets.all(16),
+          decoration: BoxDecoration(
+            borderRadius: const BorderRadius.vertical(top: Radius.circular(10)),
+          ),
+          child: Row(
+            children: [
+              Icon(Icons.person, color: Colors.white, size: 24),
+              const SizedBox(width: 8),
+              Text(
+                table.name,
+                style: const TextStyle(
+                  color: Colors.white,
+                  fontSize: 20,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+            ],
+          ),
+        ),
+        // Contenido específico según el tipo
+      ],
+    );
+  }
+}