tangxiaohui/CloudHome-Ops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

ops-console v1.0.2 (versionCode 8) 源码入库

Browse Source
This commit is contained in:
txh
2026-09-03 18:01:05 +08:00
commit 685fff27c8
170 changed files with 53049 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

618
lib/screens/home/device_detail_page.dart Normal file
View File

@@ -0,0 +1,618 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../models/device.dart';
import '../../models/org_node.dart';
import '../../providers/devices_provider.dart';
import '../../providers/metrics_visibility_provider.dart';
import '../../services/api_client.dart';
import '../../services/device_service.dart';
import '../../services/org_service.dart';
import '../../utils/formatters.dart';
import '../../utils/i10n.dart';
import '../../app/theme.dart';
import '../../utils/responsive.dart';
import '../../widgets/device_command_sheet.dart';
import '../../widgets/metric_card.dart';
import '../../widgets/status_chip.dart';
/// 设备详情页：指标卡（CPU/内存/磁盘/网络）、状态与运行时长。
class DeviceDetailPage extends ConsumerWidget {
const DeviceDetailPage({super.key, required this.deviceId});
/// 设备 ID。
final String deviceId;
@override
Widget build(BuildContext context, WidgetRef ref) {
final deviceAsync = ref.watch(deviceDetailProvider(deviceId));
final showMetrics = ref.watch(showRuntimeMetricsProvider);
final t = AppLocalizations.of(context);
return Scaffold(
appBar: AppBar(automaticallyImplyLeading: false, title: Text(t.deviceDetails)),
body: deviceAsync.when(
loading: () => const Center(child: CircularProgressIndicator()),
error: (error, _) => Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('$error'),
const SizedBox(height: 8),
FilledButton.tonal(
onPressed: () =>
ref.refresh(deviceDetailProvider(deviceId)),
child: Text(t.retry),
),
],
),
),
data: (device) => Column(
children: [
Expanded(
child: RefreshIndicator(
onRefresh: () async =>
ref.refresh(deviceDetailProvider(deviceId).future),
child: ListView(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.all(16),
children: [
_buildHeader(context, ref, device),
const SizedBox(height: 16),
_buildBasicInfo(context, device),
const SizedBox(height: 16),
_buildConfigParams(context, device),
const SizedBox(height: 16),
_buildNetworkInfo(context, device),
const SizedBox(height: 16),
_buildRuntimeData(context, device),
if (showMetrics) ...[
const SizedBox(height: 16),
_buildMetricsGrid(context, device),
],
],
),
),
),
_buildStickyActions(context, ref, device),
],
),
),
);
}
Widget _buildHeader(BuildContext context, WidgetRef ref, Device device) {
return Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
device.macLabel,
style: Theme.of(context)
.textTheme
.titleLarge
?.copyWith(fontWeight: FontWeight.bold),
),
if (device.model.isNotEmpty)
Padding(
padding: const EdgeInsets.only(top: 2),
child: Text(
'${AppLocalizations.of(context).modelLabel}：${device.model}',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
),
],
),
),
StatusChip(status: device.status),
],
);
}
/// 底部常驻操作栏（发送指令 / 编辑分组），滚动时保持可见。
Widget _buildStickyActions(
BuildContext context,
WidgetRef ref,
Device device,
) {
final t = AppLocalizations.of(context);
final scheme = Theme.of(context).colorScheme;
return Container(
decoration: BoxDecoration(
color: scheme.surface,
border: Border(top: BorderSide(color: scheme.outlineVariant)),
boxShadow: AppShadows.sm,
),
padding: const EdgeInsets.fromLTRB(16, 10, 16, 10),
child: SafeArea(
top: false,
child: Row(
children: [
Expanded(
child: FilledButton.tonal(
onPressed: () => _showCommandSheet(context, device),
child: Text(t.sendCommand),
),
),
const SizedBox(width: 12),
Expanded(
child: FilledButton.tonal(
onPressed: () => _showEditSheet(context, ref, device),
child: Text(t.editGroup),
),
),
],
),
),
);
}
/// 信息行标签宽度随窗口尺寸自适应（窄屏 96 / 中屏 128 / 宽屏 160）。
double _labelWidth(BuildContext context) {
final w = context.responsive.windowSize;
return w == AppWindowSize.compact
? 96
: w == AppWindowSize.medium
? 128
: 160;
}
/// 修改设备分组 / 房号。
void _showEditSheet(BuildContext context, WidgetRef ref, Device device) {
showModalBottomSheet(
useSafeArea: true,
context: context,
isScrollControlled: true,
builder: (ctx) => DeviceGroupRoomSheet(
device: device,
onSaved: (groupId, roomNo) async {
Navigator.pop(ctx);
try {
await DeviceService().updateDevice({
'id': device.id,
// 后端 /device/info/update 要求 mac 非空，修改分组/房号时须回传原 MAC。
'mac': device.mac,
'groupId': groupId,
'roomId': roomNo,
});
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(AppLocalizations.of(context).saveSuccess)),
);
ref.refresh(deviceDetailProvider(deviceId));
}
} on ApiException catch (e) {
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(e.message)),
);
}
} catch (e) {
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('${AppLocalizations.of(context).saveFailed}：${formatApiError(e)}')),
);
}
}
},
),
);
}
void _showCommandSheet(BuildContext context, Device device) { showModalBottomSheet(
useSafeArea: true,
context: context,
isScrollControlled: true,
builder: (ctx) => DeviceCommandSheet(
device: device,
deviceService: DeviceService(),
),
);
}
/// 带标题的分区块卡片。
Widget _sectionCard(
BuildContext context,
String title,
List<Widget> rows,
) {
final theme = Theme.of(context);
return Card(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 8),
const Divider(height: 1),
const SizedBox(height: 8),
...rows,
],
),
),
);
}
/// 基本信息：设备名称 / 设备 ID / 型号 / 状态。
Widget _buildBasicInfo(BuildContext context, Device device) {
final t = AppLocalizations.of(context);
final theme = Theme.of(context);
return _sectionCard(context, t.basicInfo, [
_infoRow(context, theme, t.deviceName,
device.macLabel.isEmpty ? t.none : device.macLabel),
_infoRow(context, theme, t.deviceId,
device.id.isEmpty ? t.none : device.id),
_infoRow(context, theme, t.modelLabel,
device.model.isEmpty ? t.none : device.model),
Padding(
padding: const EdgeInsets.symmetric(vertical: 6),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: _labelWidth(context),
child: Text(
t.status,
style: theme.textTheme.bodyMedium?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
),
Expanded(child: StatusChip(status: device.status)),
],
),
),
]);
}
/// 配置参数：所属门店 / 分组 / 房号 / 序列号 / UID / 创建时间。
Widget _buildConfigParams(BuildContext context, Device device) {
final t = AppLocalizations.of(context);
final theme = Theme.of(context);
return _sectionCard(context, t.configParams, [
_infoRow(context, theme, t.belongStore,
device.storeName.isEmpty ? t.none : device.storeName),
_infoRow(context, theme, t.belongGroup,
device.groupId.isEmpty ? t.notGrouped : device.groupId),
_infoRow(context, theme, t.roomNo,
device.roomNo.isEmpty ? t.none : device.roomNo),
_infoRow(context, theme, t.deviceSnLabel,
device.deviceSn.isEmpty ? t.none : device.deviceSn),
_infoRow(context, theme, t.deviceUidLabel,
device.deviceUid.isEmpty ? t.none : device.deviceUid),
_infoRow(context, theme, t.createTime,
device.createTime != null
? Formatters.formatDateTime(device.createTime!)
: t.none),
]);
}
/// 网络信息：IP 地址 / MAC 地址。
Widget _buildNetworkInfo(BuildContext context, Device device) {
final t = AppLocalizations.of(context);
final theme = Theme.of(context);
return _sectionCard(context, t.networkInfo, [
_infoRow(context, theme, t.ipAddress,
device.ip.isEmpty ? t.none : device.ip),
_infoRow(context, theme, t.macAddress,
device.mac.isEmpty ? t.none : device.mac),
]);
}
/// 运行时数据：在线时长 / 最后活跃时间。
Widget _buildRuntimeData(BuildContext context, Device device) {
final t = AppLocalizations.of(context);
final theme = Theme.of(context);
return _sectionCard(context, t.runtimeData, [
_infoRow(context, theme, t.uptime,
device.uptimeSeconds > 0
? t.formatUptime(device.uptimeSeconds)
: t.none),
_infoRow(context, theme, t.lastActiveTime,
device.lastSyncTime != null
? Formatters.formatDateTime(device.lastSyncTime!)
: t.none),
]);
}
Widget _infoRow(BuildContext context, ThemeData theme, String label, String value) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 6),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
width: _labelWidth(context),
child: Text(
label,
style: theme.textTheme.bodyMedium?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
),
Expanded(
child: Text(
value,
style: theme.textTheme.bodyMedium
?.copyWith(fontWeight: FontWeight.w600),
),
),
],
),
);
}
Widget _buildMetricsGrid(BuildContext context, Device device) {
final t = AppLocalizations.of(context);
final metrics = device.metrics;
// 真实后端不提供运行指标：无指标数据时显示 “—”（仅 mock 模式有值）。
final hasMetrics = device.hasMetrics;
final none = t.none;
return GridView.count(
crossAxisCount: context.responsive.gridCount(minTileWidth: 300),
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
mainAxisSpacing: 8,
crossAxisSpacing: 8,
childAspectRatio: 1.15,
children: [
MetricCard(
icon: Icons.memory,
title: t.cpuUsage,
value: hasMetrics ? Formatters.formatPercent(metrics.cpuUsage) : none,
progress: hasMetrics ? metrics.cpuUsage : null,
accentColor:
hasMetrics && metrics.cpuUsage > 0.8 ? Colors.red : null,
),
MetricCard(
icon: Icons.storage,
title: t.memoryUsage,
value:
hasMetrics ? Formatters.formatPercent(metrics.memoryUsage) : none,
progress: hasMetrics ? metrics.memoryUsage : null,
accentColor:
hasMetrics && metrics.memoryUsage > 0.85 ? Colors.red : null,
),
MetricCard(
icon: Icons.sd_storage,
title: t.diskUsage,
value:
hasMetrics ? Formatters.formatPercent(metrics.diskUsage) : none,
progress: hasMetrics ? metrics.diskUsage : null,
accentColor:
hasMetrics && metrics.diskUsage > 0.8 ? Colors.orange : null,
),
MetricCard(
icon: Icons.network_check,
title: t.networkRxTx,
value: hasMetrics
? '${metrics.networkRxKbps.toStringAsFixed(1)} / '
'${metrics.networkTxKbps.toStringAsFixed(1)} KB/s'
: none,
),
],
);
}
}
/// 修改设备分组 / 房号底部表单。
///
/// 分组改为「分组名称」下拉选择（与 Web 端一致）：进入时按设备所属门店调用
/// `/sys/store/deviceGroups/{storeId}` 拉取该门店下专属分组，下拉显示 [OrgNode.name]，
/// 提交 [OrgNode.id]。房号仍保留文本输入。
class DeviceGroupRoomSheet extends StatefulWidget {
const DeviceGroupRoomSheet({
super.key,
required this.device,
required this.onSaved,
});
final Device device;
final Future<void> Function(String groupId, String roomNo) onSaved;
@override
State<DeviceGroupRoomSheet> createState() => _DeviceGroupRoomSheetState();
}
class _DeviceGroupRoomSheetState extends State<DeviceGroupRoomSheet> {
final _formKey = GlobalKey<FormState>();
late final TextEditingController _roomNoCtrl;
bool _saving = false;
/// 当前门店下的设备分组列表。
List<OrgNode> _groups = const [];
bool _groupsLoading = false;
String? _groupsError;
/// 选中的分组 ID（null 表示「未分组」）。
String? _selectedGroupId;
@override
void initState() {
super.initState();
_roomNoCtrl = TextEditingController(text: widget.device.roomNo);
_selectedGroupId =
widget.device.groupId.isEmpty ? null : widget.device.groupId;
_loadGroups();
}
@override
void dispose() {
_roomNoCtrl.dispose();
super.dispose();
}
/// 拉取当前门店下的设备分组列表。
///
/// 优先使用 `/device/group/list?storeId=xxx`，该接口支持按门店筛选且已在
/// [DeviceService] 中实现；若调用失败则降级为读取「当前分组」一项，避免阻塞
/// 用户修改房号或保存现有分组。
Future<void> _loadGroups() async {
if (widget.device.storeId.isEmpty) {
if (mounted) setState(() => _groupsLoading = false);
return;
}
if (mounted) setState(() => _groupsLoading = true);
try {
_groups = await DeviceService().getDeviceGroupList(
storeId: widget.device.storeId,
);
_groupsError = null;
} on ApiException catch (e) {
_groupsError = e.message;
_groups = const [];
} catch (e) {
_groupsError = formatApiError(e, fallback: '分组加载失败，请检查网络');
_groups = const [];
} finally {
if (mounted) setState(() => _groupsLoading = false);
}
}
/// 构造下拉项：首项「未分组」，随后各分组（显示名称，值为 ID）。
/// 若当前分组不在列表中（如后端未返回或跨门店），追加一项以便正确回显。
List<DropdownMenuItem<String>> _buildGroupItems(AppLocalizations t) {
final items = <DropdownMenuItem<String>>[
DropdownMenuItem<String>(
value: '',
child: Text(t.notGrouped),
),
];
final seen = <String>{''};
for (final group in _groups) {
if (seen.contains(group.id)) continue;
seen.add(group.id);
items.add(
DropdownMenuItem<String>(
value: group.id,
child: Text(group.name.isNotEmpty ? group.name : group.id),
),
);
}
final current = widget.device.groupId;
if (current.isNotEmpty && !seen.contains(current)) {
items.add(
DropdownMenuItem<String>(
value: current,
child: Text(current),
),
);
}
return items;
}
Future<void> _submit() async {
if (!_formKey.currentState!.validate()) return;
setState(() => _saving = true);
try {
await widget.onSaved(
_selectedGroupId ?? '',
_roomNoCtrl.text.trim(),
);
} finally {
if (mounted) setState(() => _saving = false);
}
}
@override
Widget build(BuildContext context) {
final t = AppLocalizations.of(context);
return SingleChildScrollView(
padding: EdgeInsets.only(
bottom: MediaQuery.of(context).viewInsets.bottom,
),
child: Container(
padding: const EdgeInsets.all(20),
child: Form(
key: _formKey,
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'${t.editGroup} / ${t.roomNo}',
style: Theme.of(context)
.textTheme
.titleLarge
?.copyWith(fontWeight: FontWeight.bold),
),
const SizedBox(height: 16),
// 所属分组：名称下拉选择（提交分组 ID）。
DropdownButtonFormField<String>(
value: _selectedGroupId ?? '',
isExpanded: true,
decoration: InputDecoration(
labelText: t.belongGroup,
border: const OutlineInputBorder(),
prefixIcon: const Icon(Icons.dvr),
),
items: _buildGroupItems(t),
onChanged: _groupsLoading
? null
: (value) => setState(() => _selectedGroupId = value),
),
const SizedBox(height: 8),
if (_groupsLoading)
Padding(
padding: const EdgeInsets.only(left: 4),
child: Row(
children: [
const SizedBox(
width: 14,
height: 14,
child: CircularProgressIndicator(strokeWidth: 2),
),
const SizedBox(width: 8),
Text(t.groupListLoading),
],
),
)
else if (_groupsError != null)
Padding(
padding: const EdgeInsets.only(left: 4),
child: Text(
'${t.loadFailed}：$_groupsError',
style: const TextStyle(color: Colors.redAccent, fontSize: 12),
),
),
const SizedBox(height: 12),
TextFormField(
controller: _roomNoCtrl,
decoration: InputDecoration(
labelText: t.roomNo,
border: const OutlineInputBorder(),
prefixIcon: const Icon(Icons.meeting_room),
),
),
const SizedBox(height: 24),
SizedBox(
width: double.infinity,
child: FilledButton(
onPressed: _saving ? null : _submit,
child: _saving
? const SizedBox(
height: 20,
width: 20,
child: CircularProgressIndicator(strokeWidth: 2),
)
: Text(t.save),
),
),
],
),
),
),
);
}
}