import 'package:flutter/material.dart';

import '../../core/app_state.dart';
import '../../core/app_theme.dart';
import '../../widgets/app_widgets.dart';
import '../words/words_page.dart';

/// 首页的认词入口。
///
/// 认词跟今日任务是并行的，不是竞争关系：一个题几秒钟，不该去抢上面那张
/// 今日任务卡的「今天最该做的一件事」。所以它单独占一行 —— 有题时是一张能
/// 直接开始的卡，没题时缩成一行状态，但入口始终在。
class WordTaskCard extends StatelessWidget {
  const WordTaskCard({
    super.key,
    required this.state,
    required this.onOpenWords,
  });

  final AppState state;
  final VoidCallback onOpenWords;

  @override
  Widget build(BuildContext context) {
    final planned = state.wordSessionPreviewSize;
    if (planned == 0) return _restRow(context);
    return SectionCard(
      tint: AppColors.surfaceMuted,
      onTap: onOpenWords,
      child: SpacedColumn(
        children: [
          Row(
            children: [
              const Expanded(child: Eyebrow('认词')),
              Text(
                '${state.wordSessionMinutes(planned)} 分钟',
                style: TextStyle(color: AppColors.muted),
              ),
            ],
          ),
          Text(
            wordTaskHeadline(state),
            style: const TextStyle(fontSize: 17, fontWeight: FontWeight.w600),
          ),
          Text(
            '$planned 个题，听到、看到能认出来就行，不用会说。',
            style: Theme.of(context).textTheme.bodyMedium,
          ),
          SecondaryButton(label: '开始认词', onPressed: onOpenWords),
        ],
      ),
    );
  }

  Widget _restRow(BuildContext context) => SectionCard(
    tint: AppColors.surfaceMuted,
    onTap: onOpenWords,
    child: Row(
      children: [
        Icon(Icons.abc_outlined, color: AppColors.muted, size: 20),
        const SizedBox(width: 8),
        Expanded(
          child: Text(
            state.newWordQuota > 0
                ? '今天的词都过完了'
                : '今天的新词学满 ${state.newWordsPerDay} 个了，明天继续',
            style: Theme.of(context).textTheme.bodyMedium,
          ),
        ),
        Text(
          '认识 ${state.recognizedWordCount} · 熟悉 ${state.familiarWordCount}',
          style: Theme.of(context).textTheme.bodySmall,
        ),
      ],
    ),
  );
}