feat(flutter): add auth module with router and screens

- Add app_router.dart with auth routes (login, register) - Update main.dart with MaterialApp.router - Add 5 auth screens: - LoginEmailScreen with email validation - LoginPasswordScreen with password visibility toggle - LoginCodeScreen with verification code input - RegisterScreen with step indicator - RegisterStep2Screen with password/code/invite inputs
2026-02-25 10:57:43 +08:00
parent 8c0b0a25c3
commit 4fb90de1f5
7 changed files with 1016 additions and 0 deletions
@@ -0,0 +1,180 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import '../../../../core/theme/design_tokens.dart';
+import '../../../../shared/widgets/app_button.dart';
+
+class RegisterScreen extends StatefulWidget {
+  const RegisterScreen({super.key});
+
+  @override
+  State<RegisterScreen> createState() => _RegisterScreenState();
+}
+
+class _RegisterScreenState extends State<RegisterScreen> {
+  final _nicknameController = TextEditingController();
+  final _emailController = TextEditingController();
+
+  @override
+  void dispose() {
+    _nicknameController.dispose();
+    _emailController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: AppColors.background,
+      body: SafeArea(
+        child: Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 24),
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.center,
+            children: [
+              Expanded(
+                child: Center(
+                  child: Column(
+                    mainAxisSize: MainAxisSize.min,
+                    crossAxisAlignment: CrossAxisAlignment.center,
+                    children: [
+                      _buildAppIcon(),
+                      const SizedBox(height: 24),
+                      _buildAppTitle(),
+                      const SizedBox(height: 24),
+                      _buildFormContainer(),
+                    ],
+                  ),
+                ),
+              ),
+              _buildFooter(),
+              const SizedBox(height: 24),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+
+  Widget _buildAppIcon() {
+    return Container(
+      width: 104,
+      height: 104,
+      decoration: BoxDecoration(
+        color: AppColors.appIconRing,
+        borderRadius: BorderRadius.circular(52),
+        border: Border.all(color: AppColors.appIconBorder, width: 1),
+      ),
+      child: Center(
+        child: ClipRRect(
+          borderRadius: BorderRadius.circular(38),
+          child: Image.asset(
+            'assets/images/logo.png',
+            width: 76,
+            height: 76,
+            fit: BoxFit.cover,
+          ),
+        ),
+      ),
+    );
+  }
+
+  Widget _buildAppTitle() {
+    return const Text(
+      'linksy',
+      style: TextStyle(
+        fontFamily: 'Playfair Display',
+        fontSize: 34,
+        fontWeight: FontWeight.w700,
+        fontStyle: FontStyle.italic,
+        color: AppColors.appTitle,
+        letterSpacing: 0.5,
+      ),
+    );
+  }
+
+  Widget _buildFormContainer() {
+    return SizedBox(
+      width: 327,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.stretch,
+        children: [
+          _buildInput('昵称', '请输入昵称', _nicknameController),
+          const SizedBox(height: 12),
+          _buildInput('邮箱', '请输入邮箱', _emailController),
+          const SizedBox(height: 12),
+          _buildStepIndicator(),
+          const SizedBox(height: 12),
+          AppButton(
+            text: '下一步',
+            onPressed: () => context.push('/register/step2'),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildInput(
+    String label,
+    String hint,
+    TextEditingController controller,
+  ) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Text(
+          label,
+          style: const TextStyle(
+            fontSize: 13,
+            fontWeight: FontWeight.w500,
+            color: Color(0xFF475569),
+          ),
+        ),
+        const SizedBox(height: 6),
+        TextField(
+          controller: controller,
+          decoration: InputDecoration(hintText: hint),
+        ),
+      ],
+    );
+  }
+
+  Widget _buildStepIndicator() {
+    return Row(
+      children: [
+        Expanded(
+          child: Container(
+            height: 4,
+            decoration: BoxDecoration(
+              color: AppColors.primary,
+              borderRadius: BorderRadius.circular(99),
+            ),
+          ),
+        ),
+        const SizedBox(width: 6),
+        Expanded(
+          child: Container(
+            height: 4,
+            decoration: BoxDecoration(
+              color: const Color(0xFFDCE3EC),
+              borderRadius: BorderRadius.circular(99),
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+
+  Widget _buildFooter() {
+    return GestureDetector(
+      onTap: () => context.pop(),
+      child: const Text(
+        '已有账号？去登录',
+        style: TextStyle(
+          fontSize: 14,
+          fontWeight: FontWeight.w500,
+          color: AppColors.slate500,
+        ),
+      ),
+    );
+  }
+}