import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'package:new_learn/pages/demo/detail_page.dart';
import 'package:new_learn/pages/demo/picker_page.dart';

/// 路由首页
/// 三个按钮演示三种跳转姿势（push 传参 / 返回结果 / 命名路由）
class RouterHomePage extends StatelessWidget {
  const RouterHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('路由导航 Demo')),
      body: Padding(
        padding: EdgeInsets.all(16.w),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            // ---- 方式1：push + 构造函数传参 ----
            FilledButton.icon(
              icon: const Icon(Icons.send),
              label: const Text('方式1：push 构造传参 → 详情页'),
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (_) => const DetailPage(name: '张三', age: 18),
                  ),
                );
              },
            ),
            SizedBox(height: 12.h),
            // ---- 方式2：push + 等待返回结果 ----
            FilledButton.tonalIcon(
              icon: const Icon(Icons.checklist),
              label: const Text('方式2：push 选择器并接收返回结果'),
              onPressed: () async {
                // 注意：push 返回的是 Future，用 await 接收 pop 带回来的值
                final result = await Navigator.push<String>(
                  context,
                  MaterialPageRoute(builder: (_) => const PickerPage()),
                );
                if (context.mounted) {
                  ScaffoldMessenger.of(context).showSnackBar(
                    SnackBar(content: Text('你选择了：${result ?? '未选择'}')),
                  );
                }
              },
            ),
            SizedBox(height: 12.h),
            // ---- 方式3：pushNamed 命名路由 + arguments 传参 ----
            FilledButton.icon(
              icon: const Icon(Icons.route),
              label: const Text('方式3：pushNamed 命名路由 + arguments'),
              onPressed: () {
                Navigator.pushNamed(
                  context,
                  '/detail',
                  arguments: {'name': '李四', 'age': 25},
                );
              },
            ),
            SizedBox(height: 24.h),
            Text(
              '知识点：页面跳转是【入栈/出栈】。'
              '返回页 pop 时带值 → 接收页 await push 拿到值。'
              '命名路由的 arguments 是 dynamic，取值需判空强转。',
              style: TextStyle(fontSize: 13.sp, color: Color(0xFF888888)),
            ),
          ],
        ),
      ),
    );
  }
}