import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import '../providers/category_provider.dart';
// import '../theme/app_colors.dart';
import '../l10n/app_localizations.dart';

class CategoryManagementScreen extends StatefulWidget {
  const CategoryManagementScreen({super.key});

  @override
  State<CategoryManagementScreen> createState() =>
      _CategoryManagementScreenState();
}

class _CategoryManagementScreenState extends State<CategoryManagementScreen> {
  final _formKey = GlobalKey<FormState>();
  final _nameController = TextEditingController();
  String _selectedColor = '#1976D2';
  String _selectedIcon = 'subscriptions';

  @override
  void dispose() {
    _nameController.dispose();
    super.dispose();
  }

  Future<void> _addCategory() async {
    if (_formKey.currentState!.validate()) {
      await Provider.of<CategoryProvider>(context, listen: false).addCategory(
        name: _nameController.text,
        color: _selectedColor,
        icon: _selectedIcon,
      );
      _nameController.clear();
      setState(() {
        _selectedColor = '#1976D2';
        _selectedIcon = 'subscriptions';
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    final loc = AppLocalizations.of(context);
    return Scaffold(
      appBar: AppBar(
        title: Text(
          loc.categoryManagement,
          style: Theme.of(context).textTheme.titleLarge?.copyWith(
                color: Theme.of(context).colorScheme.onPrimary,
              ),
        ),
        backgroundColor: Theme.of(context).colorScheme.primary,
      ),
      body: Consumer<CategoryProvider>(
        builder: (context, provider, child) {
          return Column(
            children: [
              // 카테고리 추가 폼
              Card(
                margin: const EdgeInsets.all(16),
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Form(
                    key: _formKey,
                    child: Column(
                      children: [
                        TextFormField(
                          controller: _nameController,
                          decoration: InputDecoration(
                            labelText: loc.categoryName,
                            labelStyle: TextStyle(
                              color: Theme.of(context)
                                  .colorScheme
                                  .onSurfaceVariant,
                            ),
                          ),
                          validator: (value) {
                            if (value == null || value.isEmpty) {
                              return loc.categoryNameRequired;
                            }
                            return null;
                          },
                        ),
                        const SizedBox(height: 16),
                        DropdownButtonFormField<String>(
                          initialValue: _selectedColor,
                          decoration: InputDecoration(
                            labelText: loc.selectColor,
                            labelStyle: TextStyle(
                              color: Theme.of(context)
                                  .colorScheme
                                  .onSurfaceVariant,
                            ),
                          ),
                          items: [
                            DropdownMenuItem(
                                value: '#1976D2',
                                child: Text(
                                    AppLocalizations.of(context).colorBlue,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: '#4CAF50',
                                child: Text(
                                    AppLocalizations.of(context).colorGreen,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: '#FF9800',
                                child: Text(
                                    AppLocalizations.of(context).colorOrange,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: '#F44336',
                                child: Text(
                                    AppLocalizations.of(context).colorRed,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: '#9C27B0',
                                child: Text(
                                    AppLocalizations.of(context).colorPurple,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                          ],
                          onChanged: (value) {
                            setState(() {
                              _selectedColor = value!;
                            });
                          },
                        ),
                        const SizedBox(height: 16),
                        DropdownButtonFormField<String>(
                          initialValue: _selectedIcon,
                          decoration: InputDecoration(
                            labelText: loc.selectIcon,
                            labelStyle: TextStyle(
                              color: Theme.of(context)
                                  .colorScheme
                                  .onSurfaceVariant,
                            ),
                          ),
                          items: [
                            DropdownMenuItem(
                                value: 'subscriptions',
                                child: Text(loc.subscription,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: 'movie',
                                child: Text(loc.movie,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: 'music_note',
                                child: Text(loc.music,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: 'fitness_center',
                                child: Text(loc.exercise,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                            DropdownMenuItem(
                                value: 'shopping_cart',
                                child: Text(loc.shopping,
                                    style: TextStyle(
                                        color: Theme.of(context)
                                            .colorScheme
                                            .onSurface))),
                          ],
                          onChanged: (value) {
                            setState(() {
                              _selectedIcon = value!;
                            });
                          },
                        ),
                        const SizedBox(height: 16),
                        ElevatedButton(
                          onPressed: _addCategory,
                          child: Text(loc.addCategory),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
              // 카테고리 목록
              Expanded(
                child: ListView.builder(
                  itemCount: provider.categories.length,
                  itemBuilder: (context, index) {
                    final category = provider.categories[index];
                    return ListTile(
                      leading: Icon(
                        IconData(
                          _getIconCode(category.icon),
                          fontFamily: 'MaterialIcons',
                        ),
                        color: Color(
                            int.parse(category.color.replaceAll('#', '0xFF'))),
                      ),
                      title: Text(
                        provider.getLocalizedCategoryName(
                            context, category.name),
                        style: TextStyle(
                          color: Theme.of(context).colorScheme.onSurface,
                        ),
                      ),
                      trailing: IconButton(
                        icon: const Icon(Icons.delete),
                        onPressed: () async {
                          await provider.deleteCategory(category.id);
                        },
                      ),
                    );
                  },
                ),
              ),
            ],
          );
        },
      ),
    );
  }

  int _getIconCode(String iconName) {
    switch (iconName) {
      case 'subscriptions':
        return 0xe8c1;
      case 'movie':
        return 0xe8c2;
      case 'music_note':
        return 0xe405;
      case 'fitness_center':
        return 0xeb43;
      case 'shopping_cart':
        return 0xe8cc;
      default:
        return 0xe8c1;
    }
  }
}
