import 'dart:ui';

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

class ThemeColor {
  final String name;
  final Color primaryColor;
  final MaterialColor materialColor;

  ThemeColor({
    required this.name,
    required this.primaryColor,
    required this.materialColor,
  });
}

final List<ThemeColor> defaultThemes = [
  ThemeColor(
    name: '梦幻紫',
    primaryColor: Color(0xFF8B5CF6),
    materialColor: MaterialColor(0xFF8B5CF6, {
      50: Color(0xFFF5F3FF),
      100: Color(0xFFEDE9FE),
      200: Color(0xFFDDD6FE),
      300: Color(0xFFC4B5FD),
      400: Color(0xFFA78BFA),
      500: Color(0xFF8B5CF6),
      600: Color(0xFF7C3AED),
      700: Color(0xFF6D28D9),
      800: Color(0xFF5B21B6),
      900: Color(0xFF4C1D95),
    }),
  ),
  ThemeColor(
    name: '活力橙',
    primaryColor: Color(0xFFF59E0B),
    materialColor: MaterialColor(0xFFF59E0B, {
      50: Color(0xFFFFFBEB),
      100: Color(0xFFFEF3C7),
      200: Color(0xFFFDE68A),
      300: Color(0xFFFCD34D),
      400: Color(0xFFFBBF24),
      500: Color(0xFFF59E0B),
      600: Color(0xFFD97706),
      700: Color(0xFFB45309),
      800: Color(0xFF92400E),
      900: Color(0xFF78350F),
    }),
  ),
  ThemeColor(
    name: '浪漫粉',
    primaryColor: Color(0xFFEC4899),
    materialColor: MaterialColor(0xFFEC4899, {
      50: Color(0xFFFDF2F8),
      100: Color(0xFFFCE7F3),
      200: Color(0xFFFBCFE8),
      300: Color(0xFFF9A8D4),
      400: Color(0xFFF472B6),
      500: Color(0xFFEC4899),
      600: Color(0xFFDB2777),
      700: Color(0xFFBE185D),
      800: Color(0xFF9D174D),
      900: Color(0xFF831843),
    }),
  ),
  ThemeColor(
    name: '清新青',
    primaryColor: Color(0xFF06B6D4),
    materialColor: MaterialColor(0xFF06B6D4, {
      50: Color(0xFFF0FDFA),
      100: Color(0xFFCCFBF1),
      200: Color(0xFF99F6E4),
      300: Color(0xFF5EEAD4),
      400: Color(0xFF2DD4BF),
      500: Color(0xFF06B6D4),
      600: Color(0xFF0891B2),
      700: Color(0xFF0E7490),
      800: Color(0xFF155E75),
      900: Color(0xFF164E63),
    }),
  ),
];

ThemeColor getThemeColor(String themeName) {
  return defaultThemes.firstWhere(
    (theme) => theme.name == themeName,
    orElse: () => defaultThemes[0],
  );
}

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,
            ),
          ),
        ],
      ),
    ),
  );
}