431 lines
15 KiB
Dart
431 lines
15 KiB
Dart
|
import 'package:flutter/material.dart';
|
|||
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|||
|
|
|
|||
|
|
import '../../providers/auth_provider.dart';
|
|||
|
|
import '../../providers/locale_provider.dart';
|
|||
|
|
import '../../providers/theme_provider.dart';
|
|||
|
|
import '../../providers/display_provider.dart';
|
|||
|
|
import '../../services/api_client.dart';
|
|||
|
|
import '../../services/sys_service.dart';
|
|||
|
|
import '../../utils/constants.dart';
|
|||
|
|
import '../../utils/i10n.dart';
|
|||
|
|
import '../../utils/app_update.dart';
|
|||
|
|
import 'package:package_info_plus/package_info_plus.dart';
|
|||
|
|
|
|||
|
|
/// 设置页（底部导航第 3 个 tab）：主题切换 / 语言占位 / 关于 / 退出登录。
|
|||
|
|
class SettingsPage extends ConsumerWidget {
|
|||
|
|
const SettingsPage({super.key});
|
|||
|
|
|
|||
|
|
Future<void> _showChangePasswordDialog(BuildContext context, WidgetRef ref) async {
|
|||
|
|
final t = AppLocalizations.of(context);
|
|||
|
|
final oldCtrl = TextEditingController();
|
|||
|
|
final newCtrl = TextEditingController();
|
|||
|
|
final confirmCtrl = TextEditingController();
|
|||
|
|
bool saving = false;
|
|||
|
|
|
|||
|
|
await showDialog<void>(
|
|||
|
|
context: context,
|
|||
|
|
builder: (ctx) => StatefulBuilder(
|
|||
|
|
builder: (ctx, setState) => AlertDialog(
|
|||
|
|
title: Text(t.passwordDialogTitle),
|
|||
|
|
content: SingleChildScrollView(
|
|||
|
|
child: Column(
|
|||
|
|
mainAxisSize: MainAxisSize.min,
|
|||
|
|
children: [
|
|||
|
|
TextField(
|
|||
|
|
controller: oldCtrl,
|
|||
|
|
obscureText: true,
|
|||
|
|
decoration: InputDecoration(
|
|||
|
|
labelText: t.oldPassword,
|
|||
|
|
border: const OutlineInputBorder(),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const SizedBox(height: 12),
|
|||
|
|
TextField(
|
|||
|
|
controller: newCtrl,
|
|||
|
|
obscureText: true,
|
|||
|
|
decoration: InputDecoration(
|
|||
|
|
labelText: t.newPassword,
|
|||
|
|
border: const OutlineInputBorder(),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const SizedBox(height: 12),
|
|||
|
|
TextField(
|
|||
|
|
controller: confirmCtrl,
|
|||
|
|
obscureText: true,
|
|||
|
|
decoration: InputDecoration(
|
|||
|
|
labelText: t.confirmNewPassword,
|
|||
|
|
border: const OutlineInputBorder(),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
actions: [
|
|||
|
|
TextButton(
|
|||
|
|
onPressed: saving ? null : () => Navigator.pop(ctx),
|
|||
|
|
child: Text(t.cancel),
|
|||
|
|
),
|
|||
|
|
FilledButton(
|
|||
|
|
onPressed: saving
|
|||
|
|
? null
|
|||
|
|
: () async {
|
|||
|
|
final oldPwd = oldCtrl.text.trim();
|
|||
|
|
final newPwd = newCtrl.text.trim();
|
|||
|
|
final confirmPwd = confirmCtrl.text.trim();
|
|||
|
|
if (oldPwd.isEmpty || newPwd.isEmpty) {
|
|||
|
|
ScaffoldMessenger.of(ctx).showSnackBar(
|
|||
|
|
SnackBar(content: Text(t.pleaseFillPassword)),
|
|||
|
|
);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
if (newPwd != confirmPwd) {
|
|||
|
|
ScaffoldMessenger.of(ctx).showSnackBar(
|
|||
|
|
SnackBar(content: Text(t.passwordsDoNotMatch)),
|
|||
|
|
);
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
setState(() => saving = true);
|
|||
|
|
try {
|
|||
|
|
await SystemService().updatePassword(oldPwd, newPwd);
|
|||
|
|
if (!ctx.mounted) return;
|
|||
|
|
Navigator.pop(ctx);
|
|||
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|||
|
|
SnackBar(content: Text(t.passwordChangeSuccess)),
|
|||
|
|
);
|
|||
|
|
// 修改成功后安全登出，要求用新密码重新登录。
|
|||
|
|
Future.delayed(const Duration(seconds: 1), () {
|
|||
|
|
if (context.mounted) {
|
|||
|
|
ref.read(authProvider.notifier).logout();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
} on ApiException catch (e) {
|
|||
|
|
setState(() => saving = false);
|
|||
|
|
ScaffoldMessenger.of(ctx).showSnackBar(
|
|||
|
|
SnackBar(content: Text(e.message)),
|
|||
|
|
);
|
|||
|
|
} catch (e) {
|
|||
|
|
setState(() => saving = false);
|
|||
|
|
ScaffoldMessenger.of(ctx).showSnackBar(
|
|||
|
|
SnackBar(content: Text(t.passwordChangeFailed(formatApiError(e)))),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
child: saving
|
|||
|
|
? const SizedBox(
|
|||
|
|
height: 18,
|
|||
|
|
width: 18,
|
|||
|
|
child: CircularProgressIndicator(strokeWidth: 2),
|
|||
|
|
)
|
|||
|
|
: Text(t.save),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
|
|||
|
|
oldCtrl.dispose();
|
|||
|
|
newCtrl.dispose();
|
|||
|
|
confirmCtrl.dispose();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
String _themeModeLabel(ThemeMode mode, AppLocalizations t) {
|
|||
|
|
switch (mode) {
|
|||
|
|
case ThemeMode.dark:
|
|||
|
|
return t.themeDark;
|
|||
|
|
case ThemeMode.light:
|
|||
|
|
return t.themeLight;
|
|||
|
|
case ThemeMode.system:
|
|||
|
|
return t.themeSystem;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
String _orientationLabel(DisplayOrientation mode, AppLocalizations t) {
|
|||
|
|
switch (mode) {
|
|||
|
|
case DisplayOrientation.system:
|
|||
|
|
return t.orientationSystem;
|
|||
|
|
case DisplayOrientation.portrait:
|
|||
|
|
return t.orientationPortrait;
|
|||
|
|
case DisplayOrientation.landscape:
|
|||
|
|
return t.orientationLandscape;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|||
|
|
final themeMode = ref.watch(themeModeProvider);
|
|||
|
|
final appLocale = ref.watch(localeProvider);
|
|||
|
|
final displayOrientation = ref.watch(displayOrientationProvider);
|
|||
|
|
final authState = ref.watch(authProvider);
|
|||
|
|
final t = AppLocalizations.of(context);
|
|||
|
|
|
|||
|
|
return Scaffold(
|
|||
|
|
appBar: AppBar(title: Text(t.settings)),
|
|||
|
|
body: ListView(
|
|||
|
|
children: [
|
|||
|
|
if (authState.user != null)
|
|||
|
|
ListTile(
|
|||
|
|
leading: const CircleAvatar(child: Icon(Icons.person)),
|
|||
|
|
title: Text(authState.user!.displayName),
|
|||
|
|
subtitle: Text(
|
|||
|
|
authState.user!.role.isEmpty
|
|||
|
|
? '${t.account}：${authState.user!.account}'
|
|||
|
|
: authState.user!.role,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const Divider(),
|
|||
|
|
// 主题切换：深色 / 浅色 / 跟随系统
|
|||
|
|
_AppSettingsTile(
|
|||
|
|
leading: const Icon(Icons.dark_mode_outlined),
|
|||
|
|
title: t.themeMode,
|
|||
|
|
subtitle: _themeModeLabel(themeMode, t),
|
|||
|
|
control: SegmentedButton<ThemeMode>(
|
|||
|
|
segments: [
|
|||
|
|
ButtonSegment(
|
|||
|
|
value: ThemeMode.dark,
|
|||
|
|
icon: const Icon(Icons.dark_mode),
|
|||
|
|
label: Text(t.themeDark),
|
|||
|
|
),
|
|||
|
|
ButtonSegment(
|
|||
|
|
value: ThemeMode.light,
|
|||
|
|
icon: const Icon(Icons.light_mode),
|
|||
|
|
label: Text(t.themeLight),
|
|||
|
|
),
|
|||
|
|
ButtonSegment(
|
|||
|
|
value: ThemeMode.system,
|
|||
|
|
icon: const Icon(Icons.settings_suggest),
|
|||
|
|
label: Text(t.themeSystem),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
selected: {themeMode},
|
|||
|
|
onSelectionChanged: (selection) => ref
|
|||
|
|
.read(themeModeProvider.notifier)
|
|||
|
|
.setThemeMode(selection.first),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
// 语言切换：简体中文 / English
|
|||
|
|
_AppSettingsTile(
|
|||
|
|
leading: const Icon(Icons.language_outlined),
|
|||
|
|
title: t.language,
|
|||
|
|
subtitle: appLocale.label,
|
|||
|
|
control: SegmentedButton<AppLocale>(
|
|||
|
|
segments: const [
|
|||
|
|
ButtonSegment(value: AppLocale.zh, label: Text('中文')),
|
|||
|
|
ButtonSegment(value: AppLocale.en, label: Text('EN')),
|
|||
|
|
],
|
|||
|
|
selected: {appLocale},
|
|||
|
|
onSelectionChanged: (selection) {
|
|||
|
|
try {
|
|||
|
|
ref.read(localeProvider.notifier).setLocale(selection.first);
|
|||
|
|
} catch (e) {
|
|||
|
|
if (!context.mounted) return;
|
|||
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|||
|
|
SnackBar(content: Text('语言切换失败：$e')),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const Divider(),
|
|||
|
|
// 显示方向：跟随系统 / 竖屏 / 横屏（手动切换屏幕方向，布局自动适配）。
|
|||
|
|
_AppSettingsTile(
|
|||
|
|
leading: const Icon(Icons.screen_rotation_outlined),
|
|||
|
|
title: t.orientationMode,
|
|||
|
|
subtitle: _orientationLabel(displayOrientation, t),
|
|||
|
|
control: SegmentedButton<DisplayOrientation>(
|
|||
|
|
segments: [
|
|||
|
|
ButtonSegment(
|
|||
|
|
value: DisplayOrientation.system,
|
|||
|
|
icon: const Icon(Icons.screen_rotation),
|
|||
|
|
label: Text(t.orientationSystem),
|
|||
|
|
),
|
|||
|
|
ButtonSegment(
|
|||
|
|
value: DisplayOrientation.portrait,
|
|||
|
|
icon: const Icon(Icons.stay_current_portrait),
|
|||
|
|
label: Text(t.orientationPortrait),
|
|||
|
|
),
|
|||
|
|
ButtonSegment(
|
|||
|
|
value: DisplayOrientation.landscape,
|
|||
|
|
icon: const Icon(Icons.stay_current_landscape),
|
|||
|
|
label: Text(t.orientationLandscape),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
selected: {displayOrientation},
|
|||
|
|
onSelectionChanged: (selection) => ref
|
|||
|
|
.read(displayOrientationProvider.notifier)
|
|||
|
|
.set(selection.first),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const Divider(),
|
|||
|
|
// 修改密码
|
|||
|
|
ListTile(
|
|||
|
|
leading: const Icon(Icons.lock_outline),
|
|||
|
|
title: Text(t.changePassword),
|
|||
|
|
onTap: () => _showChangePasswordDialog(context, ref),
|
|||
|
|
),
|
|||
|
|
const Divider(),
|
|||
|
|
// 检查更新
|
|||
|
|
ListTile(
|
|||
|
|
leading: const Icon(Icons.system_update_alt_outlined),
|
|||
|
|
title: Text(t.checkUpdate),
|
|||
|
|
subtitle: _VersionSubtitle(t: t),
|
|||
|
|
onTap: () => checkAndPromptUpdate(
|
|||
|
|
context,
|
|||
|
|
silentIfNoUpdate: false,
|
|||
|
|
orgId: ref.read(authProvider).user?.orgId,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
const Divider(),
|
|||
|
|
// 关于
|
|||
|
|
ListTile(
|
|||
|
|
leading: const Icon(Icons.info_outline),
|
|||
|
|
title: Text(t.about),
|
|||
|
|
subtitle: _VersionSubtitle(t: t, includeName: true),
|
|||
|
|
onTap: () async {
|
|||
|
|
final pkg = await currentPackageInfo;
|
|||
|
|
if (!context.mounted) return;
|
|||
|
|
showAboutDialog(
|
|||
|
|
context: context,
|
|||
|
|
applicationName: AppConstants.appName,
|
|||
|
|
applicationVersion: '${pkg.version} (${pkg.buildNumber})',
|
|||
|
|
applicationIcon: Image.asset(
|
|||
|
|
'assets/images/logo.png',
|
|||
|
|
width: 64,
|
|||
|
|
height: 64,
|
|||
|
|
),
|
|||
|
|
applicationLegalese: 'Device/system operation admin mobile demo',
|
|||
|
|
);
|
|||
|
|
},
|
|||
|
|
),
|
|||
|
|
const Divider(),
|
|||
|
|
// 退出登录
|
|||
|
|
ListTile(
|
|||
|
|
leading: Icon(
|
|||
|
|
Icons.logout,
|
|||
|
|
color: Theme.of(context).colorScheme.error,
|
|||
|
|
),
|
|||
|
|
title: Text(
|
|||
|
|
t.logout,
|
|||
|
|
style: TextStyle(color: Theme.of(context).colorScheme.error),
|
|||
|
|
),
|
|||
|
|
onTap: () async {
|
|||
|
|
final confirmed = await showDialog<bool>(
|
|||
|
|
context: context,
|
|||
|
|
builder: (ctx) => AlertDialog(
|
|||
|
|
title: Text(t.logout),
|
|||
|
|
content: const Text('确定要退出当前账号吗？'),
|
|||
|
|
actions: [
|
|||
|
|
TextButton(
|
|||
|
|
onPressed: () => Navigator.pop(ctx, false),
|
|||
|
|
child: Text(t.cancel),
|
|||
|
|
),
|
|||
|
|
FilledButton(
|
|||
|
|
style: FilledButton.styleFrom(
|
|||
|
|
backgroundColor: Theme.of(context).colorScheme.error,
|
|||
|
|
foregroundColor: Theme.of(context).colorScheme.onError,
|
|||
|
|
),
|
|||
|
|
onPressed: () => Navigator.pop(ctx, true),
|
|||
|
|
child: Text(t.logout),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
if (confirmed == true && context.mounted) {
|
|||
|
|
ref.read(authProvider.notifier).logout();
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 设置项：图标 + 标题 + 副标题在上，控件整行铺满在下。
|
|||
|
|
///
|
|||
|
|
/// 用于 [SegmentedButton] 等较宽的控件，避免塞进 [ListTile.trailing]
|
|||
|
|
/// 在窄屏溢出。
|
|||
|
|
class _AppSettingsTile extends StatelessWidget {
|
|||
|
|
const _AppSettingsTile({
|
|||
|
|
required this.title,
|
|||
|
|
required this.control,
|
|||
|
|
this.subtitle,
|
|||
|
|
this.leading,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
final String title;
|
|||
|
|
final Widget control;
|
|||
|
|
final String? subtitle;
|
|||
|
|
final Widget? leading;
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
Widget build(BuildContext context) {
|
|||
|
|
final theme = Theme.of(context);
|
|||
|
|
return Padding(
|
|||
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
|
|||
|
|
child: Column(
|
|||
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|||
|
|
children: [
|
|||
|
|
Row(
|
|||
|
|
children: [
|
|||
|
|
if (leading != null) ...[
|
|||
|
|
leading!,
|
|||
|
|
const SizedBox(width: 12),
|
|||
|
|
],
|
|||
|
|
Expanded(
|
|||
|
|
child: Text(
|
|||
|
|
title,
|
|||
|
|
style: theme.textTheme.titleMedium
|
|||
|
|
?.copyWith(fontWeight: FontWeight.w600),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
if (subtitle != null) ...[
|
|||
|
|
const SizedBox(height: 2),
|
|||
|
|
Padding(
|
|||
|
|
padding: EdgeInsets.only(left: leading != null ? 32 : 0),
|
|||
|
|
child: Text(
|
|||
|
|
subtitle!,
|
|||
|
|
style: theme.textTheme.bodySmall?.copyWith(
|
|||
|
|
color: theme.colorScheme.onSurfaceVariant,
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
),
|
|||
|
|
],
|
|||
|
|
const SizedBox(height: 12),
|
|||
|
|
SizedBox(width: double.infinity, child: control),
|
|||
|
|
],
|
|||
|
|
),
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/// 当前 App 版本副标题：异步读取 [PackageInfo] 展示版本名与构建号。
|
|||
|
|
///
|
|||
|
|
/// [includeName]=true 时前缀应用名（用于「关于」项）。
|
|||
|
|
class _VersionSubtitle extends StatelessWidget {
|
|||
|
|
const _VersionSubtitle({required this.t, this.includeName = false});
|
|||
|
|
|
|||
|
|
final AppLocalizations t;
|
|||
|
|
final bool includeName;
|
|||
|
|
|
|||
|
|
@override
|
|||
|
|
Widget build(BuildContext context) {
|
|||
|
|
return FutureBuilder<PackageInfo>(
|
|||
|
|
future: currentPackageInfo,
|
|||
|
|
builder: (ctx, snap) {
|
|||
|
|
final info = snap.data;
|
|||
|
|
if (includeName) {
|
|||
|
|
// 「关于」项：副标题只展示应用名，版本详情交由「关于」弹窗承载，
|
|||
|
|
// 避免与应用名 + 版本号 + 构建号叠加成冗余且暴露内部构建号的文案。
|
|||
|
|
return const Text(AppConstants.appName);
|
|||
|
|
}
|
|||
|
|
// 「检查更新」项：展示当前已安装版本名（不暴露内部构建号）。
|
|||
|
|
final version = info != null ? info.version : t.loading;
|
|||
|
|
return Text('${t.currentVersion} $version');
|
|||
|
|
},
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
}
|