mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 07:07:19 +00:00
Refactor TotalEnergyConsumptionChart
to TotalEnergyConsumptionChartBox
for improved layout and encapsulation.
This commit is contained in:
@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/energy_consumption_by_phases_chart.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/energy_consumption_per_device_chart.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/power_clamp_energy_data_widget.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/total_energy_consumption_chart.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/total_energy_consumption_chart_box.dart';
|
||||
import 'package:syncrow_web/utils/style.dart';
|
||||
|
||||
class AnalyticsEnergyManagementView extends StatelessWidget {
|
||||
@ -20,7 +20,7 @@ class AnalyticsEnergyManagementView extends StatelessWidget {
|
||||
child: Column(
|
||||
spacing: 20,
|
||||
children: [
|
||||
Expanded(child: TotalEnergyConsumptionChart()),
|
||||
Expanded(child: TotalEnergyConsumptionChartBox()),
|
||||
Expanded(child: EnergyConsumptionPerDeviceChart()),
|
||||
],
|
||||
),
|
||||
|
@ -2,60 +2,70 @@ import 'package:fl_chart/fl_chart.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:syncrow_web/utils/color_manager.dart';
|
||||
import 'package:syncrow_web/utils/extension/build_context_x.dart';
|
||||
import 'package:syncrow_web/utils/style.dart';
|
||||
|
||||
const _chartData = [
|
||||
EnergyData('JAN', 18000),
|
||||
EnergyData('FEB', 25000),
|
||||
EnergyData('MAR', 22000),
|
||||
EnergyData('APR', 21000),
|
||||
EnergyData('MAY', 30000),
|
||||
EnergyData('JUN', 23000),
|
||||
EnergyData('JUL', 21000),
|
||||
EnergyData('AUG', 25000),
|
||||
EnergyData('SEP', 21100),
|
||||
EnergyData('OCT', 22000),
|
||||
EnergyData('NOV', 21000),
|
||||
EnergyData('DEC', 27500),
|
||||
];
|
||||
|
||||
class EnergyData {
|
||||
const EnergyData(this.time, this.consumption);
|
||||
final String time;
|
||||
final double consumption;
|
||||
}
|
||||
|
||||
// energy_consumption_chart will return id, name and consumption
|
||||
final s = {
|
||||
"1": {
|
||||
"phaseOne": 1000,
|
||||
"phaseTwo": 2000,
|
||||
"phaseThree": 3000,
|
||||
}
|
||||
};
|
||||
|
||||
class TotalEnergyConsumptionChart extends StatelessWidget {
|
||||
const TotalEnergyConsumptionChart({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
decoration: subSectionContainerDecoration.copyWith(
|
||||
borderRadius: BorderRadius.circular(30),
|
||||
),
|
||||
padding: const EdgeInsets.all(30),
|
||||
child: Column(
|
||||
spacing: 20,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Total Energy Consumption',
|
||||
style: TextStyle(
|
||||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
return Expanded(
|
||||
child: LineChart(
|
||||
LineChartData(
|
||||
titlesData: _titlesData(context),
|
||||
lineBarsData: _lineBarsData,
|
||||
gridData: FlGridData(
|
||||
show: true,
|
||||
drawVerticalLine: false,
|
||||
drawHorizontalLine: true,
|
||||
),
|
||||
Expanded(
|
||||
child: LineChart(
|
||||
LineChartData(
|
||||
titlesData: _titlesData(context),
|
||||
lineBarsData: _lineBarsData,
|
||||
gridData: FlGridData(
|
||||
show: true,
|
||||
drawVerticalLine: false,
|
||||
drawHorizontalLine: true,
|
||||
),
|
||||
borderData: FlBorderData(
|
||||
show: true,
|
||||
border: const Border.symmetric(
|
||||
horizontal: BorderSide(
|
||||
color: ColorsManager.greyColor,
|
||||
width: 1,
|
||||
style: BorderStyle.solid,
|
||||
),
|
||||
),
|
||||
),
|
||||
lineTouchData: LineTouchData(
|
||||
handleBuiltInTouches: true,
|
||||
touchSpotThreshold: 2,
|
||||
touchTooltipData: _lineTouchTooltipData(),
|
||||
),
|
||||
borderData: FlBorderData(
|
||||
show: true,
|
||||
border: const Border.symmetric(
|
||||
horizontal: BorderSide(
|
||||
color: ColorsManager.greyColor,
|
||||
width: 1,
|
||||
style: BorderStyle.solid,
|
||||
),
|
||||
duration: Durations.extralong1,
|
||||
curve: Curves.easeIn,
|
||||
),
|
||||
),
|
||||
],
|
||||
lineTouchData: LineTouchData(
|
||||
handleBuiltInTouches: true,
|
||||
touchSpotThreshold: 2,
|
||||
touchTooltipData: _lineTouchTooltipData(),
|
||||
),
|
||||
),
|
||||
duration: Durations.extralong1,
|
||||
curve: Curves.easeIn,
|
||||
),
|
||||
);
|
||||
}
|
||||
@ -205,33 +215,3 @@ class TotalEnergyConsumptionChart extends StatelessWidget {
|
||||
return values[month.toInt()] ?? 'N/A';
|
||||
}
|
||||
}
|
||||
|
||||
const _chartData = [
|
||||
EnergyData('JAN', 18000),
|
||||
EnergyData('FEB', 25000),
|
||||
EnergyData('MAR', 22000),
|
||||
EnergyData('APR', 21000),
|
||||
EnergyData('MAY', 30000),
|
||||
EnergyData('JUN', 23000),
|
||||
EnergyData('JUL', 21000),
|
||||
EnergyData('AUG', 25000),
|
||||
EnergyData('SEP', 21100),
|
||||
EnergyData('OCT', 22000),
|
||||
EnergyData('NOV', 21000),
|
||||
EnergyData('DEC', 27500),
|
||||
];
|
||||
|
||||
class EnergyData {
|
||||
const EnergyData(this.time, this.consumption);
|
||||
final String time;
|
||||
final double consumption;
|
||||
}
|
||||
|
||||
// energy_consumption_chart will return id, name and consumption
|
||||
final s = {
|
||||
"1": {
|
||||
"phaseOne": 1000,
|
||||
"phaseTwo": 2000,
|
||||
"phaseThree": 3000,
|
||||
}
|
||||
};
|
||||
|
@ -0,0 +1,31 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/total_energy_consumption_chart.dart';
|
||||
import 'package:syncrow_web/utils/style.dart';
|
||||
|
||||
class TotalEnergyConsumptionChartBox extends StatelessWidget {
|
||||
const TotalEnergyConsumptionChartBox({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
decoration: subSectionContainerDecoration.copyWith(
|
||||
borderRadius: BorderRadius.circular(30),
|
||||
),
|
||||
padding: const EdgeInsets.all(30),
|
||||
child: Column(
|
||||
spacing: 20,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Total Energy Consumption',
|
||||
style: TextStyle(
|
||||
fontSize: 22,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
const TotalEnergyConsumptionChart(),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user