Extracted and implemented EnergyConsumptionPerDeviceDevicesList.

This commit is contained in:
Faris Armoush
2025-05-04 10:55:32 +03:00
parent 24c30ddcb5
commit d8faafd1c0

View File

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/analytics/modules/energy_management/widgets/energy_consumption_per_device_chart.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/style.dart';
class EnergyConsumptionPerDeviceChartBox extends StatelessWidget {
@ -12,7 +13,7 @@ class EnergyConsumptionPerDeviceChartBox extends StatelessWidget {
borderRadius: BorderRadius.circular(30),
),
padding: const EdgeInsets.all(30),
child: Column(
child: const Column(
spacing: 20,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
@ -29,23 +30,7 @@ class EnergyConsumptionPerDeviceChartBox extends StatelessWidget {
Spacer(),
Expanded(
flex: 2,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
spacing: 16,
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisAlignment: MainAxisAlignment.end,
children: List.generate(
20,
(index) => Chip(
label: Text('Device ${index + 1}'),
backgroundColor: Colors.blueAccent,
labelStyle: TextStyle(color: Colors.white),
),
).toList(),
),
),
child: EnergyConsumptionPerDeviceDevicesList(),
),
],
),
@ -56,3 +41,53 @@ class EnergyConsumptionPerDeviceChartBox extends StatelessWidget {
);
}
}
class EnergyConsumptionPerDeviceDevicesList extends StatelessWidget {
const EnergyConsumptionPerDeviceDevicesList({super.key});
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
spacing: 16,
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisAlignment: MainAxisAlignment.end,
children: List.generate(
20,
(index) => _buildDeviceCell(index),
).toList(),
),
);
}
Widget _buildDeviceCell(int index) {
return Container(
padding: EdgeInsetsDirectional.symmetric(
vertical: 8,
horizontal: 12,
),
decoration: BoxDecoration(
borderRadius: BorderRadiusDirectional.circular(8),
border: Border.all(
color: ColorsManager.greyColor,
width: 1,
),
),
child: Row(
spacing: 6,
children: [
CircleAvatar(
radius: 4,
backgroundColor: Colors.purple,
),
Text(
'Device ${index + 1}',
textAlign: TextAlign.center,
),
],
),
);
}
}