import 'dart:convert';
import 'dart:math';
import 'package:flutter/material.dart';
import 'package:frontend/Screens/policy/policyCriteria.dart';
import 'package:responsive_builder/responsive_builder.dart';

import '../../routes/custom_appBar.dart';
import '../../routes/custom_drawer.dart';

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

  @override
  _PolicyState createState() => _PolicyState();
}

class _PolicyState extends State<Policy> {
  late String policyType = "domestic";
  int? selectedServiceIndex = 1;
  late String selectedService = "Train";

  bool showClass = true;
  bool showCost = true;

  @override
  Widget build(BuildContext context) {
    return ResponsiveBuilder(builder: (context, sizingInfo) {
      bool isDesktop = sizingInfo.deviceScreenType == DeviceScreenType.desktop;

      return Scaffold(
        backgroundColor: Colors.white,
        appBar: isDesktop ? null : const CustomAppBar(title: 'Home'),
        drawer: isDesktop ? null : CustomDrawer(isDesktop: false),
        body: Row(
          children: [
            if (isDesktop) CustomDrawer(isDesktop: true),
            Expanded(child: buildPolicyLayout(isDesktop))
          ],
        ),
      );
    });
  }

  Widget buildPolicyLayout(bool isDesktop) {
    return Container(
      margin: isDesktop
          ? EdgeInsets.all(20.0)
          : EdgeInsets.only(left: 20.0, bottom: 20.0, top: 10.0, right: 10.0),
      height: MediaQuery.of(context).size.height,
      // color: Colors.grey,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          Container(
            // color: Color(0xFFF7F7FB),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Expanded(
                      child: Container(
                        // color: Colors.amber,
                        // color: Color(0xFFF7F7FB),
                        padding: EdgeInsets.all(5),
                        alignment: Alignment.center,
                        child: Text(
                          "Choose Policy Type",
                          style: TextStyle(
                            fontSize: 18,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
                SizedBox(
                  height: 10,
                ),
                Container(
                  child: Row(
                    children: [
                      Expanded(
                        child: GestureDetector(
                          onTap: () {
                            setState(() {
                              policyType = "domestic";
                            });
                          },
                          child: Container(
                            padding: EdgeInsets.all(10),
                            color: policyType == "domestic"
                                ? Colors.blueAccent.shade100
                                : Color(0xFFEBEBF7),
                            // color: Colors.blue.shade300,
                            child: Column(
                              children: [
                                Text(
                                  "Domestic",
                                  style: TextStyle(
                                      color: policyType == "domestic"
                                          ? Colors.white
                                          : Colors.black87,
                                      fontSize: 15,
                                      fontWeight: FontWeight.bold),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                      Expanded(
                          child: GestureDetector(
                        onTap: () {
                          setState(() {
                            policyType = "international";
                          });
                        },
                        child: Container(
                          padding: EdgeInsets.all(10),
                          // color: Color(0xFFEBEBF7),
                          color: policyType == "international"
                              ? Colors.blueAccent.shade100
                              : Color(0xFFEBEBF7),
                          // color: Color(0xFFE3F2FD),

                          child: Column(
                            children: [
                              Text(
                                "International",
                                style: TextStyle(
                                    color: policyType == "international"
                                        ? Colors.white
                                        : Colors.black87,
                                    fontSize: 15,
                                    fontWeight: FontWeight.bold),
                              ),
                            ],
                          ),
                        ),
                      )),
                    ],
                  ),
                ),
              ],
            ),
          ),
          isDesktop
              ? Expanded(
                  child: Row(
                    children: [
                      _buildPolicyCategoryList(isDesktop),
                      _buildPolicyCategory(isDesktop),
                    ],
                  ),
                )
              : Expanded(
                  child: Column(
                    children: [
                      _buildPolicyCategoryList(isDesktop),
                      _buildPolicyCategory(isDesktop),
                    ],
                  ),
                )
        ],
      ),
    );
  }

  Widget _buildPolicyCategoryList(bool isDesktop) {
    return Container(
      color: Colors.white,
      // color: Colors.blueGrey.shade200,
      width: isDesktop ? MediaQuery.of(context).size.width * 0.15 : null,
      child: isDesktop
          ? Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [_buildPolicySubCategoryList(isDesktop)],
            )
          : Container(
              // color: Colors.amber,
              child: Expanded(
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [_buildPolicySubCategoryList(isDesktop)],
                ),
              ),
            ),
    );
  }

  Widget _buildPolicySubCategoryList(bool isDesktop) {
    List<String> services = [
      "Flight",
      "Train",
      "Bus",
      "Taxi",
      "Forex",
      "Accommodation",
      "Insurance",
      "Visa",
      "Miscellaneous"
    ];

    return Expanded(
      child: SingleChildScrollView(
        scrollDirection: isDesktop ? Axis.vertical : Axis.horizontal,
        child: Flex(
          direction: isDesktop ? Axis.vertical : Axis.horizontal,
          children: services.asMap().entries.map((entry) {
            int index = entry.key;
            String service = entry.value;
            bool isSelected = selectedServiceIndex == index;

            return SizedBox(
                width: isDesktop ? 180 : null,
                height: isDesktop
                    ? max((MediaQuery.of(context).size.height * 0.085), 10)
                    : 45,
                child: GestureDetector(
                  onTap: () {
                    print("Selected Services - $service - $index");
                    setState(() {
                      selectedServiceIndex = index;
                      selectedService = service;

                      if (selectedService == "Flight" ||
                          selectedService == "Train") {
                        showClass = true;
                        showCost = true;
                      } else if (selectedService == "Accommodation") {
                        showClass = true;
                        showCost = false;
                      } else {
                        showClass = false;
                        showCost = false;
                      }
                    });
                  },
                  child: Container(
                    margin: EdgeInsets.all(8),
                    padding: isDesktop
                        ? EdgeInsets.all(8)
                        : EdgeInsets.only(top: 3, bottom: 3, left: 8, right: 8),
                    decoration: BoxDecoration(
                      // color: Colors.blue,
                      color: isSelected
                          ? Colors.blueAccent.shade100
                          : Colors.grey.shade100,
                      // : Color(0xFFEBEBF7),
                      borderRadius: BorderRadius.circular(8),
                    ),
                    alignment: Alignment.center,
                    child: Text(
                      service,
                      style: TextStyle(
                          color: isSelected ? Colors.white : Colors.black87,
                          fontSize: 13,
                          fontWeight:
                              isSelected ? FontWeight.bold : FontWeight.w100),
                    ),
                  ),
                ));
          }).toList(),
        ),
      ),
    );
  }

  Widget _buildPolicyCategory(bool isDesktop) {
    return Expanded(
      child: Container(
          // color: Colors.brown.shade100,
          color: Colors.white60,
          child: PolicyCriteria(
              isDesktop: isDesktop,
              isClass: showClass,
              isCost: showCost,
              selectedTab: selectedService)),
    );
  }
}