import 'package:flutter/material.dart';
import 'package:supplier_new/common/settings.dart';
import 'package:supplier_new/resources/source_location2.dart';

void main() => runApp(const MaterialApp(home: SourceLocation1()));

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

  @override
  State<SourceLocation1> createState() => _SourceLocation1State();
}

class _SourceLocation1State extends State<SourceLocation1> {
  final _formKey = GlobalKey<FormState>();

  String _deliveryFrom = 'business';
  final TextEditingController _radiusController =
      TextEditingController(text: "10");

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        surfaceTintColor: Colors.transparent,
        elevation: 0,
        scrolledUnderElevation: 0,
        title: const Text("Complete Profile"),
        actions: [
          Padding(
            padding: const EdgeInsets.fromLTRB(10, 10, 0, 10),
            child: IconButton(
              splashRadius: 20,
              padding: EdgeInsets.zero,
              icon: const Image(
                  image: AssetImage('images/calendar_appbar.png'),
                  width: 22,
                  height: 22),
              onPressed: () {},
            ),
          ),
          Padding(
            padding: const EdgeInsets.fromLTRB(0, 10, 10, 10),
            child: IconButton(
              splashRadius: 20,
              padding: EdgeInsets.zero,
              icon: Image.asset('images/notification_appbar.png',
                  width: 22, height: 22),
              onPressed: () {},
            ),
          ),
        ],
      ),
      body: SafeArea(
        child: Form(
          key: _formKey,
          child: ListView(
            padding: const EdgeInsets.fromLTRB(20, 10, 20, 24),
            children: [
              // Step indicator
              Text(
                "Step 1/5",
                style:
                    fontTextStyle(16, const Color(0xFFC3C4C4), FontWeight.w500),
              ),
              const SizedBox(height: 16),
              Row(
                children: List.generate(4, (index) {
                  return Expanded(
                    child: Container(
                      margin: const EdgeInsets.symmetric(horizontal: 2),
                      height: 5,
                      decoration: BoxDecoration(
                        color: index < 4 ? const Color(0xFFC3C4C4) : Colors.grey,
                        borderRadius: BorderRadius.circular(2),
                      ),
                    ),
                  );
                }),
              ),
              const SizedBox(height: 16),
              Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text("SORURCE LOCATION",
                      style: fontTextStyle(
                          20, const Color(0xFF515253), FontWeight.w600)),
                  const SizedBox(height: 8),
                  Container(
                    width: 24,
                    height: 24,
                    decoration: const BoxDecoration(
                      image: DecorationImage(
                          image: AssetImage('images/marker-pin.png'),
                          fit: BoxFit.contain),
                    ),
                  ),
                ],
              ),
              const SizedBox(height: 12),
              Text(
                "Define where you want to provide delivery services",
                style:
                    fontTextStyle(14, const Color(0xFF939495), FontWeight.w500),
                maxLines: 1,
                softWrap: false,
              ),
              const SizedBox(height: 6),
              // Radio ListTiles (vertical)
              Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  RadioListTile<String>(
                    value: 'business',
                    groupValue: _deliveryFrom,
                    onChanged: (value) {
                      if (value == null) return;
                      setState(() => _deliveryFrom = value);
                    },
                    title: Text(
                      "From Business Location",
                      style: fontTextStyle(
                          14, const Color(0xFF2D2E30), FontWeight.w500),
                    ),
                    dense: true,
                    contentPadding: EdgeInsets.zero,
                    visualDensity:
                        const VisualDensity(horizontal: 0, vertical: -3),
                  ),
                  RadioListTile<String>(
                    value: 'source',
                    groupValue: _deliveryFrom,
                    onChanged: (value) {
                      if (value == null) return;
                      setState(() => _deliveryFrom = value);
                    },
                    title: Text(
                      "From Source Locations",
                      style: fontTextStyle(
                          14, const Color(0xFF2D2E30), FontWeight.w500),
                    ),
                    dense: true,
                    contentPadding: EdgeInsets.zero,
                    visualDensity:
                        const VisualDensity(horizontal: 0, vertical: -3),
                  ),
                ],
              ),

              const SizedBox(height: 12),
              Text(
                "Delivery Radius (in Kms) *",
                style:
                    fontTextStyle(14, const Color(0xFF2D2E30), FontWeight.w500),
              ),
              const SizedBox(height: 6),
              TextFormField(
                controller: _radiusController,
                keyboardType: TextInputType.number,
                decoration: InputDecoration(
                  hintText: "Enter radius in kms",
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(8),
                  ),
                  contentPadding:
                      const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
                ),
              ),
              const SizedBox(height: 12),
              InkWell(
                onTap: () => setState(
                    () => _customizeEachSource = !_customizeEachSource),
                child: Padding(
                  padding: EdgeInsets.zero,

                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.center,

                    children: [

                      Checkbox(
                        value: _customizeEachSource,
                        onChanged: (val) =>
                            setState(() => _customizeEachSource = val ?? false),
                        materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                      ),

                      const SizedBox(width: 2),
                      Expanded(
                        child: Text(
                          "Customize for every each source location",
                          style: fontTextStyle(
                              14, const Color(0xFF2D2E30), FontWeight.w500),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ),

                    ],
                  ),
                ),
              ),
              const SizedBox(height: 12),
              Container(
                width: 343,
                height: 166,
                decoration: const BoxDecoration(
                  image: DecorationImage(
                      image: AssetImage('images/google_maps.png'),
                      fit: BoxFit.contain),
                ),
              ),
              const SizedBox(height: 20),
              Text(
                "Types of Services",
                style:
                fontTextStyle(16, const Color(0xFF2D2E30), FontWeight.w600),
              ),
              const SizedBox(height: 12),
              Text(
                "Define what type of services you would wish to provide",
                style:
                fontTextStyle(14, const Color(0xFF939495), FontWeight.w500),
              ),
              const SizedBox(height: 20),
              Row(
                children: [
                  const Icon(Icons.check_box_outline_blank, size: 20, color: Color(0xFF939495)),
                  const SizedBox(width: 8),
                  Text(
                    "24/7 Emergency services",
                    style: fontTextStyle(12, const Color(0xFF2D2E30), FontWeight.w400),
                  ),
                ],
              ),
              const SizedBox(height: 12),
              Row(
                children: [
                  const Icon(Icons.check_box_outline_blank, size: 20, color: Color(0xFF939495)),
                  const SizedBox(width: 8),
                  Text(
                    "Scheduled water deliveries",
                    style: fontTextStyle(12, const Color(0xFF2D2E30), FontWeight.w400),
                  ),
                ],
              ),
              const SizedBox(height: 12),
              Row(
                children: [
                  const Icon(Icons.check_box_outline_blank, size: 20, color: Color(0xFF939495)),
                  const SizedBox(width: 8),
                  Text(
                    "Bulk water deliveries",
                    style: fontTextStyle(12, const Color(0xFF2D2E30), FontWeight.w400),
                  ),
                ],
              ),
              const SizedBox(height: 12),
              Row(
                children: [
                  const Icon(Icons.check_box_outline_blank, size: 20, color: Color(0xFF939495)),
                  const SizedBox(width: 8),
                  Text(
                    "Long-term water delivery planes",
                    style: fontTextStyle(12, const Color(0xFF2D2E30), FontWeight.w400),
                  ),
                ],
              ),
              const SizedBox(height: 12),
              Row(
                children: [
                  const Icon(Icons.check_box_outline_blank, size: 20, color: Color(0xFF939495)),
                  const SizedBox(width: 8),
                  Text(
                    "Industrial/Commercial water deliveries",
                    style: fontTextStyle(12, const Color(0xFF2D2E30), FontWeight.w400),
                  ),
                ],
              ),
              const SizedBox(height: 16),
              SizedBox(
                width: double.infinity,
                child: ElevatedButton(
                  style: ElevatedButton.styleFrom(
                    backgroundColor: const Color(0xFF8270DB),
                    foregroundColor: Colors.white,
                    padding: const EdgeInsets.symmetric(vertical: 14),
                    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24)),
                  ),
                  onPressed: () {
                    // TODO: Navigate to the next step/screen
                    Navigator.push(context, MaterialPageRoute(builder: (_) => const SourceLocation2()));
                    // ScaffoldMessenger.of(context).showSnackBar(
                    //   SnackBar(content: Text("Saved ${_drivers.length} driver(s). Proceeding…")),
                    // );
                  },
                  child: Text(
                    "Continue",
                    style: fontTextStyle(14, Colors.white, FontWeight.w400),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  bool _customizeEachSource = false;
}