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(0xFF2563EB),
    materialColor: MaterialColor(0xFF2563EB, {
      50: Color(0xFFDBEAFE),
      100: Color(0xFFBFDBFE),
      200: Color(0xFF93C5FD),
      300: Color(0xFF60A5FA),
      400: Color(0xFF3B82F6),
      500: Color(0xFF2563EB),
      600: Color(0xFF1D4ED8),
      700: Color(0xFF1E40AF),
      800: Color(0xFF1E3A8A),
      900: Color(0xFF1E3A8A),
    }),
  ),
  ThemeColor(
    name: '翡翠绿',
    primaryColor: Color(0xFF10B981),
    materialColor: MaterialColor(0xFF10B981, {
      50: Color(0xFFECFDF5),
      100: Color(0xFFD1FAE5),
      200: Color(0xFFA7F3D0),
      300: Color(0xFF6EE7B7),
      400: Color(0xFF34D399),
      500: Color(0xFF10B981),
      600: Color(0xFF059669),
      700: Color(0xFF047857),
      800: Color(0xFF065F46),
      900: Color(0xFF064E3B),
    }),
  ),
  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(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(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(
    name: '深空蓝',
    primaryColor: Color(0xFF1E40AF),
    materialColor: MaterialColor(0xFF1E40AF, {
      50: Color(0xFFEFF6FF),
      100: Color(0xFFDBEAFE),
      200: Color(0xFFBFDBFE),
      300: Color(0xFF93C5FD),
      400: Color(0xFF60A5FA),
      500: Color(0xFF3B82F6),
      600: Color(0xFF2563EB),
      700: Color(0xFF1D4ED8),
      800: Color(0xFF1E40AF),
      900: Color(0xFF1E3A8A),
    }),
  ),
  ThemeColor(
    name: '落日红',
    primaryColor: Color(0xFFEF4444),
    materialColor: MaterialColor(0xFFEF4444, {
      50: Color(0xFFFEF2F2),
      100: Color(0xFFFEE2E2),
      200: Color(0xFFFECACA),
      300: Color(0xFFFCA5A5),
      400: Color(0xFFF87171),
      500: Color(0xFFEF4444),
      600: Color(0xFFDC2626),
      700: Color(0xFFB91C1C),
      800: Color(0xFF991B1B),
      900: Color(0xFF7F1D1D),
    }),
  ),
];

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