feat: 添加软件设置页面

lib/views/settings/about/cubit/settings_about_index_cubit.dart

+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'settings_about_index_state.dart';
+
+class SettingsAboutIndexCubit extends Cubit<SettingsAboutIndexState> {
+  SettingsAboutIndexCubit() : super(const SettingsAboutIndexState());
+}

lib/views/settings/about/cubit/settings_about_index_state.dart

+import 'package:equatable/equatable.dart';
+
+class SettingsAboutIndexState extends Equatable {
+  const SettingsAboutIndexState();
+
+  @override
+  List<Object?> get props => [];
+}

lib/views/settings/about/settings_about_index_view.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import '../widgets/settings_about_panel.dart';
+import 'cubit/settings_about_index_cubit.dart';
+
+class SettingsAboutIndexView extends StatelessWidget {
+  const SettingsAboutIndexView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => SettingsAboutIndexCubit(),
+      child: const SettingsAboutPanel(),
+    );
+  }
+}

lib/views/settings/cubit/settings_index_cubit.dart

@@ -3,4 +3,16 @@ import 'settings_index_state.dart';
 
 class SettingsIndexCubit extends Cubit<SettingsIndexState> {
   SettingsIndexCubit() : super(const SettingsIndexState());
+
+  void selectMenu(String menu) {
+    emit(state.copyWith(selectedMenu: menu));
+  }
+
+  void selectTemperatureUnit(bool useCelsius) {
+    emit(state.copyWith(useCelsius: useCelsius));
+  }
+
+  void setLockScreen(bool lockScreen) {
+    emit(state.copyWith(lockScreen: lockScreen));
+  }
 }

lib/views/settings/cubit/settings_index_state.dart

 import 'package:equatable/equatable.dart';
 
 class SettingsIndexState extends Equatable {
-  const SettingsIndexState();
+  const SettingsIndexState({
+    this.selectedMenu = '关于本机',
+    this.language = '简体中文',
+    this.useCelsius = true,
+    this.lockScreen = true,
+  });
+
+  final String selectedMenu;
+  final String language;
+  final bool useCelsius;
+  final bool lockScreen;
+
+  SettingsIndexState copyWith({
+    String? selectedMenu,
+    String? language,
+    bool? useCelsius,
+    bool? lockScreen,
+  }) {
+    return SettingsIndexState(
+      selectedMenu: selectedMenu ?? this.selectedMenu,
+      language: language ?? this.language,
+      useCelsius: useCelsius ?? this.useCelsius,
+      lockScreen: lockScreen ?? this.lockScreen,
+    );
+  }
 
   @override
-  List<Object?> get props => [];
+  List<Object?> get props => [
+        selectedMenu,
+        language,
+        useCelsius,
+        lockScreen,
+      ];
 }

lib/views/settings/customer_service/cubit/customer_service_index_cubit.dart

+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'customer_service_index_state.dart';
+
+class CustomerServiceIndexCubit extends Cubit<CustomerServiceIndexState> {
+  CustomerServiceIndexCubit() : super(const CustomerServiceIndexState());
+}

lib/views/settings/customer_service/cubit/customer_service_index_state.dart

+import 'package:equatable/equatable.dart';
+
+class CustomerServiceIndexState extends Equatable {
+  const CustomerServiceIndexState();
+
+  @override
+  List<Object?> get props => [];
+}

lib/views/settings/customer_service/customer_service_index_view.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import '../widgets/settings_title_panel.dart';
+import 'cubit/customer_service_index_cubit.dart';
+
+class CustomerServiceIndexView extends StatelessWidget {
+  const CustomerServiceIndexView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => CustomerServiceIndexCubit(),
+      child: const SettingsTitlePanel(title: '客户服务'),
+    );
+  }
+}

lib/views/settings/factory_settings/cubit/factory_settings_index_cubit.dart

+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'factory_settings_index_state.dart';
+
+class FactorySettingsIndexCubit extends Cubit<FactorySettingsIndexState> {
+  FactorySettingsIndexCubit() : super(const FactorySettingsIndexState());
+}

lib/views/settings/factory_settings/cubit/factory_settings_index_state.dart

+import 'package:equatable/equatable.dart';
+
+class FactorySettingsIndexState extends Equatable {
+  const FactorySettingsIndexState();
+
+  @override
+  List<Object?> get props => [];
+}

lib/views/settings/factory_settings/factory_settings_index_view.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import '../widgets/settings_title_panel.dart';
+import 'cubit/factory_settings_index_cubit.dart';
+
+class FactorySettingsIndexView extends StatelessWidget {
+  const FactorySettingsIndexView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => FactorySettingsIndexCubit(),
+      child: const SettingsTitlePanel(title: '出厂设置'),
+    );
+  }
+}

