From 7a1cddee03e589f5d076da55768496dc2ea86c44 Mon Sep 17 00:00:00 2001 From: Prajna Prayoga Date: Wed, 7 Feb 2024 18:34:46 +0700 Subject: [PATCH] fix: more detailing product view --- .../view/portfolio/portfolio_view.dart | 40 +++++++++---------- .../view/product/product_chart_view.dart | 11 +---- .../view/product/product_view.dart | 4 +- 3 files changed, 24 insertions(+), 31 deletions(-) diff --git a/lib/features/dashboard/dashboard_account/view/portfolio/portfolio_view.dart b/lib/features/dashboard/dashboard_account/view/portfolio/portfolio_view.dart index 46753ad..8ce0621 100644 --- a/lib/features/dashboard/dashboard_account/view/portfolio/portfolio_view.dart +++ b/lib/features/dashboard/dashboard_account/view/portfolio/portfolio_view.dart @@ -1,3 +1,5 @@ +import 'dart:math'; + import 'package:cims_apps/application/assets/path_assets.dart'; import 'package:cims_apps/application/component/image/image_view.dart'; import 'package:cims_apps/application/theme/color_palette.dart'; @@ -5,11 +7,12 @@ import 'package:cims_apps/core/utils/size_config.dart'; import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; -class CategoryPortofolio { +class InvestmentType { String name; int value; + int mutualFunds; - CategoryPortofolio(this.value, this.name); + InvestmentType(this.value, this.name, this.mutualFunds); } class PortofolioView extends StatefulWidget { @@ -36,11 +39,11 @@ class _PortofolioViewState extends State { bool seePortofolioValue = false; int touchedIndex = -1; - List listCategoryPortofolio = [ - CategoryPortofolio(20, 'Money Market'), - CategoryPortofolio(15, 'Shares'), - CategoryPortofolio(8, 'Bonds'), - CategoryPortofolio(50, 'Sharia'), + List listInvestmentType = [ + InvestmentType(20, 'Money Market', 2), + InvestmentType(15, 'Shares', 5), + InvestmentType(8, 'Bonds', 3), + InvestmentType(50, 'Sharia', 4), ]; List assetsImage = [ @@ -91,7 +94,7 @@ class _PortofolioViewState extends State { topRight: Radius.circular(24)), ), child: ListView( - padding: const EdgeInsets.symmetric(vertical: 0), + padding: const EdgeInsets.symmetric(vertical: 16), children: [ Stack(alignment: Alignment.center, children: [ AspectRatio( @@ -117,20 +120,20 @@ class _PortofolioViewState extends State { show: true, ), sectionsSpace: 20, - centerSpaceRadius: 100, + centerSpaceRadius: 110, sections: sectionsDataPortofolio())), ), - const Column( + Column( children: [ - Text('Total Mutual Fund', + const Text('Total Mutual Fund', style: TextStyle( fontWeight: FontWeight.w600, fontSize: 18, color: ColorPalette.slate400 ), ), - Text('10', - style: TextStyle( + Text(listInvestmentType.map((e) => e.mutualFunds).reduce((value, element) => value + element).toString(), + style: const TextStyle( fontSize: 44, fontWeight: FontWeight.w700 ) @@ -147,9 +150,6 @@ class _PortofolioViewState extends State { height: 24, ), ...listColumnPortofolio(), - const SizedBox( - height: 24, - ) ], ), ), @@ -232,7 +232,7 @@ class _PortofolioViewState extends State { } List sectionsDataPortofolio() { - return listCategoryPortofolio.asMap().entries.map((e) { + return listInvestmentType.asMap().entries.map((e) { final isTouched = e.key == touchedIndex; final radius = isTouched ? 40.0 : 30.0; return PieChartSectionData( @@ -265,7 +265,7 @@ class _PortofolioViewState extends State { child: Wrap( alignment: WrapAlignment.center, spacing: 12, - children: listCategoryPortofolio.asMap().entries.map((e) { + children: listInvestmentType.asMap().entries.map((e) { return Container( color: Colors.white, width: SizeConfig.width * 0.18, @@ -303,7 +303,7 @@ class _PortofolioViewState extends State { } List listColumnPortofolio() { - return listCategoryPortofolio.asMap().entries.map((e) { + return listInvestmentType.asMap().entries.map((e) { return Column( children: [ if (e.key > 0) ...[ @@ -325,7 +325,7 @@ class _PortofolioViewState extends State { style: const TextStyle(fontWeight: FontWeight.w600), ), subtitle: Text( - e.value.name, + '${e.value.mutualFunds} Mutual Funds', style: const TextStyle( fontWeight: FontWeight.w600, color: Color(0xff94A3B8)), ), diff --git a/lib/features/dashboard/dashboard_account/view/product/product_chart_view.dart b/lib/features/dashboard/dashboard_account/view/product/product_chart_view.dart index 186e06e..c7f5ea6 100644 --- a/lib/features/dashboard/dashboard_account/view/product/product_chart_view.dart +++ b/lib/features/dashboard/dashboard_account/view/product/product_chart_view.dart @@ -124,22 +124,13 @@ class _ProductChartViewState extends State { ), ), Padding( - padding: const EdgeInsets.symmetric(vertical: 48), + padding: const EdgeInsets.only(top: 48, bottom: 24), child: AspectRatio( aspectRatio: 2.5, child: LayoutBuilder( builder: (context, constraints) { return LineChart( LineChartData( - // showingTooltipIndicators: showingTooltipOnSpots.map((index) { - // return ShowingTooltipIndicators([ - // LineBarSpot( - // tooltipsOnBar, - // lineBarsData.indexOf(tooltipsOnBar), - // tooltipsOnBar.spots[index], - // ), - // ]); - // }).toList(), extraLinesData: ExtraLinesData( verticalLines: [ VerticalLine( diff --git a/lib/features/dashboard/dashboard_account/view/product/product_view.dart b/lib/features/dashboard/dashboard_account/view/product/product_view.dart index 54f9f01..34d930d 100644 --- a/lib/features/dashboard/dashboard_account/view/product/product_view.dart +++ b/lib/features/dashboard/dashboard_account/view/product/product_view.dart @@ -274,7 +274,7 @@ class _ProductViewState extends State { ), cardInformation('Time Machine', timeMachine()), const SizedBox( - height: 24, + height: 32, ), topFiveHoldings(), const SizedBox( @@ -530,6 +530,7 @@ class _ProductViewState extends State { sizeBorderRadius: 8, isSecondaryColor: false, width: SizeConfig.width * .5, + marginVertical: 0, heightWrapContent: true, isOutlined: true, widthPrefix: 10, @@ -554,6 +555,7 @@ class _ProductViewState extends State { heightWrapContent: true, backgroundColor: ColorPalette.orange50, sizeBorderRadius: 8, + marginVertical: 0, isOutlined: true, borderColor: ColorPalette.orange500, textSize: 14,