1b43dfc75d
照 shell.js/statusbar.js/atoms.css 把外壳从「旧单品牌+换色」彻底重建为原型样式: - 顶栏:岩美酒库(线描山形 mark CustomPaint,软件品牌) │分隔│ 鼎晟酒行(门店字标+店名); 右侧 ThemePickerPill(主题器,从系统设置迁来,A/B/C 切换) + NotificationBell(通知) - 侧栏(218w):分组 单据/经营/系统(nav-label) + nav(active 高亮) + 底部 side-user(头像/姓名/店·角色→菜单) - 状态栏:AppStatusBar(原型 .statusbar,AppChrome 主题无关色):店号/操作员/登录/当前(走字) · 连接/版本/授权 - 保留全部既有行为:更新/强制更新/授权横幅与弹窗、离线横幅、心跳、apiMessage、窄屏 Drawer - 新增 widgets/theme_picker_pill.dart · notification_bell.dart · app_status_bar.dart - golden:加载真实 MaterialIcons 字体(消图标豆腐块,全 golden 受益); app_shell golden 用 9 分支+冻结时钟(可测试缝)确定化,对齐原型数据(鼎晟酒行/王经理/库存激活) - fidelity:外壳 vs 原型 diff 3.5% ≤ 阈,montage 目检 chrome 与原型一致 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01TSKEiHsvauyxYUW2itzUXX
165 lines
5.2 KiB
Dart
165 lines
5.2 KiB
Dart
import 'dart:async';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import 'package:intl/intl.dart';
|
|
import '../core/auth/auth_state.dart';
|
|
import '../core/config/license_copy.dart';
|
|
import '../core/theme/app_chrome.g.dart';
|
|
import '../providers/connectivity_provider.dart';
|
|
import '../providers/license_provider.dart';
|
|
import '../providers/update_provider.dart';
|
|
|
|
/// 底部状态栏(原型 .statusbar,主题无关 chrome 条)。
|
|
/// 左:门店编号 / 操作员 / 登录时间 / 当前时间(每秒走字) 右:连接 / 版本 / 授权。
|
|
class AppStatusBar extends ConsumerStatefulWidget {
|
|
final String loginTime;
|
|
const AppStatusBar({super.key, required this.loginTime});
|
|
|
|
/// 时钟种子(可测试缝):golden 测试覆盖为固定时间以确定化;走字默认关。
|
|
static DateTime Function() clock = DateTime.now;
|
|
|
|
/// 是否每秒走字(golden 测试关掉,避免时间变动造成像素抖动 / pending timer)。
|
|
static bool ticking = true;
|
|
|
|
@override
|
|
ConsumerState<AppStatusBar> createState() => _AppStatusBarState();
|
|
}
|
|
|
|
class _AppStatusBarState extends ConsumerState<AppStatusBar> {
|
|
Timer? _timer;
|
|
late String _now;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
_now = DateFormat('HH:mm:ss').format(AppStatusBar.clock());
|
|
if (AppStatusBar.ticking) {
|
|
_timer = Timer.periodic(const Duration(seconds: 1), (_) {
|
|
if (mounted) {
|
|
setState(() =>
|
|
_now = DateFormat('HH:mm:ss').format(AppStatusBar.clock()));
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_timer?.cancel();
|
|
super.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final user = ref.watch(authStateProvider).user;
|
|
final isOnline = ref.watch(connectivityProvider);
|
|
final version = ref.watch(appVersionProvider).valueOrNull ?? 'v1.0.0';
|
|
final lic = ref.watch(licenseProvider).valueOrNull;
|
|
|
|
return Container(
|
|
height: 34,
|
|
color: AppChrome.statusbarBg,
|
|
padding: const EdgeInsets.symmetric(horizontal: 6),
|
|
child: Row(
|
|
children: [
|
|
// 左组
|
|
_item(icon: Icons.storefront_outlined, strong: user?.shopNo ?? '—'),
|
|
_div(),
|
|
_item(
|
|
icon: Icons.person_outline,
|
|
text: (user == null || user.realName.isEmpty)
|
|
? (user?.username ?? '—')
|
|
: user.realName),
|
|
_div(),
|
|
_item(icon: Icons.login, text: '登录 ', strong: widget.loginTime),
|
|
_div(),
|
|
_item(icon: Icons.schedule, text: '当前 ', strong: _now),
|
|
const Spacer(),
|
|
// 右组
|
|
_item(
|
|
icon: isOnline ? Icons.cloud_done_outlined : Icons.cloud_off_outlined,
|
|
text: isOnline ? '已连接' : '连接已断开',
|
|
ok: isOnline,
|
|
),
|
|
_div(),
|
|
_item(icon: Icons.sell_outlined, strong: version, ok: true),
|
|
_div(),
|
|
_licenseItem(lic),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _div() => Container(
|
|
width: 1,
|
|
height: 14,
|
|
color: AppChrome.statusbarDiv,
|
|
margin: const EdgeInsets.symmetric(horizontal: 0),
|
|
);
|
|
|
|
// 单项:图标 + 普通文字 + 强调文字(mono 强调色)。ok=true 用 statusbar-ok 绿。
|
|
Widget _item({
|
|
required IconData icon,
|
|
String? text,
|
|
String? strong,
|
|
bool ok = false,
|
|
Color? color,
|
|
}) {
|
|
final c = color ?? (ok ? AppChrome.statusbarOk : AppChrome.statusbarFg);
|
|
final iconC = ok ? AppChrome.statusbarOk : AppChrome.statusbarMuted;
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 13),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Icon(icon, size: 13, color: iconC),
|
|
const SizedBox(width: 6),
|
|
if (text != null)
|
|
Text(text, style: TextStyle(fontSize: 11, color: c)),
|
|
if (strong != null)
|
|
Text(
|
|
strong,
|
|
style: TextStyle(
|
|
fontSize: 11,
|
|
color: ok ? AppChrome.statusbarOk : AppChrome.statusbarStrong,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _licenseItem(LicenseInfo? lic) {
|
|
if (lic == null) {
|
|
return _item(icon: Icons.verified_user_outlined, text: '授权', ok: true);
|
|
}
|
|
final color = LicenseCopy.phaseColor(lic.phase);
|
|
final icon = LicenseCopy.phaseIcon(lic.phase);
|
|
final date = lic.expiresAt == null
|
|
? ''
|
|
: DateFormat('yyyy-MM-dd').format(lic.expiresAt!);
|
|
final text = LicenseCopy.statusBar(lic, date);
|
|
final normal = lic.phase == 'normal';
|
|
return Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 13),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Icon(icon,
|
|
size: 13, color: normal ? AppChrome.statusbarOk : color),
|
|
const SizedBox(width: 6),
|
|
Text(
|
|
text,
|
|
style: TextStyle(
|
|
fontSize: 11,
|
|
color: normal ? AppChrome.statusbarOk : color,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|