wangjia
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
76 lines
2.6 KiB
Dart
76 lines
2.6 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import '../core/theme/context_tokens.dart';
|
|
import '../core/theme/theme_controller.dart';
|
|
|
|
/// 顶栏主题选择器 pill（原型 .theme-pill）：衬衫图标 + 当前主题名 + ▾。
|
|
/// 点开 A/B/C 菜单切换主题（持久化），从「系统设置」迁来的入口。
|
|
class ThemePickerPill extends ConsumerWidget {
|
|
const ThemePickerPill({super.key});
|
|
|
|
// 主题键 → 中文名（与原型 shell.js THEMES 一致）。
|
|
static const _names = {'a': '经典蓝', 'b': '琥珀', 'c': '酒窖'};
|
|
|
|
@override
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
final t = context.tokens;
|
|
final key = ref.watch(themeControllerProvider);
|
|
final name = _names[key] ?? '经典蓝';
|
|
|
|
return PopupMenuButton<String>(
|
|
tooltip: '切换主题',
|
|
offset: const Offset(0, 38),
|
|
position: PopupMenuPosition.under,
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
|
|
color: t.surface,
|
|
elevation: 8,
|
|
onSelected: (v) => ref.read(themeControllerProvider.notifier).set(v),
|
|
itemBuilder: (_) => _names.entries.map((e) {
|
|
final sel = e.key == key;
|
|
return PopupMenuItem<String>(
|
|
value: e.key,
|
|
height: 40,
|
|
child: Row(
|
|
children: [
|
|
SizedBox(
|
|
width: 18,
|
|
child: sel
|
|
? Icon(Icons.check, size: 16, color: t.primary)
|
|
: null,
|
|
),
|
|
const SizedBox(width: 4),
|
|
Text(
|
|
'${e.key.toUpperCase()} · ${e.value}',
|
|
style: TextStyle(
|
|
fontSize: 13,
|
|
color: sel ? t.primary : t.text,
|
|
fontWeight: sel ? FontWeight.w600 : FontWeight.w400,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}).toList(),
|
|
child: Container(
|
|
height: 30,
|
|
padding: const EdgeInsets.symmetric(horizontal: 11),
|
|
decoration: BoxDecoration(
|
|
color: t.topControl,
|
|
border: Border.all(color: t.topBorder),
|
|
borderRadius: BorderRadius.circular(999),
|
|
),
|
|
child: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Icon(Icons.checkroom, size: 15, color: t.sideFg),
|
|
const SizedBox(width: 7),
|
|
Text(name, style: TextStyle(fontSize: 12, color: t.topFg)),
|
|
const SizedBox(width: 7),
|
|
Icon(Icons.keyboard_arrow_down, size: 14, color: t.topFg),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|