import 'package:flutter/material.dart';
import 'package:test_sa/controllers/api_routes/urls.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/device/asset.dart';
import 'package:test_sa/views/widgets/item_views/info_text_widget.dart';

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

class AssetItemGridView extends StatelessWidget {
  final Asset device;
  final Function(Asset) onPressed;

  const AssetItemGridView({Key? key, required this.device, required this.onPressed}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        AspectRatio(
          aspectRatio: 159 / 94,
          child: Container(
            width: 95,
            height: 95,
            decoration: ShapeDecoration(
                color: context.isDark ? AppColor.neutral50 : AppColor.neutral30,
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
                image: DecorationImage(
                  fit: BoxFit.cover,
                  image: NetworkImage(device.assetPhoto != null ? URLs.getFileUrl(device.assetPhoto!)! : "https://www.lasteelcraft.com/images/no-image-available.png"),
                )),
          ),
        ),
        6.height,
        Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              device.modelDefinition!.assetName!.cleanupWhitespace.capitalizeFirstOfEach,
              maxLines: 2,
              overflow: TextOverflow.ellipsis,
              style: AppTextStyles.bodyText.copyWith(color: AppColor.textStyleColor(context)),
            ),
            if (context.userProvider.isEngineer && !(device.hasTrainingImageData ?? true)) ...[
              2.height,
              Text(
                '*Upload Images for this asset',
                style: AppTextStyles.tinyFont2.copyWith(color: AppColor.red30),
              ),
            ],
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisSize: MainAxisSize.min,
              children: [
                // "${context.translation.assetNumber} : ${device.assetNumber}".bodyText2(context),
                // "${context.translation.modelName} : ${device.modelDefinition!.modelName}".cleanupWhitespace.capitalizeFirstOfEach.bodyText2(context),
                // Text(
                //   "${context.translation.serialNo} : ${device.assetSerialNo}",
                //   maxLines: 2,
                //   overflow: TextOverflow.ellipsis,
                //   style: AppTextStyles.bodyText2.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20),
                // ).expanded,
                InfoTextWidget(label: context.translation.assetNumber, value: device.assetNumber),
                InfoTextWidget(label: context.translation.modelName, value: device.modelDefinition!.modelName),
                InfoTextWidget(label: context.translation.serialNo, value: device.assetSerialNo),
              ],
            ).expanded,
            Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text(
                  'View Details',
                  style: AppTextStyles.bodyText2.copyWith(color: AppColor.primary10),
                ),
                4.width,
                const Icon(Icons.arrow_forward, color: AppColor.primary10, size: 14)
              ],
            ),
          ],
        ).expanded
      ],
    ).onPress(() => onPressed(device)).toShadowContainer(context);
  }
}
