import 'package:flutter/material.dart';
import 'package:routemaster/routemaster.dart';

import '../../Services/date_service.dart';
import '../Misc/InputFields/date_range_picker.dart';

/// Stellt die Inputfelder für die Verlaufsübersicht dar
class InputFields extends StatefulWidget {
  /// Erstellt eine neue Instanz dieser Klasse
  const InputFields({
    super.key,
    this.amountMax,
    this.amountMin,
    this.dateFrom,
    this.dateTo,
    this.name,
  });

  /// Der Name der Transaktion, nach der gesucht werden soll
  final String? name;

  /// Der Mindestbetrag der Transaktion, nach der gesucht werden soll
  final double? amountMin;

  /// Der Maximalbetrag der Transaktion, nach der gesucht werden soll
  final double? amountMax;

  /// Das Datum der Transaktionen, ab dem gestartet wurde
  final DateTime? dateFrom;

  ///Das Datum der Transaktionen, bis zu welchen beendet wurde
  final DateTime? dateTo;

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

class _InputFields extends State<InputFields> {
  final TextEditingController _nameController = TextEditingController();
  final TextEditingController _amountMinController = TextEditingController();
  final TextEditingController _amountMaxController = TextEditingController();
  final TextEditingController _dateTimeController = TextEditingController();

  @override
  void initState() {
    super.initState();

    if (widget.name != null) {
      _nameController.text = widget.name!;
    }

    if (widget.amountMin != null) {
      _amountMinController.text = widget.amountMin!.toString();
    }

    if (widget.amountMax != null) {
      _amountMaxController.text = widget.amountMax!.toString();
    }

    if (widget.dateFrom != null && widget.dateTo != null) {
      final DateTimeRange dateTimeRange = DateTimeRange(
        start: widget.dateFrom!,
        end: widget.dateTo!,
      );

      _dateTimeController.text = DateService.dateTimeRangeToString(
        dateTimeRange,
      )!;
    }
  }

  @override
  void dispose() {
    _nameController.dispose();
    _amountMinController.dispose();
    _amountMaxController.dispose();
    _dateTimeController.dispose();

    super.dispose();
  }

  @override
  Widget build(final BuildContext context) {
    final ThemeData theme = Theme.of(context);

    return Row(
      children: <Widget>[
        Expanded(
          child: TextField(
            controller: _nameController,
            decoration: const InputDecoration(
              labelText: 'Name',
              border: OutlineInputBorder(),
            ),
            onChanged: (final String value) {
              _updateUrl();
            },
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: TextField(
            controller: _amountMinController,
            decoration: const InputDecoration(
              labelText: 'Min Betrag €',
              border: OutlineInputBorder(),
            ),
            keyboardType: const TextInputType.numberWithOptions(decimal: true),
            onChanged: (final String value) {
              _updateUrl();
            },
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: TextField(
            controller: _amountMaxController,
            decoration: const InputDecoration(
              labelText: 'Max Betrag €',
              border: OutlineInputBorder(),
            ),
            keyboardType: const TextInputType.numberWithOptions(decimal: true),
            onChanged: (final String value) {
              _updateUrl();
            },
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: DateRangePicker(
            controller: _dateTimeController,
            onChanged: (final DateTimeRange? value) {
              _updateUrl();
            },
            decoration: InputDecoration(
              labelText: 'Zeitraum',
              border: const OutlineInputBorder(),
              suffixIcon: Icon(
                Icons.calendar_month,
                color: theme.colorScheme.onSurface,
              ),
            ),
          ),
        ),
        const SizedBox(width: 8),
        IconButton(
          onPressed: () {
            _nameController.text = '';
            _amountMinController.text = '';
            _amountMaxController.text = '';
            _dateTimeController.text = '';

            _updateUrl();
          },
          icon: const Icon(Icons.clear),
        ),
      ],
    );
  }

  void _updateUrl() {
    final params = <String, String>{
      if (_nameController.text != '') 'name': _nameController.text,
      if (_amountMinController.text != '')
        'amountMin': _amountMinController.text,
      if (_amountMaxController.text != '')
        'amountMax': _amountMaxController.text,
    };

    if (_dateTimeController.text != '') {
      final DateTimeRange<DateTime>? range = DateService.stringToDateTimeRange(
        _dateTimeController.text,
      );

      if (range != null) {
        params['dateFrom'] = range.start.toIso8601String();
        params['dateTo'] = range.end.toIso8601String();
      }
    }

    Routemaster.of(context).replace('/trend', queryParameters: params);
  }
}