import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:image_picker/image_picker.dart';

import '../../../api/photo_api.dart';
import '../../../core/network/api_env.dart';
import '../../../core/network/api_exception.dart';
import '../../../models/photo.dart';
import '../../../models/watermark.dart';
import '../../../providers/watermark_provider.dart';
import '../../../utils/toast.dart';
import 'watermark_edit_page.dart';
import 'widgets/watermark_settings_sheet.dart';

/// 水印相机模块入口：拍照 / 相册选图 → 进编辑页加水印；
/// 下面列出**已经上传过的原图**，点一张就能重新打水印。
///
/// 刻意不做自绘相机预览（原项目也是调系统相机）：省掉一整套相机权限、
/// 预览流、方向处理的复杂度，代价只是没法实时看到水印。
class WatermarkCameraPage extends ConsumerStatefulWidget {
  const WatermarkCameraPage({super.key});

  @override
  ConsumerState<WatermarkCameraPage> createState() => _WatermarkCameraPageState();
}

class _WatermarkCameraPageState extends ConsumerState<WatermarkCameraPage> {
  static const _pageSize = 21; // 3 列，正好 7 行

  final List<PhotoItem> _photos = [];
  int _total = 0;

  bool _loading = true;
  bool _loadingMore = false;
  bool _hasMore = false;
  int _page = 0;
  String? _error;

  /// 正在下载哪一张的原图（下载完才进编辑页）
  int? _openingId;
  double? _openProgress;

  @override
  void initState() {
    super.initState();
    _loadFirstPage();
  }

  // ---------------- 列表 ----------------

  Future<void> _loadFirstPage() async {
    setState(() {
      _loading = true;
      _error = null;
    });
    try {
      final page = await ref.read(photoApiProvider).list(page: 1, size: _pageSize);
      if (!mounted) return;
      setState(() {
        _photos
          ..clear()
          ..addAll(page.items);
        _total = page.total;
        _page = 1;
        _hasMore = page.hasMore;
        _loading = false;
      });
    } on ApiException catch (e) {
      if (!mounted) return;
      setState(() {
        _loading = false;
        _error = e.message;
      });
    } catch (_) {
      if (!mounted) return;
      setState(() {
        _loading = false;
        _error = '照片加载失败';
      });
    }
  }

  Future<void> _loadMore() async {
    if (_loadingMore || !_hasMore) return;
    setState(() => _loadingMore = true);
    try {
      final next = _page + 1;
      final page = await ref.read(photoApiProvider).list(page: next, size: _pageSize);
      if (!mounted) return;
      setState(() {
        // 按 id 去重：翻页期间如果有新照片传上来，可能两页里都有
        final existing = _photos.map((p) => p.id).toSet();
        _photos.addAll(page.items.where((p) => !existing.contains(p.id)));
        _total = page.total;
        _page = next;
        _hasMore = page.hasMore;
        _loadingMore = false;
      });
    } catch (_) {
      if (!mounted) return;
      setState(() => _loadingMore = false);
    }
  }

  // ---------------- 选照片 ----------------

  /// 选图。**不传 imageQuality / maxWidth** —— 要的就是原图，
  /// 编辑页会在合成时按最长边 1920 缩放，原始文件则原样备份到服务器。
  Future<void> _pick(ImageSource source) async {
    try {
      final file = await ImagePicker().pickImage(source: source);
      if (file == null || !mounted) return;

      await Navigator.of(context).push(
        MaterialPageRoute(builder: (_) => WatermarkEditPage(imagePath: file.path)),
      );
      // 回来刷新一下：刚才那张已经传上去了，列表该多一张
      if (mounted) await _loadFirstPage();
    } catch (e) {
      if (mounted) showToast(context, '打开相机/相册失败：$e', error: true);
    }
  }

  /// 点一张老照片 → 下载原图 → 进编辑页重新打水印
  Future<void> _openPhoto(PhotoItem photo) async {
    if (_openingId != null) return;
    setState(() {
      _openingId = photo.id;
      _openProgress = null;
    });

    try {
      final path = await ref.read(photoApiProvider).downloadOriginal(
            photo.url,
            onProgress: (received, total) {
              if (!mounted || total <= 0) return;
              setState(() => _openProgress = received / total);
            },
          );
      if (!mounted) return;
      setState(() {
        _openingId = null;
        _openProgress = null;
      });

      await Navigator.of(context).push(
        MaterialPageRoute(
          builder: (_) => WatermarkEditPage(
            imagePath: path,
            // 服务器上已经有这张原图了，别再传一遍
            uploadOriginal: false,
            // 用拍摄当时的地点天气，而不是你现在站的地方
            initialData: photo.toWatermarkData(),
          ),
        ),
      );
    } on ApiException catch (e) {
      if (!mounted) return;
      setState(() {
        _openingId = null;
        _openProgress = null;
      });
      showToast(context, e.message, error: true);
    } catch (_) {
      if (!mounted) return;
      setState(() {
        _openingId = null;
        _openProgress = null;
      });
      showToast(context, '原图下载失败，请重试', error: true);
    }
  }

