import 'package:app_gaslieferung/bloc/authentication/auth_bloc.dart';
import 'package:app_gaslieferung/bloc/authentication/auth_state.dart';
import 'package:app_gaslieferung/bloc/tour_select/bloc.dart';
import 'package:app_gaslieferung/model/supplier.dart';
import 'package:app_gaslieferung/ui/page/tour.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import '../../bloc/tour_select/event.dart';
import '../../bloc/tour_select/state.dart';

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

  @override
  State<StatefulWidget> createState() => _TourSelectPageState();
}

class _TourSelectPageState extends State<TourSelectPage> {
  @override
  void initState() {
    super.initState();

    context.read<TourSelectBloc>().add(
      TourSelectLoadMetadataEvent(
        sessionId:
            (context.read<AuthBloc>().state as AuthenticatedState).sessionId,
      ),
    );
  }

  Widget _listTour(SupplierTourMetadata data) {
    return ListView.separated(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      itemBuilder: (context, index) {
        TourMetadata tourData = data.tours[index];

        return ListTile(
          leading: Icon(Icons.local_shipping_outlined),
          onTap: () => Navigator.push(
            context,
            MaterialPageRoute(
              builder: (context) => TourPage(carId: tourData.car.id.toString()),
            ),
          ),
          title: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [Text(tourData.car.driverName ?? tourData.car.carName)],
          ),
          subtitle: Row(
            children: [
              tourData.car.driverName != null
                  ? Text("${tourData.car.carName} | ")
                  : Container(),

              Text("${tourData.amountDeliveries} Lieferungen"),
            ],
          ),
          tileColor: Theme.of(context).colorScheme.surface,
          trailing: Icon(Icons.arrow_forward_ios),
        );
      },
      separatorBuilder: (BuildContext context, int index) =>
          SizedBox(height: 10),
      itemCount: data.tours.length,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: BlocBuilder<TourSelectBloc, TourSelectState>(
        builder: (context, state) {
          if (state is TourSelectLoading) {
            return const Center(child: CircularProgressIndicator());
          }

          if (state is TourSelectError) {
            return Center(child: Text(state.message));
          }

          if (state is TourSelectLoaded) {
            return Center(
              child: ListView(
                children: [
                  Image.asset(
                    "assets/graphics/bg-carrier-cylinder-duo.png",
                    fit: BoxFit.contain,
                  ),

                  Padding(
                    padding: const EdgeInsets.only(top: 25),
                    child: Text(
                      "Wählen Sie Ihre Tour aus:",
                      style: Theme.of(context).textTheme.titleLarge,
                      textAlign: TextAlign.center,
                    ),
                  ),

                  Padding(
                    padding: const EdgeInsets.all(15),
                    child: SizedBox(
                      width: double.infinity,
                      child: Card(
                        color: Theme.of(
                          context,
                        ).colorScheme.surfaceContainerHighest,
                        child: Padding(
                          padding: const EdgeInsets.all(20),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: [
                                  Row(
                                    children: [
                                      Padding(
                                        padding: const EdgeInsets.only(
                                          right: 10,
                                        ),
                                        child: Icon(Icons.tour),
                                      ),
                                      Text(
                                        "Touren",
                                        style: Theme.of(
                                          context,
                                        ).textTheme.titleMedium,
                                      ),
                                    ],
                                  ),
                                  Row(
                                    children: [
                                      Padding(
                                        padding: const EdgeInsets.only(
                                          right: 10,
                                        ),
                                        child: Icon(Icons.calendar_month),
                                      ),
                                      Text(
                                        state.data.date,
                                        style: Theme.of(
                                          context,
                                        ).textTheme.labelLarge,
                                      ),
                                    ],
                                  ),
                                ],
                              ),

                              Padding(
                                padding: const EdgeInsets.only(top: 15),
                                child: _listTour(state.data),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            );
          }

          return Container();
        },
      ),
    );
  }
}