import 'package:flutter/material.dart';
import 'package:bookatanker/common/settings.dart';

class FilterScreen extends StatefulWidget {
  final Map<String, dynamic>? initialFilters;

  FilterScreen({this.initialFilters});
  @override
  _FilterScreenState createState() => _FilterScreenState();
}

class _FilterScreenState extends State<FilterScreen> {
  /*bool all = true, connected = false, notConnected = false;
  RangeValues radiusRange = RangeValues(4, 15);
  RangeValues ratingRange = RangeValues(3.5, 5);
  RangeValues priceRange = RangeValues(2500, 5000);
  String? pumpChoice;*/
  bool all = true, connected = false, notConnected = false;
  RangeValues? radiusRange;
  RangeValues? ratingRange;
  RangeValues? priceRange;
  String? pumpChoice;

  @override
  void initState() {
    super.initState();
    final filters = widget.initialFilters ?? {};
    all = filters['all'] ?? true;
    connected = filters['connected'] ?? false;
    notConnected = filters['notConnected'] ?? false;
    radiusRange = filters['radiusRange'] ?? RangeValues(4, 15);
    ratingRange = filters['ratingRange'] ?? RangeValues(3.5, 5);
    priceRange = filters['priceRange'] ?? RangeValues(2500, 5000);
    pumpChoice = filters['pumpChoice'];
  }

  void _applyFilters() {
    Navigator.pop(context, {
      'all': all,
      'connected': connected,
      'notConnected': notConnected,
      'radiusRange': radiusRange,
      'ratingRange': ratingRange,
      'priceRange': priceRange,
      'pumpChoice': pumpChoice,
    });
  }