lib/views/settings/remote_control/cubit/remote_control_index_cubit.dart

+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'remote_control_index_state.dart';
+
+class RemoteControlIndexCubit extends Cubit<RemoteControlIndexState> {
+  RemoteControlIndexCubit() : super(const RemoteControlIndexState());
+}

lib/views/settings/remote_control/cubit/remote_control_index_state.dart

+import 'package:equatable/equatable.dart';
+
+class RemoteControlIndexState extends Equatable {
+  const RemoteControlIndexState();
+
+  @override
+  List<Object?> get props => [];
+}

lib/views/settings/remote_control/remote_control_index_view.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import '../widgets/settings_title_panel.dart';
+import 'cubit/remote_control_index_cubit.dart';
+
+class RemoteControlIndexView extends StatelessWidget {
+  const RemoteControlIndexView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => RemoteControlIndexCubit(),
+      child: const SettingsTitlePanel(title: '远程控制'),
+    );
+  }
+}

lib/views/settings/settings_index_view.dart

 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
+import 'about/settings_about_index_view.dart';
+import 'cubit/settings_index_cubit.dart';
+import 'cubit/settings_index_state.dart';
+import 'customer_service/customer_service_index_view.dart';
+import 'factory_settings/factory_settings_index_view.dart';
+import 'remote_control/remote_control_index_view.dart';
+import 'software_update/software_update_index_view.dart';
+import 'widgets/settings_side_menu.dart';
 
 @RoutePage()
 class SettingsIndexView extends StatelessWidget {
@@ -7,11 +18,56 @@ class SettingsIndexView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return const Center(
-      child: Text(
-        '设置',
-        style: TextStyle(color: Colors.white, fontSize: 24),
-      ),
+    return BlocProvider(
+      create: (_) => SettingsIndexCubit(),
+      child: const _SettingsIndexContent(),
+    );
+  }
+}
+
+class _SettingsIndexContent extends StatelessWidget {
+  const _SettingsIndexContent();
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocBuilder<SettingsIndexCubit, SettingsIndexState>(
+      builder: (context, state) {
+        return Padding(
+          padding: EdgeInsets.fromLTRB(30.w, 28.h, 30.w, 28.h),
+          child: Row(
+            children: [
+              Expanded(
+                flex: 25,
+                child: SettingsSideMenu(
+                  selectedMenu: state.selectedMenu,
+                  onSelected: context.read<SettingsIndexCubit>().selectMenu,
+                ),
+              ),
+              SizedBox(width: 24.w),
+              Expanded(
+                flex: 75,
+                child: _buildSelectedPanel(state.selectedMenu),
+              ),
+            ],
+          ),
+        );
+      },
     );
   }
+
+  Widget _buildSelectedPanel(String selectedMenu) {
+    switch (selectedMenu) {
+      case '远程控制':
+        return const RemoteControlIndexView();
+      case '软件更新':
+        return const SoftwareUpdateIndexView();
+      case '客户服务':
+        return const CustomerServiceIndexView();
+      case '出厂设置':
+        return const FactorySettingsIndexView();
+      case '关于本机':
+      default:
+        return const SettingsAboutIndexView();
+    }
+  }
 }

lib/views/settings/software_update/cubit/software_update_index_cubit.dart

+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'software_update_index_state.dart';
+
+class SoftwareUpdateIndexCubit extends Cubit<SoftwareUpdateIndexState> {
+  SoftwareUpdateIndexCubit() : super(const SoftwareUpdateIndexState());
+}

lib/views/settings/software_update/cubit/software_update_index_state.dart

+import 'package:equatable/equatable.dart';
+
+class SoftwareUpdateIndexState extends Equatable {
+  const SoftwareUpdateIndexState();
+
+  @override
+  List<Object?> get props => [];
+}

lib/views/settings/software_update/software_update_index_view.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import '../widgets/settings_title_panel.dart';
+import 'cubit/software_update_index_cubit.dart';
+
+class SoftwareUpdateIndexView extends StatelessWidget {
+  const SoftwareUpdateIndexView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => SoftwareUpdateIndexCubit(),
+      child: const SettingsTitlePanel(title: '软件更新'),
+    );
+  }
+}

