import 'package:fis_jsonrpc/rpc.dart';
import 'package:fis_lib_report/converts/event_type.dart';
import 'package:fis_theme/theme.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/interface/interactive_container.dart';
import 'package:flutter/material.dart';
import 'package:flyinsono/pages/remedical/report/report_edit/widgets/quick_preview_plugin.dart';
import 'package:flyinsono/pages/user/user_device/index.dart';

///单张云端图像
class CloudImageItem extends FStatefulWidget implements FInteractiveContainer {
  final int index;
  final double? imageWidth;
  final RemedicalInfoDTO imageInfo;

  /// 图片双击事件
  final VoidCallback? onDoubleTap;

  /// 图片单机事件
  final VoidCallback? onTap;

  ///描述
  final String? description;

  ///边框颜色
  final bool? isSelected;

  ///选中图像选择框时事件通知
  final FEventHandler<List<String>>? onSelectedInputChange;

  final bool isShowQuickPreviewPlugin;

  CloudImageItem(
    this.index,
    this.imageInfo, {
    this.imageWidth,
    this.onTap,
    this.description,
    this.onDoubleTap,
    this.isSelected = false,
    this.isShowQuickPreviewPlugin = true,
    this.onSelectedInputChange,
  });

  @override
  FState<FStatefulWidget> createState() {
    return CloudImageItemState();
  }

  @override
  String get pageName => "CloudImageItem";
}

class CloudImageItemState extends FState<CloudImageItem> {
  Color? _borderColor;
  bool _isSelected = false;

  @override
  void initState() {
    super.initState();
    _isSelected = widget.isSelected ?? false;
    if (_isSelected) {
      _borderColor = FTheme.ins.colorScheme.primary;
    } else {
      _borderColor = Colors.transparent;
    }
    widget.onSelectedInputChange?.addListener(_onSelectedImagesChange);
  }

  @override
  void didUpdateWidget(CloudImageItem oldWidget) {
    if (widget.isSelected != _isSelected) {
      _isSelected = widget.isSelected ?? false;
    }
    if (_isSelected) {
      setState(() {
        _borderColor = FTheme.ins.colorScheme.primary;
      });
    } else {
      setState(() {
        _borderColor = Colors.transparent;
      });
    }
    super.didUpdateWidget(oldWidget);
  }

  @override
  void dispose() {
    super.dispose();
    widget.onSelectedInputChange?.removeListener(_onSelectedImagesChange);
  }

  @override
  FWidget build(BuildContext context) {
    final index = widget.index;
    final terminalImage = widget.imageInfo.terminalImages ?? TerminalImageDTO();
    return FMouseRegion(
      cursor: SystemMouseCursors.click,
      child: FContainer(
        width: widget.imageWidth,
        decoration: BoxDecoration(
          border: Border.all(
            width: 4,
            color: _borderColor ?? Colors.transparent,
          ),
          color: Colors.black,
        ),
        margin: const EdgeInsets.all(2),
        child: FStack(
          children: [
            FCenter(
              child: FContainer(
                child: FContentImage(
                  remedicalInfo: widget.imageInfo,
                  onTap: () {
                    if (widget.onTap != null) {
                      widget.onTap!.call();
                      if (_borderColor == FTheme.ins.colorScheme.primary) {
                        setState(() {
                          _borderColor = Colors.transparent;
                        });
                      } else {
                        setState(() {
                          _borderColor = FTheme.ins.colorScheme.primary;
                        });
                      }
                    }
                  },
                  onDoubleTap: widget.onDoubleTap,
                  serialNo: index + 1,
                  description: widget.description,
                  isQualityControlled: widget.imageInfo.isQualityControlled,
                ),
              ),
            ),
            if (widget.isShowQuickPreviewPlugin) ...[
              FPositioned(
                right: 10,
                top: 5,
                child: FQuickPreviewPlugin(
                  imageUrl: terminalImage.coverImageUrl ?? '',
                  vidUrl: terminalImage.imageUrl ?? '',
                  child: FIcon(
                    Icons.zoom_in,
                    color: Colors.white,
                    size: 32,
                  ),
                ),
              ),
            ],
          ],
        ),
      ),
    );
  }

  void _onSelectedImagesChange(Object sender, List<String> e) {
    var coverImage = widget.imageInfo.terminalImages?.coverImageUrl;
    if (e.contains(coverImage)) {
      setState(() {
        _borderColor = FTheme.ins.colorScheme.primary;
      });
    } else {
      setState(() {
        _borderColor = Colors.transparent;
      });
    }
  }
}