  void _resetFilters() {
    setState(() {
      all = true;
      connected = false;
      notConnected = false;
      radiusRange = RangeValues(4, 15);
      ratingRange = RangeValues(3.5, 5);
      priceRange = RangeValues(2500, 5000);
      pumpChoice = null;
    });
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      /*appBar: AppBar(
        title: Text("Filters", style: TextStyle(color: Colors.black)),
        backgroundColor: Colors.white,
        elevation: 0,
        automaticallyImplyLeading: false,
        actions: [
          IconButton(
            icon: Icon(Icons.close, color: Colors.black),
            onPressed: () => Navigator.pop(context),
          ),
        ],
      ),*/
      body: SafeArea(
        child:Padding(
          padding: EdgeInsets.fromLTRB(16, 0, 16, 0),
          child:  Column(
            children: [
              SizedBox(height: MediaQuery.of(context).size.height * .048),
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text("Filters", style: fontTextStyle(14, Color(0XFF2A2A2A), FontWeight.w600),),
                  GestureDetector(
                    onTap: (){
                      Navigator.pop(context);
                    },
                    child: Image.asset(
                      'images/cross.png', // Replace with your arrow image
                      width: 24, // Adjust size
                      height: 24,
                    ),
                  )
                ],
              ),
              Expanded(
                child: ListView(
                  padding: EdgeInsets.symmetric(horizontal: 0),
                  children: [
                    SizedBox(height: MediaQuery.of(context).size.height * .012),
                    Text("TYPE OF SUPPLIERS", style: fontTextStyle(10, Color(0XFF646566), FontWeight.w400),),
                    CheckboxListTile(
                      value: all,
                      onChanged: (v) => setState(() => all = v!),
                      contentPadding: EdgeInsets.zero,
                      dense: true,
                      activeColor:Color(0XFF000000) ,
                      visualDensity: VisualDensity.compact,
                      controlAffinity: ListTileControlAffinity.leading,
                      title: Text(
                        "All",
                        style: fontTextStyle(12, Color(0XFF2D2E30), FontWeight.w400),
                      ),
                    ),
                    CheckboxListTile(
                      value: connected,
                      onChanged: (v) => setState(() => connected = v!),
                      contentPadding: EdgeInsets.zero,
                      dense: true,
                      activeColor:Color(0XFF000000) ,
                      visualDensity: VisualDensity.compact,
                      controlAffinity: ListTileControlAffinity.leading,
                      title: Text(
                        "Connected",
                        style: fontTextStyle(12, Color(0XFF2D2E30), FontWeight.w400),
                      ),
                    ),
                    CheckboxListTile(
                      value: notConnected,
                      onChanged: (v) => setState(() => notConnected = v!),
                      contentPadding: EdgeInsets.zero,
                      dense: true,
                      activeColor:Color(0XFF000000) ,
                      visualDensity: VisualDensity.compact,
                      controlAffinity: ListTileControlAffinity.leading,
                      title: Text(
                        "Not Connected",
                        style: fontTextStyle(12, Color(0XFF2D2E30), FontWeight.w400),
                      ),
                    ),
                    Divider(height: 32,color: Color(0XFFC3C4C4) ,),
                    _buildRangeSlider("SEARCH RADIUS", "km", 0, 25, radiusRange ?? RangeValues(0, 25)),
                    Divider(height: 32,color: Color(0XFFC3C4C4) ,),
                    Text("PUMP", style: fontTextStyle(10, Color(0XFF646566), FontWeight.w400),),
                    RadioListTile<String>(
                      value: "Yes",
                      groupValue: pumpChoice,
                      onChanged: (v) => setState(() => pumpChoice = v),
                      activeColor:Color(0XFF000000) ,
                      contentPadding: EdgeInsets.zero,
                      visualDensity: VisualDensity(horizontal: -4, vertical: -4),
                      title: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Text("Yes", style: fontTextStyle(12, Color(0XFF2D2E30), FontWeight.w400)),
                        ],
                      ),
                    ),
                    RadioListTile<String>(
                      value: "No",
                      groupValue: pumpChoice,
                      onChanged: (v) => setState(() => pumpChoice = v),
                      contentPadding: EdgeInsets.zero,
                      activeColor:Color(0XFF000000) ,
                      visualDensity: VisualDensity(horizontal: -4, vertical: -4),
                      title: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Text("No", style: fontTextStyle(12, Color(0XFF2D2E30), FontWeight.w400)),
                        ],
                      ),
                    ),

                    Divider(height: 32,color: Color(0XFFC3C4C4) ,),
                    _buildRangeSlider("RATING", "", 0, 5, ratingRange?? RangeValues(0, 5)),
                    Divider(height: 32,color: Color(0XFFC3C4C4) ,),
                    _buildRangeSlider("PRICE", "", 2500, 5000, priceRange?? RangeValues(0, 5000)),
                    SizedBox(height: MediaQuery.of(context).size.height * .012),
                  ],
                ),
              ),
              Padding(
                padding: EdgeInsets.fromLTRB(0,0,0,16),
                child: Row(
                  children: [
                    Expanded(
                      child: OutlinedButton(
                        onPressed: _resetFilters,
                        style: OutlinedButton.styleFrom(
                          side: BorderSide(color:Color(0XFF2A2A2A)),
                          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
                        ),
                        child: Text("Reset", style: fontTextStyle(14, Color(0XFF2A2A2A), FontWeight.w600),),
                      ),
                    ),
                    SizedBox(width: 12),
                    Expanded(
                      child: ElevatedButton(
                        onPressed: _applyFilters,
                        style: ElevatedButton.styleFrom(
                          backgroundColor: Color(0XFF2A2A2A),
                          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
                        ),
                        child: Text("Apply", style: fontTextStyle(14, Color(0XFFFFFFFF), FontWeight.w600),),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        )
      )
    );
  }


  Widget _buildRangeSlider(String title, String suffix, double min, double max, RangeValues values) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          title,
          style: fontTextStyle(10, Color(0XFF646566), FontWeight.w400),
        ),
        SliderTheme(
          data: SliderTheme.of(context).copyWith(
            trackHeight: 1.5,
            activeTrackColor: Color(0XFF000000),
            inactiveTrackColor: Color(0XFFC3C4C4),
            thumbColor: Colors.black,
            rangeThumbShape: RoundRangeSliderThumbShape(enabledThumbRadius: 7),
          ),
          child: RangeSlider(
            values: values,
            min: min,
            max: max,
            labels: RangeLabels(
              "${values.start.round()}$suffix",
              "${values.end.round()}$suffix",
            ),
            onChanged: (val) {
              setState(() {
                if (title == "SEARCH RADIUS") {
                  radiusRange = val;
                } else if (title == "RATING") {
                  ratingRange = val;
                } else if (title == "PRICE") {
                  priceRange = val;
                }
              });
            },
          ),
        ),
        Row(
          children: [
            Text("From", style: fontTextStyle(10, Color(0XFF939495), FontWeight.w400)),
            SizedBox(width: MediaQuery.of(context).size.width * .016),
            Container(
              padding: EdgeInsets.all(2),
              decoration: BoxDecoration(
                border: Border.all(color: Color(0XFFC3C4C4)),
                borderRadius: BorderRadius.circular(6),
              ),
              child: Text(
                "${values.start.toStringAsFixed(suffix.isNotEmpty ? 0 : 1)}$suffix",
                style: fontTextStyle(10, Color(0XFF2D2E30), FontWeight.w400),
              ),
            ),
            SizedBox(width: MediaQuery.of(context).size.width * .016),
            Text("To", style: fontTextStyle(10, Color(0XFF939495), FontWeight.w400)),
            SizedBox(width: MediaQuery.of(context).size.width * .016),
            Container(
              padding: EdgeInsets.all(2),
              decoration: BoxDecoration(
                border: Border.all(color: Color(0XFFC3C4C4)),
                borderRadius: BorderRadius.circular(6),
              ),
              child: Text(
                "${values.end.toStringAsFixed(suffix.isNotEmpty ? 0 : 1)}$suffix",
                style: fontTextStyle(10, Color(0XFF2D2E30), FontWeight.w400),
              ),
            ),
          ],
        ),
      ],
    );
  }


}