lib/views/settings/widgets/settings_panel_frame.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
+const String settingsAssetPanelLeft =
+    'lib/assets/monitoring/box_bg_460x905.png';
+const String settingsAssetPanelMain =
+    'lib/assets/monitoring/box_bg_674x509.png';
+const String settingsAssetButton =
+    'lib/assets/monitoring/frame_button_324x164.png';
+
+class SettingsPanelFrame extends StatelessWidget {
+  const SettingsPanelFrame({
+    super.key,
+    required this.child,
+    required this.padding,
+    required this.backgroundAsset,
+  });
+
+  final Widget child;
+  final EdgeInsetsGeometry padding;
+  final String backgroundAsset;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: double.infinity,
+      height: double.infinity,
+      padding: padding,
+      decoration: BoxDecoration(
+        image: DecorationImage(
+          image: AssetImage(backgroundAsset),
+          fit: BoxFit.fill,
+        ),
+      ),
+      child: child,
+    );
+  }
+}
+
+BoxDecoration settingsButtonDecoration({bool active = false}) {
+  return BoxDecoration(
+    image: const DecorationImage(
+      image: AssetImage(settingsAssetButton),
+      fit: BoxFit.fill,
+    ),
+    boxShadow: active
+        ? [
+            BoxShadow(
+              color: const Color(0xFF45CFFF).withValues(alpha: 0.3),
+              blurRadius: 18.r,
+              spreadRadius: 1.r,
+            ),
+          ]
+        : null,
+  );
+}

lib/views/settings/widgets/settings_side_menu.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
+import 'settings_panel_frame.dart';
+
+class SettingsSideMenu extends StatelessWidget {
+  const SettingsSideMenu({
+    super.key,
+    required this.selectedMenu,
+    required this.onSelected,
+  });
+
+  final String selectedMenu;
+  final ValueChanged<String> onSelected;
+
+  static const List<String> menus = [
+    '关于本机',
+    '远程控制',
+    '软件更新',
+    '客户服务',
+    '出厂设置',
+  ];
+
+  @override
+  Widget build(BuildContext context) {
+    return SettingsPanelFrame(
+      backgroundAsset: settingsAssetPanelLeft,
+      padding: EdgeInsets.fromLTRB(42.w, 48.h, 42.w, 48.h),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(
+            '软件设置',
+            style: TextStyle(
+              color: Colors.white,
+              fontSize: 30.sp,
+              fontWeight: FontWeight.w700,
+            ),
+          ),
+          SizedBox(height: 34.h),
+          Divider(color: const Color(0xFF4CA7D2).withValues(alpha: 0.42)),
+          SizedBox(height: 30.h),
+          for (final menu in menus) ...[
+            _SettingsMenuButton(
+              text: menu,
+              active: menu == selectedMenu,
+              onTap: () => onSelected(menu),
+            ),
+            SizedBox(height: 22.h),
+          ],
+        ],
+      ),
+    );
+  }
+}
+
+class _SettingsMenuButton extends StatelessWidget {
+  const _SettingsMenuButton({
+    required this.text,
+    required this.active,
+    required this.onTap,
+  });
+
+  final String text;
+  final bool active;
+  final VoidCallback onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      behavior: HitTestBehavior.opaque,
+      onTap: onTap,
+      child: Container(
+        height: 64.h,
+        padding: EdgeInsets.symmetric(horizontal: 28.w),
+        decoration: settingsButtonDecoration(active: active),
+        child: Row(
+          children: [
+            Expanded(
+              child: Text(
+                text,
+                textAlign: TextAlign.center,
+                style: TextStyle(
+                  color: active ? const Color(0xFFC9F8FF) : Colors.white,
+                  fontSize: 30.sp,
+                  fontWeight: FontWeight.w700,
+                ),
+              ),
+            ),
+            Text(
+              '》》',
+              style: TextStyle(
+                color: const Color(0xFF67C9F5)
+                    .withValues(alpha: active ? 0.72 : 0.36),
+                fontSize: 28.sp,
+                fontWeight: FontWeight.w700,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/views/settings/widgets/settings_title_panel.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_screenutil/flutter_screenutil.dart';
+
+import 'settings_panel_frame.dart';
+
+class SettingsTitlePanel extends StatelessWidget {
+  const SettingsTitlePanel({
+    super.key,
+    required this.title,
+  });
+
+  final String title;
+
+  @override
+  Widget build(BuildContext context) {
+    return SettingsPanelFrame(
+      backgroundAsset: settingsAssetPanelMain,
+      padding: EdgeInsets.all(42.w),
+      child: Align(
+        alignment: Alignment.topLeft,
+        child: Text(
+          title,
+          style: TextStyle(
+            color: Colors.white,
+            fontSize: 34.sp,
+            fontWeight: FontWeight.w800,
+          ),
+        ),
+      ),
+    );
+  }
+}