  // ---------------- 构建 ----------------

  @override
  Widget build(BuildContext context) {
    final settings = ref.watch(watermarkSettingsProvider);

    return Scaffold(
      appBar: AppBar(
        title: const Text('水印相机'),
        actions: [
          IconButton(
            tooltip: '水印设置',
            icon: const Icon(Icons.tune),
            onPressed: () => showWatermarkSettingsSheet(context),
          ),
        ],
      ),
      body: Stack(
        children: [
          ListView(
            padding: const EdgeInsets.fromLTRB(16, 16, 16, 24),
            children: [
              _introCard(),
              const SizedBox(height: 20),
              _captureButton(
                icon: Icons.camera_alt,
                label: '拍照',
                primary: true,
                onTap: () => _pick(ImageSource.camera),
              ),
              const SizedBox(height: 12),
              _captureButton(
                icon: Icons.photo_library_outlined,
                label: '从相册选',
                primary: false,
                onTap: () => _pick(ImageSource.gallery),
              ),
              const SizedBox(height: 24),
              _settingsCard(context, settings),
              const SizedBox(height: 24),
              _recentSection(),
            ],
          ),
          if (_openingId != null) _downloadOverlay(),
        ],
      ),
    );
  }

  Widget _introCard() {
    return Container(
      padding: const EdgeInsets.all(18),
      decoration: BoxDecoration(
        gradient: const LinearGradient(
          begin: Alignment.topLeft,
          end: Alignment.bottomRight,
          colors: [Color(0xFFFFE5CC), Color(0xFFFFD4A8)],
        ),
        borderRadius: BorderRadius.circular(16),
      ),
      child: const Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '拍一张，自动加水印',
            style: TextStyle(
              fontSize: 17,
              fontWeight: FontWeight.bold,
              color: Color(0xFF5D4037),
            ),
          ),
          SizedBox(height: 6),
          Text(
            '时间、地点、天气自动填好，可以拖动位置、换颜色。\n'
            '加好水印的照片直接存进手机相册；原图会同时备份到服务器。',
            style: TextStyle(fontSize: 12.5, height: 1.6, color: Color(0xFF8D6E63)),
          ),
        ],
      ),
    );
  }

  Widget _captureButton({
    required IconData icon,
    required String label,
    required bool primary,
    required VoidCallback onTap,
  }) {
    return FilledButton.icon(
      onPressed: onTap,
      style: FilledButton.styleFrom(
        backgroundColor: primary ? const Color(0xFFC8956E) : Colors.white,
        foregroundColor: primary ? Colors.white : const Color(0xFFC8956E),
        minimumSize: const Size.fromHeight(52),
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(26),
          side: primary ? BorderSide.none : const BorderSide(color: Color(0xFFC8956E)),
        ),
        elevation: 0,
      ),
      icon: Icon(icon, size: 20),
      label: Text(
        label,
        style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
      ),
    );
  }

  Widget _settingsCard(BuildContext context, WatermarkSettings settings) {
    final items = <String>[
      if (settings.showTime) '时间',
      if (settings.showAddress) '地点',
      if (settings.showWeather) '天气',
      if (settings.showRemark) '备注',
      if (settings.showBrand) '品牌角标',
    ];

    return InkWell(
      onTap: () => showWatermarkSettingsSheet(context),
      borderRadius: BorderRadius.circular(16),
      child: Container(
        padding: const EdgeInsets.fromLTRB(18, 16, 14, 16),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(16),
        ),
        child: Row(
          children: [
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  const Text(
                    '当前水印内容',
                    style: TextStyle(
                      fontSize: 14,
                      fontWeight: FontWeight.w600,
                      color: Color(0xFF5D4037),
                    ),
                  ),
                  const SizedBox(height: 8),
                  if (items.isEmpty)
                    const Text(
                      '全部关闭（照片不会加任何水印）',
                      style: TextStyle(fontSize: 12, color: Color(0xFFBCAAA4)),
                    )
                  else
                    Wrap(
                      spacing: 6,
                      runSpacing: 6,
                      children: items
                          .map(
                            (t) => Container(
                              padding: const EdgeInsets.symmetric(
                                horizontal: 10,
                                vertical: 4,
                              ),
                              decoration: BoxDecoration(
                                color: const Color(0xFFFFF3E6),
                                borderRadius: BorderRadius.circular(10),
                              ),
                              child: Text(
                                t,
                                style: const TextStyle(
                                  fontSize: 12,
                                  color: Color(0xFF8D6E63),
                                ),
                              ),
                            ),
                          )
                          .toList(),
                    ),
                ],
              ),
            ),
            const Icon(Icons.chevron_right, color: Color(0xFFBCAAA4)),
          ],
        ),
      ),
    );
  }

  /// 已上传照片的网格 —— 点一张就能重新打水印（换颜色/位置/补备注）
  Widget _recentSection() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            const Text(
              '最近拍摄',
              style: TextStyle(
                fontSize: 14,
                fontWeight: FontWeight.w600,
                color: Color(0xFF5D4037),
              ),
            ),
            const Spacer(),
            if (_total > 0)
              Text(
                '共 $_total 张',
                style: const TextStyle(fontSize: 12, color: Color(0xFFBCAAA4)),
              ),
          ],
        ),
        const SizedBox(height: 4),
        const Text(
          '点一张可以重新加水印（原图没带水印，随便改）',
          style: TextStyle(fontSize: 11.5, color: Color(0xFFBCAAA4)),
        ),
        const SizedBox(height: 12),
        _recentBody(),
      ],
    );
  }

  Widget _recentBody() {
    if (_loading) {
      return const Padding(
        padding: EdgeInsets.symmetric(vertical: 36),
        child: Center(
          child: SizedBox(
            width: 22,
            height: 22,
            child: CircularProgressIndicator(strokeWidth: 2),
          ),
        ),
      );
    }

    if (_error != null) {
      return Container(
        width: double.infinity,
        padding: const EdgeInsets.symmetric(vertical: 22, horizontal: 16),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(14),
        ),
        child: Column(
          children: [
            Text(
              _error!,
              textAlign: TextAlign.center,
              style: const TextStyle(fontSize: 12.5, color: Color(0xFFE53935)),
            ),
            const SizedBox(height: 10),
            TextButton(
              onPressed: _loadFirstPage,
              child: const Text(
                '重试',
                style: TextStyle(fontSize: 13, color: Color(0xFFC8956E)),
              ),
            ),
          ],
        ),
      );
    }

    if (_photos.isEmpty) {
      return Container(
        width: double.infinity,
        padding: const EdgeInsets.symmetric(vertical: 28, horizontal: 16),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(14),
        ),
        child: const Text(
          '还没拍过。拍一张试试，原图会自动存到服务器',
          textAlign: TextAlign.center,
          style: TextStyle(fontSize: 12.5, color: Color(0xFFBCAAA4)),
        ),
      );
    }

    return Column(
      children: [
        GridView.builder(
          shrinkWrap: true,
          physics: const NeverScrollableScrollPhysics(),
          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 3,
            crossAxisSpacing: 8,
            mainAxisSpacing: 8,
          ),
          itemCount: _photos.length,
          itemBuilder: (context, i) => _photoTile(_photos[i]),
        ),
        if (_hasMore)
          Padding(
            padding: const EdgeInsets.only(top: 14),
            child: TextButton(
              onPressed: _loadingMore ? null : _loadMore,
              child: _loadingMore
                  ? const SizedBox(
                      width: 16,
                      height: 16,
                      child: CircularProgressIndicator(strokeWidth: 2),
                    )
                  : const Text(
                      '加载更多',
                      style: TextStyle(fontSize: 13, color: Color(0xFFC8956E)),
                    ),
            ),
          ),
      ],
    );
  }

  Widget _photoTile(PhotoItem photo) {
    // 缩略图没生成出来时退回原图（慢，但总比空着好）
    final url = resolveAssetUrl(photo.thumbUrl ?? photo.url);

    return GestureDetector(
      onTap: () => _openPhoto(photo),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(10),
        child: Container(
          color: const Color(0xFFF0EAE4),
          child: Image.network(
            url,
            fit: BoxFit.cover,
            // 缩略图本来就只有 400 宽，这里再限一次解码尺寸，省内存
            cacheWidth: 400,
            loadingBuilder: (context, child, progress) {
              if (progress == null) return child;
              return const Center(
                child: SizedBox(
                  width: 16,
                  height: 16,
                  child: CircularProgressIndicator(strokeWidth: 2),
                ),
              );
            },
            errorBuilder: (context, _, _) => const Center(
              child: Icon(Icons.broken_image_outlined, size: 20, color: Color(0xFFBCAAA4)),
            ),
          ),
        ),
      ),
    );
  }

  /// 下载原图时的遮罩。原图好几 MB，不提示的话用户会以为卡死了
  Widget _downloadOverlay() {
    final percent = _openProgress == null ? null : (_openProgress! * 100).round();

    return Positioned.fill(
      child: ColoredBox(
        color: const Color(0x99000000),
        child: Center(
          child: Container(
            padding: const EdgeInsets.symmetric(horizontal: 26, vertical: 22),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(14),
            ),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                const SizedBox(
                  width: 26,
                  height: 26,
                  child: CircularProgressIndicator(strokeWidth: 2.5),
                ),
                const SizedBox(height: 14),
                Text(
                  percent == null ? '正在下载原图…' : '正在下载原图… $percent%',
                  style: const TextStyle(fontSize: 13, color: Color(0xFF5D4037)),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}