24

lib/v12/app.dart

@@ -0,0 +1 @@
+export 'app/unit_app.dart';

lib/v12/app/authentication/auth_scope.dart

@@ -0,0 +1,75 @@
+import 'package:flutter/material.dart';
+
+const Map<String,String> _kTestUserMap = {
+  'toly': '123456',
+  '张风捷特烈': '111111',
+  'test1': '111111',
+};
+
+class AuthScope extends InheritedNotifier<AuthResult> {
+  const AuthScope({super.key, required super.child, super.notifier});
+
+  static AuthResult of(BuildContext context) {
+    return context
+        .dependOnInheritedWidgetOfExactType<AuthScope>()!
+        .notifier!;
+  }
+
+  static AuthResult read(BuildContext context) {
+    return context
+        .getInheritedWidgetOfExactType<AuthScope>()!
+        .notifier!;
+  }
+}
+
+enum AuthStatus{
+  none,
+  success,
+  failed,
+  waitingLogin,
+  waitingLoginOut,
+}
+
+class AuthResult with ChangeNotifier {
+  String? name;
+  int coin = 0;
+  String? token;
+  AuthStatus status = AuthStatus.none;
+
+  AuthResult();
+
+  Future<(bool,String)> login(String username,String pwd) async{
+    /// 模拟校验 与 模拟延时
+    bool allow = _kTestUserMap[username] == pwd;
+    status = AuthStatus.waitingLogin;
+    notifyListeners();
+      await Future.delayed(const Duration(seconds: 1));
+    if(allow){
+      name = username;
+      coin = 1994328;
+      token = 'testToken======';
+      status = AuthStatus.success;
+      notifyListeners();
+      return (true,'登陆成功!');
+    }else{
+      /// 可以返回一写其他错误信息
+      status = AuthStatus.failed;
+      notifyListeners();
+      return (false,'登陆失败!');
+    }
+  }
+
+  Future<bool> logout() async{
+    status = AuthStatus.waitingLoginOut;
+    notifyListeners();
+    /// 模拟退出登录请求耗时
+    await Future.delayed(const Duration(seconds: 1));
+    name = null;
+    coin = 0;
+    token = null;
+    status = AuthStatus.none;
+    notifyListeners();
+    return true;
+  }
+}
+

lib/v12/app/navigation/helper/function.dart

@@ -0,0 +1,25 @@
+import 'package:flutter/cupertino.dart';
+
+Map<String, String> kRouteLabelMap = {
+  '': '',
+  '/color': '颜色板',
+  '/color/add': '添加颜色',
+  '/color/detail': '颜色详情',
+  '/counter': '计数器',
+  '/sort': '排序算法',
+  '/sort/player': '',
+  '/sort/settings': '排序配置',
+  '/user': '我的',
+  '/settings': '系统设置',
+};
+
+
+String calcRouteName(BuildContext context,String path){
+  String? result = kRouteLabelMap[path];
+  if(result !=null) return result;
+  if(path.startsWith('/sort/player/')){
+    return path.split('/sort/player/')[1];
+  }
+
+  return '未知路由';
+}

lib/v12/app/navigation/helper/router_history.dart

@@ -0,0 +1,108 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+class RouterHistoryScope extends InheritedNotifier<RouterHistory> {
+  const RouterHistoryScope({super.key, required super.child, super.notifier});
+
+  static RouterHistory of(BuildContext context) {
+    return context
+        .dependOnInheritedWidgetOfExactType<RouterHistoryScope>()!
+        .notifier!;
+  }
+
+  static RouterHistory read(BuildContext context) {
+    return context
+        .getInheritedWidgetOfExactType<RouterHistoryScope>()!
+        .notifier!;
+  }
+}
+
+class RouterHistory with ChangeNotifier {
+  final List<String> exclusives;
+
+  final GoRouterDelegate delegate;
+
+  final List<RouteMatchList> _histories = [];
+  final List<RouteMatchList> _backHistories = [];
+
+  List<RouteMatchList> get histories => _histories;
+
+  RouterHistory(this.delegate, {this.exclusives = const []}) {
+    delegate.addListener(_onRouteChange);
+  }
+
+  /// 用于记录当前历史记录
+  /// 清空历史之后，切换时，先记录 _current
+  RouteMatchList? _current;
+
+  void _onRouteChange() {
+    /// 当没有历史，且 _current 非空
+    if (_histories.isEmpty && _current != null) {
+      _histories.add(_current!);
+    }
+
+    RouteMatchList matchList = delegate.currentConfiguration;
+    if (_histories.isNotEmpty && matchList == _histories.last
+    || matchList.isEmpty
+    ) return;
+
+
+
+    String uri = matchList.last.matchedLocation;
+    if (exclusives.contains(uri)) {
+      return;
+    }
+    _recode(matchList);
+  }
+
+  /// 将 [history] 加入历史记录
+  void _recode(RouteMatchList history) {
+    _current = history;
+    _histories.add(history);
+    if (hasHistory) {
+      notifyListeners();
+    }
+  }
+
+  bool get hasHistory => _histories.length > 1;
+
+  bool get hasBackHistory => _backHistories.isNotEmpty;
+
+  /// 历史回退操作
+  /// 将当前顶层移除，并加入 [_backHistories] 撤销列表
+  /// 并转到前一路径 [_histories.last]
+  void back() {
+    if (!hasHistory) {
+      return;
+    }
+    RouteMatchList top = _histories.removeLast();
+    _backHistories.add(top);
+    if (_histories.isNotEmpty) {
+      delegate.setNewRoutePath(_histories.last);
+      notifyListeners();
+    }
+  }
+
+  /// 撤销回退操作
+  /// 取出回退列表的最后元素，跳转到该路径
+  void revocation() {
+    RouteMatchList target = _backHistories.removeLast();
+    delegate.setNewRoutePath(target);
+    notifyListeners();
+  }
+
+  void close(RouteMatchList history) {
+    _histories.remove(history);
+    notifyListeners();
+  }
+
+  void clear() {
+    _histories.clear();
+    notifyListeners();
+  }
+
+  void select(RouteMatchList history) {
+    _histories.remove(history);
+    delegate.setNewRoutePath(history);
+  }
+}

lib/v12/app/navigation/router/app.dart

@@ -0,0 +1,44 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import '../../../pages/counter/counter_page.dart';
+import '../../../pages/user/user_page.dart';
+import '../../../pages/settings/settings_page.dart';
+import '../../../pages/empty/empty_panel.dart';
+import '../views/app_navigation.dart';
+import 'color.dart';
+import 'sort.dart';
+
+
+final RouteBase appRoute = ShellRoute(
+  builder: (BuildContext context, GoRouterState state, Widget child) {
+    return AppNavigation(navigator: child);
+  },
+  routes: <RouteBase>[
+    colorRouters,
+    GoRoute(
+        path: 'counter',
+        builder: (BuildContext context, GoRouterState state) {
+          return const CounterPage();
+        }),
+    sortRouters,
+    GoRoute(
+      path: 'user',
+      builder: (BuildContext context, GoRouterState state) {
+        return const UserPage();
+      },
+    ),
+    GoRoute(
+      path: 'settings',
+      builder: (BuildContext context, GoRouterState state) {
+        return const SettingPage();
+      },
+    ),
+    GoRoute(
+      path: '404',
+      builder: (BuildContext context, GoRouterState state) {
+        String msg = '无法访问: ${state.extra}';
+        return EmptyPanel(msg: msg);
+      },
+    )
+  ],
+);

lib/v12/app/navigation/router/color.dart

@@ -0,0 +1,35 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import '../../../pages/color/color_add_page.dart';
+import '../../../pages/color/color_detail_page.dart';
+import '../../../pages/color/color_page.dart';
+
+
+
+final RouteBase colorRouters = GoRoute(
+  path: 'color',
+  builder: (BuildContext context, GoRouterState state) {
+    return const ColorPage();
+  },
+  routes: <RouteBase>[
+    GoRoute(
+      path: 'detail',
+      name: 'colorDetail',
+      builder: (BuildContext context, GoRouterState state) {
+        String? selectedColor = state.uri.queryParameters['color'];
+        Color color = Colors.black;
+        if (selectedColor != null) {
+          color = Color(int.parse(selectedColor, radix: 16));
+        }
+        return ColorDetailPage(color: color);
+      },
+    ),
+    GoRoute(
+      path: 'add',
+      builder: (BuildContext context, GoRouterState state) {
+        return const ColorAddPage();
+      },
+    ),
+  ],
+);
+

lib/v12/app/navigation/router/root.dart

@@ -0,0 +1,27 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import '../../../pages/login/login.dart';
+import 'app.dart';
+
+final RouteBase rootRoute = GoRoute(
+  path: '/',
+  redirect: _redirect,
+  routes: [
+    appRoute,
+    GoRoute(
+      path: 'login',
+      builder: (BuildContext context, GoRouterState state) {
+        return const LoginPage();
+      },
+    ),
+  ],
+);
+
+FutureOr<String?> _redirect(BuildContext context, GoRouterState state) {
+  if(state.fullPath=='/'){
+    return '/color';
+  }
+  return null;
+}

lib/v12/app/navigation/router/sort.dart

