mirror of
https://github.com/SyncrowIOT/web.git
synced 2025-07-10 07:07:19 +00:00
finished integrating realtime data.
This commit is contained in:
@ -1,12 +1,27 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/air_quality/widgets/air_quality_end_side_widget.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/air_quality/widgets/range_of_aqi_chart_box.dart';
|
||||
import 'package:syncrow_web/pages/analytics/modules/energy_management/blocs/realtime_device_changes/realtime_device_changes_bloc.dart';
|
||||
|
||||
class AirQualityView extends StatelessWidget {
|
||||
class AirQualityView extends StatefulWidget {
|
||||
const AirQualityView({super.key});
|
||||
|
||||
static const _padding = EdgeInsetsDirectional.all(32);
|
||||
|
||||
@override
|
||||
State<AirQualityView> createState() => _AirQualityViewState();
|
||||
}
|
||||
|
||||
class _AirQualityViewState extends State<AirQualityView> {
|
||||
@override
|
||||
void initState() {
|
||||
context.read<RealtimeDeviceChangesBloc>().add(
|
||||
const RealtimeDeviceChangesStarted('078e4ed4-8f85-47b8-8c78-5a766549135d'),
|
||||
);
|
||||
super.initState();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return LayoutBuilder(
|
||||
@ -15,7 +30,7 @@ class AirQualityView extends StatelessWidget {
|
||||
final height = MediaQuery.sizeOf(context).height;
|
||||
if (isMediumOrLess) {
|
||||
return SingleChildScrollView(
|
||||
padding: _padding,
|
||||
padding: AirQualityView._padding,
|
||||
child: Column(
|
||||
spacing: 32,
|
||||
children: [
|
||||
@ -32,7 +47,7 @@ class AirQualityView extends StatelessWidget {
|
||||
|
||||
return SingleChildScrollView(
|
||||
child: Container(
|
||||
padding: _padding,
|
||||
padding: AirQualityView._padding,
|
||||
height: height * 1.1,
|
||||
child: const Column(
|
||||
children: [
|
||||
|
@ -11,16 +11,19 @@ import 'package:syncrow_web/utils/style.dart';
|
||||
class AqiDeviceInfo extends StatelessWidget {
|
||||
const AqiDeviceInfo({super.key});
|
||||
|
||||
double _getValueForStatus(
|
||||
String _getValueForStatus(
|
||||
List<Status> deviceStatusList,
|
||||
String code, {
|
||||
double defaultValue = 0,
|
||||
String Function(int value)? formatter,
|
||||
}) {
|
||||
try {
|
||||
final foundStatus = deviceStatusList.firstWhere((e) => e.code == code);
|
||||
return double.parse(foundStatus.value.toString());
|
||||
} catch (_) {
|
||||
return defaultValue;
|
||||
final value = foundStatus.value.toString();
|
||||
final intValue = int.parse(value);
|
||||
return formatter != null ? formatter(intValue) : intValue.toString();
|
||||
} catch (e) {
|
||||
return defaultValue.toString();
|
||||
}
|
||||
}
|
||||
|
||||
@ -29,13 +32,42 @@ class AqiDeviceInfo extends StatelessWidget {
|
||||
return BlocBuilder<RealtimeDeviceChangesBloc, RealtimeDeviceChangesState>(
|
||||
builder: (context, state) {
|
||||
final status = state.deviceStatusList;
|
||||
final humidityValue = _getValueForStatus(status, 'humidity_value');
|
||||
final tempValue = _getValueForStatus(status, 'temp_current');
|
||||
final pm25Value = _getValueForStatus(status, 'pm25_value');
|
||||
final pm10Value = _getValueForStatus(status, 'pm10');
|
||||
final co2Value = _getValueForStatus(status, 'co2_value');
|
||||
final ch2oValue = _getValueForStatus(status, 'ch2o_value');
|
||||
final tvocValue = _getValueForStatus(status, 'tvoc_value');
|
||||
final humidityValue = _getValueForStatus(
|
||||
status,
|
||||
'humidity_value',
|
||||
formatter: (value) => value.toStringAsFixed(0),
|
||||
);
|
||||
|
||||
final tempValue = _getValueForStatus(
|
||||
status,
|
||||
'temp_current',
|
||||
formatter: (value) => value.toStringAsFixed(0),
|
||||
);
|
||||
final pm25Value = _getValueForStatus(
|
||||
status,
|
||||
'pm25_value',
|
||||
formatter: (value) => value.toString().padLeft(3, '0'),
|
||||
);
|
||||
final pm10Value = _getValueForStatus(
|
||||
status,
|
||||
'pm10',
|
||||
formatter: (value) => value.toString().padLeft(3, '0'),
|
||||
);
|
||||
final co2Value = _getValueForStatus(
|
||||
status,
|
||||
'co2_value',
|
||||
formatter: (value) => value.toString().padLeft(4, '0'),
|
||||
);
|
||||
final ch2oValue = _getValueForStatus(
|
||||
status,
|
||||
'ch2o_value',
|
||||
formatter: (value) => (value / 100).toStringAsFixed(2),
|
||||
);
|
||||
final tvocValue = _getValueForStatus(
|
||||
status,
|
||||
'tvoc_value',
|
||||
formatter: (value) => (value / 100).toStringAsFixed(2),
|
||||
);
|
||||
|
||||
return Container(
|
||||
decoration: secondarySection.copyWith(boxShadow: const []),
|
||||
@ -46,34 +78,30 @@ class AqiDeviceInfo extends StatelessWidget {
|
||||
children: [
|
||||
const AirQualityEndSideLiveIndicator(),
|
||||
AirQualityEndSideGaugeAndInfo(
|
||||
temperature: humidityValue.toInt(),
|
||||
humidity: tempValue.toInt(),
|
||||
temperature: int.parse(tempValue),
|
||||
humidity: int.parse(humidityValue),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
AqiSubValueWidget(
|
||||
range: (0, 999),
|
||||
label: AqiType.pm25.value,
|
||||
value: pm25Value < 100
|
||||
? double.parse(pm25Value.toStringAsFixed(1).padLeft(4, '0'))
|
||||
: pm25Value,
|
||||
value: pm25Value,
|
||||
unit: AqiType.pm25.unit,
|
||||
),
|
||||
AqiSubValueWidget(
|
||||
range: (0, 999),
|
||||
label: AqiType.pm10.value,
|
||||
value: pm10Value < 100
|
||||
? double.parse(pm10Value.toStringAsFixed(1).padLeft(4, '0'))
|
||||
: pm10Value,
|
||||
value: pm10Value,
|
||||
unit: AqiType.pm10.unit,
|
||||
),
|
||||
AqiSubValueWidget(
|
||||
range: (0, 5),
|
||||
label: AqiType.hcho.value,
|
||||
value: double.parse(ch2oValue.toStringAsFixed(2)),
|
||||
value: ch2oValue,
|
||||
unit: AqiType.hcho.unit,
|
||||
),
|
||||
AqiSubValueWidget(
|
||||
range: (0, 9.99),
|
||||
range: (0, 999),
|
||||
label: AqiType.tvoc.value,
|
||||
value: tvocValue,
|
||||
unit: AqiType.tvoc.unit,
|
||||
@ -84,12 +112,6 @@ class AqiDeviceInfo extends StatelessWidget {
|
||||
value: co2Value,
|
||||
unit: AqiType.co2.unit,
|
||||
),
|
||||
AqiSubValueWidget(
|
||||
range: (0, 100),
|
||||
label: AqiType.c6h6.value,
|
||||
value: 18,
|
||||
unit: AqiType.c6h6.unit,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
@ -17,6 +17,23 @@ class AqiSubValueWidget extends StatelessWidget {
|
||||
required this.range,
|
||||
super.key,
|
||||
});
|
||||
|
||||
final String label;
|
||||
final String value;
|
||||
final String unit;
|
||||
final (double min, double max) range;
|
||||
|
||||
double get _parsedValue => double.parse(value);
|
||||
|
||||
static const List<_AqiRange> _ranges = [
|
||||
_AqiRange(max: 12, color: ColorsManager.goodGreen),
|
||||
_AqiRange(max: 35, color: ColorsManager.poorOrange),
|
||||
_AqiRange(max: 55, color: ColorsManager.poorOrange),
|
||||
_AqiRange(max: 150, color: ColorsManager.unhealthyRed),
|
||||
_AqiRange(max: 250, color: ColorsManager.severePink),
|
||||
_AqiRange(max: 500, color: ColorsManager.hazardousPurple),
|
||||
];
|
||||
|
||||
static List<_AqiRange> _getRangesForValue((double min, double max) range) {
|
||||
final (double min, double max) = range;
|
||||
final rangeSize = (max - min) / 6;
|
||||
@ -38,24 +55,9 @@ class AqiSubValueWidget extends StatelessWidget {
|
||||
return ranges.length - 1;
|
||||
}
|
||||
|
||||
|
||||
final String label;
|
||||
final double value;
|
||||
final String unit;
|
||||
final (double min, double max) range;
|
||||
|
||||
static const List<_AqiRange> _ranges = [
|
||||
_AqiRange(max: 12, color: ColorsManager.goodGreen),
|
||||
_AqiRange(max: 35, color: ColorsManager.poorOrange),
|
||||
_AqiRange(max: 55, color: ColorsManager.poorOrange),
|
||||
_AqiRange(max: 150, color: ColorsManager.unhealthyRed),
|
||||
_AqiRange(max: 250, color: ColorsManager.severePink),
|
||||
_AqiRange(max: 500, color: ColorsManager.hazardousPurple),
|
||||
];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final activeSegment = _getActiveSegmentByRange(value, range);
|
||||
final activeSegment = _getActiveSegmentByRange(_parsedValue, range);
|
||||
return Expanded(
|
||||
child: Container(
|
||||
padding: const EdgeInsetsDirectional.all(10),
|
||||
@ -86,7 +88,7 @@ class AqiSubValueWidget extends StatelessWidget {
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
value.toString(),
|
||||
value,
|
||||
style: context.textTheme.titleMedium?.copyWith(
|
||||
color: ColorsManager.blackColor,
|
||||
fontWeight: FontWeight.w400,
|
||||
|
@ -8,8 +8,7 @@ enum AqiType {
|
||||
pm10('PM10', 'µg/m³'),
|
||||
hcho('HCHO', 'mg/m³'),
|
||||
tvoc('TVOC', 'µg/m³'),
|
||||
co2('CO2', 'ppm'),
|
||||
c6h6('C6H6', 'µg/m³');
|
||||
co2('CO2', 'ppm');
|
||||
|
||||
const AqiType(this.value, this.unit);
|
||||
|
||||
|
Reference in New Issue
Block a user