Update Pie Chart In DeviceManagerScreen

This commit is contained in:
anhtunz
2024-12-24 11:16:00 +07:00
parent e047fe1e27
commit 77afc09d19
6 changed files with 297 additions and 29 deletions

View File

@@ -0,0 +1,180 @@
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:sfm_app/feature/devices/device_model.dart';
import 'package:sfm_app/product/extention/context_extention.dart';
import 'package:sfm_app/product/services/language_services.dart';
import '../constant/app/app_constants.dart';
class SharedPieChart extends StatelessWidget {
const SharedPieChart({
super.key,
required this.deviceByState,
});
final Map<String, List<Device>> deviceByState;
@override
Widget build(BuildContext context) {
TextStyle titleStyle = const TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.bold,
);
int offlineCount =
deviceByState[ApplicationConstants.OFFLINE_STATE]?.length ?? 0;
int normalCount =
deviceByState[ApplicationConstants.NORMAL_STATE]?.length ?? 0;
int warningCount =
deviceByState[ApplicationConstants.WARNING_STATE]?.length ?? 0;
int inProgressCount =
deviceByState[ApplicationConstants.INPROGRESS_STATE]?.length ?? 0;
int errorCount =
deviceByState[ApplicationConstants.ERROR_STATE]?.length ?? 0;
return Padding(
padding: context.paddingLowHorizontal,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Container(
width: context.dynamicWidth(0.5),
height: context.dynamicHeight(0.3),
padding: const EdgeInsets.all(10),
child: PieChart(
PieChartData(
sections: [
PieChartSectionData(
color: Colors.grey,
value: offlineCount.toDouble(),
title: offlineCount.toString(),
radius: context.dynamicWidth(0.3),
titleStyle: titleStyle,
),
PieChartSectionData(
color: Colors.green,
value: normalCount.toDouble(),
title: normalCount.toString(),
radius: context.dynamicWidth(0.3),
titleStyle: titleStyle,
),
PieChartSectionData(
color: Colors.red,
value: warningCount.toDouble(),
title: warningCount.toString(),
radius: context.dynamicWidth(0.3),
titleStyle: titleStyle,
),
PieChartSectionData(
color: Colors.yellow,
value: inProgressCount.toDouble(),
title: inProgressCount.toString(),
radius: context.dynamicWidth(0.3),
titleStyle: titleStyle,
),
PieChartSectionData(
color: Colors.black, // Có thể thêm màu cho trạng thái lỗi
value: errorCount.toDouble(),
title: errorCount.toString(),
radius: context.dynamicWidth(0.3),
titleStyle: titleStyle,
),
],
centerSpaceRadius: 0,
sectionsSpace: 1,
),
),
),
Column(
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Indicator(
color: Colors.grey,
text: appLocalization(context).inactive_devices_message,
isSquare: true,
),
SizedBox(
height: context.lowValue,
),
Indicator(
color: Colors.green,
text: appLocalization(context).active_devices_message,
isSquare: true,
),
SizedBox(
height: context.lowValue,
),
Indicator(
color: Colors.red,
text: appLocalization(context).warning_devices_message,
isSquare: true,
),
SizedBox(
height: context.lowValue,
),
Indicator(
color: Colors.yellow,
text: appLocalization(context).in_progress_message,
isSquare: true,
),
SizedBox(
height: context.lowValue,
),
Indicator(
color: Colors.black,
text: appLocalization(context).error_message_uppercase,
isSquare: true,
),
// const SizedBox(
// height: 18,
// ),
],
),
],
),
);
}
}
class Indicator extends StatelessWidget {
const Indicator({
super.key,
required this.color,
required this.text,
required this.isSquare,
this.size = 16,
this.textColor,
});
final Color color;
final String text;
final bool isSquare;
final double size;
final Color? textColor;
@override
Widget build(BuildContext context) {
return Row(
children: <Widget>[
Container(
width: size,
height: size,
decoration: BoxDecoration(
shape: isSquare ? BoxShape.rectangle : BoxShape.circle,
color: color,
),
),
SizedBox(
width: context.lowValue,
),
Text(
text,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: textColor,
),
)
],
);
}
}