import 'package:flutter/material.dart';
import '../../../constants/app_constants.dart';

/// 时间: 2026-03-27
/// 功能: 桌面小卡片设置页面
/// 介绍: 用于配置和管理桌面小卡片
class WidgetsPage extends StatefulWidget {
  const WidgetsPage({super.key});

  @override
  State<WidgetsPage> createState() => _WidgetsPageState();
}

class _WidgetsPageState extends State<WidgetsPage> {
  bool _enableWidget = true;
  bool _showWeather = true;
  bool _showQuote = true;
  bool _showTime = true;
  int _updateInterval = 5; // 分钟

  final List<int> _intervalOptions = [1, 5, 10, 30, 60];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFFF5F5F5),
      appBar: AppBar(
        title: Text(
          '桌面卡片设置',
          style: TextStyle(
            color: AppConstants.primaryColor,
            fontWeight: FontWeight.bold,
          ),
        ),
        backgroundColor: Colors.white,
        elevation: 0,
        centerTitle: true,
        leading: IconButton(
          icon: Icon(Icons.arrow_back, color: AppConstants.primaryColor),
          onPressed: () => Navigator.of(context).pop(),
        ),
      ),
      body: ListView(
        padding: const EdgeInsets.all(16),
        children: [
          _buildSettingsGroup('卡片状态', [
            _buildSwitchItem(
              '启用桌面卡片',
              '在桌面上显示诗词卡片',
              Icons.widgets,
              _enableWidget,
              (value) => setState(() => _enableWidget = value),
            ),
          ]),
          const SizedBox(height: 16),
          _buildSettingsGroup('显示内容', [
            _buildSwitchItem(
              '显示天气',
              '在卡片上显示当前天气',
              Icons.cloud,
              _showWeather,
              (value) => setState(() => _showWeather = value),
            ),
            _buildSwitchItem(
              '显示诗句',
              '在卡片上显示随机诗句',
              Icons.edit_document,
              _showQuote,
              (value) => setState(() => _showQuote = value),
            ),
            _buildSwitchItem(
              '显示时间',
              '在卡片上显示当前时间',
              Icons.access_time,
              _showTime,
              (value) => setState(() => _showTime = value),
            ),
          ]),
          const SizedBox(height: 16),
          _buildSettingsGroup('更新设置', [_buildIntervalItem()]),
          const SizedBox(height: 16),
          _buildSettingsGroup('预览', [_buildPreviewCard()]),
          const SizedBox(height: 32),
          _buildActionButton(),
        ],
      ),
    );
  }

  Widget _buildSettingsGroup(String title, List<Widget> items) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(16),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(5),
            blurRadius: 10,
            offset: const Offset(0, 2),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Padding(
            padding: const EdgeInsets.fromLTRB(16, 16, 16, 8),
            child: Text(
              title,
              style: TextStyle(
                fontSize: 14,
                fontWeight: FontWeight.bold,
                color: AppConstants.primaryColor,
              ),
            ),
          ),
          ...items,
        ],
      ),
    );
  }

  Widget _buildSwitchItem(
    String title,
    String subtitle,
    IconData icon,
    bool value,
    ValueChanged<bool> onChanged,
  ) {
    return ListTile(
      leading: Container(
        padding: const EdgeInsets.all(8),
        decoration: BoxDecoration(
          color: AppConstants.primaryColor.withAlpha(10),
          borderRadius: BorderRadius.circular(8),
        ),
        child: Icon(icon, color: AppConstants.primaryColor, size: 20),
      ),
      title: Text(
        title,
        style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500),
      ),
      subtitle: Text(
        subtitle,
        style: TextStyle(fontSize: 12, color: Colors.grey[600]),
      ),
      trailing: Switch(
        value: value,
        onChanged: onChanged,
        activeThumbColor: AppConstants.primaryColor,
      ),
    );
  }

  Widget _buildIntervalItem() {
    return ListTile(
      leading: Container(
        padding: const EdgeInsets.all(8),
        decoration: BoxDecoration(
          color: AppConstants.primaryColor.withAlpha(10),
          borderRadius: BorderRadius.circular(8),
        ),
        child: Icon(Icons.refresh, color: AppConstants.primaryColor, size: 20),
      ),
      title: const Text(
        '更新间隔',
        style: TextStyle(fontSize: 15, fontWeight: FontWeight.w500),
      ),
      subtitle: Text(
        '每 $_updateInterval 分钟更新一次',
        style: TextStyle(fontSize: 12, color: Colors.grey[600]),
      ),
      trailing: SizedBox(
        width: 150,
        child: SegmentedButton<int>(
          segments: _intervalOptions.map((interval) {
            return ButtonSegment(value: interval, label: Text('$interval'));
          }).toList(),
          selected: {_updateInterval},
          onSelectionChanged: (Set<int> selection) {
            setState(() {
              _updateInterval = selection.first;
            });
          },
          style: ButtonStyle(
            visualDensity: VisualDensity.compact,
            backgroundColor: WidgetStateProperty.resolveWith((states) {
              if (states.contains(WidgetState.selected)) {
                return AppConstants.primaryColor;
              }
              return Colors.grey[200];
            }),
            foregroundColor: WidgetStateProperty.resolveWith((states) {
              if (states.contains(WidgetState.selected)) {
                return Colors.white;
              }
              return Colors.black87;
            }),
          ),
        ),
      ),
    );
  }

  Widget _buildPreviewCard() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: AppConstants.primaryColor.withAlpha(90),
        borderRadius: BorderRadius.circular(12),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(10),
            blurRadius: 5,
            offset: const Offset(0, 2),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          if (_showTime) ...[
            Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                Text(
                  '${DateTime.now().hour.toString().padLeft(2, '0')}:${DateTime.now().minute.toString().padLeft(2, '0')}',
                  style: const TextStyle(
                    color: Colors.white,
                    fontSize: 14,
                    fontWeight: FontWeight.w500,
                  ),
                ),
              ],
            ),
            const SizedBox(height: 12),
          ],
          if (_showQuote) ...[
            Text(
              '床前明月光，疑是地上霜。',
              style: const TextStyle(
                color: Colors.white,
                fontSize: 16,
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 4),
            Text(
              '举头望明月，低头思故乡。',
              style: const TextStyle(color: Colors.white, fontSize: 16),
            ),
            const SizedBox(height: 8),
            Text(
              '— 李白《静夜思》',
              style: const TextStyle(color: Colors.white70, fontSize: 12),
            ),
          ],
          if (_showWeather) ...[
            const SizedBox(height: 12),
            Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                Icon(Icons.sunny, color: Colors.white, size: 16),
                const SizedBox(width: 4),
                Text(
                  '25°C',
                  style: const TextStyle(color: Colors.white, fontSize: 14),
                ),
              ],
            ),
          ],
        ],
      ),
    );
  }

  Widget _buildActionButton() {
    return SizedBox(
      width: double.infinity,
      child: ElevatedButton(
        onPressed: () {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(
              content: Text('桌面卡片设置已保存'),
              backgroundColor: AppConstants.primaryColor,
            ),
          );
        },
        style: ElevatedButton.styleFrom(
          backgroundColor: AppConstants.primaryColor,
          padding: const EdgeInsets.symmetric(vertical: 16),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(12),
          ),
          elevation: 0,
        ),
        child: const Text(
          '应用设置',
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.bold,
            color: Colors.white,
          ),
        ),
      ),
    );
  }
}