From 8805b2a9a0a21ebf18affce2fef17f0ec7fc2a7f Mon Sep 17 00:00:00 2001 From: Sergey Elpashev Date: Thu, 2 May 2024 22:56:08 +0300 Subject: [PATCH] Basket items --- lib/components/basket_item_card.dart | 71 +++++++++++++ lib/pages/basket.dart | 151 +++++++++++++++++++++++++-- 2 files changed, 215 insertions(+), 7 deletions(-) create mode 100644 lib/components/basket_item_card.dart diff --git a/lib/components/basket_item_card.dart b/lib/components/basket_item_card.dart new file mode 100644 index 0000000..c383759 --- /dev/null +++ b/lib/components/basket_item_card.dart @@ -0,0 +1,71 @@ +import 'package:flutter/material.dart'; + +class BasketItemCard extends StatelessWidget { + final String name; + final String price; + final String id; + final Image image; + final VoidCallback onTap; + + const BasketItemCard({ + super.key, + required this.name, + required this.price, + required this.id, + required this.image, + required this.onTap, + }); + + @override + Widget build(BuildContext context) { + return Padding( + padding: + const EdgeInsetsDirectional.symmetric(horizontal: 10, vertical: 10), + child: ConstrainedBox( + constraints: const BoxConstraints( + minHeight: 100, + maxHeight: 200, + minWidth: 400, + maxWidth: 600, + ), + child: Card( + elevation: 4, + color: const Color(0xFFF2F3F9), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(30), + ), + child: Padding( + padding: const EdgeInsetsDirectional.symmetric(horizontal: 20), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + image, + const SizedBox(width: 20), + Column( + mainAxisSize: MainAxisSize.min, + children: [ + Text( + name, + style: Theme.of(context).textTheme.bodyLarge, + ), + Text('\$$price'), + ], + ) + ], + ), + IconButton( + onPressed: onTap, + icon: const Icon(Icons.close), + ) + ], + ), + ), + ), + ), + ); + } +} diff --git a/lib/pages/basket.dart b/lib/pages/basket.dart index cd2c85b..f365135 100644 --- a/lib/pages/basket.dart +++ b/lib/pages/basket.dart @@ -1,8 +1,47 @@ import 'package:flutter/material.dart'; import 'package:gymlink_module_web/components/app_bar.dart'; +import 'package:gymlink_module_web/components/basket_item_card.dart'; import 'package:gymlink_module_web/components/heading.dart'; +import 'package:gymlink_module_web/tools/prefs.dart'; + +List> cart = [ + { + "name": "Протеин", + "image": "product.png", + "price": "120", + "details": "Test details", + "id": "34fa3126-bfaf-5dec-8f4a-b246c097ef73" + }, + { + "name": "Протеин", + "image": "product.png", + "price": "150", + "details": "Test details", + "id": "34a26e82-7656-5e98-a44a-c2d01d0b1ad1123" + }, + { + "name": "Протеин", + "image": "product.png", + "price": "250", + "details": "Test details", + "id": "4fb204b7-3f9e-52a2-bed1-415c00a31a37123" + }, + { + "name": "Протеин", + "image": "product.png", + "price": "300", + "details": "Test details", + "id": "09b2f5bb-683e-5c39-ae89-b8e152fa8bcf123" + }, + { + "name": "Протеин", + "image": "product.png", + "price": "100", + "details": "Test details", + "id": "cd1b6817-db94-5394-be1d-af88af79749f123" + } +]; -//TODO: Вывод корзины из shared_prefs class BasketPage extends StatefulWidget { const BasketPage({super.key}); @@ -11,16 +50,114 @@ class BasketPage extends StatefulWidget { } class _BasketPageState extends State { + List> cartItems = []; + int totalPrice = 0; + + @override + void initState() { + super.initState(); + getCart().then((value) { + setState(() { + cartItems = cart + .where((element) => value.any((e) => e['id'] == element['id'])) + .toList(); + totalPrice = + cartItems.fold(0, (sum, item) => sum + int.parse(item['price'])); + debugPrint(totalPrice.toString()); + }); + }); + } + + void removeItem(String id) async { + setState(() { + cartItems.removeWhere((element) => element['id'] == id); + totalPrice = + cartItems.fold(0, (sum, item) => sum + int.parse(item['price'])); + }); + await removeItemFromCart(id); + } + @override Widget build(BuildContext context) { - return const Scaffold( - appBar: GymLinkAppBar(), + return Scaffold( + appBar: const GymLinkAppBar(), body: Column( children: [ - GymLinkHeader(title: 'Корзина'), - Center( - child: Text('Корзина'), - ), + const GymLinkHeader(title: "Корзина"), + cartItems.isEmpty + ? Expanded( + child: Center( + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text('Корзина пуста', + style: Theme.of(context).textTheme.bodyLarge), + const SizedBox(height: 10), + ElevatedButton( + onPressed: () => Navigator.pop(context), + style: ElevatedButton.styleFrom( + backgroundColor: Theme.of(context).primaryColor, + shape: const RoundedRectangleBorder( + borderRadius: + BorderRadius.all(Radius.circular(50)), + ), + foregroundColor: Colors.white, + ), + child: const Text('Вернуться назад'), + ), + ], + ), + ), + ) + : Expanded( + child: Row( + children: [ + Expanded( + child: ListView.builder( + itemCount: cartItems.length, + itemBuilder: (context, index) { + final item = cartItems[index]; + return BasketItemCard( + name: item['name'], + price: item['price'], + id: item['id'], + image: Image.asset( + item['image'], + width: 50, + ), + onTap: () => removeItem(item['id']), + ); + }, + ), + ), + const Spacer(), + Padding( + padding: const EdgeInsetsDirectional.symmetric( + horizontal: 10, vertical: 10), + child: Column( + children: [ + Text( + 'Итого: $totalPrice', + ), + ElevatedButton( + onPressed: () {}, + style: ElevatedButton.styleFrom( + backgroundColor: Theme.of(context).primaryColor, + shape: const RoundedRectangleBorder( + borderRadius: + BorderRadius.all(Radius.circular(50)), + ), + foregroundColor: Colors.white, + ), + child: const Text('Оформить заказ'), + ), + ], + ), + ), + const SizedBox(width: 50), + ], + ), + ), ], ), );