power_clamp

This commit is contained in:
mohammad
2024-10-21 16:39:10 +03:00
parent 9b0e6ff898
commit 3684ac4d27
16 changed files with 719 additions and 261 deletions

View File

@ -0,0 +1,124 @@
import 'package:flutter/material.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/view/power_info_card.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
class PhaseWidget extends StatefulWidget {
final List<Map<String, dynamic>> phaseData;
PhaseWidget({
required this.phaseData,
});
@override
_PhaseWidgetState createState() => _PhaseWidgetState();
}
class _PhaseWidgetState extends State<PhaseWidget> {
int _selectedPhaseIndex = 0;
@override
Widget build(BuildContext context) {
return Column(
children: [
SizedBox(height: 10),
Row(
children: List.generate(widget.phaseData.length, (index) {
return InkWell(
onTap: () {
setState(() {
_selectedPhaseIndex = index;
});
},
child: Padding(
padding: const EdgeInsets.only(left: 10, right: 10),
child: Text(
widget.phaseData[index]['name'],
style: TextStyle(
fontWeight: FontWeight.bold,
color: _selectedPhaseIndex == index
? Colors.black
: Colors.grey,
),
),
),
);
}),
),
SizedBox(height: 10),
_selectedPhaseIndex == 0
? phase(
totalActive: widget.phaseData[0]['activePower'] ?? '0',
totalCurrent: widget.phaseData[0]['current'] ?? '0',
totalFactor: widget.phaseData[0]['powerFactor'] ?? '0',
totalVoltage: widget.phaseData[0]['voltage'] ?? '0',
)
: _selectedPhaseIndex == 1
? phase(
totalActive: widget.phaseData[1]['activePower'] ?? '0',
totalCurrent: widget.phaseData[1]['current'] ?? '0',
totalFactor: widget.phaseData[1]['powerFactor'] ?? '0',
totalVoltage: widget.phaseData[1]['voltage'] ?? '0',
)
: phase(
totalActive: widget.phaseData[2]['activePower'] ?? '0',
totalCurrent: widget.phaseData[2]['current'] ?? '0',
totalFactor: widget.phaseData[2]['powerFactor'] ?? '0',
totalVoltage: widget.phaseData[2]['voltage'] ?? '0',
),
],
);
}
}
class phase extends StatelessWidget {
const phase({
super.key,
required this.totalVoltage,
required this.totalCurrent,
required this.totalActive,
required this.totalFactor,
});
final String totalVoltage;
final String totalCurrent;
final String totalActive;
final String totalFactor;
@override
Widget build(BuildContext context) {
return Container(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
PowerClampInfoCard(
iconPath: Assets.voltageIcon,
title: 'Voltage',
value: totalVoltage,
unit: '',
),
PowerClampInfoCard(
iconPath: Assets.voltMeterIcon,
title: 'Current',
value: totalCurrent,
unit: '',
),
PowerClampInfoCard(
iconPath: Assets.powerActiveIcon,
title: 'Active Power',
value: totalActive,
unit: '',
),
PowerClampInfoCard(
iconPath: Assets.speedoMeter,
title: 'Power Factor',
value: totalFactor,
unit: '',
),
],
),
],
),
);
}
}

View File

@ -28,9 +28,62 @@ class _EnergyConsumptionPageState extends State<EnergyConsumptionPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
return Container(
color: ColorsManager.whiteColors,
child: Column(
children: [
const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'Total Consumption',
style: TextStyle(
fontWeight: FontWeight.w700,
fontSize: 20,
),
),
Text(
'8623.20 kWh',
style: TextStyle(
fontWeight: FontWeight.w700,
fontSize: 20,
),
),
],
),
const Row(
children: [
Text(
'Energy consumption',
style: TextStyle(
color: ColorsManager.grayColor,
fontWeight: FontWeight.w700,
fontSize: 12,
),
),
],
),
const Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'01/08/2024 - 31/08/2024',
style: TextStyle(
color: ColorsManager.grayColor,
fontWeight: FontWeight.w400,
fontSize: 8,
),
),
Text(
'1000.00 kWh',
style: TextStyle(
color: ColorsManager.grayColor,
fontWeight: FontWeight.w400,
fontSize: 8,
),
),
],
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(top: 15),
@ -78,7 +131,7 @@ class _EnergyConsumptionPageState extends State<EnergyConsumptionPage> {
),
topTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
showTitles: false,
reservedSize: 70,
getTitlesWidget: (value, meta) {
int index = value.toInt();

View File

@ -24,56 +24,50 @@ class PowerClampInfoCard extends StatelessWidget {
padding: const EdgeInsets.all(5.0),
child: Container(
decoration: BoxDecoration(
color: Colors.white,
color: ColorsManager.graysColor,
borderRadius: BorderRadius.circular(20),
),
height: 55,
color: ColorsManager.graysColor,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Expanded(
child: SvgPicture.asset(
iconPath,
fit: BoxFit.fill,
),
SvgPicture.asset(
iconPath,
fit: BoxFit.fill,
),
Expanded(
flex: 3,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
value,
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w700,
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
title,
style: TextStyle(
fontSize: 8,
fontWeight: FontWeight.w400,
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
value,
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w700,
),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
value,
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w700,
),
Text(
unit,
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w700,
),
Text(
unit,
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w700,
),
),
],
),
],
),
),
],
),
],
)
],
),

