Skip to content

S
smart_hotel_app
Commit aba1fd46 authored by 张宏's avatar 张宏
Browse files
Options

.

parent 95ab7cfd
Show whitespace changes
Inline Side-by-side
Showing with 254 additions and 323 deletions
lib/views/home/abnormal/abnormal_detail_view.dart
View file @ aba1fd46
......@@ -16,22 +16,24 @@ class AbnormalDetailView extends StatefulWidget {
class _AbnormalDetailViewState extends State<AbnormalDetailView> {
late final HomeAbnormalController _controller;
late final AlarmInfo _alarmInfo;
@override
void initState() {
super.initState();
_controller = HomeAbnormalController(context);
_alarmInfo = _controller.getAlarmInfo();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color.fromRGBO(15, 23, 42, 1),
backgroundColor: Color.fromRGBO(242, 243, 245, 1),
appBar: AppBar(
backgroundColor: Color.fromRGBO(15, 23, 42, 1),
backgroundColor: Colors.white,
elevation: 0,
leading: IconButton(
icon: Icon(Icons.arrow_back, color: Colors.white),
icon: Icon(Icons.arrow_back_ios, color: Color.fromRGBO(100, 116, 139, 1),),
onPressed: () {
context.popRoute();
},
......@@ -39,105 +41,82 @@ class _AbnormalDetailViewState extends State<AbnormalDetailView> {
title: Text(
'告警详情',
style: TextStyle(
color: Colors.white,
fontSize: 18.sp,
fontWeight: FontWeight.bold,
color: Color.fromRGBO(10, 13, 20, 1),
fontSize: 32.sp,
fontWeight: FontWeight.w200,
),
),
centerTitle: true,
),
body: SingleChildScrollView(
padding: EdgeInsets.symmetric(horizontal: 28.w),
child: Column(
children: [
TemperatureBlock(),
TemperatureCharBlock(),
AlarmInfoBlock(),
SizedBox(height: 120.h),
TemperatureBlock(alarmInfo: _alarmInfo),
SizedBox(height: 10.h),
TemperatureCharBlock(alarmInfo: _alarmInfo),
SizedBox(height: 10.h),
AlarmInfoBlock(alarmInfo: _alarmInfo),
SizedBox(height: 10.h),
_buildBottomButtons(),
SizedBox(height: 30.h),
],
),
),
bottomNavigationBar: _buildBottomButtons(),
);
}
Widget _buildBottomButtons() {
return Container(
width: double.infinity,
padding: EdgeInsets.symmetric(horizontal: 20.w, vertical: 15.h),
decoration: BoxDecoration(
color: Color.fromRGBO(15, 23, 42, 1),
border: Border(
top: BorderSide(
color: Color.fromRGBO(30, 41, 59, 1),
width: 1.w,
),
),
),
padding: EdgeInsets.symmetric(vertical: 15.h),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
children: [
Expanded(
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Color.fromRGBO(246, 158, 11, 1.0),
minimumSize: Size(double.infinity, 55.h),
padding: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15.r),
),
Container(
width: double.infinity,
height: 70.h,
decoration: BoxDecoration(
color: Color.fromRGBO(59, 130, 246, 1),
borderRadius: BorderRadius.circular(20.r),
),
onPressed: () {
print("确认处理");
},
child: TextButton(
onPressed: _controller.handleConfirm,
child: Text(
"确认处理",
style: TextStyle(fontSize: 16.sp, color: Colors.white),
),
'确认处理',
style: TextStyle(
fontSize: 22.sp,
color: Colors.white,
),
),
SizedBox(width: 12.w),
Expanded(
child: ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Color.fromRGBO(51, 65, 85, 1),
minimumSize: Size(double.infinity, 55.h),
padding: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15.r),
),
),
onPressed: _controller.navigateToDeviceDetail,
child: Text(
"查看关联设备 →",
style: TextStyle(fontSize: 16.sp, color: Colors.white),
SizedBox(height: 20.h),
Container(
width: double.infinity,
height: 70.h,
decoration: BoxDecoration(
color: Color.fromRGBO(209, 213, 219, 1),
borderRadius: BorderRadius.circular(20.r),
),
child: TextButton(
onPressed: _controller.handleViewDevice,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'查看关联设备',
style: TextStyle(
fontSize: 22.sp,
color: Color.fromRGBO(75, 85, 99, 1),
),
),
SizedBox(width: 8.w),
Icon(Icons.launch, color: Color.fromRGBO(75, 85, 99, 1)),
],
),
// SizedBox(height: 10.h),
// Container(
// width: double.infinity,
// height: 55.h,
// decoration: BoxDecoration(
// color: Color.fromRGBO(30, 41, 59, 1),
// borderRadius: BorderRadius.circular(15.r),
// ),
// child: TextButton(
// onPressed: () {
// print("查看关联设备");
// },
// child: Text(
// "查看关联设备 →",
// style: TextStyle(
// fontSize: 16.sp,
// color: Colors.grey,
// ),
// ),
// ),
// ),
),
),
],
),
);
......
lib/views/home/abnormal/child/alarm_info_block.dart
View file @ aba1fd46
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:smart_hotel_app/views/home/abnormal/controller.dart';
class AlarmInfoBlock extends StatelessWidget {
const AlarmInfoBlock({super.key});
final AlarmInfo alarmInfo;
const AlarmInfoBlock({super.key, required this.alarmInfo});
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
margin: EdgeInsets.only(top: 10.h, left: 20.w, right: 20.w),
padding: EdgeInsets.all(20.w),
margin: EdgeInsets.only(top: 10.h),
padding: EdgeInsets.all(25.w),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.r),
color: Color.fromRGBO(30, 41, 59, 1),
color: Colors.white,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'告警信息',
'电压波动告警',
style: TextStyle(
fontSize: 18.sp,
color: Colors.white,
fontSize: 28.sp,
color: Color.fromRGBO(17, 24, 39, 1),
fontWeight: FontWeight.bold,
),
),
SizedBox(height: 15.h),
_buildInfoRow('触发时间', '2026-05-09 14:23:18'),
SizedBox(height: 12.h),
SizedBox(height: 30.h),
_buildInfoRow('触发时间', alarmInfo.triggerTime),
SizedBox(height: 25.h),
_buildInfoRow(
'告警级别',
'高警 (Level 3)',
valueColor: Color.fromRGBO(246, 158, 11, 1.0),
'${alarmInfo.alarmLevel}(Level 3)',
valueColor: Color.fromRGBO(239, 68, 68, 1),
),
SizedBox(height: 25.h),
_buildInfoRow('闭值设置', alarmInfo.threshold),
SizedBox(height: 25.h),
_buildInfoRow('持续时间', alarmInfo.duration),
SizedBox(height: 25.h),
_buildInfoRow(
'峰值记录',
alarmInfo.peak,
valueColor: Color.fromRGBO(251, 191, 36, 1),
),
SizedBox(height: 12.h),
_buildInfoRow('阈值设置', '温度 > 80℃ 触发'),
SizedBox(height: 12.h),
_buildInfoRow('持续时间', '2小时37分钟'),
SizedBox(height: 12.h),
_buildInfoRow('峰值记录', '89.2℃ (15:02)'),
SizedBox(height: 12.h),
SizedBox(height: 25.h),
_buildInfoRow(
'关联联动',
'自动断电保护 →',
valueColor: Color.fromRGBO(59, 130, 246, 1.0),
alarmInfo.linkAction,
valueColor: Color.fromRGBO(59, 130, 246, 1),
),
],
),
......@@ -57,15 +64,15 @@ class AlarmInfoBlock extends StatelessWidget {
Text(
label,
style: TextStyle(
fontSize: 15.sp,
color: Colors.grey,
fontSize: 20.sp,
color: Color.fromRGBO(107, 114, 128, 1),
),
),
Text(
value,
style: TextStyle(
fontSize: 15.sp,
color: valueColor ?? Colors.white,
fontSize: 20.sp,
color: valueColor ?? Color.fromRGBO(107, 114, 128, 1),
),
),
],
......
lib/views/home/abnormal/child/temperature_block.dart
View file @ aba1fd46
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:smart_hotel_app/views/home/abnormal/controller.dart';
class TemperatureBlock extends StatefulWidget {
const TemperatureBlock({super.key});
class TemperatureBlock extends StatelessWidget {
final AlarmInfo alarmInfo;
@override
State<TemperatureBlock> createState() => _TemperatureBlockState();
}
const TemperatureBlock({super.key, required this.alarmInfo});
class _TemperatureBlockState extends State<TemperatureBlock> {
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
// height: 280.h,
margin: EdgeInsets.only(top: 10.h,left: 20.w,right: 20.w),
padding: EdgeInsets.all(20.w),
margin: EdgeInsets.only(top: 10.h),
padding: EdgeInsets.all(25.w),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.r),
color: Color.fromRGBO(30, 41, 59, 1),
border: Border(
left: BorderSide(
color: Color.fromRGBO(246, 158, 11, 1.0),
width: 10.w,
)),
color: Colors.white,
),
child: Column(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 描述信息
Container(
width: double.infinity,
// height: 100.h,
margin: EdgeInsets.only(bottom: 10.h),
width: 64.w,
height: 66.h,
decoration: BoxDecoration(
border:BoxBorder.all(
color: Color.fromRGBO(246, 158, 11, 1.0),
width: 1.w,
color: Color.fromRGBO(219, 234, 254, 1),
borderRadius: BorderRadius.circular(15.r),
),
child: Icon(
Icons.thermostat_outlined,
color: Color.fromRGBO(59, 130, 246, 1),
size: 35.sp,
),
child:Flex(
direction: Axis.horizontal,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 50.w,
height: 50.h,
decoration: BoxDecoration(
color: Color.fromRGBO(71, 85, 105, 0.3),
borderRadius: BorderRadius.circular(8.r),
),
child: Icon(Icons.thermostat,color: Color.fromRGBO(246, 158, 11, 1),size: 20.sp,),
),
SizedBox(width: 15.w),
Expanded(
child: Container(
width: 50.w,
padding: EdgeInsets.only(left: 10.w),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("温度异常告警",style: TextStyle(fontSize: 20.sp,color: Color.fromRGBO(246, 158, 11, 1.0),),),
Text("客房301 A-301 智能空开",style: TextStyle(fontSize: 15.sp,color: Colors.grey),),
],
),
),
Text(
alarmInfo.alarmType,
style: TextStyle(
fontSize: 28.sp,
color: Colors.black,
fontWeight: FontWeight.bold,
),
Text("置顶",style: TextStyle(fontSize: 15.sp,color: Color.fromRGBO(246, 158, 11, 1.0)),)
],
)
),
// 数据行
Container(
width: double.infinity,
height: 100.h,
decoration: BoxDecoration(
color: Color.fromRGBO(24, 33, 47, 1.0),
borderRadius: BorderRadius.circular(25.r),
border:BoxBorder.all(
color: Color.fromRGBO(246, 158, 11, 1.0),
width: 1.w,
SizedBox(height: 8.h),
Text(
alarmInfo.deviceInfo,
style: TextStyle(
fontSize: 24.sp,
color: Color.fromRGBO(100, 116, 139, 1),
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Container(
width: 100.w,
height: 80.h,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.r),
color: Colors.white,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
SizedBox(height: 15.h),
Row(
children: [
Text("85℃",style: TextStyle(fontSize: 20.sp,color: Color.fromRGBO(246, 158, 11, 1.0),),),
Text("当前温度",style: TextStyle(fontSize: 15.sp,color: Colors.grey),),
],
Text(
'${alarmInfo.alarmLevel}·',
style: TextStyle(
fontSize: 24.sp,
color: Color.fromRGBO(255, 100, 101, 1),
fontWeight: FontWeight.bold,
),
),
Container(
width: 100.w,
height: 80.h,
padding: EdgeInsets.symmetric(horizontal: 10.w, vertical: 5.h),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.r),
color: Colors.white,
color: Color.fromRGBO(255, 158, 159, 0.5),
borderRadius: BorderRadius.circular(16.r),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text("22V",style: TextStyle(fontSize: 20.sp,color: Color.fromRGBO(246, 158, 11, 1.0),),),
Text("电压",style: TextStyle(fontSize: 15.sp,color: Colors.grey),),
],
child: Text(
alarmInfo.urgency,
style: TextStyle(
fontSize: 24.sp,
color: Color.fromRGBO(255, 100, 101, 1),
),
),
Container(
width: 100.w,
height: 80.h,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.r),
color: Colors.white,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text("3.2A",style: TextStyle(fontSize: 20.sp,color: Color.fromRGBO(246, 158, 11, 1.0),),),
Text("电流",style: TextStyle(fontSize: 15.sp,color: Colors.grey),),
],
),
)
],
),
),
// 操作行
Container(
width: double.infinity,
// height: 100.h,
margin: EdgeInsets.only(top: 10.h),
decoration: BoxDecoration(
border:BoxBorder.all(
color: Color.fromRGBO(246, 158, 11, 1.0),
width: 1.w,
),
),
child: Flex(
direction: Axis.horizontal,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Icon(Icons.warning, size: 15.sp, color: Color.fromRGBO(246, 158, 11, 1.0),),
Expanded(child: Text("已等待2h37m 紧急", style: TextStyle(fontSize: 15.sp,color: Color.fromRGBO(246, 158, 11, 1.0)),),),
Row(
mainAxisSize: MainAxisSize.min,
children: [
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Color.fromRGBO(246, 158, 11, 1.0),
minimumSize: Size(100.w, 55.h),
padding: EdgeInsets.zero,
alignment: Alignment.center,
visualDensity: VisualDensity.compact,
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.r),
),
),
onPressed: () {
print("立即处理");
},
child: Text("立即处理",style: TextStyle(fontSize: 14.sp,color: Colors.white),),
),
SizedBox(width: 8.w),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Color.fromRGBO(51, 65, 85, 1),
minimumSize: Size(80.w, 55.h),
padding: EdgeInsets.zero,
alignment: Alignment.center,
visualDensity: VisualDensity.compact,
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.r),
),
),
onPressed: () {
print("派工");
},
child: Text("派工",style: TextStyle(fontSize: 14.sp,color: Colors.white),),
),
],
)
],
),
),
],
),
);
......
lib/views/home/abnormal/child/temperature_char_block.dart
View file @ aba1fd46
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:smart_hotel_app/views/home/abnormal/controller.dart';
class TemperatureCharBlock extends StatelessWidget {
const TemperatureCharBlock({super.key});
final AlarmInfo alarmInfo;
const TemperatureCharBlock({super.key, required this.alarmInfo});
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
margin: EdgeInsets.only(top: 10.h, left: 20.w, right: 20.w),
padding: EdgeInsets.all(20.w),
margin: EdgeInsets.only(top: 10.h),
padding: EdgeInsets.all(25.w),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.r),
color: Color.fromRGBO(30, 41, 59, 1),
color: Colors.white,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
......@@ -24,76 +27,72 @@ class TemperatureCharBlock extends StatelessWidget {
Text(
'24小时温度趋势',
style: TextStyle(
fontSize: 16.sp,
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 24.sp,
color: Color.fromRGBO(100, 116, 139, 1),
),
),
Text(
'5月9日',
alarmInfo.date,
style: TextStyle(
fontSize: 14.sp,
color: Colors.grey,
fontSize: 24.sp,
color: Color.fromRGBO(100, 116, 139, 1),
),
),
],
),
SizedBox(height: 20.h),
Container(
height: 200.h,
height: 250.h,
child: LineChart(
LineChartData(
gridData: FlGridData(show: false),
gridData: FlGridData(
show: true,
drawHorizontalLine: true,
drawVerticalLine: false,
horizontalInterval: 10,
getDrawingHorizontalLine: (value) {
return FlLine(
color: Color.fromRGBO(209, 213, 219, 1),
strokeWidth: 2,
dashArray: [5, 5],
);
},
),
titlesData: FlTitlesData(
rightTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
topTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
interval: 3,
interval: 6,
getTitlesWidget: (value, meta) {
return Text(
'11:04',
style: TextStyle(
color: Color.fromRGBO(156, 163, 175, 1),
fontSize: 14.sp,
),
);
},
reservedSize: 40,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
interval: 20,
getTitlesWidget: (value, meta) {
String text = '';
switch (value.toInt()) {
case 0:
text = '00:00';
break;
case 3:
text = '03:00';
break;
case 6:
text = '06:00';
break;
case 9:
text = '09:00';
break;
case 12:
text = '12:00';
break;
case 15:
text = '15:00';
break;
case 18:
text = '18:00';
break;
case 21:
text = '21:00';
break;
case 24:
text = '现在';
break;
}
return Text(
text,
'${value.toInt()}',
style: TextStyle(
color: Colors.grey,
fontSize: 10.sp,
color: Color.fromRGBO(156, 163, 175, 1),
fontSize: 14.sp,
),
);
},
reservedSize: 30,
reservedSize: 40,
),
),
leftTitles: AxisTitles(sideTitles: SideTitles(showTitles: false)),
),
borderData: FlBorderData(show: false),
minX: 0,
......@@ -102,28 +101,18 @@ class TemperatureCharBlock extends StatelessWidget {
maxY: 100,
lineBarsData: [
LineChartBarData(
spots: [
FlSpot(0, 75),
FlSpot(4, 76),
FlSpot(8, 78),
FlSpot(12, 82),
FlSpot(16, 86),
FlSpot(18, 89),
FlSpot(20, 87),
FlSpot(22, 85),
FlSpot(24, 70),
],
spots: alarmInfo.temperatureSpots,
isCurved: true,
color: Color.fromRGBO(246, 158, 11, 1.0),
barWidth: 3,
color: Color.fromRGBO(239, 68, 68, 1),
barWidth: 4,
isStrokeCapRound: true,
dotData: FlDotData(show: false),
belowBarData: BarAreaData(
show: true,
gradient: LinearGradient(
colors: [
Color.fromRGBO(246, 158, 11, 0.5),
Color.fromRGBO(246, 158, 11, 0.1),
Color.fromRGBO(254, 202, 202, 1),
Color.fromRGBO(254, 226, 226, 0.1),
],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
......
lib/views/home/abnormal/controller.dart
View file @ aba1fd46
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:smart_hotel_app/routes/app_router.gr.dart';
class AlarmInfo {
final String alarmType;
final String deviceInfo;
final String alarmLevel;
final String urgency;
final String currentTemp;
final String voltage;
final String current;
final String triggerTime;
final String threshold;
final String duration;
final String peak;
final String linkAction;
final String date;
final List<FlSpot> temperatureSpots;
AlarmInfo({
required this.alarmType,
required this.deviceInfo,
required this.alarmLevel,
required this.urgency,
required this.currentTemp,
required this.voltage,
required this.current,
required this.triggerTime,
required this.threshold,
required this.duration,
required this.peak,
required this.linkAction,
required this.date,
required this.temperatureSpots,
});
}
class HomeAbnormalController {
final BuildContext context;
......@@ -10,4 +45,41 @@ class HomeAbnormalController {
void navigateToDeviceDetail() {
context.pushRoute(const DeviceDetailRoute());
}
AlarmInfo getAlarmInfo() {
return AlarmInfo(
alarmType: '温度异常告警',
deviceInfo: 'A-301智能空开·客房301',
alarmLevel: '高警',
urgency: '紧急',
currentTemp: '85℃',
voltage: '22V',
current: '3.2A',
triggerTime: '2026-05-09 14:23:18',
threshold: '温度>80℃触发',
duration: '2小时37分钟',
peak: '89.2℃ (15:02)',
linkAction: '自动断电保护',
date: '5月9日',
temperatureSpots: [
FlSpot(0, 40),
FlSpot(4, 40),
FlSpot(8, 15),
FlSpot(12, 55),
FlSpot(16, 50),
FlSpot(18, 55),
FlSpot(20, 75),
FlSpot(22, 82),
FlSpot(24, 85),
],
);
}
void handleConfirm() {
print('确认处理');
}
void handleViewDevice() {
navigateToDeviceDetail();
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment