// Rögzített geometriák listája — pont, vonal, terület csoportosítva
// Minden elemnél: ikon, felirat, idő, pont szám, fotó/hang darabszám, törlés

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:intl/intl.dart';

import '../../enums/note_type.dart';
import '../../models/note_item.dart';
import '../../pages/map_survey/presentations/controllers/map_survey_controller.dart';
import '../../services/app_database.dart';
import '../../services/project_service.dart';

// ─── Összesített adatok egy elemhez ──────────────────────────────────────────

class _NoteRow {
  final NoteItem item;
  final int photoCount;
  final int audioCount;
  const _NoteRow(this.item, this.photoCount, this.audioCount);
}

// ─── Fő widget ────────────────────────────────────────────────────────────────

class NoteItemListSheet extends StatefulWidget {
  const NoteItemListSheet({super.key});

  @override
  State<NoteItemListSheet> createState() => _NoteItemListSheetState();
}

class _NoteItemListSheetState extends State<NoteItemListSheet> {
  List<_NoteRow> _points = [];
  List<_NoteRow> _lines = [];
  List<_NoteRow> _polygons = [];
  bool _loading = true;

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

  Future<void> _load() async {
    final projectId = ProjectService.to.activeProjectId;
    final items = await AppDatabase.instance.listNoteItems(projectId);

    final rows = await Future.wait(
      items.map((item) async {
        final photoCount = await AppDatabase.instance.countNotePhotos(item.id!);
        final audioCount = await AppDatabase.instance.countNoteAudios(item.id!);
        return _NoteRow(item, photoCount, audioCount);
      }),
    );

    if (!mounted) return;
    setState(() {
      _points = rows.where((r) => r.item.type == NoteType.point).toList();
      _lines = rows.where((r) => r.item.type == NoteType.line).toList();
      _polygons = rows.where((r) => r.item.type == NoteType.polygon).toList();
      _loading = false;
    });
  }

  Future<void> _delete(_NoteRow row) async {
    final ok = await Get.dialog<bool>(AlertDialog(
      title: const Text('Geometria törlése'),
      content: Text(
          '"${row.item.label.isEmpty ? _typeName(row.item.type) : row.item.label}" törlése visszavonhatatlan.'),
      actions: [
        TextButton(onPressed: Get.back, child: const Text('Mégse')),
        FilledButton(
          style: FilledButton.styleFrom(backgroundColor: Colors.red),
          onPressed: () => Get.back(result: true),
          child: const Text('Törlés'),
        ),
      ],
    ));
    if (ok != true) return;

    // Controller törli az adatbázisból + a térkép rétegről
    await Get.find<MapSurveyController>().deleteNoteItem(row.item);

    setState(() {
      _points.removeWhere((r) => r.item.id == row.item.id);
      _lines.removeWhere((r) => r.item.id == row.item.id);
      _polygons.removeWhere((r) => r.item.id == row.item.id);
    });
  }

  @override
  Widget build(BuildContext context) {
    final cs = Theme.of(context).colorScheme;
    final total = _points.length + _lines.length + _polygons.length;

    return Container(
      decoration: BoxDecoration(
        color: cs.surface,
        borderRadius: const BorderRadius.vertical(top: Radius.circular(16)),
        boxShadow: [
          BoxShadow(
              color: Colors.black.withOpacity(0.15),
              blurRadius: 16,
              offset: const Offset(0, -4)),
        ],
      ),
      child: Column(children: [
        // ── Handle ──────────────────────────────────────────────────
        Center(
          child: Container(
            margin: const EdgeInsets.symmetric(vertical: 10),
            width: 40,
            height: 4,
            decoration: BoxDecoration(
                color: Colors.grey.shade300,
                borderRadius: BorderRadius.circular(2)),
          ),
        ),

        // ── Fejléc ──────────────────────────────────────────────────
        Padding(
          padding: const EdgeInsets.fromLTRB(20, 0, 20, 10),
          child: Row(children: [
            const Icon(Icons.layers_outlined, size: 20),
            const SizedBox(width: 8),
            const Text('Rögzített geometriák',
                style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600)),
            const SizedBox(width: 6),
            if (!_loading)
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 7, vertical: 2),
                decoration: BoxDecoration(
                  color: cs.primaryContainer,
                  borderRadius: BorderRadius.circular(10),
                ),
                child: Text('$total',
                    style: TextStyle(
                        fontSize: 12,
                        fontWeight: FontWeight.w600,
                        color: cs.onPrimaryContainer)),
              ),
          ]),
        ),

        const Divider(height: 1),

        // ── Lista ────────────────────────────────────────────────────
        Expanded(
          child: _loading
              ? const Center(child: CircularProgressIndicator())
              : total == 0
                  ? _emptyState()
                  : ListView(
                      padding: const EdgeInsets.only(bottom: 24),
                      children: [
                        if (_points.isNotEmpty)
                          _Section(
                            icon: Icons.location_on,
                            color: Colors.orange,
                            title: 'Pontok',
                            rows: _points,
                            onDelete: _delete,
                          ),
                        if (_lines.isNotEmpty)
                          _Section(
                            icon: Icons.show_chart,
                            color: Colors.blue,
                            title: 'Vonalak',
                            rows: _lines,
                            onDelete: _delete,
                          ),
                        if (_polygons.isNotEmpty)
                          _Section(
                            icon: Icons.pentagon_outlined,
                            color: Colors.green,
                            title: 'Területek',
                            rows: _polygons,
                            onDelete: _delete,
                          ),
                      ],
                    ),
        ),

        SizedBox(height: MediaQuery.of(context).padding.bottom + 8),
      ]),
    );
  }

  Widget _emptyState() => Center(
        child: Column(mainAxisSize: MainAxisSize.min, children: [
          Icon(Icons.layers_clear_outlined,
              size: 56, color: Colors.grey.shade300),
          const SizedBox(height: 12),
          Text('Még nincs rögzített geometria',
              style: TextStyle(color: Colors.grey.shade500)),
        ]),
      );

  String _typeName(NoteType t) => switch (t) {
        NoteType.point => 'Pont',
        NoteType.line => 'Vonal',
        NoteType.polygon => 'Terület',
      };
}

// ─── Szekció (típusonként) ────────────────────────────────────────────────────

class _Section extends StatelessWidget {
  final IconData icon;
  final Color color;
  final String title;
  final List<_NoteRow> rows;
  final Future<void> Function(_NoteRow) onDelete;

  const _Section({
    required this.icon,
    required this.color,
    required this.title,
    required this.rows,
    required this.onDelete,
  });

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

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // Szekció fejléc
        Padding(
          padding: const EdgeInsets.fromLTRB(16, 14, 16, 6),
          child: Row(children: [
            Icon(icon, size: 16, color: color),
            const SizedBox(width: 6),
            Text(title,
                style: TextStyle(
                    fontSize: 12,
                    fontWeight: FontWeight.w700,
                    color: color,
                    letterSpacing: 0.5)),
            const SizedBox(width: 6),
            Container(
              padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 1),
              decoration: BoxDecoration(
                color: color.withOpacity(0.12),
                borderRadius: BorderRadius.circular(8),
              ),
              child: Text('${rows.length}',
                  style: TextStyle(
                      fontSize: 11, fontWeight: FontWeight.w600, color: color)),
            ),
          ]),
        ),

        // Elemek
        ...rows.map((row) => _NoteItemTile(
              row: row,
              typeIcon: icon,
              typeColor: color,
              onDelete: () => onDelete(row),
            )),

        Divider(height: 1, color: cs.outlineVariant),
      ],
    );
  }
}

// ─── Egy sor ──────────────────────────────────────────────────────────────────

class _NoteItemTile extends StatelessWidget {
  final _NoteRow row;
  final IconData typeIcon;
  final Color typeColor;
  final VoidCallback onDelete;

  static final _timeFmt = DateFormat('MM.dd HH:mm');

  const _NoteItemTile({
    required this.row,
    required this.typeIcon,
    required this.typeColor,
    required this.onDelete,
  });

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

    return Dismissible(
      key: ValueKey(item.id),
      direction: DismissDirection.endToStart,
      confirmDismiss: (_) async {
        onDelete();
        return false;
      },
      background: Container(
        color: Colors.red,
        alignment: Alignment.centerRight,
        padding: const EdgeInsets.only(right: 20),
        child: const Icon(Icons.delete, color: Colors.white),
      ),
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10),
        child: Row(children: [
          // Geometria szín jelző
          Container(
            width: 28,
            height: 28,
            decoration: BoxDecoration(
              color: item.color.withOpacity(0.15),
              borderRadius: BorderRadius.circular(6),
              border: Border.all(color: item.color.withOpacity(0.4)),
            ),
            child: Icon(typeIcon, size: 15, color: item.color),
          ),

          const SizedBox(width: 10),

          // Fő tartalom
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisSize: MainAxisSize.min,
              children: [
                // Felirat / cím
                Text(
                  item.label.isNotEmpty ? item.label : '(nincs felirat)',
                  style: TextStyle(
                    fontSize: 14,
                    fontWeight: FontWeight.w600,
                    color: item.label.isEmpty ? cs.onSurfaceVariant : null,
                    fontStyle: item.label.isEmpty ? FontStyle.italic : null,
                  ),
                  overflow: TextOverflow.ellipsis,
                ),
                const SizedBox(height: 3),
                // Metaadatok sor
                Row(children: [
                  // Idő
                  Text(
                    _timeFmt.format(item.createdAt),
                    style: TextStyle(fontSize: 11, color: cs.onSurfaceVariant),
                  ),
                  // Pont/töréspontok száma (vonal/terület esetén)
                  if (item.type != NoteType.point) ...[
                    const SizedBox(width: 8),
                    _MetaChip(
                      icon: Icons.radio_button_unchecked,
                      label: '${item.points.length} pt',
                    ),
                  ],
                  // Fotók
                  if (row.photoCount > 0) ...[
                    const SizedBox(width: 6),
                    _MetaChip(
                      icon: Icons.photo_camera_outlined,
                      label: '${row.photoCount}',
                      color: Colors.blue.shade600,
                    ),
                  ],
                  // Hang
                  if (row.audioCount > 0) ...[
                    const SizedBox(width: 6),
                    _MetaChip(
                      icon: Icons.mic_outlined,
                      label: '${row.audioCount}',
                      color: Colors.purple.shade400,
                    ),
                  ],
                ]),
              ],
            ),
          ),

          // Törlés gomb
          IconButton(
            icon: Icon(Icons.delete_outline,
                size: 20, color: Colors.grey.shade400),
            onPressed: onDelete,
            padding: EdgeInsets.zero,
            constraints: const BoxConstraints(minWidth: 36, minHeight: 36),
          ),
        ]),
      ),
    );
  }
}

// ─── Meta chip (pont szám, fotó, hang) ───────────────────────────────────────

class _MetaChip extends StatelessWidget {
  final IconData icon;
  final String label;
  final Color? color;
  const _MetaChip({
    required this.icon,
    required this.label,
    this.color,
  });

  @override
  Widget build(BuildContext context) {
    final c = color ?? Theme.of(context).colorScheme.onSurfaceVariant;
    return Row(mainAxisSize: MainAxisSize.min, children: [
      Icon(icon, size: 11, color: c),
      const SizedBox(width: 2),
      Text(label,
          style:
              TextStyle(fontSize: 11, color: c, fontWeight: FontWeight.w500)),
    ]);
  }
}