@@ -0,0 +1,44 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import '../../../pages/sort/provider/state.dart';
+
+import '../../../pages/sort/views/player/sort_player.dart';
+import '../../../pages/sort/views/settings/sort_setting.dart';
+import '../../../pages/sort/views/sort_page/sort_page.dart';
+
+final RouteBase sortRouters = ShellRoute(
+  builder: (BuildContext context, GoRouterState state, Widget child) {
+    return SortNavigation(navigator: child);
+  },
+  routes: [
+    GoRoute(
+      path: 'sort',
+      redirect: _redirectSort,
+      routes: [
+        GoRoute(
+          path: 'player/:name',
+          builder: (BuildContext context, GoRouterState state) {
+            print(state.pathParameters);// 获取路径参数
+            return const SortPlayer();
+          },
+        ),
+        GoRoute(
+          path: 'settings',
+          builder: (BuildContext context, GoRouterState state) {
+            return const SortSettings();
+          },
+        ),
+      ],
+    ),
+  ],
+);
+
+FutureOr<String?> _redirectSort(BuildContext context, GoRouterState state) {
+  if (state.fullPath == '/sort') {
+    String name = SortStateScope.read(context).config.name;
+    return '/sort/player/$name';
+  }
+  return null;
+}

lib/v12/app/navigation/transition/fade_page_transitions_builder.dart

@@ -0,0 +1,43 @@
+import 'package:flutter/material.dart';
+
+class FadePageTransitionsBuilder extends PageTransitionsBuilder {
+
+  const FadePageTransitionsBuilder();
+
+  @override
+  Widget buildTransitions<T>(
+      PageRoute<T>? route,
+      BuildContext? context,
+      Animation<double> animation,
+      Animation<double> secondaryAnimation,
+      Widget child,
+      ) {
+    return _FadePagePageTransition(
+      animation: animation,
+      secondaryAnimation: secondaryAnimation,
+      child: child,
+    );
+  }
+}
+
+class _FadePagePageTransition extends StatelessWidget {
+
+  const _FadePagePageTransition({
+    required this.animation,
+    required this.secondaryAnimation,
+    required this.child,
+  });
+
+  final Animation<double> animation;
+  final Animation<double> secondaryAnimation;
+  final Widget child;
+
+  @override
+  Widget build(BuildContext context) {
+    var curveTween = CurveTween(curve: Curves.easeIn);
+    return FadeTransition(
+      opacity: animation.drive(curveTween),
+      child: child,
+    );
+  }
+}

lib/v12/app/navigation/transition/fade_transition_page.dart

@@ -0,0 +1,52 @@
+// Copyright 2021, the Flutter project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import 'package:flutter/material.dart';
+
+class FadeTransitionPage<T> extends Page<T> {
+  final Widget child;
+  final Duration duration;
+
+  const FadeTransitionPage({
+    super.key,
+    required this.child,
+    this.duration = const Duration(milliseconds: 300),
+  });
+
+  @override
+  Route<T> createRoute(BuildContext context) => PageBasedFadeTransitionRoute<T>(this);
+}
+
+class PageBasedFadeTransitionRoute<T> extends PageRoute<T> {
+  final FadeTransitionPage<T> _page;
+
+  PageBasedFadeTransitionRoute(this._page) : super(settings: _page);
+
+  @override
+  Color? get barrierColor => null;
+
+  @override
+  String? get barrierLabel => null;
+
+  @override
+  Duration get transitionDuration => _page.duration;
+
+  @override
+  bool get maintainState => true;
+
+  @override
+  Widget buildPage(BuildContext context, Animation<double> animation,
+      Animation<double> secondaryAnimation) {
+    var curveTween = CurveTween(curve: Curves.easeIn);
+    return FadeTransition(
+      opacity: animation.drive(curveTween),
+      child: (settings as FadeTransitionPage).child,
+    );
+  }
+
+  @override
+  Widget buildTransitions(BuildContext context, Animation<double> animation,
+          Animation<double> secondaryAnimation, Widget child) =>
+      child;
+}

lib/v12/app/navigation/transition/no_transition_page.dart

@@ -0,0 +1,47 @@
+// Copyright 2021, the Flutter project authors. Please see the AUTHORS file
+// for details. All rights reserved. Use of this source code is governed by a
+// BSD-style license that can be found in the LICENSE file.
+
+import 'package:flutter/material.dart';
+
+class NoTransitionPage<T> extends Page<T> {
+  final Widget child;
+
+  const NoTransitionPage({
+    super.key,
+    required this.child,
+  });
+
+  @override
+  Route<T> createRoute(BuildContext context) => NoTransitionRoute<T>(this);
+}
+
+class NoTransitionRoute<T> extends PageRoute<T> {
+
+  final NoTransitionPage<T> _page;
+
+  NoTransitionRoute(this._page) : super(settings: _page);
+
+  @override
+  Color? get barrierColor => null;
+
+  @override
+  String? get barrierLabel => null;
+
+  @override
+  Duration get transitionDuration => const Duration(milliseconds: 0);
+
+  @override
+  bool get maintainState => true;
+
+  @override
+  Widget buildPage(BuildContext context, Animation<double> animation,
+      Animation<double> secondaryAnimation) {
+    return (settings as NoTransitionPage).child;
+  }
+
+  @override
+  Widget buildTransitions(BuildContext context, Animation<double> animation,
+          Animation<double> secondaryAnimation, Widget child) =>
+      child;
+}

lib/v12/app/navigation/views/app_navigation.dart

