From 799c63b42722cc8657534b19f4c7c1cdda997f8e Mon Sep 17 00:00:00 2001 From: Alex Date: Fri, 13 Dec 2024 17:11:15 +0300 Subject: [PATCH] feat: recipe widget --- ...otlin-compiler-11108898403823619126.salive | 0 assets/icons/calories.svg | 6 + assets/icons/clock.svg | 3 + assets/icons/steps.svg | 3 + .../presentation/widgets/recipes_widget.dart | 148 ++++++++++-------- 5 files changed, 93 insertions(+), 67 deletions(-) delete mode 100644 android/.kotlin/sessions/kotlin-compiler-11108898403823619126.salive create mode 100644 assets/icons/calories.svg create mode 100644 assets/icons/clock.svg create mode 100644 assets/icons/steps.svg diff --git a/android/.kotlin/sessions/kotlin-compiler-11108898403823619126.salive b/android/.kotlin/sessions/kotlin-compiler-11108898403823619126.salive deleted file mode 100644 index e69de29b..00000000 diff --git a/assets/icons/calories.svg b/assets/icons/calories.svg new file mode 100644 index 00000000..56188edf --- /dev/null +++ b/assets/icons/calories.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/assets/icons/clock.svg b/assets/icons/clock.svg new file mode 100644 index 00000000..f11f885b --- /dev/null +++ b/assets/icons/clock.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/icons/steps.svg b/assets/icons/steps.svg new file mode 100644 index 00000000..45c8cb6a --- /dev/null +++ b/assets/icons/steps.svg @@ -0,0 +1,3 @@ + + + diff --git a/lib/features/feed/presentation/widgets/recipes_widget.dart b/lib/features/feed/presentation/widgets/recipes_widget.dart index 9e93074b..f8c3d7a1 100644 --- a/lib/features/feed/presentation/widgets/recipes_widget.dart +++ b/lib/features/feed/presentation/widgets/recipes_widget.dart @@ -1,10 +1,13 @@ import 'package:cached_network_image/cached_network_image.dart'; import 'package:eatvio_app/core/const.dart'; +import 'package:eatvio_app/core/widgets/feed_icon_button.dart'; import 'package:eatvio_app/features/feed/models/recipes_model.dart'; import 'package:eatvio_app/core/theme/theme_helper.dart'; import 'package:flutter/material.dart'; import 'package:flutter_html/flutter_html.dart'; +import 'package:flutter_svg/flutter_svg.dart'; import 'package:go_router/go_router.dart'; +import 'package:share_plus/share_plus.dart'; class RecipesWidget extends StatefulWidget { final Recipes recipes; @@ -46,72 +49,14 @@ class _RecipesWidgetState extends State { child: Wrap( runSpacing: 8, children: [ - _iconButton(Icons.fastfood, '139.9 ккал'), + _iconButton('assets/icons/clock.svg', widget.recipes.cookingTime.toString() + ' минут'), SizedBox(width: 8), - _iconButton(Icons.timer_rounded, widget.recipes.cookingTime.toString() + ' минут'), + _iconButton('assets/icons/steps.svg', widget.recipes.steps.length.toString() + ' этапов'), SizedBox(width: 8), - _iconButton(Icons.fast_forward_rounded, widget.recipes.steps.length.toString() + ' этапов'), + _iconButton('assets/icons/calories.svg', '139.9 ккал'), ], ), ), - Positioned( - left: 8, - top: 8, - child: Container( - padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4), - decoration: BoxDecoration( - color: Colors.white.withOpacity(0.8), - borderRadius: BorderRadius.circular(16), - ), - child: Row( - children: [ - Icon( - Icons.favorite_rounded, - size: 16, - color: Colors.black, - ), - SizedBox(width: 4), - Text( - '0', - style: TextStyle( - fontSize: 12, - color: Colors.black, - fontWeight: FontWeight.w400, - ), - ), - ], - ), - ), - ), - Positioned( - right: 8, - top: 8, - child: Container( - padding: EdgeInsets.symmetric(horizontal: 8, vertical: 4), - decoration: BoxDecoration( - color: Colors.white.withOpacity(0.8), - borderRadius: BorderRadius.circular(16), - ), - child: Row( - children: [ - Icon( - Icons.visibility_rounded, - size: 16, - color: Colors.black, - ), - SizedBox(width: 4), - Text( - '0', - style: TextStyle( - fontSize: 12, - color: Colors.black, - fontWeight: FontWeight.w400, - ), - ), - ], - ), - ), - ), ], ), SizedBox(height: 12), @@ -150,27 +95,96 @@ class _RecipesWidgetState extends State { ), ), SizedBox(height: 12), + Padding( + padding: const EdgeInsets.symmetric(horizontal: 12), + child: Row( + children: [ + FeedIconButton( + icon: true ? Icons.favorite_rounded : Icons.favorite_border_rounded, + text: widget.recipes.likesCount.toString(), + iconColor: true ? Colors.red.withOpacity(0.8) : null, + backgroundColor: true ? Colors.red.withOpacity(0.1) : null, + textColor: true ? Colors.red.withOpacity(0.8) : null, + onTap: () async { + // setState(() { + // isLiked = !isLiked; + // isLiked ? totalLikes++ : totalLikes--; + // }); + // isLiked + // ? await context.read().likePost(state.feedBlogPostList[widget.index].id) + // : await context.read().unlikedPost(state.feedBlogPostList[widget.index].id); + // await context.read().loadFeedBlogPostList(); + }, + ), + SizedBox(width: 8), + FeedIconButton( + svgIcon: SvgPicture.asset( + 'assets/icons/comment.svg', + height: 20, + width: 20, + colorFilter: ColorFilter.mode( + appTheme.gray600, + BlendMode.srcIn, + ), + ), + text: widget.recipes.commentsCount.toString(), + onTap: () => GoRouter.of(context).pushNamed( + 'aboutRecipesScreen', + extra: widget.recipes, + ), + ), + SizedBox(width: 8), + FeedIconButton( + svgIcon: SvgPicture.asset( + height: 20, + width: 20, + 'assets/icons/share.svg', + colorFilter: ColorFilter.mode(appTheme.gray600, BlendMode.srcIn), + ), + onTap: () => Share.shareUri( + Uri.parse( + baseUrl + '/ru/blog_post/' + widget.recipes.id.toString(), + ), + ), + ), + Spacer(), + Icon( + Icons.visibility_rounded, + size: 16, + color: appTheme.gray500, + ), + SizedBox(width: 4), + Text( + widget.recipes.viewsCount.toString(), + style: TextStyle( + fontSize: 12, + color: appTheme.gray500, + fontWeight: FontWeight.w400, + ), + ), + ], + ), + ), + SizedBox(height: 12), ], ), ), ); } - _iconButton(IconData icon, [String? text]) { + _iconButton(String iconPath, [String? text]) { return Container( padding: EdgeInsets.symmetric(horizontal: 12, vertical: 4), decoration: BoxDecoration( - color: Colors.white.withOpacity(0.8), + color: Colors.white.withValues(alpha: 0.8), borderRadius: BorderRadius.circular(16), ), height: 32, child: Row( mainAxisSize: MainAxisSize.min, children: [ - Icon( - icon, - size: 16, - color: Colors.black, + SvgPicture.asset( + iconPath, ), if (text != null) SizedBox(width: 8), if (text != null)