import 'package:flutter/material.dart';
import 'package:provider/provider.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/models/device/asset_by_id_model.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/common_widgets/default_app_bar.dart';
import 'package:test_sa/views/widgets/equipment/asset_details_view.dart';
import 'package:test_sa/views/widgets/equipment/asset_document_history_view.dart';
import 'package:test_sa/views/widgets/equipment/asset_image_upload_page.dart';
import 'package:test_sa/views/widgets/loaders/app_loading.dart';
import 'package:test_sa/views/widgets/loaders/failed_loading.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> {
  int? assetId;
  AssetProvider? _assetProvider;
  AssetByIdModel? assetModel;

  @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!;
            return DefaultTabController(
              length: 2,
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Container(
                    margin: EdgeInsets.only(left: 16.toScreenWidth, right: 16.toScreenWidth, top: 12.toScreenHeight),
                    decoration: BoxDecoration(
                      color: AppColor.tabBarBackground(context),
                      border: Border.all(color: AppColor.tabBarBorder(context)),
                      borderRadius: BorderRadius.circular(20),
                    ),
                    child: TabBar(
                      padding: EdgeInsets.symmetric(vertical: 6.toScreenHeight, horizontal: 6.toScreenWidth),
                      labelColor: context.isDark ? AppColor.neutral30 : AppColor.black20,
                      unselectedLabelColor: context.isDark ? AppColor.neutral30 : AppColor.black20,
                      unselectedLabelStyle: AppTextStyles.bodyText,
                      labelStyle: AppTextStyles.bodyText,
                      indicatorPadding: EdgeInsets.zero,
                      indicatorSize: TabBarIndicatorSize.tab,
                      dividerColor: Colors.transparent,
                      overlayColor: WidgetStateProperty.all(Colors.transparent),
                      indicator: BoxDecoration(
                          color: AppColor.background(context),
                          borderRadius: BorderRadius.circular(15),
                          boxShadow: [BoxShadow(color: Colors.black.withValues(alpha: 0.03), blurRadius: 5, offset: const Offset(0, 0), spreadRadius: 0)]),
                      onTap: (index) {
                        // setState(() {});
                      },
                      tabs: [
                        Tab(text: context.translation.assetDetails, height: 57.toScreenHeight),
                        Tab(text: 'Document history'.addTranslation, height: 57.toScreenHeight),
                      ],
                    ),
                  ),
                  12.height,
                  TabBarView(
                    children: [
                      AssetDetailsView(assetModel: assetModel!, onUpload: _upload),
                      const AssetDocumentHistoryView(),
                    ],
                  ).expanded,
                ],
              ),
            );
          }
          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(() {});
    }
  }
}
