import 'package:flutter/material.dart';
import 'package:miaoji_zhang/shared/theme/app_theme.dart';
import 'package:miaoji_zhang/shared/widgets/app_icons.dart';

class AiWelcomePage extends StatelessWidget {
  final void Function(String) onSend;
  final String? companionName;
  final String? companionAvatarKey;
  const AiWelcomePage({
    super.key,
    required this.onSend,
    this.companionName,
    this.companionAvatarKey,
  });

  static const _cards = [
    ('"早餐包子豆浆 6 块"', '直接说花了多少钱，我帮你记账', AppIcons.food),
    ('"这个月花最多的是什么"', '问我查账、看报告、定预算', AppIcons.chart),
    ('"按住说话"', '语音记账、拍小票，都能识别', AppIcons.mic),
  ];

  @override
  Widget build(BuildContext context) {
    final name = companionName ?? '小账喵';
    final avatar = AppIcons.avatarAsset(companionAvatarKey ?? 'cat');
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      child: Column(
        children: [
          Spacer(flex: 2),
          Container(
            width: 88,
            height: 88,
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              color: context.jz.aiBackground,
              boxShadow: [
                BoxShadow(
                  color: AppTheme.ai.withValues(alpha: 0.15),
                  blurRadius: 24,
                ),
              ],
            ),
            child: Center(
              child: AppIcons.icon(avatar, size: 44, color: AppTheme.ai),
            ),
          ),
          SizedBox(height: 18),
          Text(
            '嗨！我是$name',
            style: TextStyle(fontSize: 20, fontWeight: FontWeight.w800),
          ),
          SizedBox(height: 8),
          Text(
            '不用翻菜单，不用点按钮\n说句话就能记账，试试看？',
            textAlign: TextAlign.center,
            style: TextStyle(
              fontSize: 12.5,
              color: context.jz.text2,
              height: 1.7,
            ),
          ),
          SizedBox(height: 22),
          ..._cards.asMap().entries.map(
            (e) => GestureDetector(
              onTap: () => onSend(e.value.$1.replaceAll('"', '')),
              child: Container(
                margin: const EdgeInsets.only(bottom: 10),
                padding: const EdgeInsets.symmetric(
                  horizontal: 14,
                  vertical: 13,
                ),
                decoration: BoxDecoration(
                  color: Colors.white.withValues(alpha: 0.75),
                  borderRadius: BorderRadius.circular(14),
                  border: Border.all(
                    color: Colors.white.withValues(alpha: 0.9),
                  ),
                ),
                child: Row(
                  children: [
                    Container(
                      width: 36,
                      height: 36,
                      decoration: BoxDecoration(
                        color: context.jz.aiBackground,
                        borderRadius: BorderRadius.circular(10),
                      ),
                      child: Center(
                        child: AppIcons.icon(
                          e.value.$3,
                          size: 18,
                          color: AppTheme.ai,
                        ),
                      ),
                    ),
                    SizedBox(width: 12),
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            e.value.$1,
                            style: TextStyle(
                              fontSize: 12.5,
                              fontWeight: FontWeight.w600,
                            ),
                          ),
                          SizedBox(height: 3),
                          Text(
                            e.value.$2,
                            style: TextStyle(
                              fontSize: 10.5,
                              color: context.jz.text2,
                            ),
                          ),
                        ],
                      ),
                    ),
                    AppIcons.icon(
                      AppIcons.chevronRight,
                      size: 14,
                      color: context.jz.text3,
                    ),
                  ],
                ),
              ),
            ),
          ),
          Spacer(flex: 3),
        ],
      ),
    );
  }
}