|
|
@@ -1,5 +1,10 @@
|
|
|
import 'package:flutter/material.dart';
|
|
|
+import 'package:provider/provider.dart';
|
|
|
+import 'package:turquessa_mesas_hoster/core/models/producto_model.dart';
|
|
|
+import 'package:turquessa_mesas_hoster/mvvm/viewmodels/creacion_pedido_view_model.dart';
|
|
|
+import 'package:turquessa_mesas_hoster/utils/themes.dart';
|
|
|
import 'package:turquessa_mesas_hoster/utils/widgets/custom_appbar.dart';
|
|
|
+import 'package:turquessa_mesas_hoster/utils/widgets/custom_card.dart';
|
|
|
import 'package:turquessa_mesas_hoster/utils/widgets/navigation_rail.dart';
|
|
|
|
|
|
class CreacionPedido extends StatefulWidget {
|
|
|
@@ -10,10 +15,19 @@ class CreacionPedido extends StatefulWidget {
|
|
|
}
|
|
|
|
|
|
class _CreacionPedidoState extends State<CreacionPedido> {
|
|
|
+ @override
|
|
|
+ void initState() {
|
|
|
+ // TODO: implement initState
|
|
|
+ super.initState();
|
|
|
+ }
|
|
|
+
|
|
|
final _selectedIndex = 0;
|
|
|
|
|
|
@override
|
|
|
Widget build(BuildContext context) {
|
|
|
+ CreacionPedidoViewModel creacionPedidoViewModel =
|
|
|
+ Provider.of<CreacionPedidoViewModel>(context, listen: true);
|
|
|
+ List<Producto> listaPedido = creacionPedidoViewModel.productosDisponibles;
|
|
|
return Container(
|
|
|
decoration: const BoxDecoration(
|
|
|
gradient: LinearGradient(
|
|
|
@@ -21,8 +35,8 @@ class _CreacionPedidoState extends State<CreacionPedido> {
|
|
|
end: Alignment.topLeft,
|
|
|
colors: [
|
|
|
Color(0xFF7FD4D4),
|
|
|
- Color(0xFFE5E5E5),
|
|
|
- Color(0xFFFFFFFF),
|
|
|
+ Color.fromARGB(255, 141, 225, 225),
|
|
|
+ Color.fromARGB(255, 74, 156, 156),
|
|
|
])),
|
|
|
child: Scaffold(
|
|
|
backgroundColor: Colors.transparent,
|
|
|
@@ -33,55 +47,150 @@ class _CreacionPedidoState extends State<CreacionPedido> {
|
|
|
children: [
|
|
|
CustomNavigationRail(selectedIndex: _selectedIndex),
|
|
|
Expanded(
|
|
|
- flex: 5,
|
|
|
+ flex: 8,
|
|
|
child: Container(
|
|
|
- decoration: BoxDecoration(
|
|
|
- borderRadius: BorderRadius.circular(20),
|
|
|
+ decoration: const BoxDecoration(
|
|
|
color: Colors.white,
|
|
|
),
|
|
|
- child: Column(
|
|
|
+ child: const Column(
|
|
|
children: [
|
|
|
- const CategoryFilters(),
|
|
|
- Expanded(
|
|
|
- child: Container(
|
|
|
- padding: const EdgeInsets.all(8),
|
|
|
- child: GridView.builder(
|
|
|
- gridDelegate:
|
|
|
- const SliverGridDelegateWithFixedCrossAxisCount(
|
|
|
- crossAxisCount: 4,
|
|
|
- crossAxisSpacing: 10,
|
|
|
- mainAxisSpacing: 10,
|
|
|
- ),
|
|
|
- itemCount: 20,
|
|
|
- itemBuilder: (context, index) {
|
|
|
- return Container(
|
|
|
- decoration: BoxDecoration(
|
|
|
- color: Colors.grey.shade200,
|
|
|
- borderRadius: BorderRadius.circular(20),
|
|
|
- ),
|
|
|
- child: Center(
|
|
|
- child: Text(
|
|
|
- 'Item $index',
|
|
|
- style: const TextStyle(fontSize: 20),
|
|
|
- ),
|
|
|
- ),
|
|
|
- );
|
|
|
- },
|
|
|
- ),
|
|
|
- ),
|
|
|
- ),
|
|
|
+ CategoryFilters(),
|
|
|
+ CategoryGrid(),
|
|
|
],
|
|
|
),
|
|
|
),
|
|
|
),
|
|
|
Expanded(
|
|
|
- flex: 3,
|
|
|
+ flex: 4,
|
|
|
child: Container(
|
|
|
- decoration: BoxDecoration(
|
|
|
- borderRadius: BorderRadius.circular(20),
|
|
|
+ decoration: const BoxDecoration(
|
|
|
color: Colors.white,
|
|
|
),
|
|
|
- child: const Text("test"),
|
|
|
+ child: Padding(
|
|
|
+ padding: const EdgeInsets.all(8.0),
|
|
|
+ child: Column(
|
|
|
+ crossAxisAlignment: CrossAxisAlignment.start,
|
|
|
+ children: [
|
|
|
+ const Padding(
|
|
|
+ padding: EdgeInsets.only(left: 10),
|
|
|
+ child: Text(
|
|
|
+ "Mesa 3: Palmeras",
|
|
|
+ textAlign: TextAlign.start,
|
|
|
+ style: TextStyle(
|
|
|
+ fontSize: 40,
|
|
|
+ fontWeight: FontWeight.bold,
|
|
|
+ color: Colors.black),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ const Divider(),
|
|
|
+ // En el DataTable
|
|
|
+ SingleChildScrollView(
|
|
|
+ scrollDirection: Axis.horizontal,
|
|
|
+ child: SingleChildScrollView(
|
|
|
+ scrollDirection: Axis.vertical,
|
|
|
+ child: DataTable(
|
|
|
+ columnSpacing: 16,
|
|
|
+ horizontalMargin: 12,
|
|
|
+ dataRowHeight: 60,
|
|
|
+ headingRowHeight: 48,
|
|
|
+ columns: const <DataColumn>[
|
|
|
+ DataColumn(label: Text('Cant')),
|
|
|
+ DataColumn(label: Text('Nombre')),
|
|
|
+ DataColumn(label: Text('SubTotal')),
|
|
|
+ DataColumn(label: Text('Acciones')),
|
|
|
+ ],
|
|
|
+ rows: creacionPedidoViewModel
|
|
|
+ .carrito // Aquí usamos la lista de carrito
|
|
|
+ .map(
|
|
|
+ (e) => DataRow(cells: [
|
|
|
+ DataCell(
|
|
|
+ Text(e.venta.toString()),
|
|
|
+ ),
|
|
|
+ DataCell(Text(e.nombre!)),
|
|
|
+ DataCell(
|
|
|
+ Text((e.precio! * e.venta!)
|
|
|
+ .toStringAsFixed(2)),
|
|
|
+ ),
|
|
|
+ DataCell(IconButton(
|
|
|
+ color: Colors.grey[600],
|
|
|
+ icon: const Icon(Icons.edit),
|
|
|
+ onPressed: () {
|
|
|
+ creacionPedidoViewModel
|
|
|
+ .eliminarDelCarrito(e);
|
|
|
+ },
|
|
|
+ )),
|
|
|
+ ]),
|
|
|
+ )
|
|
|
+ .toList(),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ Expanded(
|
|
|
+ child: Column(
|
|
|
+ children: [
|
|
|
+ const SizedBox(
|
|
|
+ height: 100,
|
|
|
+ width: double.infinity,
|
|
|
+ ),
|
|
|
+ const Divider(),
|
|
|
+ Row(
|
|
|
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
|
+ children: [
|
|
|
+ const Text(
|
|
|
+ "Total",
|
|
|
+ style: TextStyle(
|
|
|
+ fontSize: 20,
|
|
|
+ fontWeight: FontWeight.bold),
|
|
|
+ ),
|
|
|
+ Text(
|
|
|
+ "\$${creacionPedidoViewModel.calcularTotalCarrito().toStringAsFixed(2)}",
|
|
|
+ style: const TextStyle(
|
|
|
+ fontSize: 20,
|
|
|
+ fontWeight: FontWeight.bold),
|
|
|
+ ),
|
|
|
+ ],
|
|
|
+ ),
|
|
|
+ const SizedBox(height: 10),
|
|
|
+ Row(
|
|
|
+ children: [
|
|
|
+ Expanded(
|
|
|
+ flex: 9,
|
|
|
+ child: ElevatedButton(
|
|
|
+ style: const ButtonStyle(
|
|
|
+ backgroundColor: MaterialStatePropertyAll(
|
|
|
+ Colors.green),
|
|
|
+ ),
|
|
|
+ onPressed: () {},
|
|
|
+ child: const Text(
|
|
|
+ "Mandar a Preparacion",
|
|
|
+ style: TextStyle(color: Colors.white),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ Expanded(
|
|
|
+ flex: 1,
|
|
|
+ child: IconButton(
|
|
|
+ style: const ButtonStyle(
|
|
|
+ backgroundColor:
|
|
|
+ MaterialStatePropertyAll(
|
|
|
+ Colors.white),
|
|
|
+ iconColor: MaterialStatePropertyAll(
|
|
|
+ Colors.red)),
|
|
|
+ icon: const Icon(Icons.delete,
|
|
|
+ color: Colors.red),
|
|
|
+ onPressed: () {
|
|
|
+ creacionPedidoViewModel.limpiarCarrito();
|
|
|
+ },
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ ],
|
|
|
+ ),
|
|
|
+ ],
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ ],
|
|
|
+ ),
|
|
|
+ ),
|
|
|
),
|
|
|
)
|
|
|
],
|
|
|
@@ -91,6 +200,121 @@ class _CreacionPedidoState extends State<CreacionPedido> {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+class CategoryGrid extends StatelessWidget {
|
|
|
+ const CategoryGrid({
|
|
|
+ super.key,
|
|
|
+ });
|
|
|
+
|
|
|
+ @override
|
|
|
+ Widget build(BuildContext context) {
|
|
|
+ CreacionPedidoViewModel creacionPedidoViewModel =
|
|
|
+ Provider.of<CreacionPedidoViewModel>(context);
|
|
|
+ List<Producto> listaProductos =
|
|
|
+ creacionPedidoViewModel.productosDisponibles;
|
|
|
+ return Expanded(
|
|
|
+ child: Container(
|
|
|
+ padding: const EdgeInsets.all(8),
|
|
|
+ child: GridView.builder(
|
|
|
+ gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
|
|
+ crossAxisCount: 3,
|
|
|
+ crossAxisSpacing: 10,
|
|
|
+ mainAxisSpacing: 15,
|
|
|
+ ),
|
|
|
+ itemCount: listaProductos.length,
|
|
|
+ itemBuilder: (context, index) {
|
|
|
+ int carritoIndex = creacionPedidoViewModel.carrito
|
|
|
+ .indexWhere((p) => p.id == listaProductos[index].id);
|
|
|
+ int cantidad = carritoIndex != -1
|
|
|
+ ? creacionPedidoViewModel.carrito[carritoIndex].venta!
|
|
|
+ : 0;
|
|
|
+
|
|
|
+ return Card(
|
|
|
+ shadowColor: Colors.grey.shade700,
|
|
|
+ surfaceTintColor: Colors.white,
|
|
|
+ child: Column(children: [
|
|
|
+ Padding(
|
|
|
+ padding: const EdgeInsets.all(3),
|
|
|
+ child: Container(
|
|
|
+ height: 140,
|
|
|
+ width: double.infinity,
|
|
|
+ decoration: BoxDecoration(
|
|
|
+ color: Colors.white,
|
|
|
+ image: DecorationImage(
|
|
|
+ image: NetworkImage(
|
|
|
+ "https://picsum.photos/200/300?random=$index"),
|
|
|
+ fit: BoxFit.cover,
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ Center(
|
|
|
+ child: Text(
|
|
|
+ listaProductos[index].nombre ?? "Error",
|
|
|
+ style: const TextStyle(
|
|
|
+ fontWeight: FontWeight.bold,
|
|
|
+ fontSize: 16,
|
|
|
+ color: Colors.black),
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ Text(
|
|
|
+ "\$${listaProductos[index].precio}",
|
|
|
+ textAlign: TextAlign.left,
|
|
|
+ style: TextStyle(
|
|
|
+ color: Colors.green[600],
|
|
|
+ fontWeight: FontWeight.bold,
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ const Spacer(),
|
|
|
+ Padding(
|
|
|
+ padding: const EdgeInsets.symmetric(horizontal: 10),
|
|
|
+ child: Row(
|
|
|
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
|
+ children: [
|
|
|
+ IconButton(
|
|
|
+ style: ButtonStyle(
|
|
|
+ backgroundColor:
|
|
|
+ MaterialStatePropertyAll(AppTheme.primary)),
|
|
|
+ onPressed: () {
|
|
|
+ if (cantidad > 0) {
|
|
|
+ creacionPedidoViewModel
|
|
|
+ .reducirDelCarrito(listaProductos[index]);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ icon: const Icon(
|
|
|
+ Icons.remove,
|
|
|
+ color: Colors.black,
|
|
|
+ )),
|
|
|
+ Text(
|
|
|
+ "$cantidad",
|
|
|
+ style: const TextStyle(
|
|
|
+ fontSize: 20,
|
|
|
+ fontWeight: FontWeight.bold,
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ IconButton(
|
|
|
+ style: ButtonStyle(
|
|
|
+ backgroundColor:
|
|
|
+ MaterialStatePropertyAll(AppTheme.primary)),
|
|
|
+ onPressed: () {
|
|
|
+ creacionPedidoViewModel
|
|
|
+ .agregarAlCarrito(listaProductos[index]);
|
|
|
+ },
|
|
|
+ icon: const Icon(
|
|
|
+ Icons.add,
|
|
|
+ color: Colors.black,
|
|
|
+ )),
|
|
|
+ ],
|
|
|
+ ),
|
|
|
+ )
|
|
|
+ ]),
|
|
|
+ );
|
|
|
+ },
|
|
|
+ ),
|
|
|
+ ),
|
|
|
+ );
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
class CategoryFilters extends StatefulWidget {
|
|
|
const CategoryFilters({super.key});
|
|
|
|
c90Beretta