View File

@ -1,66 +1,234 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/bloc/smart_power_bloc.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/bloc/smart_power_event.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/bloc/smart_power_state.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/view/power_chart.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/view/power_info_card.dart';
import 'package:syncrow_web/pages/device_managment/power_clamp/view/phase_widget.dart';
import 'package:syncrow_web/pages/device_managment/shared/device_controls_container.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';
import 'package:syncrow_web/utils/helpers/responsice_layout_helper/responsive_layout_helper.dart';
//Smart Power Clamp
class SmartPowerDeviceControl extends StatelessWidget
class SmartPowerDeviceControl extends StatefulWidget
with HelperResponsiveLayout {
final String deviceId;
const SmartPowerDeviceControl({super.key, required this.deviceId});
@override
State<SmartPowerDeviceControl> createState() =>
_SmartPowerDeviceControlState();
}
class _SmartPowerDeviceControlState extends State<SmartPowerDeviceControl> {
@override
Widget build(BuildContext context) {
return _buildStatusControls(
context,
return BlocProvider(
create: (context) => SmartPowerBloc(deviceId: widget.deviceId)
..add(SmartPowerFetchDeviceEvent(widget.deviceId)),
child: BlocBuilder<SmartPowerBloc, SmartPowerState>(
builder: (context, state) {
final _blocProvider = BlocProvider.of<SmartPowerBloc>(context);
if (state is SmartPowerLoading) {
return const Center(child: CircularProgressIndicator());
} else if (state is SmartPowerStatusLoaded) {
return _buildStatusControls(
context: context,
blocProvider: _blocProvider,
);
}
return const Center(child: CircularProgressIndicator());
// }
},
),
);
// BlocProvider(
// create: (context) => SmartPowerBloc(deviceId: deviceId)
// ..add(SmartPowerFetchDeviceEvent(deviceId)),
// child: BlocBuilder<SmartPowerBloc, SmartPowerState>(
// builder: (context, state) {
// if (state is SmartPowerLoading) {
// return const Center(child: CircularProgressIndicator());
// } else if (state is SmartPowerStatusLoaded) {
// return _buildStatusControls(context, state.status);
// }
// // else if (state is WallLightSwitchError ||
// // state is WallLightSwitchControlError) {
// // return const Center(child: Text('Error fetching status'));
// // } else {
// return const Center(child: CircularProgressIndicator());
// // }
// },
// ),
// );
}
Widget _buildStatusControls(
BuildContext context,
) {
final isExtraLarge = isExtraLargeScreenSize(context);
final isLarge = isLargeScreenSize(context);
final isMedium = isMediumScreenSize(context);
Widget _buildStatusControls({
required BuildContext context,
required SmartPowerBloc blocProvider,
}) {
PageController _pageController = PageController();
int _currentPage = 0;
void _onArrowPressed(int direction) {
setState(() {
_currentPage = (_currentPage + direction) % 3;
if (_currentPage < 0) {
_currentPage = 2;
}
_pageController.animateToPage(
_currentPage,
duration: Duration(milliseconds: 300),
curve: Curves.easeInOut,
);
});
}
return Container(
height: 150,
child: EnergyConsumptionPage(
chartData: [
EnergyData('12:00 AM', 4.0),
EnergyData('01:00 AM', 3.5),
EnergyData('02:00 AM', 3.8),
EnergyData('03:00 AM', 3.2),
EnergyData('04:00 AM', 4.0),
EnergyData('05:00 AM', 3.4),
EnergyData('06:00 AM', 3.2),
EnergyData('07:00 AM', 3.5),
EnergyData('08:00 AM', 3.8),
EnergyData('09:00 AM', 3.6),
EnergyData('10:00 AM', 3.9),
EnergyData('11:00 AM', 4.0),
],
totalConsumption: 10000,
date: '10/08/2024',
child: DeviceControlsContainer(
child: Column(
children: [
const Row(
children: [
Text(
'Live',
style: TextStyle(
fontSize: 32,
fontWeight: FontWeight.w700,
color: ColorsManager.grayColor),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
PowerClampInfoCard(
iconPath: Assets.powerActiveIcon,
title: 'Active',
value: blocProvider
.deviceStatus.status.general.dataPoints[0].value
.toString(),
unit: '',
),
PowerClampInfoCard(
iconPath: Assets.voltMeterIcon,
title: 'Current',
value: blocProvider
.deviceStatus.status.general.dataPoints[1].value
.toString(),
unit: ' A',
),
PowerClampInfoCard(
iconPath: Assets.frequencyIcon,
title: 'Frequency',
value: blocProvider
.deviceStatus.status.general.dataPoints[2].value
.toString(),
unit: ' Hz',
),
],
),
PhaseWidget(
phaseData: blocProvider.phaseData,
),
Container(
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: ColorsManager.whiteColors,
borderRadius: BorderRadius.circular(20),
),
height: 250,
child: Column(
children: [
Container(
decoration: BoxDecoration(
color: ColorsManager.graysColor,
borderRadius: BorderRadius.circular(20),
),
height: 60,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
IconButton(
icon: Icon(Icons.arrow_left),
onPressed: () => _onArrowPressed(-1),
),
Text(
_currentPage == 0
? 'Total'
: _currentPage == 0
? 'Phase A'
: _currentPage == 0
? 'Phase B'
: 'Phase C',
style: TextStyle(fontSize: 18),
),
IconButton(
icon: Icon(Icons.arrow_right),
onPressed: () => _onArrowPressed(1),
),
],
),
),
Expanded(
child: PageView(
controller: _pageController,
onPageChanged: (int page) {
setState(() {
_currentPage = page;
});
},
children: [
EnergyConsumptionPage(
chartData: [
EnergyData('12:00 AM', 4.0),
EnergyData('01:00 AM', 3.5),
EnergyData('02:00 AM', 3.8),
EnergyData('03:00 AM', 3.2),
EnergyData('04:00 AM', 4.0),
EnergyData('05:00 AM', 3.4),
EnergyData('06:00 AM', 3.2),
EnergyData('07:00 AM', 3.5),
EnergyData('08:00 AM', 3.8),
EnergyData('09:00 AM', 3.6),
EnergyData('10:00 AM', 3.9),
EnergyData('10:00 AM', 3.9),
EnergyData('11:00 AM', 4.0),
],
totalConsumption: 10000,
date: '10/08/2024',
),
EnergyConsumptionPage(
chartData: [
EnergyData('12:00 AM', 4.0),
EnergyData('01:00 AM', 3.5),
EnergyData('02:00 AM', 3.8),
EnergyData('03:00 AM', 3.2),
EnergyData('04:00 AM', 4.0),
EnergyData('05:00 AM', 3.4),
EnergyData('06:00 AM', 3.2),
EnergyData('07:00 AM', 3.5),
EnergyData('08:00 AM', 3.8),
EnergyData('09:00 AM', 3.6),
EnergyData('10:00 AM', 3.9),
EnergyData('10:00 AM', 3.9),
EnergyData('11:00 AM', 4.0),
],
totalConsumption: 10000,
date: '10/08/2024',
),
EnergyConsumptionPage(
chartData: [
EnergyData('12:00 AM', 4.0),
EnergyData('01:00 AM', 6.5),
EnergyData('02:00 AM', 3.8),
EnergyData('03:00 AM', 3.2),
EnergyData('04:00 AM', 6.0),
EnergyData('05:00 AM', 3.4),
EnergyData('06:00 AM', 5.2),
EnergyData('07:00 AM', 3.5),
EnergyData('08:00 AM', 3.8),
EnergyData('09:00 AM', 5.6),
EnergyData('10:00 AM', 6.9),
EnergyData('10:00 AM', 3.9),
EnergyData('11:00 AM', 6.0),
],
totalConsumption: 10000,
date: '10/08/2024',
),
],
),
),
],
),
),
],
),
),
);
}