feat(client): 初版 Flutter UI 框架，仿照参考截图实现
- 蓝色顶栏（#1565C0）+ 深蓝侧边栏（#0D47A1），含折叠/展开 - 底部状态栏：门店编号、登录用户、登录时间、实时时钟、版本号 - 登录页：居中卡片，支持密码显示/隐藏 - 入库单列表：筛选/搜索/日期选择/分页，三个 Tab（入库单/查询/审核） - 新建入库单：基本信息 + 商品明细动态增删，实时计算合计金额 - 出库单列表：同入库单风格 - 库存查询：4 张统计卡片 + 颜色高亮缺货/预警行，库存预警 Tab - 往来单位、财务、商品、系统设置（用户/仓库/编号规则/系统参数） - 使用 Riverpod 状态管理 + go_router 路由 + Dio HTTP Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
wangjia
@@ -0,0 +1,214 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../../core/auth/auth_state.dart';
|
||||
import '../../core/theme/app_theme.dart';
|
||||
|
||||
class LoginScreen extends ConsumerStatefulWidget {
|
||||
const LoginScreen({super.key});
|
||||
|
||||
@override
|
||||
ConsumerState<LoginScreen> createState() => _LoginScreenState();
|
||||
}
|
||||
|
||||
class _LoginScreenState extends ConsumerState<LoginScreen> {
|
||||
final _formKey = GlobalKey<FormState>();
|
||||
final _usernameCtrl = TextEditingController();
|
||||
final _passwordCtrl = TextEditingController();
|
||||
bool _loading = false;
|
||||
bool _obscure = true;
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_usernameCtrl.dispose();
|
||||
_passwordCtrl.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
Future<void> _login() async {
|
||||
if (!_formKey.currentState!.validate()) return;
|
||||
setState(() => _loading = true);
|
||||
await Future.delayed(const Duration(milliseconds: 600));
|
||||
// Mock login for UI demo
|
||||
ref.read(authStateProvider.notifier).login(AuthUser(
|
||||
token: 'demo-token',
|
||||
username: _usernameCtrl.text,
|
||||
hotelName: '示范大酒店',
|
||||
hotelNo: 'H001',
|
||||
hotelId: 1,
|
||||
));
|
||||
if (mounted) {
|
||||
context.go('/stock-in');
|
||||
}
|
||||
if (mounted) setState(() => _loading = false);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: AppTheme.primaryDark,
|
||||
body: Stack(
|
||||
children: [
|
||||
// Background pattern
|
||||
Positioned.fill(
|
||||
child: CustomPaint(painter: _BackgroundPainter()),
|
||||
),
|
||||
Center(
|
||||
child: Card(
|
||||
elevation: 12,
|
||||
shadowColor: Colors.black38,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(8)),
|
||||
child: Container(
|
||||
width: 400,
|
||||
padding: const EdgeInsets.all(40),
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// Logo
|
||||
Container(
|
||||
width: 80,
|
||||
height: 80,
|
||||
decoration: BoxDecoration(
|
||||
gradient: const LinearGradient(
|
||||
colors: [AppTheme.primaryLight, AppTheme.primaryDark],
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppTheme.primary.withOpacity(0.4),
|
||||
blurRadius: 12,
|
||||
offset: const Offset(0, 4),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: const Icon(Icons.wine_bar,
|
||||
color: Colors.white, size: 44),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
const Text(
|
||||
'酒库管理系统',
|
||||
style: TextStyle(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: AppTheme.primaryDark,
|
||||
letterSpacing: 1,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
const Text(
|
||||
'酒店仓库管理解决方案',
|
||||
style: TextStyle(
|
||||
fontSize: 13, color: AppTheme.textSecondary),
|
||||
),
|
||||
const SizedBox(height: 36),
|
||||
TextFormField(
|
||||
controller: _usernameCtrl,
|
||||
decoration: const InputDecoration(
|
||||
labelText: '用户名',
|
||||
hintText: '请输入用户名',
|
||||
prefixIcon:
|
||||
Icon(Icons.person_outline, size: 20),
|
||||
),
|
||||
validator: (v) =>
|
||||
(v == null || v.isEmpty) ? '请输入用户名' : null,
|
||||
textInputAction: TextInputAction.next,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
TextFormField(
|
||||
controller: _passwordCtrl,
|
||||
obscureText: _obscure,
|
||||
decoration: InputDecoration(
|
||||
labelText: '密码',
|
||||
hintText: '请输入密码',
|
||||
prefixIcon:
|
||||
const Icon(Icons.lock_outline, size: 20),
|
||||
suffixIcon: IconButton(
|
||||
icon: Icon(
|
||||
_obscure
|
||||
? Icons.visibility_off
|
||||
: Icons.visibility,
|
||||
size: 20),
|
||||
onPressed: () =>
|
||||
setState(() => _obscure = !_obscure),
|
||||
),
|
||||
),
|
||||
validator: (v) =>
|
||||
(v == null || v.isEmpty) ? '请输入密码' : null,
|
||||
onFieldSubmitted: (_) => _login(),
|
||||
),
|
||||
const SizedBox(height: 28),
|
||||
SizedBox(
|
||||
width: double.infinity,
|
||||
height: 46,
|
||||
child: ElevatedButton(
|
||||
onPressed: _loading ? null : _login,
|
||||
style: ElevatedButton.styleFrom(
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(4)),
|
||||
),
|
||||
child: _loading
|
||||
? const SizedBox(
|
||||
width: 20,
|
||||
height: 20,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2, color: Colors.white))
|
||||
: const Text('登 录',
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w500,
|
||||
letterSpacing: 2)),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
TextButton(
|
||||
onPressed: () {},
|
||||
child: const Text('忘记密码？'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
// Bottom version info
|
||||
Positioned(
|
||||
bottom: 16,
|
||||
left: 0,
|
||||
right: 0,
|
||||
child: Center(
|
||||
child: Text(
|
||||
'© 2026 酒库管理系统 v1.0.0',
|
||||
style: TextStyle(
|
||||
color: Colors.white.withOpacity(0.4), fontSize: 12),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _BackgroundPainter extends CustomPainter {
|
||||
@override
|
||||
void paint(Canvas canvas, Size size) {
|
||||
final paint = Paint()
|
||||
..color = const Color(0xFF1976D2).withOpacity(0.15)
|
||||
..style = PaintingStyle.fill;
|
||||
canvas.drawCircle(
|
||||
Offset(size.width * 0.1, size.height * 0.2), 180, paint);
|
||||
canvas.drawCircle(
|
||||
Offset(size.width * 0.9, size.height * 0.8), 220, paint);
|
||||
paint.color = const Color(0xFF0D47A1).withOpacity(0.1);
|
||||
canvas.drawCircle(
|
||||
Offset(size.width * 0.8, size.height * 0.1), 140, paint);
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
|
||||
}
|
||||
Reference in New Issue
Block a user