flisp_app/lib/layout/app_drawer.dart

import 'package:flisp_app/provider/app_provider.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class AppDrawer extends StatelessWidget {
  const AppDrawer({super.key});

  DrawerHeader buildDrawerHeader(BuildContext context) {
    return DrawerHeader(
      decoration: BoxDecoration(color: Theme.of(context).colorScheme.primary),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          CircleAvatar(
            radius: 30,
            backgroundColor: Colors.white,
            child: Icon(
              Icons.flash_on,
              color: Theme.of(context).colorScheme.primary,
              size: 40,
            ),
          ),
          SizedBox(height: 10),
          Text(
            '闪灵',
            style: TextStyle(
              color: Colors.white,
              fontSize: 24,
              fontWeight: FontWeight.bold,
            ),
          ),
          Text(
            '记录每一刻的灵感',
            style: TextStyle(color: Colors.white70, fontSize: 14),
          ),
        ],
      ),
    );
  }

  Widget _buildDarkModeSection(BuildContext context, AppProvider appProvider) {
    return ListTile(
      leading: Icon(
        appProvider.isDarkMode ? Icons.dark_mode : Icons.light_mode,
        color: Theme.of(context).colorScheme.primary,
      ),
      title: const Text('暗黑模式'),
      trailing: Switch(
        value: appProvider.isDarkMode,
        onChanged: (value) {
          appProvider.toggleDarkMode(value);
        },
      ),
      onTap: () {
        appProvider.toggleDarkMode(!appProvider.isDarkMode);
      },
    );
  }

  Widget _buildThemeColorList(BuildContext context, AppProvider appProvider) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
      child: GridView.builder(
        shrinkWrap: true,
        physics: const NeverScrollableScrollPhysics(),
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 4,
          crossAxisSpacing: 8,
          mainAxisSpacing: 8,
          childAspectRatio: 1.2,
        ),
        itemCount: appProvider.availableThemes.length,
        itemBuilder: (context, index) {
          final themeColor = appProvider.availableThemes[index];
          final isSelected = appProvider.currentTheme == themeColor;

          return _buildThemeColorItem(
            themeColor: themeColor,
            isSelected: isSelected,
            onTap: () => appProvider.changeTheme(themeColor),
          );
        },
      ),
    );
  }

  Widget _buildThemeColorItem({
    required ThemeColor themeColor,
    required bool isSelected,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        decoration: BoxDecoration(
          color:
              isSelected
                  ? themeColor.primaryColor.withAlpha(50)
                  : Colors.transparent,
          borderRadius: BorderRadius.circular(8),
          border: Border.all(
            color: isSelected ? themeColor.primaryColor : Colors.grey.shade300,
            width: isSelected ? 2 : 1,
          ),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // 颜色圆点
            Container(
              width: 20,
              height: 20,
              decoration: BoxDecoration(
                color: themeColor.primaryColor,
                shape: BoxShape.circle,
                border: Border.all(color: Colors.white, width: 2),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black.withAlpha(10),
                    blurRadius: 2,
                    offset: const Offset(0, 1),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 4),
            Text(
              themeColor.name,
              style: TextStyle(
                fontSize: 10,
                fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
                color:
                    isSelected ? themeColor.primaryColor : Colors.grey.shade600,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildThemeSection(BuildContext context, AppProvider appProvider) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.fromLTRB(16, 16, 16, 8),
          child: Text('主题颜色', style: Theme.of(context).textTheme.titleMedium),
        ),
        _buildDarkModeSection(context, appProvider),
        _buildThemeColorList(context, appProvider),
      ],
    );
  }

  // 构建抽屉菜单项
  Widget _buildDrawerItem({
    required BuildContext context,
    required IconData icon,
    required String title,
    required VoidCallback onTap,
  }) {
    return ListTile(
      leading: Icon(icon, color: Theme.of(context).colorScheme.primary),
      title: Text(title),
      onTap: onTap,
    );
  }

  @override
  Widget build(BuildContext context) {
    final appProvider = Provider.of<AppProvider>(context);

    return Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: [
          // 抽屉头部
          buildDrawerHeader(context),

          // 菜单项
          _buildDrawerItem(
            context: context,
            icon: Icons.flash_on,
            title: '闪灵',
            onTap: () {
              Navigator.pop(context);
              appProvider.changeTab(0);
            },
          ),
          _buildDrawerItem(
            context: context,
            icon: Icons.checklist,
            title: '待办事项',
            onTap: () {
              Navigator.pop(context);
              appProvider.changeTab(1);
            },
          ),

          const Divider(),

          _buildDrawerItem(
            context: context,
            icon: Icons.analytics,
            title: '统计',
            onTap: () {
              Navigator.pop(context);
              // 这里可以导航到统计页面
            },
          ),
          _buildDrawerItem(
            context: context,
            icon: Icons.archive,
            title: '归档',
            onTap: () {
              Navigator.pop(context);
              // 这里可以导航到归档页面
            },
          ),

          const Divider(),

          _buildThemeSection(context, appProvider),

          const Divider(),

          _buildDrawerItem(
            context: context,
            icon: Icons.help,
            title: '帮助与反馈',
            onTap: () {
              Navigator.pop(context);
              // 这里可以导航到帮助页面
            },
          ),
        ],
      ),
    );
  }
}