import 'package:fis_i18n/i18n.dart';
import 'package:fis_jsonrpc/services/liveConsultation.m.dart';
import 'package:fis_lib_business_components/components/consultation_picture_component.dart';
import 'package:fis_ui/base_define/page.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/values/font_sizes.dart';
import 'package:fis_ui/values/spacings.dart';
import 'package:flutter/material.dart';
import 'package:flyinsono/architecture/define.dart';
import 'package:flyinsono/architecture/router/router.dart';
import 'package:flyinsono/pages/consultation/controller.dart';
import 'package:flyinsono/pages/remedical/consultation/widgets/measure_image.dart';
import 'package:flyinsono/pages/remedical/report/report_edit/widgets/cloud_image_item.dart';
import 'package:get/get.dart';
import 'package:intl/intl.dart';

import 'light_title.dart';

class ConsultationImagesView extends FisView<MobileConsultationController>
    implements FPage {
  final ScrollController _listViewController = ScrollController();
  int _index = 0;

  @override
  String get pageName => "ConsultationImagesView";
  @override
  FWidget build(BuildContext context) {
    return FScaffold(
      appBar: FAppBar.simple(
        title: i18nBook.realTimeConsultation.consultationImage.t,
        onBackClicked: () {
          router.back();
        },
      ),
      body: _buildConsultationImagesView(),
    );
  }

  FWidget _buildCloudImags(List<RemedicalInfoDTO> coloudImags) {
    return FGridView.builder(
      controller: _listViewController,
      padding: EdgeInsets.symmetric(horizontal: 10),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
      ),
      itemCount: coloudImags.length,
      shrinkWrap: true,
      itemBuilder: ((context, index) {
        var imageInfo = coloudImags[index];
        var image = CloudImageItem(
          _index,
          imageInfo,
          isShowQuickPreviewPlugin: false,
          onTap: () {
            controller.onTapCloudImage(imageInfo);
          },
          onDoubleTap: () {
            controller.onTapCloudImage(imageInfo);
          },
        );
        _index++;
        return image;
      }),
    );
  }

  FWidget _buildConsultationImagesView() {
    List<FWidget> children = [];
    for (var imageInfos in controller.state.currentConsultationImages) {
      var imageDate = imageInfos.imageDate ?? DateTime.now();
      var consultationImages = imageInfos.screenshotList ?? [];
      var coloudImags = imageInfos.ultrasoundImageList ?? [];
      var measureImags = imageInfos.measurementImageList ?? [];
      children.add(
        FColumn(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            FContainer(
              margin: EdgeInsets.only(left: FSpacings.XXL, top: FSpacings.L),
              child: FText(
                DateFormat("yyyy-MM-dd").format(imageDate),
                style: TextStyle(
                  fontSize: FFontSizes.H5,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            const FSizedBox(height: FSpacings.M),
            if (consultationImages.isNotEmpty) ...[
              LightTitle(i18nBook.realTimeConsultation.consultationImage.t),
              _buildScreenshotImages(consultationImages),
            ],
            if (coloudImags.isNotEmpty) ...[
              LightTitle(i18nBook.remedical.cloudImage.t),
              _buildCloudImags(coloudImags),
            ],
            if (measureImags.isNotEmpty) ...[
              LightTitle(i18nBook.measure.measureImage.t),
              _buildMeasureImags(measureImags),
            ],
          ],
        ),
      );
    }
    return FListView(
      shrinkWrap: true,
      controller: _listViewController,
      children: children,
    );
  }

  FWidget _buildMeasureImags(List<RemedicalMeasuredInfoDTO> imags) {
    return FGridView.builder(
      padding: EdgeInsets.symmetric(horizontal: 20),
      controller: _listViewController,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisSpacing: 10,
        crossAxisCount: 2,
      ),
      itemCount: imags.length,
      shrinkWrap: true,
      itemBuilder: ((context, index) {
        var imageInfo = imags[index];
        // final image = MeasureImage(imageInfo.measuredFileToken ?? '');
        final image = FContainer(
          color: Colors.black,
          margin: EdgeInsets.symmetric(vertical: 10),
          child: FStack(
            children: [
              FPositioned(
                top: 0,
                left: 0,
                bottom: 0,
                right: 0,
                child: FGestureDetector(
                  name: "MeasureImage:${imageInfo.measuredFileToken}",
                  businessParent: this,
                  onTap: () {
                    Get.to(
                        () => MeasureImage(imageInfo.measuredFileToken ?? ''));
                  },
                  onDoubleTap: () {
                    Get.to(
                        () => MeasureImage(imageInfo.measuredFileToken ?? ''));
                  },
                  child: FImage.network(
                    imageInfo.measuredFileToken ?? '',
                    fit: BoxFit.fitWidth,
                  ),
                ),
              ),
              FPositioned(
                left: 5,
                top: 5,
                child: FText(
                  _index.toString(),
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ],
          ),
        );

        _index++;
        return image;
      }),
    );
  }

  FWidget _buildScreenshotImages(List<ConsultationFileDTO> consultationImages) {
    return FGridView.builder(
      padding: EdgeInsets.symmetric(horizontal: 20),
      controller: _listViewController,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisSpacing: 20,
        crossAxisCount: 2,
        mainAxisSpacing: 20,
      ),
      itemCount: consultationImages.length,
      shrinkWrap: true,
      itemBuilder: ((context, index) {
        var imageInfo = consultationImages[index];
        final image = FConsultationContentImage(
          consultationFileInfo: imageInfo,
          onDoubleTap: () {
            controller.onTapConsultationImage(imageInfo);
          },
          onTap: () {
            controller.onTapConsultationImage(imageInfo);
          },
          serialNo: _index + 1,
          description:
              " ${i18nBook.realTimeConsultation.uploader.t} ${imageInfo.creatorName!} ",
        );
        _index++;
        return image;
      }),
    );
  }
}
