更新消息设置

lib/pages/device/component/MessageTypeComponent.dart

@@ -0,0 +1,256 @@
+import 'package:flutter/material.dart';
+import 'dart:convert';
+
+class MessageTypeComponent extends StatelessWidget {
+  final Map<String, dynamic> config;
+
+  const MessageTypeComponent({Key? key, required this.config}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final String name = config['name'] ?? '未命名';
+    final String type = config['type'] ?? 'unknown';
+    final List<dynamic> dataList = config['data'] ?? [];
+
+    return Container(
+      margin: const EdgeInsets.all(12.0),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(12.0),
+        boxShadow: [
+          BoxShadow(
+            color: Colors.grey.withOpacity(0.2),
+            blurRadius: 8.0,
+            offset: const Offset(0, 2),
+          ),
+        ],
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          // 标题栏
+          _buildHeader(name, type),
+          
+          // 分隔线
+          const Divider(height: 1, color: Color(0xFFEEEEEE)),
+          
+          // 数据列表
+          _buildDataList(dataList),
+        ],
+      ),
+    );
+  }
+
+  // 构建标题栏
+  Widget _buildHeader(String name, String type) {
+    return Container(
+      padding: const EdgeInsets.all(16.0),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          Text(
+            name,
+            style: const TextStyle(
+              fontSize: 18.0,
+              fontWeight: FontWeight.bold,
+              color: Color(0xFF333333),
+            ),
+          ),
+          Container(
+            padding: const EdgeInsets.symmetric(horizontal: 12.0, vertical: 4.0),
+            decoration: BoxDecoration(
+              color: _getTypeColor(type),
+              borderRadius: BorderRadius.circular(20.0),
+            ),
+            child: Text(
+              _getTypeText(type),
+              style: const TextStyle(
+                fontSize: 12.0,
+                color: Colors.white,
+                fontWeight: FontWeight.w500,
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  // 构建数据列表
+  Widget _buildDataList(List<dynamic> dataList) {
+    if (dataList.isEmpty) {
+      return const Padding(
+        padding: EdgeInsets.all(16.0),
+        child: Text(
+          '暂无数据',
+          style: TextStyle(color: Colors.grey),
+        ),
+      );
+    }
+
+    return ListView.separated(
+      shrinkWrap: true,
+      physics: const NeverScrollableScrollPhysics(),
+      padding: const EdgeInsets.symmetric(vertical: 8.0),
+      itemCount: dataList.length,
+      separatorBuilder: (context, index) => const Divider(
+        height: 1,
+        indent: 16.0,
+        endIndent: 16.0,
+        color: Color(0xFFF5F5F5),
+      ),
+      itemBuilder: (context, index) {
+        final Map<String, dynamic> item = dataList[index];
+        return _buildDataItem(item);
+      },
+    );
+  }
+
+  // 构建单个数据项
+  Widget _buildDataItem(Map<String, dynamic> item) {
+    final String itemName = item['name']?.toString() ?? '未知';
+    final int? id = item['id'];
+    
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          // ID 标签
+          if (id != null)
+            Container(
+              width: 24.0,
+              height: 24.0,
+              alignment: Alignment.center,
+              margin: const EdgeInsets.only(right: 12.0),
+              decoration: BoxDecoration(
+                color: const Color(0xFFE8F4FF),
+                borderRadius: BorderRadius.circular(12.0),
+              ),
+              child: Text(
+                id.toString().substring(id.toString().length - 2),
+                style: const TextStyle(
+                  fontSize: 12.0,
+                  color: Color(0xFF1890FF),
+                  fontWeight: FontWeight.w500,
+                ),
+              ),
+            ),
+          
+          // 数据内容
+          Expanded(
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(
+                  itemName,
+                  style: const TextStyle(
+                    fontSize: 16.0,
+                    fontWeight: FontWeight.w500,
+                    color: Color(0xFF333333),
+                  ),
+                ),
+                
+                const SizedBox(height: 4.0),
+                
+                // 动态显示其他字段
+                ..._buildExtraFields(item),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  // 构建额外字段显示
+  List<Widget> _buildExtraFields(Map<String, dynamic> item) {
+    final List<Widget> fields = [];
+    
+    // 遍历所有字段，排除已经显示的 id 和 name
+    item.forEach((key, value) {
+      if (key != 'id' && key != 'name' && value != null) {
+        final String displayKey = _getDisplayKey(key);
+        final String displayValue = _formatValue(value);
+        
+        fields.add(
+          Padding(
+            padding: const EdgeInsets.only(top: 2.0),
+            child: Text.rich(
+              TextSpan(
+                children: [
+                  TextSpan(
+                    text: '$displayKey：',
+                    style: const TextStyle(
+                      fontSize: 14.0,
+                      color: Color(0xFF666666),
+                    ),
+                  ),
+                  TextSpan(
+                    text: displayValue,
+                    style: const TextStyle(
+                      fontSize: 14.0,
+                      color: Color(0xFF1890FF),
+                      fontWeight: FontWeight.w500,
+                    ),
+                  ),
+                ],
+              ),
+            ),
+          ),
+        );
+      }
+    });
+    
+    return fields;
+  }
+
+  // 获取显示用的键名
+  String _getDisplayKey(String key) {
+    final Map<String, String> keyMap = {
+      'min': '最小值',
+      'max': '最大值',
+      'interval': '间隔(秒)',
+      'duration': '持续时间(秒)',
+      'time': '时间',
+    };
+    
+    return keyMap[key] ?? key;
+  }
+
+  // 格式化值显示
+  String _formatValue(dynamic value) {
+    if (value is int) {
+      // 如果是时间相关的秒数，转换为分钟显示
+      if (value >= 60) {
+        return '${value ~/ 60}分钟${value % 60 != 0 ? '${value % 60}秒' : ''}';
+      }
+      return value.toString();
+    }
+    return value.toString();
+  }
+
+  // 根据类型获取颜色
+  Color _getTypeColor(String type) {
+    switch (type) {
+      case 'instant':
+        return const Color(0xFF52C41A);
+      case 'sleep':
+        return const Color(0xFF1890FF);
+      default:
+        return Colors.grey;
+    }
+  }
+
+  // 根据类型获取显示文本
+  String _getTypeText(String type) {
+    switch (type) {
+      case 'instant':
+        return '实时';
+      case 'sleep':
+        return '睡眠';
+      default:
+        return '未知';
+    }
+  }
+}