import 'package:flutter/material.dart';
import 'package:routemaster/routemaster.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,
    this.onChanged,
  });

  /// 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;

  /// Die Funktion, die bei Veränderung eines Wertes aufgerufen wird
  final Function()? onChanged;

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

class _InputFields extends State<InputFields> {
  String? _name;
  double? _amountMin;
  double? _amountMax;
  DateTimeRange? _dateTimeRange;

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

    _name = widget.name;
    _amountMin = widget.amountMin;
    _amountMax = widget.amountMax;

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

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

    return Row(
      children: <Widget>[
        Expanded(
          child: TextField(
            decoration: const InputDecoration(
              labelText: 'Name',
              border: OutlineInputBorder(),
            ),
            onChanged: (final String value) {
              _name = value;
              _updateUrl();
            },
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: TextField(
            decoration: const InputDecoration(
              labelText: 'Min Betrag €',
              border: OutlineInputBorder(),
            ),
            keyboardType: const TextInputType.numberWithOptions(decimal: true),
            onChanged: (final String value) {
              _amountMin = double.tryParse(value);
              _updateUrl();
            },
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: TextField(
            decoration: const InputDecoration(
              labelText: 'Max Betrag €',
              border: OutlineInputBorder(),
            ),
            keyboardType: const TextInputType.numberWithOptions(decimal: true),
            onChanged: (final String value) {
              _amountMax = double.tryParse(value);
              _updateUrl();
            },
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: DateRangePicker(
            initialValue: _dateTimeRange,
            onChanged: (final DateTimeRange? value) {
              _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: () {
            _name = null;
            _amountMin = null;
            _amountMax = null;
            _dateTimeRange = null;

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

  void _updateUrl() {
    final params = <String, String>{
      if (_name != null && _name != '') 'name': _name!,
      if (_amountMin != null) 'amountMin': _amountMin!.toString(),
      if (_amountMax != null) 'amountMax': _amountMax!.toString(),
    };

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

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

    widget.onChanged?.call();
  }
}