import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

import '../../core/l10n/app_localizations.dart';
import '../../core/theme/app_colors.dart';

/// 网络加载失败页面
/// 用法：context.push('/network-error', extra: NetworkErrorExtra(...))
class NetworkErrorScreen extends StatelessWidget {
  const NetworkErrorScreen({
    super.key,
    this.title = '',
    this.errorCode,
    this.onRetry,
  });

  /// AppBar 标题（调用方传入，例如"行情"）
  final String title;

  /// 错误代码，如 NET_ERR_CONNECTION_TIMED_OUT
  final String? errorCode;

  /// 重新加载回调；为 null 时按钮执行 pop
  final VoidCallback? onRetry;

  @override
  Widget build(BuildContext context) {
    final cs = Theme.of(context).colorScheme;

    return Scaffold(
      appBar: AppBar(
        elevation: 0,
        leading: IconButton(
          icon: const Icon(Icons.chevron_left),
          onPressed: () => context.canPop() ? context.pop() : null,
        ),
        title: Text(
          title,
          style: TextStyle(
            color: cs.onSurface,
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
        centerTitle: true,
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 40),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              // WiFi 断开图标
              Container(
                width: 100,
                height: 100,
                decoration: BoxDecoration(
                  color: const Color(0xFFF2F2F2),
                  shape: BoxShape.circle,
                ),
                child: const Icon(
                  Icons.wifi_off_rounded,
                  size: 52,
                  color: Color(0xFFBBBBBB),
                ),
              ),
              const SizedBox(height: 28),
              // 标题
              Text(
                AppLocalizations.of(context)!.pageLoadFailed,
                style: TextStyle(
                  color: cs.onSurface,
                  fontSize: 17,
                  fontWeight: FontWeight.w600,
                ),
              ),
              const SizedBox(height: 10),
              // 副标题
              Text(
                AppLocalizations.of(context)!.networkErrorDesc,
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: cs.onSurface.withAlpha(153),
                  fontSize: 13,
                  height: 1.5,
                ),
              ),
              const SizedBox(height: 36),
              // 重新加载按钮（黑底白字）
              SizedBox(
                width: double.infinity,
                height: 50,
                child: FilledButton.icon(
                  onPressed: onRetry ?? () => context.canPop() ? context.pop() : null,
                  style: FilledButton.styleFrom(
                    backgroundColor: AppColors.brand,
                    foregroundColor: Colors.black,
                    shape: const StadiumBorder(),
                  ),
                  icon: const Icon(Icons.refresh_rounded, size: 18),
                  label: Text(
                    AppLocalizations.of(context)!.reload,
                    style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500),
                  ),
                ),
              ),
              const SizedBox(height: 12),
              // 返回首页按钮（描边）
              SizedBox(
                width: double.infinity,
                height: 50,
                child: OutlinedButton(
                  onPressed: () => context.go('/home'),
                  style: OutlinedButton.styleFrom(
                    foregroundColor: cs.onSurface,
                    side: BorderSide(color: cs.outline),
                    shape: const StadiumBorder(),
                  ),
                  child: Text(
                    AppLocalizations.of(context)!.backHome,
                    style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500),
                  ),
                ),
              ),
              // 错误代码
              if (errorCode != null) ...[
                const SizedBox(height: 28),
                Text(
                  AppLocalizations.of(context)!.errorCodeLabel(errorCode!),
                  style: TextStyle(
                    color: cs.onSurface.withAlpha(80),
                    fontSize: 11,
                  ),
                ),
              ],
            ],
          ),
        ),
      ),
    );
  }
}