import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/api_routes/urls.dart';
import 'package:test_sa/controllers/providers/api/devices_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/string_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/helper/utils.dart';
import 'package:test_sa/models/device/asset_by_id_model.dart';
import 'package:test_sa/models/generic_attachment_model.dart';
import 'package:test_sa/modules/cm_module/views/components/action_button/footer_action_button.dart';
import 'package:test_sa/new_views/common_widgets/app_filled_button.dart';
import 'package:test_sa/new_views/common_widgets/default_app_bar.dart';
import 'package:test_sa/views/widgets/equipment/asset_image_upload_page.dart';
import 'package:test_sa/views/widgets/images/files_list.dart';
import 'package:test_sa/views/widgets/images/multi_image_picker.dart';
import 'package:test_sa/views/widgets/loaders/app_loading.dart';
import 'package:test_sa/views/widgets/loaders/failed_loading.dart';

import '../../../new_views/app_style/app_color.dart';
import '../requests/request_status.dart';

class AssetDetailPage extends StatefulWidget {
  static const String id = "/asset-details";

  const AssetDetailPage({Key? key}) : super(key: key);

  @override
  _AssetDetailPageState createState() {
    return _AssetDetailPageState();
  }
}

class _AssetDetailPageState extends State<AssetDetailPage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }

  int? assetId;
  AssetProvider? _assetProvider;
  AssetByIdModel? assetModel;

  List<GenericAttachmentModel> attachments = [];

  @override
  Widget build(BuildContext context) {
    assetId ??= ModalRoute.of(context)?.settings.arguments as int;
    _assetProvider ??= Provider.of<AssetProvider>(context, listen: false);
    _assetProvider?.stateCode = null;
    return Scaffold(
      appBar: DefaultAppBar(title: context.translation.assetDetails),
      body: FutureBuilder<AssetByIdModel>(
        future: assetModel == null ? _assetProvider!.getAssetById(assetId!, context.translation) : null,
        builder: (BuildContext context, AsyncSnapshot<AssetByIdModel> snapshot) {
          if (snapshot.hasError) {
            return FailedLoading(
              message: snapshot.error.toString(),
              onReload: () {
                setState(() {});
              },
            );
          }
          if (snapshot.connectionState == ConnectionState.waiting) {
            return const Center(child: ALoading());
          } else if (snapshot.hasData) {}
          if (snapshot.hasData) {
            assetModel = snapshot.data!;
            attachments = assetModel?.assetAttachments
                    ?.map((attachment) => GenericAttachmentModel(
                          id: attachment.id,
                          name: attachment.attachmentName,
                          originalName: attachment.originalName,
                        ))
                    .toList() ??
                [];
            return Column(
              children: [
                ListView(padding: const EdgeInsets.all(16), children: [
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      AspectRatio(
                        aspectRatio: 159 / 94,
                        child: Container(
                          width: 95,
                          height: 95,
                          decoration: ShapeDecoration(
                              color: AppColor.neutral30,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(10),
                              ),
                              image: DecorationImage(
                                fit: BoxFit.cover,
                                image: NetworkImage(assetModel?.assetPhoto != null ? URLs.getFileUrl(assetModel!.assetPhoto!)! : "https://www.lasteelcraft.com/images/no-image-available.png"),
                              )),
                        ),
                      ),
                      6.height,
                      Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          if (assetModel?.commissioningStatus != null)
                            StatusLabel(
                              label: assetModel!.commissioningStatus!.name,
                              textColor: AppColor.getRequestStatusTextColorByName(context, assetModel!.commissioningStatus!.name!),
                              backgroundColor: AppColor.getRequestStatusColorByName(context, assetModel!.commissioningStatus!.name!),
                            ),
                          if (assetModel?.commissioningStatus != null) 8.height,
                          (assetModel?.modelDefinition?.assetName?.cleanupWhitespace.capitalizeFirstOfEach ?? "-").heading5(context),
                          8.height,
                          if (context.userProvider.isEngineer && !(assetModel!.hasTrainingImageData ?? true)) ...[
                            Text(
                              '*Upload Images for this asset',
                              style: AppTextStyles.bodyText2.copyWith(color: AppColor.red30),
                            ),
                            4.height,
                          ],
                          Row(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  "${context.translation.assetNo}: ${assetModel!.multiAssets!.first.assetNumber}".bodyText(context),
                                  "${context.translation.modelName}: ${assetModel!.modelDefinition!.modelName}".bodyText(context),
                                  "${context.translation.supplier}: ${assetModel!.supplier?.suppliername ?? "-"}".bodyText(context),
                                  "${context.translation.manufacture}: ${assetModel!.modelDefinition!.manufacturerName}".bodyText(context),
                                  //"${context.translation.location}: ${assetModel.site.custName?.cleanupWhitespace?.capitalizeFirstOfEach}".bodyText(context),
                                ],
                              ).expanded,
                              8.width,
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  /// TODO: theres no [ORACLE CODE] available to preview
                                  // "${context.translation.oracleCode}: ${"-"}".bodyText(context),
                                  "${context.translation.snNo}: ${assetModel!.multiAssets!.first.assetSerialNo}".bodyText(context),
                                  "${context.translation.site}: ${assetModel!.site?.custName?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"}".bodyText(context),
                                  "${context.translation.building}: ${assetModel!.building?.name?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"}".bodyText(context),
                                  "${context.translation.floor}: ${assetModel!.floor?.name?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"}".bodyText(context),
                                  "${context.translation.md}: ${assetModel!.department?.departmentName?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"}".bodyText(context),
                                  "${context.translation.room}: ${assetModel!.room?.name?.cleanupWhitespace.capitalizeFirstOfEach ?? "-"}".bodyText(context),
                                ],
                              ).expanded,
                            ],
                          ),
                          8.height,
                          const Divider(color: AppColor.neutral30, height: 1, thickness: 1),
                          8.height,
                          "${context.translation.installationDate}: ${assetModel!.installationDate?.toAssetDetailsFormat ?? "-"}".bodyText(context),
                          "${context.translation.nextPmDate}: ${assetModel!.nextPMDate?.toAssetDetailsFormat ?? "-"}".bodyText(context),
                          "${context.translation.lastPmDate}: ${assetModel!.lastPMDate?.toAssetDetailsFormat ?? "-"}".bodyText(context),
                          if ((assetModel?.modelDefinition?.assetDescription ?? "").isNotEmpty) ...[
                            8.height,
                            const Divider(color: AppColor.neutral30, height: 1, thickness: 1),
                            8.height,
                            assetModel!.modelDefinition!.assetDescription!.bodyText(context),
                          ],
                          FilesList(images: attachments.map((toElement) => URLs.getFileUrl(toElement.name!) ?? '').toList()),
                        ],
                      )
                    ],
                  ).toShadowContainer(context),
                ]).expanded,
                if (context.userProvider.isEngineer && !(assetModel!.hasTrainingImageData ?? true))
                  FooterActionButton.footerContainer(
                    context: context,
                    child: AppFilledButton(
                      buttonColor: AppColor.primary10,
                      label: "Upload Images",
                      onPressed: _upload,
                    ),
                  ),
              ],
            );
          }
          return const Center(child: ALoading());
        },
      ),
    );
  }

  void _upload() async {
    bool reload = await Navigator.push(context, MaterialPageRoute(builder: (context) => AssetImageUploadPage(assetId: assetId!))) ?? false;
    if (reload) {
      assetModel = null;
      setState(() {});
    }
  }
}