ReelShort/lib/pages/reward/reward_checkin_card.dart

// Author: fruit.com.cn

import 'dart:async';

import 'package:flutter/material.dart';

import '../../core/data/models/reward.dart';
import '../../core/data/services/reward_controller.dart';
import '../../core/theme/app_colors.dart';
import '../../core/theme/app_dimens.dart';
import '../../l10n/app_localizations.dart';
import 'reward_visuals.dart';

const double _cardRadius = 14;
const double _cardBorderWidth = 1;
const double _titleFont = 20;
const double _boostFont = 12;
const double _subtitleFont = 13;
const double _dayHeight = 80;
const double _dayRadius = 9;
const double _dayGap = 5;
const double _dayRewardFont = 13;
const double _dayLabelFont = 11;
const double _dayCoinSize = 24;
const double _buttonHeight = 48;
const double _buttonFont = 16;
const double _loadingSize = 20;
const double _loadingStroke = 2;
const Color _cardStart = Color(0xFF1A1A1C);
const Color _cardEnd = Color(0xFF101010);
const Color _cardBorder = Color(0xFF3A3A3C);
const Color _daySurface = Color(0xFF202022);
const Color _dayBorder = Color(0xFF363638);
const Color _currentSurfaceStart = Color(0xFF3E0813);
const Color _currentSurfaceEnd = Color(0xFF24070D);
const Color _currentBorder = Color(0xFFFF4860);
const Color _buttonEnd = Color(0xFFFF565B);

/// 奖励中心签到卡，展示七日规则与签到操作。
class RewardCheckinCard extends StatelessWidget {
  const RewardCheckinCard({
    super.key,
    required this.l10n,
    required this.rewards,
    required this.checkin,
    required this.onCheckIn,
    required this.onBoost,
  });

  final AppLocalizations l10n;
  final RewardController rewards;
  final RewardCheckinState checkin;
  final Future<void> Function() onCheckIn;
  final VoidCallback onBoost;

  @override
  Widget build(BuildContext context) {
    return Container(
      key: const Key('reward-checkin-card'),
      padding: const EdgeInsets.all(AppDimens.cardPadding),
      decoration: BoxDecoration(
        gradient: const LinearGradient(colors: [_cardStart, _cardEnd]),
        borderRadius: BorderRadius.circular(_cardRadius),
        border: Border.all(color: _cardBorder, width: _cardBorderWidth),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _header(),
          const SizedBox(height: AppDimens.spaceXs),
          Text(
            l10n.rewardCheckInSubtitle,
            style: const TextStyle(
              color: AppColors.textSecondary,
              fontSize: _subtitleFont,
            ),
          ),
          const SizedBox(height: AppDimens.spaceLg),
          _days(),
          const SizedBox(height: AppDimens.spaceLg),
          _action(),
        ],
      ),
    );
  }

  Widget _header() {
    return Row(
      children: [
        Expanded(
          child: Text(
            l10n.rewardCheckInTitle,
            style: const TextStyle(
              color: AppColors.textPrimary,
              fontSize: _titleFont,
              fontWeight: FontWeight.w800,
            ),
          ),
        ),
        InkWell(
          onTap: onBoost,
          borderRadius: BorderRadius.circular(AppDimens.pillRadius),
          child: Padding(
            padding: const EdgeInsets.symmetric(vertical: AppDimens.spaceSm),
            child: Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text(
                  l10n.rewardBoostCheckIn,
                  style: const TextStyle(
                    color: AppColors.brandRed,
                    fontSize: _boostFont,
                    fontWeight: FontWeight.w600,
                  ),
                ),
                const Icon(
                  Icons.chevron_right_rounded,
                  color: AppColors.brandRed,
                  size: 18,
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }

  Widget _days() {
    if (checkin.days.isEmpty) return const SizedBox.shrink();
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        for (var index = 0; index < checkin.days.length; index++) ...[
          Expanded(
            child: _RewardDay(l10n: l10n, day: checkin.days[index]),
          ),
          if (index < checkin.days.length - 1) const SizedBox(width: _dayGap),
        ],
      ],
    );
  }

  Widget _action() {
    final disabled = checkin.checkedInToday || rewards.checkingIn;
    return Container(
      key: const Key('reward-checkin-action'),
      height: _buttonHeight,
      decoration: BoxDecoration(
        gradient: disabled
            ? const LinearGradient(
                colors: [AppColors.contentChip, AppColors.contentChip],
              )
            : const LinearGradient(colors: [AppColors.brandRed, _buttonEnd]),
        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
      ),
      child: Material(
        color: AppColors.transparent,
        child: InkWell(
          onTap: disabled ? null : () => unawaited(onCheckIn()),
          borderRadius: BorderRadius.circular(AppDimens.pillRadius),
          child: Center(child: _actionContent()),
        ),
      ),
    );
  }

  Widget _actionContent() {
    if (rewards.checkingIn) {
      return const SizedBox.square(
        dimension: _loadingSize,
        child: CircularProgressIndicator(
          strokeWidth: _loadingStroke,
          color: AppColors.textPrimary,
        ),
      );
    }
    final label = checkin.checkedInToday
        ? l10n.rewardCheckedIn
        : l10n.rewardCheckInActionWithCoins(_currentReward());
    return Row(
      key: const Key('reward-checkin-action-content'),
      mainAxisSize: MainAxisSize.min,
      children: [
        if (!checkin.checkedInToday) ...[
          const RewardAdIcon(),
          const SizedBox(width: AppDimens.spaceMd),
        ],
        ConstrainedBox(
          constraints: const BoxConstraints(maxWidth: 220),
          child: Text(
            label,
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
            style: const TextStyle(
              color: AppColors.textPrimary,
              fontSize: _buttonFont,
              fontWeight: FontWeight.w700,
            ),
          ),
        ),
      ],
    );
  }

  int _currentReward() {
    for (final day in checkin.days) {
      if (day.current) return day.rewardCoin;
    }
    return checkin.days.isEmpty ? 0 : checkin.days.first.rewardCoin;
  }
}

class _RewardDay extends StatelessWidget {
  const _RewardDay({required this.l10n, required this.day});

  final AppLocalizations l10n;
  final RewardCheckinDay day;

  @override
  Widget build(BuildContext context) {
    return Container(
      height: _dayHeight,
      decoration: BoxDecoration(
        gradient: day.current
            ? const LinearGradient(
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
                colors: [_currentSurfaceStart, _currentSurfaceEnd],
              )
            : null,
        color: day.current ? null : _daySurface,
        borderRadius: BorderRadius.circular(_dayRadius),
        border: Border.all(color: day.current ? _currentBorder : _dayBorder),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          FittedBox(
            fit: BoxFit.scaleDown,
            child: Text(
              '+${day.rewardCoin}',
              style: TextStyle(
                color: day.current
                    ? const Color(0xFFFFE18C)
                    : AppColors.textPrimary,
                fontSize: _dayRewardFont,
                fontWeight: FontWeight.w800,
              ),
            ),
          ),
          const SizedBox(height: AppDimens.spaceXs),
          const RewardCoinIcon(size: _dayCoinSize),
          const SizedBox(height: AppDimens.spaceXs),
          FittedBox(
            fit: BoxFit.scaleDown,
            child: Text(
              day.current
                  ? l10n.rewardToday
                  : l10n.rewardDayLabel(day.dayIndex),
              style: TextStyle(
                color: day.checked
                    ? AppColors.success
                    : AppColors.textSecondary,
                fontSize: _dayLabelFont,
              ),
            ),
          ),
        ],
      ),
    );
  }
}