import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/constants/assets.dart';
import 'package:tm_app/core/theme/colors.dart';
import 'package:tm_app/core/utils/size_config.dart';
import 'package:tm_app/view_models/tenders_view_model.dart';
import 'package:tm_app/views/shared/base_button.dart';
import 'package:tm_app/views/shared/desktop_navigation_widget.dart';
import 'package:tm_app/views/tenders/widgets/main_tenders_slider.dart';

import '../../../core/constants/common_strings.dart';
import '../../../core/utils/app_toast.dart';

class DesktopTendersPage extends StatefulWidget {
  const DesktopTendersPage({super.key});

  @override
  State<DesktopTendersPage> createState() => _DesktopTendersPageState();
}

class _DesktopTendersPageState extends State<DesktopTendersPage> {
  late final TendersViewModel viewModel;
  @override
  void initState() {
    super.initState();
    viewModel = context.read<TendersViewModel>();
    viewModel.addListener(_viewModelListener);
  }

  void _viewModelListener() {
    if (viewModel.feedbackErrorMessage != null) {
      AppToast.error(context, viewModel.feedbackErrorMessage!);
    }
    if (viewModel.tenderApprovalErrorMessage != null) {
      AppToast.error(context, viewModel.tenderApprovalErrorMessage!);
    }
  }

  @override
  void dispose() {
    viewModel.removeListener(_viewModelListener);
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.backgroundColor,
      body: Column(
        children: [
          const DesktopNavigationWidget(
            currentIndex: 1, // Tenders index
          ),

          SizedBox(height: 48.0.h()),
          //search box
          SizedBox(
            height: 48.0.h(),
            width: 680,
            child: TextField(
              style: TextStyle(fontSize: 16.0.sp(), color: AppColors.grey0),
              decoration: InputDecoration(
                hintText: 'Search',
                hintStyle: TextStyle(
                  fontSize: 16.0.sp(),
                  color: AppColors.grey60,
                ),
                prefixIcon: Padding(
                  padding: EdgeInsets.all(12.0.w()),
                  child: SvgPicture.asset(
                    AssetsManager.normalSearch,
                    width: 24.0.w(),
                    height: 24.0.h(),
                  ),
                ),
                filled: true,
                fillColor: AppColors.grey0,
                contentPadding: EdgeInsets.symmetric(
                  horizontal: 12.0.w(),
                  vertical: 12.0.h(),
                ),
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(12.0.w()),
                  borderSide: const BorderSide(
                    color: AppColors.mainBlue,
                    width: 1,
                  ),
                ),
                enabledBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(12.0.w()),
                  borderSide: BorderSide(color: AppColors.grey40, width: 1),
                ),
                focusedBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(12.0.w()),
                  borderSide: const BorderSide(
                    color: AppColors.grey,
                    width: 1.5,
                  ),
                ),
              ),
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 25.0.h()),
            height: 40.0.h(),
            width: 680,
            child: Row(
              children: [
                BaseButton(
                  width: 178.0.w(),
                  isEnabled: true,
                  onPressed: () {},
                  text: 'Filter',
                  icon: AssetsManager.filter,
                  iconColor: AppColors.textBlue,
                  backgroundColor: AppColors.primary2,
                  textColor: AppColors.textBlue,
                ),
                SizedBox(width: 10.0.w()),
                BaseButton(
                  width: 178.0.w(),
                  isEnabled: true,
                  onPressed: () {},
                  text: 'Sort',
                  icon: AssetsManager.sort,
                  iconColor: AppColors.textBlue,
                  backgroundColor: AppColors.primary2,
                  textColor: AppColors.textBlue,
                ),
              ],
            ),
          ),

          Expanded(
            child: Consumer<TendersViewModel>(
              builder: (context, viewModel, child) {
                if (viewModel.isLoading) {
                  return const Expanded(
                    child: Center(
                      child: CircularProgressIndicator(
                        color: AppColors.jellyBean,
                      ),
                    ),
                  );
                }
                if (viewModel.errorMessage != null) {
                  return Center(child: Text(viewModel.errorMessage!));
                }
                if ((viewModel.tendersResponse?.data?.tenders == null ||
                        viewModel.tendersResponse!.data!.tenders!.isEmpty) &&
                    viewModel.isLoading == false) {
                  return const Center(child: Text(CommonStrings.noData));
                }
                return SingleChildScrollView(
                  child: SizedBox(
                    width: 740,
                    height: 800,
                    child: Padding(
                      padding: EdgeInsets.symmetric(vertical: 4.0.h()),
                      child: MainTendersSlider(
                        tenders: viewModel.tendersResponse?.data?.tenders ?? [],
                        isDesktop: true,
                      ),
                    ),
                  ),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}