import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:package_info_plus/package_info_plus.dart';

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

  @override
  State<AboutUsScreen> createState() => _AboutUsScreenState();
}

class _AboutUsScreenState extends State<AboutUsScreen> {
  PackageInfo _packageInfo = PackageInfo(
    appName: '未知',
    packageName: '未知',
    version: '未知',
    buildNumber: '未知',
    buildSignature: '未知',
  );
  bool _isLoading = false;

  @override
  void initState() {
    super.initState();
    // _initPackageInfo();
  }

  Future<void> _initPackageInfo() async {
    final info = await PackageInfo.fromPlatform();
    setState(() {
      _packageInfo = info;
      _isLoading = false;
    });
  }

  Future<void> _launchURL(String url) async {
    final Uri uri = Uri.parse(url);
    if (await canLaunchUrl(uri)) {
      await launchUrl(uri);
    } else {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(
          content: Text('无法打开链接'),
          backgroundColor: Colors.red,
        ),
      );
    }
  }

  void _showVersionInfo() {
    showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: const Text('版本信息'),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _buildInfoItem('应用名称', _packageInfo.appName),
            _buildInfoItem('版本号', _packageInfo.version),
            _buildInfoItem('构建号', _packageInfo.buildNumber),
            _buildInfoItem('包名', _packageInfo.packageName),
          ],
        ),
        actions: [
          TextButton(
            onPressed: () => Navigator.of(context).pop(),
            child: const Text('确定'),
          ),
        ],
      ),
    );
  }

  Widget _buildInfoItem(String label, String value) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 6),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 80,
            child: Text(
              '$label：',
              style: const TextStyle(
                fontWeight: FontWeight.bold,
                color: Colors.grey,
              ),
            ),
          ),
          Expanded(
            child: Text(
              value,
              style: const TextStyle(color: Colors.black87),
            ),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('关于我们'),
        centerTitle: true,
      ),
      body: _isLoading
          ? const Center(child: CircularProgressIndicator())
          : SingleChildScrollView(
              child: Column(
                children: [
                  // 应用Logo和名称区域
                  Container(
                    padding: const EdgeInsets.symmetric(vertical: 40),
                    decoration: BoxDecoration(
                      gradient: LinearGradient(
                        begin: Alignment.topCenter,
                        end: Alignment.bottomCenter,
                        colors: [
                          Colors.red[50]!,
                          Colors.orange[50]!,
                        ],
                      ),
                    ),
                    child: Column(
                      children: [
                        // 应用Logo
                        Container(
                          width: 120,
                          height: 120,
                          decoration: BoxDecoration(
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(30),
                            boxShadow: [
                              BoxShadow(
                                color: Colors.red.withOpacity(0.2),
                                blurRadius: 20,
                                offset: const Offset(0, 10),
                              ),
                            ],
                          ),
                          child: const Icon(
                            Icons.emoji_events,
                            size: 60,
                            color: Colors.red,
                          ),
                        ),
                        const SizedBox(height: 20),
                        // 应用名称
                        const Text(
                          '中了么',
                          style: TextStyle(
                            fontSize: 32,
                            fontWeight: FontWeight.bold,
                            color: Colors.red,
                          ),
                        ),
                        const SizedBox(height: 8),
                        // 宣传语
                        const Text(
                          '专业彩票资讯，开启幸运之门',
                          style: TextStyle(
                            fontSize: 16,
                            color: Colors.orange,
                            fontStyle: FontStyle.italic,
                          ),
                        ),
                        const SizedBox(height: 16),
                        // 版本信息
                        GestureDetector(
                          onTap: _showVersionInfo,
                          child: Container(
                            padding: const EdgeInsets.symmetric(
                              horizontal: 16,
                              vertical: 6,
                            ),
                            decoration: BoxDecoration(
                              color: Colors.white.withOpacity(0.8),
                              borderRadius: BorderRadius.circular(20),
                            ),
                            child: Text(
                              '版本 ${_packageInfo.version}',
                              style: const TextStyle(
                                color: Colors.red,
                                fontWeight: FontWeight.w500,
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),

                  // 应用介绍卡片
                  _buildSectionCard(
                    title: '应用介绍',
                    icon: Icons.info_outline,
                    color: Colors.blue,
                    child: const Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          '「中了么」是一款专业的彩票资讯服务平台，致力于为用户提供全面、及时、准确的彩票信息。我们不是彩票销售平台，而是您获取彩票资讯、分析数据和社区交流的得力助手。',
                          style: TextStyle(
                            height: 1.6,
                            color: Colors.black87,
                          ),
                        ),
                        SizedBox(height: 12),
                        Row(
                          children: [
                            Icon(Icons.check_circle, color: Colors.green, size: 16),
                            SizedBox(width: 8),
                            Expanded(child: Text('合法合规：严格遵守国家法律法规')),
                          ],
                        ),
                        SizedBox(height: 6),
                        Row(
                          children: [
                            Icon(Icons.check_circle, color: Colors.green, size: 16),
                            SizedBox(width: 8),
                            Expanded(child: Text('信息透明：所有数据公开可查')),
                          ],
                        ),
                        SizedBox(height: 6),
                        Row(
                          children: [
                            Icon(Icons.check_circle, color: Colors.green, size: 16),
                            SizedBox(width: 8),
                            Expanded(child: Text('理性推荐：倡导健康购彩理念')),
                          ],
                        ),
                      ],
                    ),
                  ),

                  // 核心功能
                  _buildSectionCard(
                    title: '核心功能',
                    icon: Icons.stars,
                    color: Colors.amber,
                    child: Column(
                      children: [
                        _buildFeatureItem(
                          icon: Icons.notifications_active,
                          title: '开奖通知',
                          description: '第一时间推送最新开奖结果',
                          color: Colors.red,
                        ),
                        _buildFeatureItem(
                          icon: Icons.analytics,
                          title: '数据统计',
                          description: '历史数据深度分析和趋势预测',
                          color: Colors.blue,
                        ),
                        _buildFeatureItem(
                          icon: Icons.article,
                          title: '资讯快报',
                          description: '行业动态和玩法技巧专业解读',
                          color: Colors.green,
                        ),
                        _buildFeatureItem(
                          icon: Icons.people,
                          title: '彩民社区',
                          description: '与千万彩民交流经验心得',
                          color: Colors.purple,
                        ),
                        _buildFeatureItem(
                          icon: Icons.security,
                          title: '风险提示',
                          description: '购彩风险提示和理性建议',
                          color: Colors.orange,
                        ),
                      ],
                    ),
                  ),

                  // 开发团队
                  _buildSectionCard(
                    title: '开发团队',
                    icon: Icons.group,
                    color: Colors.purple,
                    child: Column(
                      children: [
                        _buildTeamMember(
                          name: '技术团队',
                          description: '来自一线互联网公司的技术专家，拥有丰富的移动开发经验',
                          avatarColor: Colors.blue,
                        ),
                        _buildTeamMember(
                          name: '数据分析团队',
                          description: '统计学和数据分析专业人士，提供精准的数据支持',
                          avatarColor: Colors.green,
                        ),
                        _buildTeamMember(
                          name: '内容团队',
                          description: '资深彩票行业编辑，确保资讯的专业性和时效性',
                          avatarColor: Colors.orange,
                        ),
                        _buildTeamMember(
                          name: '风控团队',
                          description: '法律和风控专家，确保平台合规运营',
                          avatarColor: Colors.red,
                        ),
                      ],
                    ),
                  ),

                  // 联系我们
                  _buildSectionCard(
                    title: '联系我们',
                    icon: Icons.contact_support,
                    color: Colors.teal,
                    child: Column(
                      children: [
                        _buildContactItem(
                          icon: Icons.email,
                          label: '商务合作',
                          value: 'business@zhongleme.com',
                          onTap: () => _launchURL('mailto:business@zhongleme.com'),
                        ),
                        _buildContactItem(
                          icon: Icons.email,
                          label: '用户反馈',
                          value: 'feedback@zhongleme.com',
                          onTap: () => _launchURL('mailto:feedback@zhongleme.com'),
                        ),
                        _buildContactItem(
                          icon: Icons.phone,
                          label: '客服热线',
                          value: '400-888-8888',
                          onTap: () => _launchURL('tel:4008888888'),
                        ),
                        _buildContactItem(
                          icon: Icons.language,
                          label: '官方网站',
                          value: 'https://www.zhongleme.com',
                          onTap: () => _launchURL('https://www.zhongleme.com'),
                        ),
                        const SizedBox(height: 16),
                        const Text(
                          '工作时间：周一至周五 9:00-18:00',
                          style: TextStyle(
                            color: Colors.grey,
                            fontSize: 13,
                          ),
                        ),
                      ],
                    ),
                  ),

                  // 法律声明
                  _buildSectionCard(
                    title: '法律声明',
                    icon: Icons.gavel,
                    color: Colors.grey,
                    child: const Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          '1. 本应用提供的所有资讯仅供参考，不构成任何投注建议。',
                          style: TextStyle(fontSize: 13, color: Colors.grey),
                        ),
                        SizedBox(height: 6),
                        Text(
                          '2. 彩票有风险，请理性购彩。未满18周岁不得购买彩票。',
                          style: TextStyle(fontSize: 13, color: Colors.grey),
                        ),
                        SizedBox(height: 6),
                        Text(
                          '3. 我们严格遵守《互联网信息服务管理办法》等相关法律法规。',
                          style: TextStyle(fontSize: 13, color: Colors.grey),
                        ),
                        SizedBox(height: 6),
                        Text(
                          '4. 用户在使用过程中应遵守当地法律法规，对自己的行为负责。',
                          style: TextStyle(fontSize: 13, color: Colors.grey),
                        ),
                        SizedBox(height: 12),
                        Center(
                          child: Text(
                            '© 2023 中了么 版权所有',
                            style: TextStyle(
                              fontSize: 12,
                              color: Colors.grey,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),

                  // 社交平台
                  Container(
                    padding: const EdgeInsets.all(20),
                    child: Column(
                      children: [
                        const Text(
                          '关注我们',
                          style: TextStyle(
                            fontSize: 18,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const SizedBox(height: 16),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            _buildSocialButton(
                              icon: Icons.wechat,
                              label: '微信',
                              onTap: () => _showWechatQRCode(context),
                            ),
                            _buildSocialButton(
                              icon: Icons.camera_alt,
                              label: '微博',
                              onTap: () => _launchURL('https://weibo.com/zhongleme'),
                            ),
                            _buildSocialButton(
                              icon: Icons.videocam,
                              label: '抖音',
                              onTap: () => _launchURL('https://www.douyin.com/zhongleme'),
                            ),
                          ],
                        ),
                      ],
                    ),
                  ),

                  const SizedBox(height: 40),
                ],
              ),
            ),
    );
  }

  Widget _buildSectionCard({
    required String title,
    required IconData icon,
    required Color color,
    required Widget child,
  }) {
    return Container(
      margin: const EdgeInsets.fromLTRB(16, 8, 16, 8),
      padding: const EdgeInsets.all(20),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(16),
        boxShadow: [
          BoxShadow(
            color: Colors.grey.withOpacity(0.1),
            blurRadius: 10,
            offset: const Offset(0, 5),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Container(
                padding: const EdgeInsets.all(8),
                decoration: BoxDecoration(
                  color: color.withOpacity(0.1),
                  borderRadius: BorderRadius.circular(10),
                ),
                child: Icon(icon, color: color, size: 24),
              ),
              const SizedBox(width: 12),
              Text(
                title,
                style: TextStyle(
                  fontSize: 20,
                  fontWeight: FontWeight.bold,
                  color: color,
                ),
              ),
            ],
          ),
          const SizedBox(height: 16),
          child,
        ],
      ),
    );
  }

  Widget _buildFeatureItem({
    required IconData icon,
    required String title,
    required String description,
    required Color color,
  }) {
    return Container(
      margin: const EdgeInsets.only(bottom: 12),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            width: 40,
            height: 40,
            decoration: BoxDecoration(
              color: color.withOpacity(0.1),
              borderRadius: BorderRadius.circular(10),
            ),
            child: Icon(icon, color: color, size: 22),
          ),
          const SizedBox(width: 12),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: const TextStyle(
                    fontWeight: FontWeight.bold,
                    fontSize: 16,
                  ),
                ),
                const SizedBox(height: 4),
                Text(
                  description,
                  style: TextStyle(
                    color: Colors.grey[700],
                    fontSize: 14,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildTeamMember({
    required String name,
    required String description,
    required Color avatarColor,
  }) {
    return Container(
      margin: const EdgeInsets.only(bottom: 12),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          CircleAvatar(
            backgroundColor: avatarColor.withOpacity(0.1),
            radius: 20,
            child: Icon(
              Icons.person,
              color: avatarColor,
              size: 20,
            ),
          ),
          const SizedBox(width: 12),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  name,
                  style: const TextStyle(
                    fontWeight: FontWeight.bold,
                    fontSize: 16,
                  ),
                ),
                const SizedBox(height: 4),
                Text(
                  description,
                  style: TextStyle(
                    color: Colors.grey[700],
                    fontSize: 14,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildContactItem({
    required IconData icon,
    required String label,
    required String value,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        margin: const EdgeInsets.only(bottom: 12),
        child: Row(
          children: [
            Container(
              width: 40,
              height: 40,
              decoration: BoxDecoration(
                color: Colors.blue.withOpacity(0.1),
                borderRadius: BorderRadius.circular(10),
              ),
              child: Icon(icon, color: Colors.blue, size: 22),
            ),
            const SizedBox(width: 12),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    label,
                    style: const TextStyle(
                      fontSize: 14,
                      color: Colors.grey,
                    ),
                  ),
                  Text(
                    value,
                    style: const TextStyle(
                      fontWeight: FontWeight.w500,
                      fontSize: 16,
                    ),
                  ),
                ],
              ),
            ),
            const Icon(Icons.chevron_right, color: Colors.grey),
          ],
        ),
      ),
    );
  }

  Widget _buildSocialButton({
    required IconData icon,
    required String label,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        margin: const EdgeInsets.symmetric(horizontal: 12),
        child: Column(
          children: [
            Container(
              width: 60,
              height: 60,
              decoration: BoxDecoration(
                color: Colors.red.withOpacity(0.1),
                borderRadius: BorderRadius.circular(30),
              ),
              child: Icon(icon, color: Colors.red, size: 30),
            ),
            const SizedBox(height: 8),
            Text(label, style: const TextStyle(fontSize: 14)),
          ],
        ),
      ),
    );
  }

  void _showWechatQRCode(BuildContext context) {
    showDialog(
      context: context,
      builder: (context) => Dialog(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(20),
        ),
        child: Container(
          padding: const EdgeInsets.all(24),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              const Text(
                '关注微信公众号',
                style: TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                ),
              ),
              const SizedBox(height: 16),
              Container(
                width: 200,
                height: 200,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(10),
                  border: Border.all(color: Colors.grey[300]!),
                ),
                child: const Icon(
                  Icons.qr_code_scanner,
                  size: 100,
                  color: Colors.grey,
                ),
              ),
              const SizedBox(height: 16),
              const Text(
                '扫描二维码关注「中了么」公众号',
                textAlign: TextAlign.center,
                style: TextStyle(color: Colors.grey),
              ),
              const SizedBox(height: 20),
              TextButton(
                onPressed: () => Navigator.of(context).pop(),
                child: const Text('关闭'),
              ),
            ],
          ),
        ),
      ),
    );
  }
}