feat: update profit loss ui
Build & Deploy iOS to TestFlight / build-and-deploy (push) Waiting to run
Build & Deploy iOS to TestFlight / build-and-deploy (push) Waiting to run
This commit is contained in:
Efril
@@ -1,21 +1,13 @@
|
||||
import 'package:auto_route/auto_route.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:line_icons/line_icons.dart';
|
||||
|
||||
import '../../../application/analytic/category_analytic_loader/category_analytic_loader_bloc.dart';
|
||||
import '../../../application/analytic/profit_loss_loader/profit_loss_loader_bloc.dart';
|
||||
import '../../../common/extension/extension.dart';
|
||||
import '../../../common/theme/theme.dart';
|
||||
import '../../../domain/analytic/analytic.dart';
|
||||
import '../../../injection.dart';
|
||||
import '../../components/appbar/appbar.dart';
|
||||
import '../../components/field/date_range_picker_field.dart';
|
||||
import 'widgets/cash_flow.dart';
|
||||
import 'widgets/category.dart';
|
||||
import 'widgets/product.dart';
|
||||
import 'widgets/profit_loss.dart';
|
||||
import 'widgets/summary_card.dart';
|
||||
import 'widgets/cost_breakdown.dart';
|
||||
import 'widgets/profit_loss_header.dart';
|
||||
import 'widgets/profit_loss_report.dart';
|
||||
|
||||
@RoutePage()
|
||||
class FinancePage extends StatefulWidget implements AutoRouteWrapper {
|
||||
@@ -25,80 +17,40 @@ class FinancePage extends StatefulWidget implements AutoRouteWrapper {
|
||||
State<FinancePage> createState() => _FinancePageState();
|
||||
|
||||
@override
|
||||
Widget wrappedRoute(BuildContext context) => MultiBlocProvider(
|
||||
providers: [
|
||||
BlocProvider(
|
||||
create: (_) =>
|
||||
getIt<ProfitLossLoaderBloc>()..add(ProfitLossLoaderEvent.fetched()),
|
||||
),
|
||||
BlocProvider(
|
||||
create: (context) =>
|
||||
getIt<CategoryAnalyticLoaderBloc>()
|
||||
..add(CategoryAnalyticLoaderEvent.fetched()),
|
||||
),
|
||||
],
|
||||
Widget wrappedRoute(BuildContext context) => BlocProvider(
|
||||
create: (_) =>
|
||||
getIt<ProfitLossLoaderBloc>()..add(ProfitLossLoaderEvent.fetched()),
|
||||
child: this,
|
||||
);
|
||||
}
|
||||
|
||||
class _FinancePageState extends State<FinancePage>
|
||||
with TickerProviderStateMixin {
|
||||
late AnimationController _slideController;
|
||||
with SingleTickerProviderStateMixin {
|
||||
late AnimationController _fadeController;
|
||||
late AnimationController _scaleController;
|
||||
|
||||
late Animation<Offset> _slideAnimation;
|
||||
late Animation<double> _fadeAnimation;
|
||||
late Animation<double> _scaleAnimation;
|
||||
|
||||
int _selectedTabIndex = 0;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
|
||||
_slideController = AnimationController(
|
||||
duration: const Duration(milliseconds: 800),
|
||||
vsync: this,
|
||||
);
|
||||
|
||||
_fadeController = AnimationController(
|
||||
duration: const Duration(milliseconds: 1000),
|
||||
vsync: this,
|
||||
);
|
||||
|
||||
_scaleController = AnimationController(
|
||||
duration: const Duration(milliseconds: 600),
|
||||
vsync: this,
|
||||
);
|
||||
|
||||
_slideAnimation =
|
||||
Tween<Offset>(begin: const Offset(0, 0.3), end: Offset.zero).animate(
|
||||
CurvedAnimation(parent: _slideController, curve: Curves.easeOutCubic),
|
||||
);
|
||||
|
||||
_fadeAnimation = Tween<double>(
|
||||
begin: 0.0,
|
||||
end: 1.0,
|
||||
).animate(CurvedAnimation(parent: _fadeController, curve: Curves.easeIn));
|
||||
|
||||
_scaleAnimation = Tween<double>(begin: 0.8, end: 1.0).animate(
|
||||
CurvedAnimation(parent: _scaleController, curve: Curves.elasticOut),
|
||||
);
|
||||
|
||||
// Start animations
|
||||
_fadeController.forward();
|
||||
Future.delayed(const Duration(milliseconds: 200), () {
|
||||
_slideController.forward();
|
||||
});
|
||||
Future.delayed(const Duration(milliseconds: 400), () {
|
||||
_scaleController.forward();
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_slideController.dispose();
|
||||
_fadeController.dispose();
|
||||
_scaleController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@@ -119,89 +71,48 @@ class _FinancePageState extends State<FinancePage>
|
||||
builder: (context, state) {
|
||||
return CustomScrollView(
|
||||
slivers: [
|
||||
// SliverAppBar with animated background
|
||||
SliverAppBar(
|
||||
expandedHeight: 120,
|
||||
floating: false,
|
||||
pinned: true,
|
||||
backgroundColor: AppColor.primary,
|
||||
elevation: 0,
|
||||
flexibleSpace: CustomAppBar(title: context.lang.profit_loss),
|
||||
),
|
||||
|
||||
// Header dengan filter periode
|
||||
// Header with gradient background, tabs, and summary
|
||||
SliverToBoxAdapter(
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: DateRangePickerField(
|
||||
maxDate: DateTime.now(),
|
||||
startDate: state.dateFrom,
|
||||
endDate: state.dateTo,
|
||||
onChanged: (startDate, endDate) {
|
||||
context.read<ProfitLossLoaderBloc>().add(
|
||||
ProfitLossLoaderEvent.rangeDateChanged(
|
||||
startDate!,
|
||||
endDate!,
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
child: ProfitLossHeader(
|
||||
state: state,
|
||||
selectedTabIndex: _selectedTabIndex,
|
||||
onTabChanged: (index) {
|
||||
setState(() {
|
||||
_selectedTabIndex = index;
|
||||
});
|
||||
_onTabChanged(context, index);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Summary Cards
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: _buildSummaryCards(state.profitLoss.summary),
|
||||
),
|
||||
),
|
||||
|
||||
// Cash Flow Analysis
|
||||
SliverToBoxAdapter(
|
||||
child: ScaleTransition(
|
||||
scale: _scaleAnimation,
|
||||
child: FinanceCashFlow(dailyData: state.profitLoss.data),
|
||||
),
|
||||
),
|
||||
|
||||
// Profit Loss Detail
|
||||
// Profit Loss Report Table
|
||||
SliverToBoxAdapter(
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: FinanceProfitLoss(data: state.profitLoss.summary),
|
||||
child: ProfitLossReport(
|
||||
mainSummary: state.profitLoss.mainSummary,
|
||||
summary: state.profitLoss.summary,
|
||||
selectedTabIndex: _selectedTabIndex,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
BlocBuilder<
|
||||
CategoryAnalyticLoaderBloc,
|
||||
CategoryAnalyticLoaderState
|
||||
>(
|
||||
builder: (context, stateCategory) {
|
||||
return SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: FinanceCategory(
|
||||
categories: stateCategory.categoryAnalytic.data,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
|
||||
// Product Analysis Section
|
||||
// Cost Breakdown
|
||||
SliverToBoxAdapter(
|
||||
child: SlideTransition(
|
||||
position: _slideAnimation,
|
||||
child: _buildProductAnalysis(state.profitLoss.productData),
|
||||
child: FadeTransition(
|
||||
opacity: _fadeAnimation,
|
||||
child: CostBreakdown(
|
||||
purchasing: state.profitLoss.purchasing,
|
||||
selectedTabIndex: _selectedTabIndex,
|
||||
dateFrom: state.dateFrom,
|
||||
dateTo: state.dateTo,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Transaction Categories
|
||||
|
||||
// Bottom spacing
|
||||
const SliverToBoxAdapter(child: SizedBox(height: 100)),
|
||||
],
|
||||
@@ -212,125 +123,23 @@ class _FinancePageState extends State<FinancePage>
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSummaryCards(ProfitLossSummary summary) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: context.lang.total_revenue,
|
||||
amount: summary.totalRevenue.currencyFormatRp,
|
||||
icon: LineIcons.arrowUp,
|
||||
color: AppColor.success,
|
||||
isPositive: true,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: context.lang.total_expenditures,
|
||||
amount: summary.totalCost.currencyFormatRp,
|
||||
icon: LineIcons.arrowDown,
|
||||
color: AppColor.error,
|
||||
isPositive: false,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: context.lang.net_profit,
|
||||
amount: summary.netProfit.currencyFormatRp,
|
||||
icon: LineIcons.lineChart,
|
||||
color: AppColor.info,
|
||||
isPositive: true,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: FinanceSummaryCard(
|
||||
title: context.lang.margin_profit,
|
||||
amount: '${summary.profitabilityRatio.round()}%',
|
||||
icon: LineIcons.percent,
|
||||
color: AppColor.warning,
|
||||
isPositive: true,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
void _onTabChanged(BuildContext context, int index) {
|
||||
final now = DateTime.now();
|
||||
DateTime dateFrom;
|
||||
DateTime dateTo;
|
||||
|
||||
Widget _buildProductAnalysis(List<ProfitLossProductData> products) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.1),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.info.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: const Icon(
|
||||
LineIcons.shoppingBag,
|
||||
color: AppColor.info,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
context.lang.product_analytic,
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
const Spacer(),
|
||||
TextButton(
|
||||
onPressed: () {},
|
||||
child: Text(
|
||||
context.lang.view_all,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.primary),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
// Product list
|
||||
ListView.separated(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
padding: const EdgeInsets.only(top: 12),
|
||||
itemCount: products.length,
|
||||
separatorBuilder: (context, index) => const SizedBox(height: 12),
|
||||
itemBuilder: (context, index) {
|
||||
final product = products[index];
|
||||
return ProfitLossProduct(product: product);
|
||||
},
|
||||
),
|
||||
],
|
||||
),
|
||||
if (index == 0) {
|
||||
// Today
|
||||
dateFrom = DateTime(now.year, now.month, now.day);
|
||||
dateTo = DateTime(now.year, now.month, now.day, 23, 59, 59);
|
||||
} else {
|
||||
// MTD (Month-to-Date)
|
||||
dateFrom = DateTime(now.year, now.month, 1);
|
||||
dateTo = now;
|
||||
}
|
||||
|
||||
context.read<ProfitLossLoaderBloc>().add(
|
||||
ProfitLossLoaderEvent.rangeDateChanged(dateFrom, dateTo),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,476 +0,0 @@
|
||||
import 'package:fl_chart/fl_chart.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:line_icons/line_icons.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../domain/analytic/analytic.dart';
|
||||
|
||||
class FinanceCashFlow extends StatelessWidget {
|
||||
final List<ProfitLossDailyData> dailyData;
|
||||
|
||||
const FinanceCashFlow({super.key, required this.dailyData});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// Calculate totals from daily data
|
||||
final totalCashIn = _calculateTotalCashIn();
|
||||
final totalCashOut = _calculateTotalCashOut();
|
||||
final netFlow = totalCashIn - totalCashOut;
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.1),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: AppColor.primaryGradient,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: const Icon(
|
||||
LineIcons.areaChart,
|
||||
color: AppColor.white,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
context.lang.cash_flow_analysis,
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
],
|
||||
),
|
||||
IconButton(
|
||||
onPressed: () {},
|
||||
icon: const Icon(
|
||||
LineIcons.alternateExternalLink,
|
||||
color: AppColor.primary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// Cash Flow Indicators
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _buildCashFlowIndicator(
|
||||
context.lang.cash_in,
|
||||
_formatCurrency(totalCashIn),
|
||||
LineIcons.arrowUp,
|
||||
AppColor.success,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: _buildCashFlowIndicator(
|
||||
context.lang.cash_out,
|
||||
_formatCurrency(totalCashOut),
|
||||
LineIcons.arrowDown,
|
||||
AppColor.error,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: _buildCashFlowIndicator(
|
||||
context.lang.net_flow,
|
||||
_formatCurrency(netFlow),
|
||||
LineIcons.equals,
|
||||
AppColor.info,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// FL Chart Implementation
|
||||
Container(
|
||||
height: 200,
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.background,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: AppColor.borderLight),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
context.lang.cash_flow_chart(dailyData.length),
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Expanded(
|
||||
child: dailyData.isEmpty
|
||||
? _buildEmptyChart()
|
||||
: LineChart(_buildLineChartData()),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
// Legend
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
_buildChartLegend(context.lang.cash_in, AppColor.success),
|
||||
const SizedBox(width: 20),
|
||||
_buildChartLegend(context.lang.cash_out, AppColor.error),
|
||||
const SizedBox(width: 20),
|
||||
_buildChartLegend(context.lang.net_flow, AppColor.info),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
LineChartData _buildLineChartData() {
|
||||
final maxValue = _getMaxChartValue();
|
||||
final minValue = _getMinChartValue();
|
||||
|
||||
return LineChartData(
|
||||
gridData: FlGridData(
|
||||
show: true,
|
||||
drawVerticalLine: false,
|
||||
horizontalInterval: (maxValue / 5).roundToDouble(),
|
||||
getDrawingHorizontalLine: (value) {
|
||||
return FlLine(color: AppColor.borderLight, strokeWidth: 1);
|
||||
},
|
||||
),
|
||||
titlesData: FlTitlesData(
|
||||
show: true,
|
||||
rightTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
|
||||
topTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
|
||||
bottomTitles: AxisTitles(
|
||||
sideTitles: SideTitles(
|
||||
showTitles: true,
|
||||
reservedSize: 30,
|
||||
interval: 1,
|
||||
getTitlesWidget: (double value, TitleMeta meta) {
|
||||
final index = value.toInt();
|
||||
if (index >= 0 && index < dailyData.length) {
|
||||
final date = DateTime.parse(dailyData[index].date);
|
||||
final dayName = _getDayName(date.weekday);
|
||||
return SideTitleWidget(
|
||||
meta: meta,
|
||||
child: Text(
|
||||
dayName,
|
||||
style: const TextStyle(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 10,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
return SideTitleWidget(meta: meta, child: Text(''));
|
||||
},
|
||||
),
|
||||
),
|
||||
leftTitles: AxisTitles(
|
||||
sideTitles: SideTitles(
|
||||
showTitles: true,
|
||||
interval: (maxValue / 3).roundToDouble(),
|
||||
reservedSize: 42,
|
||||
getTitlesWidget: (double value, TitleMeta meta) {
|
||||
return Text(
|
||||
_formatChartValue(value),
|
||||
style: const TextStyle(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w500,
|
||||
fontSize: 10,
|
||||
),
|
||||
textAlign: TextAlign.left,
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
borderData: FlBorderData(
|
||||
show: true,
|
||||
border: Border.all(color: AppColor.borderLight),
|
||||
),
|
||||
minX: 0,
|
||||
maxX: (dailyData.length - 1).toDouble(),
|
||||
minY: minValue,
|
||||
maxY: maxValue,
|
||||
lineBarsData: [
|
||||
// Cash In Line (Revenue)
|
||||
LineChartBarData(
|
||||
spots: _buildCashInSpots(),
|
||||
isCurved: true,
|
||||
gradient: LinearGradient(
|
||||
colors: [AppColor.success.withOpacity(0.8), AppColor.success],
|
||||
),
|
||||
barWidth: 3,
|
||||
isStrokeCapRound: true,
|
||||
dotData: FlDotData(
|
||||
show: true,
|
||||
getDotPainter: (spot, percent, barData, index) {
|
||||
return FlDotCirclePainter(
|
||||
radius: 4,
|
||||
color: AppColor.success,
|
||||
strokeWidth: 2,
|
||||
strokeColor: AppColor.white,
|
||||
);
|
||||
},
|
||||
),
|
||||
belowBarData: BarAreaData(
|
||||
show: true,
|
||||
gradient: LinearGradient(
|
||||
colors: [
|
||||
AppColor.success.withOpacity(0.1),
|
||||
AppColor.success.withOpacity(0.0),
|
||||
],
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
),
|
||||
),
|
||||
),
|
||||
// Cash Out Line (Total Cost)
|
||||
LineChartBarData(
|
||||
spots: _buildCashOutSpots(),
|
||||
isCurved: true,
|
||||
gradient: LinearGradient(
|
||||
colors: [AppColor.error.withOpacity(0.8), AppColor.error],
|
||||
),
|
||||
barWidth: 3,
|
||||
isStrokeCapRound: true,
|
||||
dotData: FlDotData(
|
||||
show: true,
|
||||
getDotPainter: (spot, percent, barData, index) {
|
||||
return FlDotCirclePainter(
|
||||
radius: 4,
|
||||
color: AppColor.error,
|
||||
strokeWidth: 2,
|
||||
strokeColor: AppColor.white,
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
// Net Flow Line (Net Profit)
|
||||
LineChartBarData(
|
||||
spots: _buildNetFlowSpots(),
|
||||
isCurved: true,
|
||||
gradient: LinearGradient(
|
||||
colors: [AppColor.info.withOpacity(0.8), AppColor.info],
|
||||
),
|
||||
barWidth: 3,
|
||||
isStrokeCapRound: true,
|
||||
dotData: FlDotData(
|
||||
show: true,
|
||||
getDotPainter: (spot, percent, barData, index) {
|
||||
return FlDotCirclePainter(
|
||||
radius: 4,
|
||||
color: AppColor.info,
|
||||
strokeWidth: 2,
|
||||
strokeColor: AppColor.white,
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmptyChart() {
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
LineIcons.lineChart,
|
||||
size: 48,
|
||||
color: AppColor.textSecondary.withOpacity(0.3),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
'Tidak ada data untuk ditampilkan',
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
// Helper methods for calculating data
|
||||
int _calculateTotalCashIn() {
|
||||
return dailyData.fold(0, (sum, data) => sum + data.revenue);
|
||||
}
|
||||
|
||||
int _calculateTotalCashOut() {
|
||||
return dailyData.fold(
|
||||
0,
|
||||
(sum, data) => sum + data.cost + data.tax + data.discount,
|
||||
);
|
||||
}
|
||||
|
||||
double _getMaxChartValue() {
|
||||
if (dailyData.isEmpty) return 30000000;
|
||||
|
||||
final maxRevenue = dailyData
|
||||
.map((e) => e.revenue)
|
||||
.reduce((a, b) => a > b ? a : b);
|
||||
final maxCost = dailyData
|
||||
.map((e) => e.cost + e.tax + e.discount)
|
||||
.reduce((a, b) => a > b ? a : b);
|
||||
final maxValue = maxRevenue > maxCost ? maxRevenue : maxCost;
|
||||
|
||||
return (maxValue * 1.2).toDouble(); // Add 20% padding
|
||||
}
|
||||
|
||||
double _getMinChartValue() {
|
||||
if (dailyData.isEmpty) return -5000000;
|
||||
|
||||
final minNetProfit = dailyData
|
||||
.map((e) => e.netProfit)
|
||||
.reduce((a, b) => a < b ? a : b);
|
||||
return minNetProfit < 0 ? (minNetProfit * 1.2).toDouble() : 0;
|
||||
}
|
||||
|
||||
List<FlSpot> _buildCashInSpots() {
|
||||
return dailyData.asMap().entries.map((entry) {
|
||||
return FlSpot(entry.key.toDouble(), entry.value.revenue.toDouble());
|
||||
}).toList();
|
||||
}
|
||||
|
||||
List<FlSpot> _buildCashOutSpots() {
|
||||
return dailyData.asMap().entries.map((entry) {
|
||||
final totalCost =
|
||||
entry.value.cost + entry.value.tax + entry.value.discount;
|
||||
return FlSpot(entry.key.toDouble(), totalCost.toDouble());
|
||||
}).toList();
|
||||
}
|
||||
|
||||
List<FlSpot> _buildNetFlowSpots() {
|
||||
return dailyData.asMap().entries.map((entry) {
|
||||
return FlSpot(entry.key.toDouble(), entry.value.netProfit.toDouble());
|
||||
}).toList();
|
||||
}
|
||||
|
||||
String _getDayName(int weekday) {
|
||||
switch (weekday) {
|
||||
case 1:
|
||||
return 'Sen';
|
||||
case 2:
|
||||
return 'Sel';
|
||||
case 3:
|
||||
return 'Rab';
|
||||
case 4:
|
||||
return 'Kam';
|
||||
case 5:
|
||||
return 'Jum';
|
||||
case 6:
|
||||
return 'Sab';
|
||||
case 7:
|
||||
return 'Min';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
String _formatChartValue(double value) {
|
||||
if (value.abs() >= 1000000) {
|
||||
return '${(value / 1000000).toStringAsFixed(0)}M';
|
||||
} else if (value.abs() >= 1000) {
|
||||
return '${(value / 1000).toStringAsFixed(0)}K';
|
||||
} else {
|
||||
return value.toStringAsFixed(0);
|
||||
}
|
||||
}
|
||||
|
||||
String _formatCurrency(int amount) {
|
||||
if (amount.abs() >= 1000000000) {
|
||||
return 'Rp ${(amount / 1000000000).toStringAsFixed(1)}B';
|
||||
} else if (amount.abs() >= 1000000) {
|
||||
return 'Rp ${(amount / 1000000).toStringAsFixed(1)}M';
|
||||
} else if (amount.abs() >= 1000) {
|
||||
return 'Rp ${(amount / 1000).toStringAsFixed(1)}K';
|
||||
} else {
|
||||
return 'Rp ${NumberFormat('#,###', 'id_ID').format(amount)}';
|
||||
}
|
||||
}
|
||||
|
||||
Widget _buildChartLegend(String label, Color color) {
|
||||
return Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Container(
|
||||
width: 12,
|
||||
height: 12,
|
||||
decoration: BoxDecoration(color: color, shape: BoxShape.circle),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
label,
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCashFlowIndicator(
|
||||
String label,
|
||||
String amount,
|
||||
IconData icon,
|
||||
Color color,
|
||||
) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: color.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: color.withOpacity(0.2)),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Icon(icon, color: color, size: 20),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
label,
|
||||
style: AppStyle.xs.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
amount,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,209 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:line_icons/line_icons.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../domain/analytic/analytic.dart';
|
||||
import '../../../components/widgets/empty_widget.dart';
|
||||
|
||||
class FinanceCategory extends StatelessWidget {
|
||||
final List<CategoryAnalyticItem> categories;
|
||||
|
||||
const FinanceCategory({super.key, required this.categories});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final totalRevenue = _calculateTotalRevenue();
|
||||
final sortedCategories = _sortCategoriesByRevenue();
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.1),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.secondary.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: const Icon(
|
||||
LineIcons.pieChart,
|
||||
color: AppColor.secondary,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
context.lang.sales_category,
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// Show empty state if no categories
|
||||
if (categories.isEmpty)
|
||||
_buildEmptyState(context)
|
||||
else
|
||||
...sortedCategories.asMap().entries.map(
|
||||
(entry) => _buildCategoryItem(
|
||||
context,
|
||||
entry.value,
|
||||
_calculatePercentage(entry.value.totalRevenue, totalRevenue),
|
||||
_getCategoryColor(entry.key),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCategoryItem(
|
||||
BuildContext context,
|
||||
CategoryAnalyticItem category,
|
||||
double percentage,
|
||||
Color color,
|
||||
) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(bottom: 16),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 12,
|
||||
height: 12,
|
||||
decoration: BoxDecoration(
|
||||
color: color,
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
category.categoryName,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
'${category.productCount} ${context.lang.product} • ${category.orderCount} ${context.lang.orders}',
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
category.totalRevenue.currencyFormatRp,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'${NumberFormat('#,###', 'id_ID').format(category.totalQuantity)} ${context.lang.unit}',
|
||||
style: AppStyle.xs.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
LinearProgressIndicator(
|
||||
value: percentage / 100,
|
||||
backgroundColor: AppColor.borderLight,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(color),
|
||||
minHeight: 6,
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Align(
|
||||
alignment: Alignment.centerRight,
|
||||
child: Text(
|
||||
'${percentage.toStringAsFixed(1)}%',
|
||||
style: AppStyle.xs.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmptyState(BuildContext context) {
|
||||
return EmptyWidget(
|
||||
title: context.lang.category_no_data,
|
||||
message: context.lang.category_no_data_desc,
|
||||
);
|
||||
}
|
||||
|
||||
// Helper methods
|
||||
int _calculateTotalRevenue() {
|
||||
return categories.fold(0, (sum, category) => sum + category.totalRevenue);
|
||||
}
|
||||
|
||||
List<CategoryAnalyticItem> _sortCategoriesByRevenue() {
|
||||
final sorted = List<CategoryAnalyticItem>.from(categories);
|
||||
sorted.sort((a, b) => b.totalRevenue.compareTo(a.totalRevenue));
|
||||
return sorted;
|
||||
}
|
||||
|
||||
double _calculatePercentage(int categoryRevenue, int totalRevenue) {
|
||||
if (totalRevenue == 0) return 0;
|
||||
return (categoryRevenue / totalRevenue) * 100;
|
||||
}
|
||||
|
||||
Color _getCategoryColor(int index) {
|
||||
// Predefined color palette for categories
|
||||
const colors = [
|
||||
AppColor.primary,
|
||||
AppColor.secondary,
|
||||
AppColor.success,
|
||||
AppColor.warning,
|
||||
AppColor.error,
|
||||
AppColor.info,
|
||||
];
|
||||
|
||||
// Generate additional colors if needed
|
||||
if (index < colors.length) {
|
||||
return colors[index];
|
||||
} else {
|
||||
// Generate colors based on index for unlimited categories
|
||||
final hue = (index * 137.5) % 360; // Golden angle approximation
|
||||
return HSLColor.fromAHSL(1.0, hue, 0.7, 0.5).toColor();
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,143 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../domain/analytic/analytic.dart';
|
||||
|
||||
class CostBreakdown extends StatelessWidget {
|
||||
final ProfitLossPurchasing purchasing;
|
||||
final int selectedTabIndex;
|
||||
final DateTime dateFrom;
|
||||
final DateTime dateTo;
|
||||
|
||||
const CostBreakdown({
|
||||
super.key,
|
||||
required this.purchasing,
|
||||
required this.selectedTabIndex,
|
||||
required this.dateFrom,
|
||||
required this.dateTo,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final isToday = selectedTabIndex == 0;
|
||||
final total = isToday ? purchasing.todayTotal : purchasing.mtdTotal;
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.fromLTRB(16, 0, 16, 16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.08),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 10,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Title row
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
context.lang.cost_breakdown,
|
||||
style: AppStyle.lg.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColor.textPrimary,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
_formatDateLabel(dateFrom, dateTo),
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Item list
|
||||
...purchasing.items.map((item) => _buildItemRow(item)),
|
||||
|
||||
// Total row
|
||||
const Divider(height: 24, color: AppColor.borderLight),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
context.lang.total_cost,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColor.textPrimary,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
total.currencyFormatRp,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColor.textPrimary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildItemRow(ProfitLossPurchasingItem item) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 10),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
item.item,
|
||||
style: AppStyle.md.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
Text(
|
||||
item.nominal.currencyFormatRp,
|
||||
style: AppStyle.md.copyWith(
|
||||
color: AppColor.textPrimary,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
String _formatDateLabel(DateTime from, DateTime to) {
|
||||
const months = [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'Mei',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Agu',
|
||||
'Sep',
|
||||
'Okt',
|
||||
'Nov',
|
||||
'Des',
|
||||
];
|
||||
|
||||
if (from.year == to.year && from.month == to.month && from.day == to.day) {
|
||||
return '${from.day} ${months[from.month - 1]} ${from.year}';
|
||||
}
|
||||
return '${from.day} ${months[from.month - 1]} - ${to.day} ${months[to.month - 1]} ${to.year}';
|
||||
}
|
||||
}
|
||||
@@ -1,148 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../domain/analytic/analytic.dart';
|
||||
|
||||
class ProfitLossProduct extends StatelessWidget {
|
||||
final ProfitLossProductData product;
|
||||
const ProfitLossProduct({super.key, required this.product});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.background,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: AppColor.border.withOpacity(0.5)),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Product header
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
product.productName,
|
||||
style: AppStyle.md.copyWith(fontWeight: FontWeight.bold),
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 8,
|
||||
vertical: 2,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.primary.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Text(
|
||||
product.categoryName,
|
||||
style: AppStyle.xs.copyWith(color: AppColor.primary),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
'${product.quantitySold} terjual',
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
Text(
|
||||
'${product.grossProfitMargin.toStringAsFixed(1)}%',
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: product.grossProfitMargin > 25
|
||||
? AppColor.success
|
||||
: product.grossProfitMargin > 15
|
||||
? AppColor.warning
|
||||
: AppColor.error,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Financial metrics
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _buildMetricColumn(
|
||||
context.lang.revenue,
|
||||
product.revenue.currencyFormatRp,
|
||||
AppColor.success,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: _buildMetricColumn(
|
||||
context.lang.cost,
|
||||
product.cost.currencyFormatRp,
|
||||
AppColor.error,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: _buildMetricColumn(
|
||||
context.lang.gross_profit,
|
||||
product.grossProfit.currencyFormatRp,
|
||||
AppColor.info,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Average metrics
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _buildMetricColumn(
|
||||
context.lang.average_price,
|
||||
product.averagePrice.currencyFormatRp,
|
||||
AppColor.textSecondary,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: _buildMetricColumn(
|
||||
context.lang.profit_per_unit,
|
||||
product.profitPerUnit.currencyFormatRp,
|
||||
AppColor.primary,
|
||||
),
|
||||
),
|
||||
const Expanded(child: SizedBox()),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildMetricColumn(String label, String value, Color color) {
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(label, style: AppStyle.xs.copyWith(color: AppColor.textSecondary)),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
value,
|
||||
style: AppStyle.sm.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,192 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:line_icons/line_icons.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../domain/analytic/analytic.dart';
|
||||
|
||||
class FinanceProfitLoss extends StatelessWidget {
|
||||
final ProfitLossSummary data;
|
||||
|
||||
const FinanceProfitLoss({super.key, required this.data});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.1),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.info.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: const Icon(
|
||||
LineIcons.calculator,
|
||||
color: AppColor.info,
|
||||
size: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
context.lang.profit_loss_detail,
|
||||
style: AppStyle.lg.copyWith(fontWeight: FontWeight.bold),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// Total Revenue (Penjualan Kotor)
|
||||
_buildPLItem(
|
||||
context.lang.gross_sales,
|
||||
data.totalRevenue.currencyFormatRp,
|
||||
AppColor.success,
|
||||
true,
|
||||
),
|
||||
|
||||
// Discount (Diskon & Retur)
|
||||
_buildPLItem(
|
||||
'${context.lang.discount} & ${context.lang.return_text}',
|
||||
'- ${data.totalDiscount.currencyFormatRp}',
|
||||
AppColor.error,
|
||||
false,
|
||||
),
|
||||
|
||||
const Divider(height: 24),
|
||||
|
||||
// Net Sales (Penjualan Bersih = Total Revenue - Discount)
|
||||
_buildPLItem(
|
||||
context.lang.net_sales,
|
||||
(data.totalRevenue - data.totalDiscount).currencyFormatRp,
|
||||
AppColor.textPrimary,
|
||||
true,
|
||||
isHeader: true,
|
||||
),
|
||||
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Cost of Goods Sold (HPP)
|
||||
_buildPLItem(
|
||||
'${context.lang.cogs} (${context.lang.cost_of_goods_sold})',
|
||||
'- ${data.totalCost.currencyFormatRp}',
|
||||
AppColor.error,
|
||||
false,
|
||||
),
|
||||
|
||||
const Divider(height: 24),
|
||||
|
||||
// Gross Profit (Laba Kotor)
|
||||
_buildPLItem(
|
||||
context.lang.gross_profit,
|
||||
data.grossProfit.currencyFormatRp,
|
||||
AppColor.success,
|
||||
true,
|
||||
isHeader: true,
|
||||
showPercentage: true,
|
||||
percentage: '${data.grossProfitMargin.toStringAsFixed(1)}%',
|
||||
),
|
||||
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Operational Cost (Biaya Operasional) - calculated as difference
|
||||
_buildPLItem(
|
||||
context.lang.operating_costs,
|
||||
'- ${_calculateOperationalCost().currencyFormatRp}',
|
||||
AppColor.error,
|
||||
false,
|
||||
),
|
||||
|
||||
const Divider(height: 24),
|
||||
|
||||
// Net Profit (Laba Bersih)
|
||||
_buildPLItem(
|
||||
context.lang.net_profit,
|
||||
data.netProfit.currencyFormatRp,
|
||||
AppColor.primary,
|
||||
true,
|
||||
isHeader: true,
|
||||
showPercentage: true,
|
||||
percentage: '${data.netProfitMargin.round()}%',
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildPLItem(
|
||||
String title,
|
||||
String amount,
|
||||
Color color,
|
||||
bool isPositive, {
|
||||
bool isHeader = false,
|
||||
bool showPercentage = false,
|
||||
String? percentage,
|
||||
}) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 4),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
title,
|
||||
style: isHeader
|
||||
? AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
)
|
||||
: AppStyle.md.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
amount,
|
||||
style: isHeader
|
||||
? AppStyle.lg.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
)
|
||||
: AppStyle.md.copyWith(
|
||||
color: color,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
if (showPercentage && percentage != null)
|
||||
Text(
|
||||
percentage,
|
||||
style: AppStyle.xs.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontStyle: FontStyle.italic,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
// Calculate operational cost as the difference between gross profit and net profit
|
||||
int _calculateOperationalCost() {
|
||||
return data.grossProfit - data.netProfit - data.totalTax;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,389 @@
|
||||
import 'package:auto_route/auto_route.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:shimmer/shimmer.dart';
|
||||
|
||||
import '../../../../application/analytic/profit_loss_loader/profit_loss_loader_bloc.dart';
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/painter/wave_painter.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../components/spacer/spacer.dart';
|
||||
|
||||
class ProfitLossHeader extends StatelessWidget {
|
||||
final ProfitLossLoaderState state;
|
||||
final int selectedTabIndex;
|
||||
final ValueChanged<int> onTabChanged;
|
||||
|
||||
const ProfitLossHeader({
|
||||
super.key,
|
||||
required this.state,
|
||||
required this.selectedTabIndex,
|
||||
required this.onTabChanged,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final outletLabel = state.profitLoss.outletName.isNotEmpty
|
||||
? state.profitLoss.outletName
|
||||
: 'Semua Outlet';
|
||||
|
||||
return Container(
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
colors: AppColor.primaryGradient,
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
),
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(24),
|
||||
bottomRight: Radius.circular(24),
|
||||
),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
// Decorative circles
|
||||
Positioned(
|
||||
top: -20,
|
||||
right: -30,
|
||||
child: Container(
|
||||
width: 120,
|
||||
height: 120,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColor.textWhite.withOpacity(0.08),
|
||||
),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
top: 30,
|
||||
right: 20,
|
||||
child: Container(
|
||||
width: 60,
|
||||
height: 60,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColor.textWhite.withOpacity(0.05),
|
||||
),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
top: 10,
|
||||
left: -20,
|
||||
child: Container(
|
||||
width: 80,
|
||||
height: 80,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColor.textWhite.withOpacity(0.04),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Wave pattern
|
||||
Positioned.fill(
|
||||
child: CustomPaint(
|
||||
painter: WavePainter(
|
||||
animation: 0.0,
|
||||
color: AppColor.textWhite.withOpacity(0.1),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Content
|
||||
SafeArea(
|
||||
bottom: false,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 12, 16, 24),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Back button + Title row
|
||||
Row(
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () => context.router.maybePop(),
|
||||
child: Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.textWhite.withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.chevron_left_rounded,
|
||||
color: AppColor.textWhite,
|
||||
size: 24,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SpaceWidth(12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
context.lang.profit_loss,
|
||||
style: AppStyle.xl.copyWith(
|
||||
color: AppColor.textWhite,
|
||||
fontWeight: FontWeight.w700,
|
||||
fontSize: 20,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
outletLabel,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textWhite.withOpacity(0.75),
|
||||
fontWeight: FontWeight.w400,
|
||||
fontSize: 12,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
const SpaceHeight(20),
|
||||
|
||||
// Tab selector (Today / MTD)
|
||||
_buildTabSelector(context),
|
||||
|
||||
const SpaceHeight(24),
|
||||
|
||||
// Profit / Loss label with date
|
||||
Text(
|
||||
context.lang.profit_loss_date(
|
||||
_formatDateLabel(state.dateFrom, state.dateTo),
|
||||
),
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textWhite.withOpacity(0.75),
|
||||
fontWeight: FontWeight.w400,
|
||||
fontSize: 13,
|
||||
),
|
||||
),
|
||||
|
||||
const SpaceHeight(4),
|
||||
|
||||
// Big profit/loss value
|
||||
state.isFetching
|
||||
? _buildHeaderValueShimmer()
|
||||
: Text(
|
||||
state.profitLoss.summary.netProfit.currencyFormatRp,
|
||||
style: AppStyle.h1.copyWith(
|
||||
color: state.profitLoss.summary.netProfit >= 0
|
||||
? AppColor.textWhite
|
||||
: AppColor.textWhite.withOpacity(0.7),
|
||||
fontWeight: FontWeight.w900,
|
||||
fontSize: 32,
|
||||
),
|
||||
),
|
||||
|
||||
const SpaceHeight(16),
|
||||
|
||||
// Chips row (Omset + Total Biaya)
|
||||
state.isFetching
|
||||
? _buildHeaderChipsShimmer()
|
||||
: _buildHeaderChips(context),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTabSelector(BuildContext context) {
|
||||
final todayLabel = _formatTodayTabLabel(DateTime.now());
|
||||
final mtdLabel = context.lang.mtd_month(
|
||||
_getMonthName(DateTime.now().month),
|
||||
);
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(4),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.textWhite.withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(30),
|
||||
border: Border.all(color: AppColor.textWhite.withOpacity(0.2)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _buildTab(
|
||||
label: todayLabel,
|
||||
isSelected: selectedTabIndex == 0,
|
||||
onTap: () => onTabChanged(0),
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: _buildTab(
|
||||
label: mtdLabel,
|
||||
isSelected: selectedTabIndex == 1,
|
||||
onTap: () => onTabChanged(1),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildTab({
|
||||
required String label,
|
||||
required bool isSelected,
|
||||
required VoidCallback onTap,
|
||||
}) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: isSelected ? AppColor.white : Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(26),
|
||||
),
|
||||
child: Center(
|
||||
child: Text(
|
||||
label,
|
||||
style: AppStyle.md.copyWith(
|
||||
color: isSelected ? AppColor.textPrimary : AppColor.textWhite,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeaderValueShimmer() {
|
||||
return Shimmer.fromColors(
|
||||
baseColor: AppColor.textWhite.withOpacity(0.3),
|
||||
highlightColor: AppColor.textWhite.withOpacity(0.6),
|
||||
child: Container(
|
||||
width: 200,
|
||||
height: 36,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.textWhite.withOpacity(0.3),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeaderChipsShimmer() {
|
||||
return Row(
|
||||
children: List.generate(
|
||||
2,
|
||||
(index) => Padding(
|
||||
padding: const EdgeInsets.only(right: 8),
|
||||
child: Shimmer.fromColors(
|
||||
baseColor: AppColor.textWhite.withOpacity(0.15),
|
||||
highlightColor: AppColor.textWhite.withOpacity(0.3),
|
||||
child: Container(
|
||||
width: 130,
|
||||
height: 32,
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.textWhite.withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeaderChips(BuildContext context) {
|
||||
final summary = state.profitLoss.summary;
|
||||
|
||||
return Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 8,
|
||||
children: [
|
||||
_buildChip(
|
||||
'${context.lang.sales} ${summary.totalRevenue.currencyFormatRp}',
|
||||
),
|
||||
_buildChip(
|
||||
'${context.lang.total_cost} ${summary.totalCost.currencyFormatRp}',
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildChip(String label) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.textWhite.withOpacity(0.15),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(color: AppColor.textWhite.withOpacity(0.25)),
|
||||
),
|
||||
child: Text(
|
||||
label,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textWhite,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 12,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
String _formatTodayTabLabel(DateTime date) {
|
||||
const months = [
|
||||
'Januari',
|
||||
'Februari',
|
||||
'Maret',
|
||||
'April',
|
||||
'Mei',
|
||||
'Juni',
|
||||
'Juli',
|
||||
'Agustus',
|
||||
'September',
|
||||
'Oktober',
|
||||
'November',
|
||||
'Desember',
|
||||
];
|
||||
return '${date.day} ${months[date.month - 1]}';
|
||||
}
|
||||
|
||||
String _formatDateLabel(DateTime from, DateTime to) {
|
||||
const months = [
|
||||
'Jan',
|
||||
'Feb',
|
||||
'Mar',
|
||||
'Apr',
|
||||
'Mei',
|
||||
'Jun',
|
||||
'Jul',
|
||||
'Agu',
|
||||
'Sep',
|
||||
'Okt',
|
||||
'Nov',
|
||||
'Des',
|
||||
];
|
||||
|
||||
if (from.year == to.year && from.month == to.month && from.day == to.day) {
|
||||
return '${from.day} ${months[from.month - 1]} ${from.year}';
|
||||
}
|
||||
return '${from.day} ${months[from.month - 1]} - ${to.day} ${months[to.month - 1]} ${to.year}';
|
||||
}
|
||||
|
||||
String _getMonthName(int month) {
|
||||
const months = [
|
||||
'Januari',
|
||||
'Februari',
|
||||
'Maret',
|
||||
'April',
|
||||
'Mei',
|
||||
'Juni',
|
||||
'Juli',
|
||||
'Agustus',
|
||||
'September',
|
||||
'Oktober',
|
||||
'November',
|
||||
'Desember',
|
||||
];
|
||||
return months[month - 1];
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,238 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../../common/extension/extension.dart';
|
||||
import '../../../../common/theme/theme.dart';
|
||||
import '../../../../domain/analytic/analytic.dart';
|
||||
|
||||
class ProfitLossReport extends StatelessWidget {
|
||||
final List<ProfitLossMainSummaryItem> mainSummary;
|
||||
final ProfitLossSummary summary;
|
||||
final int selectedTabIndex;
|
||||
|
||||
const ProfitLossReport({
|
||||
super.key,
|
||||
required this.mainSummary,
|
||||
required this.summary,
|
||||
required this.selectedTabIndex,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final isToday = selectedTabIndex == 0;
|
||||
final marginPct = isToday
|
||||
? summary.netProfitMargin.round()
|
||||
: summary.netProfitMargin.round();
|
||||
|
||||
return Container(
|
||||
margin: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.08),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 10,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Title row
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
context.lang.profit_loss_report,
|
||||
style: AppStyle.lg.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColor.textPrimary,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'margin $marginPct%',
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// Main summary items
|
||||
...mainSummary.map((item) => _buildSummarySection(item, isToday)),
|
||||
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Net Profit/Loss footer
|
||||
_buildNetProfitFooter(context, isToday),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSummarySection(ProfitLossMainSummaryItem item, bool isToday) {
|
||||
final nominal = isToday ? item.todayNominal : item.mtdNominal;
|
||||
final pct = isToday ? item.todayPct : item.mtdPct;
|
||||
|
||||
return Column(
|
||||
children: [
|
||||
// Main item row
|
||||
_buildItemRow(
|
||||
label: item.label,
|
||||
nominal: nominal,
|
||||
pct: pct,
|
||||
isBold: item.isBold,
|
||||
isSubItem: false,
|
||||
),
|
||||
|
||||
// Sub items
|
||||
...item.subItems.map((subItem) {
|
||||
final subNominal = isToday
|
||||
? subItem.todayNominal
|
||||
: subItem.mtdNominal;
|
||||
final subPct = isToday ? subItem.todayPct : subItem.mtdPct;
|
||||
return _buildItemRow(
|
||||
label: subItem.label,
|
||||
nominal: subNominal,
|
||||
pct: subPct,
|
||||
isBold: subItem.isBold,
|
||||
isSubItem: true,
|
||||
);
|
||||
}),
|
||||
|
||||
// Divider after section (except for sub-items only sections)
|
||||
if (item.isBold)
|
||||
const Padding(
|
||||
padding: EdgeInsets.symmetric(vertical: 8),
|
||||
child: Divider(height: 1, color: AppColor.borderLight),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildItemRow({
|
||||
required String label,
|
||||
required int nominal,
|
||||
required double pct,
|
||||
required bool isBold,
|
||||
required bool isSubItem,
|
||||
}) {
|
||||
final isNegative = nominal < 0;
|
||||
final displayNominal = isNegative
|
||||
? '-${nominal.abs().currencyFormatRp}'
|
||||
: nominal.currencyFormatRp;
|
||||
final pctText = '${pct.round()}%';
|
||||
|
||||
// Determine color based on context
|
||||
Color nominalColor;
|
||||
if (isBold && isNegative) {
|
||||
nominalColor = AppColor.error;
|
||||
} else if (isBold) {
|
||||
nominalColor = AppColor.textPrimary;
|
||||
} else {
|
||||
nominalColor = AppColor.textPrimary;
|
||||
}
|
||||
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(left: isSubItem ? 16 : 0, top: 6, bottom: 6),
|
||||
child: Row(
|
||||
children: [
|
||||
// Label
|
||||
Expanded(
|
||||
flex: 5,
|
||||
child: Text(
|
||||
label,
|
||||
style: isBold
|
||||
? AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppColor.textPrimary,
|
||||
)
|
||||
: AppStyle.md.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Nominal
|
||||
Expanded(
|
||||
flex: 3,
|
||||
child: Text(
|
||||
displayNominal,
|
||||
textAlign: TextAlign.right,
|
||||
style: isBold
|
||||
? AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: nominalColor,
|
||||
)
|
||||
: AppStyle.md.copyWith(
|
||||
color: AppColor.textPrimary,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Percentage
|
||||
SizedBox(
|
||||
width: 48,
|
||||
child: Text(
|
||||
pctText,
|
||||
textAlign: TextAlign.right,
|
||||
style: AppStyle.sm.copyWith(
|
||||
color: AppColor.textSecondary,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildNetProfitFooter(BuildContext context, bool isToday) {
|
||||
final netProfit = summary.netProfit;
|
||||
final isNegative = netProfit < 0;
|
||||
final displayValue = isNegative
|
||||
? '-${netProfit.abs().currencyFormatRp}'
|
||||
: netProfit.currencyFormatRp;
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
color: isNegative
|
||||
? AppColor.error.withOpacity(0.08)
|
||||
: AppColor.success.withOpacity(0.08),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Flexible(
|
||||
child: Text(
|
||||
context.lang.net_profit_loss,
|
||||
style: AppStyle.md.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
color: isNegative ? AppColor.error : AppColor.success,
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
displayValue,
|
||||
style: AppStyle.lg.copyWith(
|
||||
fontWeight: FontWeight.w900,
|
||||
color: isNegative ? AppColor.error : AppColor.success,
|
||||
fontSize: 20,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,70 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../../common/theme/theme.dart';
|
||||
|
||||
class FinanceSummaryCard extends StatelessWidget {
|
||||
const FinanceSummaryCard({
|
||||
super.key,
|
||||
required this.title,
|
||||
required this.amount,
|
||||
required this.icon,
|
||||
required this.color,
|
||||
required this.isPositive,
|
||||
});
|
||||
|
||||
final String title;
|
||||
final String amount;
|
||||
final IconData icon;
|
||||
final Color color;
|
||||
final bool isPositive;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColor.white,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColor.textLight.withOpacity(0.1),
|
||||
spreadRadius: 1,
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: color.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Icon(icon, color: color, size: 20),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
title,
|
||||
style: AppStyle.sm.copyWith(color: AppColor.textSecondary),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
amount,
|
||||
style: AppStyle.lg.copyWith(
|
||||
fontWeight: FontWeight.bold,
|
||||
color: AppColor.textPrimary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user