@@ -0,0 +1,50 @@
+import 'package:flutter/material.dart';
+import 'app_navigation_rail.dart';
+import 'app_top_bar/app_top_bar.dart';
+
+class AppNavigation extends StatefulWidget {
+  final Widget navigator;
+
+  const AppNavigation({super.key,required this.navigator});
+
+  @override
+  State<AppNavigation> createState() => _AppNavigationState();
+}
+
+class _AppNavigationState extends State<AppNavigation> {
+
+  @override
+  void initState() {
+    print('======_AppNavigationState#initState==============');
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    print('======_AppNavigationState#dispose==============');
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    double px1 = 1/View.of(context).devicePixelRatio;
+    return Scaffold(
+      body: Row(
+        children: [
+          const AppNavigationRail(),
+          Expanded(
+            child: Column(
+              children: [
+                const AppTopBar(),
+                Divider(height: px1,),
+                Expanded(
+                  child: widget.navigator,
+                ),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/v12/app/navigation/views/app_navigation_rail.dart

@@ -0,0 +1,65 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/components.dart';
+
+class AppNavigationRail extends StatefulWidget {
+  const AppNavigationRail({super.key});
+
+  @override
+  State<AppNavigationRail> createState() => _AppNavigationRailState();
+}
+
+class _AppNavigationRailState extends State<AppNavigationRail> {
+  final List<MenuMeta> deskNavBarMenus = const [
+    MenuMeta(label: '颜色板', icon: Icons.color_lens_outlined, path: '/color'),
+    MenuMeta(label: '计数器', icon: Icons.add_chart, path: '/counter'),
+    MenuMeta(label: '排序', icon: Icons.sort, path: '/sort'),
+    MenuMeta(label: '我的', icon: Icons.person, path: '/user'),
+    MenuMeta(label: '设置', icon: Icons.settings, path: '/settings'),
+  ];
+
+
+  @override
+  Widget build(BuildContext context) {
+    return DragToMoveWrap(
+      child: TolyNavigationRail(
+        items: deskNavBarMenus,
+        leading: const Padding(
+          padding: EdgeInsets.symmetric(vertical: 18.0),
+          child: FlutterLogo(),
+        ),
+        tail: Padding(
+          padding: const EdgeInsets.only(bottom: 6.0),
+          child: Text(
+            'V0.1.1',
+            style: TextStyle(color: Colors.white, fontSize: 12),
+          ),
+        ),
+        backgroundColor: const Color(0xff3975c6),
+        onDestinationSelected: _onDestinationSelected,
+        selectedIndex: activeIndex,
+      ),
+    );
+  }
+
+  final RegExp _segReg = RegExp(r'/\w+');
+
+  int? get activeIndex {
+    final String path = GoRouterState.of(context).uri.toString();
+    RegExpMatch? match = _segReg.firstMatch(path);
+    if (match == null) return null;
+    String? target = match.group(0);
+    int index = deskNavBarMenus.indexWhere((menu) => menu.path!.contains(target??''));
+    if (index == -1) return null;
+    return index;
+  }
+
+  void _onDestinationSelected(int index) {
+    String path = deskNavBarMenus[index].path!;
+    if(index==4){
+      GoRouter.of(context).push(path);
+    }else{
+      GoRouter.of(context).go(path);
+    }
+  }
+}

lib/v12/app/navigation/views/app_top_bar/app_router_editor.dart

@@ -0,0 +1,76 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/toly_ui/button/hover_icon_button.dart';
+// import '../../router/app_router_delegate.dart';
+
+class AppRouterEditor extends StatefulWidget {
+  final ValueChanged<String>? onSubmit;
+  const AppRouterEditor({super.key, this.onSubmit});
+
+  @override
+  State<AppRouterEditor> createState() => _AppRouterEditorState();
+}
+
+class _AppRouterEditorState extends State<AppRouterEditor> {
+
+  final TextEditingController _controller = TextEditingController();
+  late GoRouterDelegate _delegate ;
+
+
+  @override
+  void initState() {
+    super.initState();
+    _delegate =   GoRouter.of(context).routerDelegate;
+
+    _onRouteChange();
+    _delegate.addListener(_onRouteChange);
+  }
+
+  void _onRouteChange() {
+
+    List<RouteMatch> matches = _delegate.currentConfiguration.matches;
+    if(matches.isEmpty) return;
+    RouteMatch match = matches.last;
+    if(match is ImperativeRouteMatch){
+      _controller.text = match.matches.uri.toString();
+    }else{
+      _controller.text = match.matchedLocation;
+    }
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    _delegate.removeListener(_onRouteChange);
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Stack(
+      alignment: Alignment.centerRight,
+      children: [
+        SizedBox(
+          child: CupertinoTextField(
+            controller: _controller,
+            style: TextStyle(fontSize: 14),
+            padding: EdgeInsets.only(left:12,top: 6,bottom: 6,right: 32),
+            placeholder: '输入路由地址导航',
+            onSubmitted: widget.onSubmit,
+            decoration: BoxDecoration(color: Color(0xffF1F2F3),borderRadius: BorderRadius.circular(6)),
+          ),
+        ),
+        Padding(
+          padding: const EdgeInsets.only(right: 8.0),
+          child: HoverIconButton(
+            icon: Icons.directions_outlined,
+            defaultColor: Color(0xff68696B),
+            onPressed:()=>widget.onSubmit?.call(_controller.text),
+            size: 20
+          ),
+        )
+      ],
+    );
+  }
+}

lib/v12/app/navigation/views/app_top_bar/app_top_bar.dart

@@ -0,0 +1,137 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/components.dart';
+import '../../helper/function.dart';
+import '../route_back_indicator.dart';
+import 'app_router_editor.dart';
+import 'route_history_button.dart';
+import 'history_view_icon.dart';
+
+class AppTopBar extends StatelessWidget {
+  const AppTopBar({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return DragToMoveWrap(
+      child: Container(
+        // alignment: Alignment.center,
+        height: 46,
+        child: Row(
+          children: [
+            const SizedBox(width: 16),
+            const RouteBackIndicator(),
+            const RouterIndicator(),
+            // Spacer(),
+            Expanded(
+                child: Row(textDirection: TextDirection.rtl, children: [
+              const Padding(
+                padding: EdgeInsets.symmetric(vertical: 12.0),
+                child: VerticalDivider(
+                  width: 32,
+                ),
+              ),
+              HistoryViewIcon(),
+              const SizedBox(
+                width: 12,
+              ),
+              SizedBox(
+                  width: 250,
+                  child: AppRouterEditor(
+                    onSubmit: (path) {
+                      GoRouter.of(context).go(path);
+                      // => router.changePath(path)
+                    },
+                  )),
+              const SizedBox(
+                width: 12,
+              ),
+              RouteHistoryButton(),
+            ])),
+            const WindowButtons()
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class RouterIndicator extends StatefulWidget {
+  const RouterIndicator({super.key});
+
+  @override
+  State<RouterIndicator> createState() => _RouterIndicatorState();
+}
+
+class _RouterIndicatorState extends State<RouterIndicator> {
+  late GoRouterDelegate _delegate;
+  @override
+  void initState() {
+    super.initState();
+    _delegate = GoRouter.of(context).routerDelegate;
+    _delegate.addListener(_onRouterChange);
+  }
+
+  @override
+  void dispose() {
+    _delegate.removeListener(_onRouterChange);
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    List<RouteMatch> matches = _delegate.currentConfiguration.matches;
+    if(matches.isEmpty) return const SizedBox();
+    RouteMatch match = _delegate.currentConfiguration.matches.last;
+
+    print(
+        "=========_RouterIndicatorState:build==${match.matchedLocation}========");
+
+    return TolyBreadcrumb(
+      items: pathToBreadcrumbItems(context, match.matchedLocation),
+      onTapItem: (item) {
+        if (item.to != null) {
+          GoRouter.of(context).go(item.to!);
+        }
+      },
+    );
+  }
+
+  void _onRouterChange() {
+    setState(() {});
+  }
+
+  List<BreadcrumbItem> pathToBreadcrumbItems(
+      BuildContext context, String path) {
+    Uri uri = Uri.parse(path);
+    List<BreadcrumbItem> result = [];
+    String to = '';
+
+    String distPath = '';
+    for (String segment in uri.pathSegments) {
+      distPath += '/$segment';
+    }
+
+    for (String segment in uri.pathSegments) {
+      to += '/$segment';
+      String label = calcRouteName(context, to);
+      if (label.isNotEmpty) {
+        result
+            .add(BreadcrumbItem(to: to, label: label, active: to == distPath));
+      }
+    }
+    return result;
+  }
+}
+
+Map<String, String> kRouteLabelMap = {
+  '': '',
+  '/color': '颜色板',
+  '/color/add': '添加颜色',
+  '/color/detail': '颜色详情',
+  '/counter': '计数器',
+  '/sort': '排序算法',
+  '/sort/player': '演示',
+  '/sort/settings': '排序配置',
+  '/user': '我的',
+  '/settings': '系统设置',
+};

lib/v12/app/navigation/views/app_top_bar/history_view_icon.dart

@@ -0,0 +1,156 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/components.dart';
+import 'package:iroute/v11/app/navigation/helper/function.dart';
+import '../../helper/router_history.dart';
+import 'app_top_bar.dart';
+
+class HistoryViewIcon extends StatelessWidget{
+  const HistoryViewIcon({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    RouterHistory routerHistory = RouterHistoryScope.read(context);
+
+    return MouseRegion(
+      cursor: SystemMouseCursors.click,
+      child: PopPanel(
+        offset: const Offset(0, 10),
+        panel: SizedBox(
+          height: 350,
+          child: Column(
+            children: [
+              _buildTopBar(routerHistory),
+              const Expanded(
+                child:HistoryPanel(),
+              ),
+            ],
+          ),
+        ),
+        child: const Icon(
+          Icons.history,
+          size: 20,
+        ),
+      ),
+    );
+  }
+
+  Widget _buildTopBar( RouterHistory routerHistory) {
+   return Container(
+        decoration: BoxDecoration(
+          color: const Color(0xffFAFAFC),
+          borderRadius: BorderRadius.circular(6),
+        ),
+        padding:
+        const EdgeInsets.only(top: 10, left: 12, right: 12, bottom: 8),
+        child: Row(
+          children: [
+            const Text(
+              '浏览历史',
+              style: TextStyle(fontWeight: FontWeight.bold),
+            ),
+            const Spacer(),
+            TextButton(onPressed: routerHistory.clear, child: const Text('清空历史'))
+          ],
+        ));
+  }
+}
+
+class HistoryItem extends StatefulWidget {
+  final RouteMatchList history;
+  final VoidCallback onPressed;
+  final VoidCallback onDelete;
+
+  const HistoryItem({super.key, required this.history, required this.onPressed, required this.onDelete});
+
+  @override
+  State<HistoryItem> createState() => _HistoryItemState();
+}
+
+class _HistoryItemState extends State<HistoryItem> {
+  @override
+  Widget build(BuildContext context) {
+    String path = widget.history.matches.last.matchedLocation;
+    return MouseRegion(
+      cursor: SystemMouseCursors.click,
+      child: GestureDetector(
+        behavior: HitTestBehavior.opaque,
+        onTap: widget.onPressed,
+        child: Row(
+          children: [
+            Expanded(
+                child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Text(path),
+                const SizedBox(
+                  height: 2,
+                ),
+                Text(calcRouteName(context, path)),
+              ],
+            )),
+            GestureDetector(
+              onTap: widget.onDelete,
+              child: const Icon(
+                Icons.close,
+                size: 18,
+                color: Color(0xff8E92A9),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class HistoryPanel extends StatefulWidget {
+  const HistoryPanel({super.key});
+
+  @override
+  State<HistoryPanel> createState() => _HistoryPanelState();
+}
+
+class _HistoryPanelState extends State<HistoryPanel> {
+  late RouterHistory _history ;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    _history = RouterHistoryScope.of(context);
+  }
+
+
+  @override
+  Widget build(BuildContext context) {
+    List<RouteMatchList> histories = _history.histories.reversed.toList();
+    if(histories.isEmpty){
+      return const Center(
+        child: Text(
+          '暂无浏览历史记录',
+          style: TextStyle(fontSize: 14, color: Colors.grey),
+        ),
+      );
+    }
+    return ListView.builder(
+      padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 16),
+      itemExtent: 46,
+      itemCount: histories.length,
+      itemBuilder: (_, index) =>
+          HistoryItem(
+              onDelete: (){
+                _history.close(histories[index]);
+              },
+              onPressed: ()async {
+                Navigator.of(context).pop();
+                _history.select(histories[index]);
+                // router.changeRoute(histories[index].copyWith(recordHistory: false));
+              },
+              history: histories[index]),
+    );
+  }
+
+  void _onChange() {
+    setState(() {});
+  }
+}

lib/v12/app/navigation/views/app_top_bar/route_history_button.dart

@@ -0,0 +1,52 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:iroute/components/toly_ui/button/hover_icon_button.dart';
+
+import '../../helper/router_history.dart';
+
+class RouteHistoryButton extends StatefulWidget {
+  const RouteHistoryButton({super.key});
+
+  @override
+  State<RouteHistoryButton> createState() => _RouteHistoryButtonState();
+}
+
+class _RouteHistoryButtonState extends State<RouteHistoryButton> {
+
+  late RouterHistory _history ;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    _history = RouterHistoryScope.of(context);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    bool hasHistory = _history.hasHistory;
+    bool hasBackHistory = _history.hasBackHistory;
+    Color activeColor = const Color(0xff9195AC);
+    Color inActiveColor = const Color(0xffC7CAD5);
+    Color historyColor = hasHistory?activeColor:inActiveColor;
+    Color backHistoryColor = hasBackHistory?activeColor:inActiveColor;
+    return Wrap(
+      children: [
+        HoverIconButton(
+          size: 20,
+          hoverColor: historyColor,
+          defaultColor: historyColor,
+          icon: CupertinoIcons.arrow_left_circle,
+          onPressed: hasHistory?_history.back:null,
+      ),
+        const SizedBox(width: 8,),
+        HoverIconButton(
+          size: 20,
+          hoverColor: backHistoryColor,
+          defaultColor: backHistoryColor,
+          icon: CupertinoIcons.arrow_right_circle,
+          onPressed: hasBackHistory?_history.revocation:null,
+        ),
+      ],
+    );
+  }
+}

lib/v12/app/navigation/views/not_find_view.dart

@@ -0,0 +1,25 @@
+import 'package:flutter/material.dart';
+
+class NotFindPage extends StatelessWidget {
+  const NotFindPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return  const Material(
+      child: Center(
+            child: Wrap(
+              spacing: 16,
+              crossAxisAlignment: WrapCrossAlignment.center,
+              direction: Axis.vertical,
+              children: [
+                Icon(Icons.nearby_error,size: 64, color: Colors.redAccent),
+                Text(
+                  '404 Page Not Find',
+                  style: TextStyle(fontSize: 24, color: Colors.grey),
+                ),
+              ],
+            ),
+      ),
+    );
+  }
+}

lib/v12/app/navigation/views/route_back_indicator.dart

@@ -0,0 +1,58 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+class RouteBackIndicator extends StatefulWidget {
+  const RouteBackIndicator({super.key});
+
+  @override
+  State<RouteBackIndicator> createState() => _RouteBackIndicatorState();
+}
+
+class _RouteBackIndicatorState extends State<RouteBackIndicator> {
+
+  late GoRouterDelegate _delegate ;
+
+  @override
+  void initState() {
+    super.initState();
+    _delegate =  GoRouter.of(context).routerDelegate;
+    _delegate.addListener(_onChange);
+  }
+
+  @override
+  void dispose() {
+    _delegate.removeListener(_onChange);
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    bool hasPush = _delegate.currentConfiguration.matches
+        .whereType<ImperativeRouteMatch>().isNotEmpty;
+    if(hasPush){
+      return MouseRegion(
+        cursor: SystemMouseCursors.click,
+        child: GestureDetector(
+          onTap: context.pop,
+          child: Container(
+              width: 26,
+              height: 26,
+              margin: EdgeInsets.only(right: 8),
+              alignment: Alignment.center,
+              decoration: BoxDecoration(
+                color: Color(0xffE3E5E7),
+                borderRadius: BorderRadius.circular(6)
+              ),
+              child: Icon(Icons.arrow_back_ios_new,size: 14,)),
+        ),
+      );
+    }
+    return SizedBox();
+  }
+
+  void _onChange() {
+    setState(() {
+
+    });
+  }
+}

lib/v12/app/unit_app.dart

@@ -0,0 +1,77 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import '../app/authentication/auth_scope.dart';
+import 'navigation/router/root.dart';
+import '../pages/sort/provider/state.dart';
+import 'navigation/helper/router_history.dart';
+import 'navigation/transition/fade_page_transitions_builder.dart';
+
+
+
+
+class UnitApp extends StatelessWidget {
+  UnitApp({super.key});
+
+  final GoRouter _router = GoRouter(
+    routes: <RouteBase>[rootRoute],
+    onException: (BuildContext ctx, GoRouterState state, GoRouter router) {
+      router.go('/404', extra: state.uri.toString());
+    },
+    redirect: _authRedirect
+  );
+
+  late final RouterHistory _routerHistory = RouterHistory(
+    _router.routerDelegate,
+    exclusives: ['/login'],
+  );
+  final AuthResult _result = AuthResult();
+
+  @override
+  Widget build(BuildContext context) {
+    return  AuthScope(
+      notifier: _result,
+      child: SortStateScope(
+        notifier: SortState(),
+        child: RouterHistoryScope(
+            notifier: _routerHistory,
+            child: MaterialApp.router(
+              routerConfig: _router,
+              theme: ThemeData(
+                  fontFamily: "宋体",
+                  scaffoldBackgroundColor: Colors.white,
+                  pageTransitionsTheme: const PageTransitionsTheme(builders: {
+                    TargetPlatform.android: ZoomPageTransitionsBuilder(),
+                    TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
+                    TargetPlatform.macOS: FadePageTransitionsBuilder(),
+                    TargetPlatform.windows: FadePageTransitionsBuilder(),
+                    TargetPlatform.linux: FadePageTransitionsBuilder(),
+                  }),
+                  appBarTheme: const AppBarTheme(
+                      elevation: 0,
+                      iconTheme: IconThemeData(color: Colors.black),
+                      titleTextStyle: TextStyle(
+                        color: Colors.black,
+                        fontSize: 18,
+                        fontWeight: FontWeight.bold,
+                      ))),
+              debugShowCheckedModeBanner: false,
+              // home: AppNavigation()
+            ),
+          ),
+
+      ),
+    );
+  }
+
+
+}
+
+FutureOr<String?> _authRedirect(BuildContext context, GoRouterState state) async{
+   bool loggedIn = AuthScope.read(context).status==AuthStatus.success;
+   if (!loggedIn) {
+     return '/login';
+   }
+   return null;
+}

lib/v12/pages/color/color_add_page.dart

@@ -0,0 +1,99 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:flutter_colorpicker/flutter_colorpicker.dart';
+
+class ColorAddPage extends StatefulWidget {
+  const ColorAddPage({super.key});
+
+  @override
+  State<ColorAddPage> createState() => _ColorAddPageState();
+}
+
+class _ColorAddPageState extends State<ColorAddPage> {
+  late Color _color;
+
+  @override
+  void initState() {
+    super.initState();
+    _color = randomColor;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    String text = '# ${_color.value.toRadixString(16)}';
+    return Scaffold(
+      bottomNavigationBar: Container(
+        margin: EdgeInsets.only(right:20,bottom: 20),
+        // color: Colors.redAccent,
+        child: Row(
+            textDirection:TextDirection.rtl,
+          children: [
+            ElevatedButton(onPressed: (){
+              Navigator.of(context).pop(_color);
+
+            }, child: Text('添加')),
+            SizedBox(width: 12,),
+            OutlinedButton(onPressed: (){
+              Navigator.of(context).pop();
+            }, child: Text('取消')),
+          ],
+        ),
+      ),
+      body: Column(
+        // mainAxisAlignment: MainAxisAlignment.center,
+        children: [
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 16.0,vertical: 16),
+            child: Row(
+              children: [
+                Expanded(child: Text(text,style: TextStyle(color: _color,fontSize: 24,letterSpacing: 4),)),
+                Container(
+                  margin: EdgeInsets.only(left: 10),
+                  width: 40,
+                  height: 40,
+                  child: Icon(
+                    Icons.sell_outlined,
+                    color: Colors.white,
+                  ),
+                  decoration: BoxDecoration(
+                    color: _color,
+                    borderRadius: BorderRadius.circular(8),
+                  ),
+                ),
+              ],
+            ),
+          ),
+          ColorPicker(
+            colorPickerWidth:200,
+            // enableAlpha: false,
+            displayThumbColor:true,
+            pickerColor: _color,
+            paletteType: PaletteType.hueWheel,
+            onColorChanged: changeColor,
+
+          ),
+        ],
+      ),
+    );
+  }
+
+  Random _random = Random();
+
+  Color get randomColor {
+    return Color.fromARGB(
+      255,
+      _random.nextInt(256),
+      _random.nextInt(256),
+      _random.nextInt(256),
+    );
+  }
+
+
+  void changeColor(Color value) {
+    _color = value;
+    setState(() {
+
+    });
+  }
+}

lib/v12/pages/color/color_detail_page.dart

@@ -0,0 +1,25 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+
+class ColorDetailPage extends StatelessWidget {
+  final Color color;
+  const ColorDetailPage({super.key, required this.color});
+
+  @override
+  Widget build(BuildContext context) {
+
+    const TextStyle style = TextStyle(
+      fontSize: 32,
+      fontWeight: FontWeight.bold,
+      color: Colors.white
+    );
+    String text = '# ${color.value.toRadixString(16)}';
+    return Scaffold(
+      body: Container(
+        alignment: Alignment.center,
+        color: color,
+        child: Text(text ,style: style,),
+      ),
+    );
+  }
+}

lib/v12/pages/color/color_page.dart

@@ -0,0 +1,81 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/project/colors_panel.dart';
+
+class ColorPage extends StatefulWidget {
+  const ColorPage({super.key});
+
+  @override
+  State<ColorPage> createState() => _ColorPageState();
+}
+
+class _ColorPageState extends State<ColorPage> {
+  final List<Color> _colors = [
+    Colors.red,
+    Colors.black,
+    Colors.blue,
+    Colors.green,
+    Colors.orange,
+    Colors.pink,
+    Colors.purple,
+    Colors.indigo,
+    Colors.amber,
+    Colors.cyan,
+    Colors.redAccent,
+    Colors.grey,
+    Colors.blueAccent,
+    Colors.greenAccent,
+    Colors.orangeAccent,
+    Colors.pinkAccent,
+    Colors.purpleAccent,
+    Colors.indigoAccent,
+    Colors.amberAccent,
+    Colors.cyanAccent,
+  ];
+
+  @override
+  void initState() {
+    print('======_ColorPageState#initState==============');
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    print('======_ColorPageState#dispose==============');
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      // appBar: AppBar(title:const Text('颜色主页')),
+      floatingActionButton: FloatingActionButton(
+        onPressed: _toAddPage,
+        child: const Icon(Icons.add),
+      ),
+      body: Align(
+        alignment: Alignment.topCenter,
+        child: ColorsPanel(
+          colors: _colors,
+          onSelect: _selectColor,
+        ),
+      ),
+    );
+  }
+
+  void _selectColor(Color color) {
+    String value = color.value.toRadixString(16);
+    context.push('/color/detail?color=$value');
+    // GoRouter.of(context) .pushNamed('colorDetail', queryParameters: {'color': value});
+  }
+
+  void _toAddPage() async {
+    Color? color = await context.push('/color/add');
+
+    if (color != null) {
+      setState(() {
+        _colors.add(color);
+      });
+    }
+  }
+}

lib/v12/pages/counter/counter_page.dart

@@ -0,0 +1,55 @@
+import 'package:flutter/material.dart';
+
+class CounterPage extends StatefulWidget {
+  const CounterPage({super.key});
+
+  @override
+  State<CounterPage> createState() => _CounterPageState();
+}
+
+class _CounterPageState extends State<CounterPage> {
+  int _counter = 0;
+
+  @override
+  void initState() {
+    print('======_CounterPageState#initState==============');
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    print('======_CounterPageState#dispose==============');
+    super.dispose();
+  }
+
+  void _incrementCounter() {
+    setState(() {
+      _counter++;
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: Center(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: <Widget>[
+            const Text(
+              'You have pushed the button this many times:',
+            ),
+            Text(
+              '$_counter',
+              style: Theme.of(context).textTheme.headlineMedium,
+            ),
+          ],
+        ),
+      ),
+      floatingActionButton: FloatingActionButton(
+        onPressed: _incrementCounter,
+        tooltip: 'Increment',
+        child: const Icon(Icons.add),
+      ),
+    );
+  }
+}

lib/v12/pages/empty/empty_page.dart

@@ -0,0 +1,48 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/components.dart';
+
+class EmptyPage extends StatelessWidget {
+  final String msg;
+  const EmptyPage({super.key, required this.msg});
+
+  @override
+  Widget build(BuildContext context) {
+    return  DragToMoveWrap(
+      child: Scaffold(
+        appBar: PreferredSize(
+          preferredSize: Size.fromHeight(46),
+          child: Row(
+            children: [
+              const SizedBox(width: 20,),
+              Text(
+                '404 界面丢失',
+                style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
+              ),
+              Spacer(),
+              const WindowButtons()
+            ],
+          ),
+        ),
+          body: Center(
+            child: Wrap(
+              spacing: 16,
+              crossAxisAlignment: WrapCrossAlignment.center,
+              direction: Axis.vertical,
+              children: [
+                Icon(Icons.nearby_error,size: 64, color: Colors.redAccent),
+                Text(
+                  msg,
+                  style: TextStyle(fontSize: 24, color: Colors.grey),
+                ),
+                ElevatedButton(onPressed: (){
+                  context.go('/');
+                }, child: Text('返回首页'))
+              ],
+            ),
+          ),
+      ),
+    );
+  }
+}
+

lib/v12/pages/empty/empty_panel.dart

@@ -0,0 +1,30 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:iroute/components/components.dart';
+
+class EmptyPanel extends StatelessWidget {
+  final String msg;
+  const EmptyPanel({super.key, required this.msg});
+
+  @override
+  Widget build(BuildContext context) {
+    return  Center(
+      child: Wrap(
+        spacing: 16,
+        crossAxisAlignment: WrapCrossAlignment.center,
+        direction: Axis.vertical,
+        children: [
+          Icon(Icons.nearby_error,size: 64, color: Colors.redAccent),
+          Text(
+            msg,
+            style: TextStyle(fontSize: 24, color: Colors.grey),
+          ),
+          ElevatedButton(onPressed: (){
+            context.go('/');
+          }, child: Text('返回首页'))
+        ],
+      ),
+    );
+  }
+}
+

lib/v12/pages/login/login.dart

@@ -0,0 +1,178 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+import '../../../components/components.dart';
+import '../../app/authentication/auth_scope.dart';
+import 'login_button.dart';
+
+class LoginPage extends StatefulWidget {
+  const LoginPage({super.key});
+
+  @override
+  State<LoginPage> createState() => _LoginPageState();
+}
+
+class _LoginPageState extends State<LoginPage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: const PreferredSize(
+        preferredSize: Size.fromHeight(46),
+        child: DragToMoveWrap(
+          child: Row(
+            children: [
+              SizedBox(
+                width: 20,
+              ),
+              Text(
+                '欢迎登录',
+                style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
+              ),
+              Spacer(),
+              WindowButtons()
+            ],
+          ),
+        ),
+      ),
+      body: Center(
+        child: SizedBox(
+          width: 360,
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Text(
+                'Login Page',
+                style: TextStyle(fontSize: 24),
+              ),
+              const SizedBox(
+                height: 20,
+              ),
+              buildUsernameInput(),
+              Stack(
+                alignment: const Alignment(.8, 0),
+                children: [
+                  buildPasswordInput(),
+                  GestureDetector(
+                      onTap: () => setState(() => _showPwd = !_showPwd),
+                      child: Icon(
+                          _showPwd ? Icons.remove_red_eye : Icons.hide_source))
+                ],
+              ),
+              const SizedBox(
+                height: 20,
+              ),
+              LoginButton(
+                onLogin: () async {
+                  String username = _usernameController.text;
+                  String pwd = _passwordController.text;
+                  (bool, String) result = await AuthScope.read(context).login(username, pwd);
+                  if (result.$1) {
+                    context.go('/');
+                  }else{
+                    ScaffoldMessenger.of(context).showSnackBar(SnackBar(
+                        backgroundColor: Colors.redAccent,
+                        content: Text(result.$2)));
+                  }
+                },
+              )
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+
+  final _usernameController = TextEditingController(text: '张风捷特烈');
+
+  final _passwordController = TextEditingController(text: '111111');
+
+  Widget buildUsernameInput() {
+    return Column(
+      children: [
+        Container(
+          decoration: BoxDecoration(
+            border: Border.all(
+              color: Colors.grey.withOpacity(0.5),
+              width: 1.0,
+            ),
+            borderRadius: BorderRadius.circular(15.0),
+          ),
+          margin: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
+          child: Row(
+            children: <Widget>[
+              const Padding(
+                padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 15.0),
+                child: Icon(
+                  Icons.person_outline,
+                  color: Colors.grey,
+                ),
+              ),
+              Container(
+                height: 20.0,
+                width: 1.0,
+                color: Colors.grey.withOpacity(0.5),
+                margin: const EdgeInsets.only(left: 00.0, right: 10.0),
+              ),
+              Expanded(
+                child: TextField(
+                  controller: _usernameController,
+                  decoration: const InputDecoration(
+                    border: InputBorder.none,
+                    hintText: '请输入用户名...',
+                    hintStyle: TextStyle(color: Colors.grey),
+                  ),
+                ),
+              )
+            ],
+          ),
+        )
+      ],
+    );
+  }
+
+  bool _showPwd = false;
+  Widget buildPasswordInput() {
+    return Column(
+      children: [
+        Container(
+          decoration: BoxDecoration(
+            border: Border.all(
+              color: Colors.grey.withOpacity(0.5),
+              width: 1.0,
+            ),
+            borderRadius: BorderRadius.circular(15.0),
+          ),
+          margin: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 10.0),
+          child: Row(
+            children: <Widget>[
+              const Padding(
+                padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 15.0),
+                child: Icon(
+                  Icons.lock_outline,
+                  color: Colors.grey,
+                ),
+              ),
+              Container(
+                height: 30.0,
+                width: 1.0,
+                color: Colors.grey.withOpacity(0.5),
+                margin: const EdgeInsets.only(left: 00.0, right: 10.0),
+              ),
+              Expanded(
+                child: TextField(
+                  obscureText: !_showPwd,
+                  controller: _passwordController,
+                  decoration: const InputDecoration(
+                    border: InputBorder.none,
+                    hintText: '请输入密码...',
+                    hintStyle: TextStyle(color: Colors.grey),
+                  ),
+                ),
+              )
+            ],
+          ),
+        )
+      ],
+    );
+  }
+}

lib/v12/pages/login/login_button.dart

@@ -0,0 +1,40 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import '../../app/authentication/auth_scope.dart';
+
+class LoginButton extends StatelessWidget {
+  final VoidCallback onLogin;
+  const LoginButton({super.key, required this.onLogin});
+
+  @override
+  Widget build(BuildContext context) {
+    const TextStyle style = TextStyle(fontSize: 16, fontWeight: FontWeight.bold);
+    AuthResult authResult = AuthScope.of(context);
+    VoidCallback? action;
+    Widget child;
+    switch (authResult.status) {
+      case AuthStatus.none:
+      case AuthStatus.success:
+      case AuthStatus.failed:
+      case AuthStatus.waitingLoginOut:
+        action = onLogin;
+        child = const Text('登 录', style: style);
+        break;
+      case AuthStatus.waitingLogin:
+        action = null;
+        child = const Wrap(
+          spacing: 8,
+          children: [
+            CupertinoActivityIndicator(radius: 10),
+            Text('登录中...', style: style)
+          ],
+        );
+    }
+
+    return ElevatedButton(
+        style: ElevatedButton.styleFrom(
+            shape: const StadiumBorder(), minimumSize: const Size(320, 52)),
+        onPressed: action,
+        child: child);
+  }
+}

lib/v12/pages/login/logout_button.dart

@@ -0,0 +1,32 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:iroute/v12/app/authentication/auth_scope.dart';
+
+class LogoutButton extends StatelessWidget {
+  final VoidCallback onLogout;
+  const LogoutButton({super.key, required this.onLogout});
+
+  @override
+  Widget build(BuildContext context) {
+    AuthResult authResult = AuthScope.of(context);
+    VoidCallback? action = onLogout;
+    Widget child = const Icon(Icons.logout,size: 20,);
+    switch (authResult.status) {
+      case AuthStatus.none:
+      case AuthStatus.success:
+      case AuthStatus.failed:
+      case AuthStatus.waitingLogin:
+        break;
+      case AuthStatus.waitingLoginOut:
+        action = null;
+        child = CupertinoActivityIndicator(radius: 10,);
+    }
+
+    return  IconButton(
+      splashRadius: 20,
+      onPressed: action,
+      tooltip: '退出登录',
+      icon: child,
+    );
+  }
+}

lib/v12/pages/settings/settings_page.dart

@@ -0,0 +1,11 @@
+import 'package:flutter/material.dart';
+
+class SettingPage extends StatelessWidget {
+  const SettingPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+        body:Center(child: Text('SettingPage')));
+  }
+}

lib/v12/pages/sort/functions.dart

@@ -0,0 +1,46 @@
+import 'functions/bubble.dart';
+import 'functions/cocktail.dart';
+import 'functions/comb.dart';
+import 'functions/cycle.dart';
+import 'functions/gnome.dart';
+import 'functions/heap.dart';
+import 'functions/insertion.dart';
+import 'functions/merage.dart';
+import 'functions/pigeonHole.dart';
+import 'functions/quick.dart';
+import 'functions/selection.dart';
+import 'functions/shell.dart';
+
+typedef SortFunction = Future<void> Function(List<int> src, SortCallback callback);
+typedef SortCallback = Future<void> Function(List<int> dist);
+
+Map<String, SortFunction> sortFunctionMap = {
+  'insertion': insertionSort,
+  'bubble': bubbleSort,
+  'cocktail': cocktailSort,
+  'comb': combSort,
+  'pigeonHole': pigeonHoleSort,
+  'shell': shellSort,
+  'selection': selectionSort,
+  'gnome': gnomeSort,
+  'cycle': cycleSort,
+  'heap': heapSort,
+  'quick': quickSort,
+  'mergeSort': mergeSort,
+};
+
+Map<String, String> sortNameMap = {
+  'insertion': '插入排序',
+  'bubble': '冒泡排序',
+  'cocktail': '鸡尾酒排序(双向冒泡排序)',
+  'comb': '梳排序',
+  'pigeonHole': '鸽巢排序',
+  'shell': '希尔排序',
+  'selection': '选择排序',
+  'gnome': '侏儒排序',
+  'cycle': '循环排序',
+  'heap': '堆排序',
+  'quick': '快速排序',
+  'mergeSort': '归并排序',
+};
+

lib/v12/pages/sort/functions/bubble.dart

@@ -0,0 +1,19 @@
+import '../functions.dart';
+
+///冒泡排序
+Future<void> bubbleSort(List<int> src, SortCallback callback ) async{
+  //控制需要进行排序的次数。每一轮循环都会确定一个数字的最终位置。
+  for (int i = 0; i < src.length; ++i) {
+    //遍历当前未排序的元素，通过相邻的元素比较并交换位置来完成排序。
+    for (int j = 0; j < src.length - i - 1; ++j) {
+      //如果 _numbers[j] 大于 _numbers[j + 1]，则交换它们的位置，确保较大的元素移到右边。
+      if (src[j] > src[j + 1]) {
+        int temp = src[j];
+        src[j] = src[j + 1];
+        src[j + 1] = temp;
+      }
+      //实现一个延迟，以便在ui上展示排序的动画效果
+     await callback(src);
+    }
+  }
+}

lib/v12/pages/sort/functions/cocktail.dart

@@ -0,0 +1,52 @@
+import '../functions.dart';
+
+///鸡尾酒排序(双向冒泡排序)
+Future<void> cocktailSort(List<int> src, SortCallback callback ) async {
+  bool swapped = true; // 表示是否进行了交换
+  int start = 0; // 当前未排序部分的起始位置
+  int end = src.length; // 当前未排序部分的结束位置
+
+  // 开始排序循环，只有当没有进行交换时才会退出循环
+  while (swapped == true) {
+    swapped = false;
+
+    // 从左往右遍历需要排序的部分
+    for (int i = start; i < end - 1; ++i) {
+      // 对每两个相邻元素进行比较
+      if (src[i] > src[i + 1]) {
+        // 如果前面的元素大于后面的元素，则交换它们的位置
+        int temp = src[i];
+        src[i] = src[i + 1];
+        src[i + 1] = temp;
+        swapped = true; // 进行了交换
+      }
+
+      // 实现动画效果，延迟一段时间后更新数组状态
+      await callback(src);
+    }
+
+    // 如果没有进行交换，则说明已经排好序，退出循环
+    if (swapped == false) break;
+    // 重设为false，准备进行下一轮排序
+    swapped = false;
+    // 将end设置为上一轮排序的最后一个元素的位置
+    end = end - 1;
+
+    // 从右往左遍历需要排序的部分
+    for (int i = end - 1; i >= start; i--) {
+      // 对每两个相邻元素进行比较
+      if (src[i] > src[i + 1]) {
+        // 如果前面的元素大于后面的元素，则交换它们的位置
+        int temp = src[i];
+        src[i] = src[i + 1];
+        src[i + 1] = temp;
+        swapped = true; // 进行了交换
+      }
+
+      // 实现动画效果，延迟一段时间后更新数组状态
+      await callback(src);
+    }
+    // 将start向右移一位，准备下一轮排序
+    start = start + 1;
+  }
+}

lib/v12/pages/sort/functions/comb.dart

@@ -0,0 +1,34 @@
+import '../functions.dart';
+
+///梳排序（Comb Sort）
+Future<void> combSort(List<int> src, SortCallback callback) async{
+  int gap = src.length;
+
+  bool swapped = true;
+
+  // 当间隔不为1或存在交换时执行循环
+  while (gap != 1 || swapped == true) {
+    // 通过缩小间隔来逐步将元素归位
+    gap = getNextGap(gap);
+    swapped = false;
+    for (int i = 0; i < src.length - gap; i++) {
+      // 如果当前元素大于间隔位置上的元素，则交换它们的位置
+      if (src[i] > src[i + gap]) {
+        int temp = src[i];
+        src[i] = src[i + gap];
+        src[i + gap] = temp;
+        swapped = true;
+      }
+
+      // 实现一个延迟，以便在 UI 上展示排序的动画效果。
+      await callback(src);
+    }
+  }
+}
+
+int getNextGap(int gap) {
+  // 根据当前间隔值计算下一个间隔值
+  gap = (gap * 10) ~/ 13;
+  if (gap < 1) return 1;
+  return gap;
+}

lib/v12/pages/sort/functions/cycle.dart

@@ -0,0 +1,54 @@
+import '../functions.dart';
+
+///循环排序
+Future<void> cycleSort(List<int> src, SortCallback callback) async {
+  int writes = 0;
+  for (int cycleStart = 0; cycleStart <= src.length - 2; cycleStart++) {
+    int item = src[cycleStart];
+    int pos = cycleStart;
+
+    // 在未排序部分中寻找比当前元素小的元素个数
+    for (int i = cycleStart + 1; i < src.length; i++) {
+      if (src[i] < item) pos++;
+    }
+
+    // 如果当前元素已经在正确位置上，则跳过此次迭代
+    if (pos == cycleStart) {
+      continue;
+    }
+
+    // 将当前元素放置到正确的位置上，并记录写操作次数
+    while (item == src[pos]) {
+      pos += 1;
+    }
+    if (pos != cycleStart) {
+      int temp = item;
+      item = src[pos];
+      src[pos] = temp;
+      writes++;
+    }
+
+    // 循环将位于当前位置的元素放置到正确的位置上
+    while (pos != cycleStart) {
+      pos = cycleStart;
+      // 继续在未排序部分中寻找比当前元素小的元素个数
+      for (int i = cycleStart + 1; i < src.length; i++) {
+        if (src[i] < item) pos += 1;
+      }
+
+      // 将当前元素放置到正确的位置上，并记录写操作次数
+      while (item == src[pos]) {
+        pos += 1;
+      }
+      if (item != src[pos]) {
+        int temp = item;
+        item = src[pos];
+        src[pos] = temp;
+        writes++;
+      }
+
+      // 添加延迟操作以展示排序过程
+      await callback(src);
+    }
+  }
+}

lib/v12/pages/sort/functions/gnome.dart

@@ -0,0 +1,22 @@
+import '../functions.dart';
+
+///地精排序 (侏儒排序)
+Future<void> gnomeSort(List<int> src, SortCallback callback) async {
+  int index = 0;
+  while (index < src.length) {
+    // 当 index 小于数组长度时执行循环
+    if (index == 0) index++;
+    if (src[index] >= src[index - 1]) {
+      // 如果当前元素大于等于前面的元素，则将 index 加1
+      index++;
+    } else {
+      // 否则，交换这两个元素，并将 index 减1（使得元素可以沉到正确位置）
+      int temp = src[index];
+      src[index] = src[index - 1];
+      src[index - 1] = temp;
+      index--;
+    }
+    await callback(src);
+  }
+  return;
+}

lib/v12/pages/sort/functions/heap.dart

@@ -0,0 +1,38 @@
+import '../functions.dart';
+
+///堆排序
+Future<void> heapSort(List<int> src, SortCallback callback) async {
+  // 从最后一个非叶子节点开始，构建最大堆
+  for (int i = src.length ~/ 2; i >= 0; i--) {
+    await heapify(src,callback, src.length, i);
+  }
+
+  // 依次取出最大堆的根节点（最大值），并进行堆化
+  for (int i = src.length - 1; i >= 0; i--) {
+    int temp = src[0];
+    src[0] = src[i];
+    src[i] = temp;
+    await heapify(src, callback,i, 0);
+  }
+}
+
+Future<void> heapify(List<int> src, SortCallback callback, int n, int i)  async{
+  int largest = i;
+  int l = 2 * i + 1; // 左子节点索引
+  int r = 2 * i + 2; // 右子节点索引
+
+  // 如果左子节点存在并且大于父节点，则更新最大值索引
+  if (l < n && src[l] > src[largest]) largest = l;
+
+  // 如果右子节点存在并且大于父节点或左子节点，则更新最大值索引
+  if (r < n && src[r] > src[largest]) largest = r;
+
+  // 如果最大值索引不等于当前节点索引，则交换节点值，并递归进行堆化
+  if (largest != i) {
+    int temp = src[i];
+    src[i] = src[largest];
+    src[largest] = temp;
+    heapify(src,callback, n, largest);
+  }
+  await callback(src);
+}

lib/v12/pages/sort/functions/insertion.dart

@@ -0,0 +1,19 @@
+import '../functions.dart';
+
+///插入排序
+Future<void> insertionSort(List<int> src, SortCallback callback) async {
+  for (int i = 1; i < src.length; i++) {
+    int temp = src[i]; // 将当前元素存储到临时变量 temp 中
+    int j = i - 1; // j 表示已排序部分的最后一个元素的索引
+
+    // 在已排序部分从后往前查找，找到合适位置插入当前元素
+    while (j >= 0 && temp < src[j]) {
+      src[j + 1] = src[j]; // 当前元素比已排序部分的元素小，将元素后移一位
+      --j; // 向前遍历
+      // 更新排序结果回调
+      await callback(src);
+    }
+    src[j + 1] = temp; // 插入当前元素到已排序部分的正确位置
+    await callback(src);
+  }
+}

lib/v12/pages/sort/functions/merage.dart

@@ -0,0 +1,79 @@
+import '../functions.dart';
+
+//快速排序
+Future<void> mergeSort(List<int> src, SortCallback callback) async {
+  await _mergeSort(src,callback,0,src.length-1);
+}
+
+///归并排序
+Future<void> _mergeSort(List<int> src, SortCallback callback,int leftIndex, int rightIndex) async {
+  // 定义一个名为 merge 的异步函数，用于合并两个有序子数组
+  Future<void> merge(int leftIndex, int middleIndex, int rightIndex) async {
+    // 计算左侧子数组和右侧子数组的大小
+    int leftSize = middleIndex - leftIndex + 1;
+    int rightSize = rightIndex - middleIndex;
+
+    // 创建左侧子数组和右侧子数组
+    List leftList = List.generate(leftSize, (index) => 0);
+    List rightList = List.generate(rightSize, (index) => 0);
+
+    // 将原始数组中的元素分别复制到左侧子数组和右侧子数组中
+    for (int i = 0; i < leftSize; i++) {
+      leftList[i] = src[leftIndex + i];
+    }
+    for (int j = 0; j < rightSize; j++) {
+      rightList[j] = src[middleIndex + j + 1];
+    }
+
+    // 初始化游标和索引
+    int i = 0, j = 0;
+    int k = leftIndex;
+
+    // 比较左侧子数组和右侧子数组的元素，并按顺序将较小的元素放入原始数组中
+    while (i < leftSize && j < rightSize) {
+      if (leftList[i] <= rightList[j]) {
+        src[k] = leftList[i];
+        i++;
+      } else {
+        src[k] = rightList[j];
+        j++;
+      }
+
+      await callback(src);
+
+      k++;
+    }
+
+    // 将左侧子数组或右侧子数组中剩余的元素放入原始数组中
+    while (i < leftSize) {
+      src[k] = leftList[i];
+      i++;
+      k++;
+
+      await callback(src);
+    }
+
+    while (j < rightSize) {
+      src[k] = rightList[j];
+      j++;
+      k++;
+
+      await callback(src);
+    }
+  }
+
+  // 如果左索引小于右索引，则递归地对数组进行归并排序
+  if (leftIndex < rightIndex) {
+    // 计算中间索引位置
+    int middleIndex = (rightIndex + leftIndex) ~/ 2;
+
+    // 分别对左侧子数组和右侧子数组进行归并排序
+    await _mergeSort(src,callback,leftIndex, middleIndex);
+    await _mergeSort(src,callback,middleIndex + 1, rightIndex);
+
+    await callback(src);
+
+    // 合并两个有序子数组
+    await merge(leftIndex, middleIndex, rightIndex);
+  }
+}

lib/v12/pages/sort/functions/oddEven.dart

@@ -0,0 +1,37 @@
+import '../functions.dart';
+
+///奇偶排序(Odd-Even Sort)
+Future<void> oddEvenSort(List<int> src, SortCallback callback) async {
+  bool isSorted = false;
+
+  while (!isSorted) {
+    // 当 isSorted 为 false 时执行循环
+    isSorted = true; // 先假设数组已经排好序
+
+    for (int i = 1; i <= src.length - 2; i = i + 2) {
+      // 对奇数索引位置进行比较
+      if (src[i] > src[i + 1]) {
+        // 如果当前元素大于后面的元素，则交换它们的值
+        int temp = src[i];
+        src[i] = src[i + 1];
+        src[i + 1] = temp;
+        isSorted = false; // 若发生了交换，则说明数组仍未完全排序，将 isSorted 设为 false
+        await callback(src);
+      }
+    }
+
+    for (int i = 0; i <= src.length - 2; i = i + 2) {
+      // 对偶数索引位置进行比较
+      if (src[i] > src[i + 1]) {
+        // 如果当前元素大于后面的元素，则交换它们的值
+        int temp = src[i];
+        src[i] = src[i + 1];
+        src[i + 1] = temp;
+        isSorted = false;
+        await callback(src);
+      }
+    }
+  }
+
+  return;
+}

lib/v12/pages/sort/functions/pigeonHole.dart

@@ -0,0 +1,33 @@
+import '../functions.dart';
+
+///鸽巢排序
+Future<void> pigeonHoleSort(List<int> src, SortCallback callback ) async{
+  int min = src[0];
+  int max = src[0];
+  int range, i, j, index;
+
+  // 找到数组中的最大值和最小值
+  for (int a = 0; a < src.length; a++) {
+    if (src[a] > max) max = src[a];
+    if (src[a] < min) min = src[a];
+  }
+
+  // 计算鸽巢的个数
+  range = max - min + 1;
+  List<int> p = List.generate(range, (i) => 0);
+
+  // 将数字分配到各个鸽巢中
+  for (i = 0; i < src.length; i++) {
+    p[src[i] - min]++;
+  }
+
+  index = 0;
+
+  // 将鸽巢中的数字取出，重新放回到数组中
+  for (j = 0; j < range; j++) {
+    while (p[j]-- > 0) {
+      src[index++] = j + min;
+      await callback(src);
+    }
+  }
+}

lib/v12/pages/sort/functions/quick.dart

@@ -0,0 +1,65 @@
+import '../functions.dart';
+
+//快速排序
+Future<void> quickSort(List<int> src, SortCallback callback) async {
+  await _quickSort(src,callback,0,src.length-1);
+}
+
+///快速排序
+Future<void> _quickSort(List<int> src, SortCallback callback,int leftIndex,int rightIndex) async {
+  // 定义一个名为 _partition 的异步函数，用于划分数组，并返回划分后的基准元素的索引位置
+  Future<int> _partition(int left, int right) async {
+    // 选择中间位置的元素作为基准元素
+    int p = (left + (right - left) / 2).toInt();
+
+    // 交换基准元素和最右边的元素
+    var temp = src[p];
+    src[p] = src[right];
+    src[right] = temp;
+    await callback(src);
+
+    // 初始化游标 cursor
+    int cursor = left;
+
+    // 遍历数组并根据基准元素将元素交换到左侧或右侧
+    for (int i = left; i < right; i++) {
+      if (cf(src[i], src[right]) <= 0) {
+        // 如果当前元素小于等于基准元素，则交换它和游标位置的元素
+        var temp = src[i];
+        src[i] = src[cursor];
+        src[cursor] = temp;
+        cursor++;
+        await callback(src);
+      }
+    }
+
+    // 将基准元素放置在游标位置
+    temp = src[right];
+    src[right] = src[cursor];
+    src[cursor] = temp;
+
+    await callback(src);
+
+    return cursor; // 返回基准元素的索引位置
+  }
+
+  // 如果左索引小于右索引，则递归地对数组进行快速排序
+  if (leftIndex < rightIndex) {
+    int p = await _partition(leftIndex, rightIndex);
+
+    await _quickSort(src,callback,leftIndex, p - 1); // 对基准元素左侧的子数组进行快速排序
+
+    await _quickSort(src,callback, p + 1, rightIndex); // 对基准元素右侧的子数组进行快速排序
+  }
+}
+
+// 比较函数，用于判断两个元素的大小关系
+cf(int a, int b) {
+  if (a < b) {
+    return -1; // 若 a 小于 b，则返回 -1
+  } else if (a > b) {
+    return 1; // 若 a 大于 b，则返回 1
+  } else {
+    return 0; // 若 a 等于 b，则返回 0
+  }
+}

lib/v12/pages/sort/functions/selection.dart

@@ -0,0 +1,18 @@
+import '../functions.dart';
+
+///选择排序
+Future<void> selectionSort(List<int> src, SortCallback callback ) async {
+  for (int i = 0; i < src.length; i++) {
+    for (int j = i + 1; j < src.length; j++) {
+      // 遍历未排序部分，内层循环控制变量 j
+      if (src[i] > src[j]) {
+        // 判断当前元素是否比后续元素小
+        int temp = src[j];
+        // 交换当前元素和后续较小的元素
+        src[j] = src[i];
+        src[i] = temp;
+      }
+      await callback(src);
+    }
+  }
+}

lib/v12/pages/sort/functions/shell.dart

@@ -0,0 +1,21 @@
+import '../functions.dart';
+
+///希尔排序
+Future<void> shellSort(List<int> src, SortCallback callback) async{
+  //定义变量 gap 并初始化为数组长度的一半。每次循环完成后将 gap 减半直到等于 0。
+  for (int gap = src.length ~/ 2; gap > 0; gap ~/= 2) {
+    //遍历每个子序列并进行插入排序。初始时从第一个子序列的第二个元素开始，即 i = gap，以 gap 为步长逐个遍历每个子序列。
+    for (int i = gap; i < src.length; i += 1) {
+      //将当前遍历到的元素赋值给它
+      int temp = src[i];
+      //内部使用一个 for 循环来实现插入排序。
+      //循环开始时定义变量 j 并将其初始化为当前遍历到的元素的下标。通过不断比较前后相隔 gap 的元素大小并交换位置，将当前元素插入到正确的位置。
+      int j;
+      for (j = i; j >= gap && src[j - gap] > temp; j -= gap) {
+        src[j] = src[j - gap];
+      }
+      src[j] = temp;
+      await callback(src);
+    }
+  }
+}

lib/v12/pages/sort/provider/sort_config.dart

@@ -0,0 +1,35 @@
+import 'dart:ui';
+
+import 'package:flutter/material.dart';
+
+class SortConfig {
+  final int count;
+  final int seed;
+  final Duration duration;
+  final String name;
+  final int colorIndex;
+
+  SortConfig({
+     this.count = 100,
+     this.duration = const Duration(microseconds: 1500),
+     this.seed = -1,
+     this.colorIndex = 0,
+     this.name = 'insertion',
+  });
+
+  SortConfig copyWith({
+    int? count,
+    int? seed,
+    int? colorIndex,
+    Duration? duration,
+    String? name,
+  }) =>
+      SortConfig(
+        count:count??this.count,
+        seed:seed??this.seed,
+        duration:duration??this.duration,
+        name:name??this.name,
+        colorIndex:colorIndex??this.colorIndex,
+      );
+}
+

lib/v12/pages/sort/provider/state.dart

@@ -0,0 +1,105 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+
+import '../functions.dart';
+import 'sort_config.dart';
+
+enum SortStatus{
+  none, // 未操作
+  sorting, // 排序中
+  sorted, // 排序完成
+}
+
+List<MaterialColor> kColorSupport = [
+  Colors.blue,
+  Colors.lightBlue,
+  Colors.cyan,
+  Colors.red,
+  Colors.pink,
+  Colors.orange,
+  Colors.yellow,
+  Colors.green,
+  Colors.indigo,
+  Colors.purple,
+  Colors.deepPurple,
+];
+
+class SortState with ChangeNotifier{
+
+  SortState(){
+    reset();
+  }
+
+  SortStatus status = SortStatus.none;
+
+  List<int> data = [];
+  List<int> stepData = [];
+
+  SortConfig _config = SortConfig();
+  SortConfig get config => _config;
+  Random random = Random();
+
+  set config(SortConfig config){
+    _config = config;
+    reset();
+    notifyListeners();
+  }
+
+  void selectName(String name){
+    if(name==config.name) return;
+    config = config.copyWith(name: name);
+  }
+
+  void selectColor(int colorIndex){
+    if(colorIndex==config.colorIndex) return;
+    config = config.copyWith(colorIndex: colorIndex);
+  }
+
+  void reset(){
+    data.clear();
+    status = SortStatus.none;
+    notifyListeners();
+    int count = config.count;
+    if(config.seed!=-1){
+      random = Random(config.seed);
+    }
+    for (int i = 0; i < count; i++) {
+      //随机往数组中填值
+      data.add(random.nextInt(1000));
+    }
+  }
+
+  void sort() async{
+    status = SortStatus.sorting;
+    notifyListeners();
+    Stopwatch stopwatch = Stopwatch()..start();
+    SortFunction? sortFunction = sortFunctionMap[config.name];
+    if(sortFunction!=null){
+      await sortFunction(data,(arr) async {
+        await Future.delayed(config.duration);
+        notifyListeners();
+      });
+    }
+    status = SortStatus.sorted;
+    notifyListeners();
+    stopwatch.stop();
+    print("Sorting completed in ${stopwatch.elapsed.inMilliseconds} ms.");
+  }
+}
+
+/// Provides the current [SortState] to descendant widgets in the tree.
+class SortStateScope extends InheritedNotifier<SortState> {
+  const SortStateScope({
+    required super.notifier,
+    required super.child,
+    super.key,
+  });
+
+  static SortState of(BuildContext context) =>
+      context.dependOnInheritedWidgetOfExactType<SortStateScope>()!.notifier!;
+
+  static SortState read(BuildContext context) {
+    return context.getInheritedWidgetOfExactType<SortStateScope>()!.notifier!;
+  }
+}

lib/v12/pages/sort/views/code_page/code_page.dart

@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+
+import '../../functions.dart';
+import '../../provider/state.dart';
+
+class CodePage extends StatelessWidget {
+  const CodePage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    SortState state = SortStateScope.of(context);
+    return Scaffold(
+        appBar: AppBar(
+          backgroundColor: Colors.white,
+          leading: BackButton(),
+          titleTextStyle: TextStyle(
+            color: Colors.black,
+            fontSize: 16,
+            fontWeight: FontWeight.bold,
+          ),
+          centerTitle: true,
+          title: Text(sortNameMap[state.config.name]!+'代码实现'),
+        ),
+        body: Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 8.0),
+          child: Text('代码'*1000),
+        ));
+  }
+}

lib/v12/pages/sort/views/player/data_painter.dart

@@ -0,0 +1,62 @@
+import 'package:flutter/material.dart';
+
+
+
+class DataPainter extends CustomPainter{
+
+  final List<int> data;
+  final MaterialColor color;
+
+  DataPainter( {required this.data,required this.color,});
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    double itemWidth = size.width/data.length;
+    double height = size.height;
+
+    Paint paint = Paint();
+    paint.strokeWidth = itemWidth;
+    paint.strokeCap = StrokeCap.round;
+
+
+    for(int i=0;i<data.length;i++){
+      int value = data[i];
+      if (value < 1000 * .10) {
+        paint.color = color.shade50;
+      } else if (value < 1000 * .20) {
+        paint.color = color.shade100;
+      } else if (value < 1000 * .30) {
+        paint.color = color.shade200;
+      } else if (value < 1000 * .40) {
+        paint.color = color.shade300;
+      } else if (value < 1000 * .50) {
+        paint.color = color.shade400;
+      } else if (value < 1000 * .60) {
+        paint.color = color.shade500;
+      } else if (value < 1000 * .70) {
+        paint.color = color.shade600;
+      } else if (value < 1000 * .80) {
+        paint.color = color.shade700;
+      } else if (value < 1000 * .90) {
+        paint.color = color.shade800;
+      } else {
+        paint.color = color.shade900;
+      }
+      canvas.drawLine(
+          Offset(i * itemWidth+itemWidth/2, 0),
+          Offset(
+            i * itemWidth+itemWidth/2,
+            size.height*(value/1000),
+          ),
+          paint);
+    }
+
+
+  }
+
+  @override
+  bool shouldRepaint(covariant DataPainter oldDelegate) {
+    return true;
+  }
+
+}

lib/v12/pages/sort/views/player/sort_player.dart

@@ -0,0 +1,22 @@
+import 'package:flutter/material.dart';
+
+import '../../provider/state.dart';
+import 'data_painter.dart';
+
+class SortPlayer extends StatelessWidget {
+  const SortPlayer({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    SortState state = SortStateScope.of(context);
+    List<int> numbers = state.data;
+    MaterialColor color = kColorSupport[state.config.colorIndex];
+    return Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 8.0),
+      child: CustomPaint(
+        painter: DataPainter(data: numbers,color: color),
+        child: ConstrainedBox(constraints: const BoxConstraints.expand()),
+      ),
+    );
+  }
+}

lib/v12/pages/sort/views/settings/color_picker.dart

@@ -0,0 +1,41 @@
+import 'package:flutter/material.dart';
+
+class ColorPicker extends StatelessWidget {
+  final List<MaterialColor> colors;
+  final ValueChanged<int> onSelected;
+  final int activeIndex;
+
+  const ColorPicker({
+    super.key,
+    required this.colors,
+    required this.activeIndex,
+    required this.onSelected,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Wrap(
+      children: colors
+          .asMap()
+          .keys
+          .map((int index) => MouseRegion(
+        cursor: SystemMouseCursors.click,
+            child: GestureDetector(
+              onTap: ()=>onSelected(index),
+              child: Container(
+                    width: 32,
+                    height: 32,
+                    color: colors[index],
+                    child: activeIndex == index
+                        ? const Icon(
+                            Icons.check,
+                            color: Colors.white,
+                          )
+                        : null,
+                  ),
+            ),
+          ))
+          .toList(),
+    );
+  }
+}