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

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

  @override
  State<PlanDetails> createState() => _PlanDetailsState();
}

class _PlanDetailsState extends State<PlanDetails> {
  final List<Map<String, dynamic>> deliveries = [
    {
      "status": "Pending",
      "quantity": "10,000 L",
      "type": "Drinking water",
      "time": "12:30 AM, Tomorrow",
      "button": "Assign Tanker",
    },
    {
      "status": "Pending",
      "quantity": "10,000 L",
      "type": "Drinking water",
      "time": "12:30 AM, Tomorrow",
      "driver": "TS 04 J 8394",
      "button": "Assign Driver",
    },
  ];

  Widget _buildInfoCard(String value, String label, {Color? color}) {
    return Expanded(
      child: Container(
        padding: const EdgeInsets.all(12),
        decoration: BoxDecoration(
          color: color ?? const Color(0xFFF7F7F7),
          borderRadius: BorderRadius.circular(12),
        ),
        child: Column(
          children: [
            Text(value, style: fontTextStyle(18, Colors.black, FontWeight.w600)),
            const SizedBox(height: 4),
            Text(label, style: fontTextStyle(13, Colors.black54, FontWeight.w400)),
          ],
        ),
      ),
    );
  }

  Widget _buildFilterChip(String label) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 4),
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
        decoration: BoxDecoration(
          border: Border.all(color: const Color(0xFFE0E0E0)),
          borderRadius: BorderRadius.circular(16),
          color: Colors.white,
        ),
        child: Text(
          label,
          style: fontTextStyle(13, Colors.black87, FontWeight.w500),
        ),
      ),
    );
  }

  Widget _buildDeliveryCard(Map<String, dynamic> delivery) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
      padding: const EdgeInsets.all(12),
      decoration: BoxDecoration(
        color: Colors.white,
        border: Border.all(color: const Color(0xFFE0E0E0)),
        borderRadius: BorderRadius.circular(12),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Container(
                padding:
                const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
                decoration: BoxDecoration(
                  color: const Color(0xFFFFF2E0),
                  borderRadius: BorderRadius.circular(8),
                ),
                child: Text(
                  delivery['status'],
                  style: fontTextStyle(
                      12, const Color(0xFFE6882C), FontWeight.w500),
                ),
              ),
              const Spacer(),
              Text(delivery['time'],
                  style: fontTextStyle(12, Colors.black54, FontWeight.w400)),
            ],
          ),
          const SizedBox(height: 8),
          Text("${delivery['quantity']} - ${delivery['type']}",
              style: fontTextStyle(14, Colors.black, FontWeight.w600)),
          const SizedBox(height: 8),
          if (delivery.containsKey('driver'))
            Row(
              children: [
                const Icon(Icons.local_shipping_outlined,
                    color: Color(0xFF8270DB), size: 18),
                const SizedBox(width: 6),
                Text(
                  delivery['driver'],
                  style: fontTextStyle(13, Colors.black87, FontWeight.w500),
                )
              ],
            ),
          const SizedBox(height: 8),
          Align(
            alignment: Alignment.centerRight,
            child: ElevatedButton(
              onPressed: () {},
              style: ElevatedButton.styleFrom(
                backgroundColor: const Color(0xFF8270DB),
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(20),
                ),
                padding:
                const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
              ),
              child: Text(
                delivery['button'],
                style: fontTextStyle(13, Colors.white, FontWeight.w600),
              ),
            ),
          )
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0,
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios_new, color: Colors.black),
          onPressed: () => Navigator.pop(context),
        ),
        title: Text("Green Valley Apartments",
            style: fontTextStyle(16, Colors.black, FontWeight.w600)),
      ),
      body: SingleChildScrollView(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // Image with status
            Stack(
              children: [
                Image.asset(
                  'images/building.png', // replace with your asset
                  height: 180,
                  width: double.infinity,
                  fit: BoxFit.cover,
                ),
                Positioned(
                  top: 16,
                  left: 16,
                  child: Container(
                    padding:
                    const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
                    decoration: BoxDecoration(
                      color: Colors.green.withOpacity(0.9),
                      borderRadius: BorderRadius.circular(20),
                    ),
                    child: Text("Active",
                        style: fontTextStyle(12, Colors.white, FontWeight.w600)),
                  ),
                ),
              ],
            ),

            const SizedBox(height: 12),

            // Apartment Info
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Column(
                children: [
                  Text("Green Valley Apartments",
                      style: fontTextStyle(18, Colors.black, FontWeight.w600)),
                  const SizedBox(height: 4),
                  Text("Gacchibowli, Hyderabad",
                      style: fontTextStyle(14, Colors.black54, FontWeight.w400)),
                  const SizedBox(height: 4),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      const Icon(Icons.water_drop, color: Color(0xFF8270DB), size: 18),
                      const SizedBox(width: 4),
                      Text("Drinking Water",
                          style: fontTextStyle(14, const Color(0xFF8270DB), FontWeight.w500)),
                    ],
                  ),
                  const SizedBox(height: 4),
                  Text("25 June 2025 • 24 deliveries",
                      style: fontTextStyle(13, Colors.black54, FontWeight.w400)),
                ],
              ),
            ),

            const SizedBox(height: 16),

            // Quantity & Balance
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Row(
                children: [
                  _buildInfoCard("10K", "Quantity"),
                  const SizedBox(width: 12),
                  _buildInfoCard("24k", "Balance", color: const Color(0xFFEFF8F1)),
                ],
              ),
            ),

            const SizedBox(height: 16),

            // Schedule | Pending | Rescheduled
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Row(
                children: [
                  _buildInfoCard("3/week", "Schedule"),
                  const SizedBox(width: 12),
                  _buildInfoCard("14", "Pending"),
                  const SizedBox(width: 12),
                  _buildInfoCard("2", "Rescheduled"),
                ],
              ),
            ),

            const SizedBox(height: 20),

            // Filter chips
            SingleChildScrollView(
              scrollDirection: Axis.horizontal,
              padding: const EdgeInsets.symmetric(horizontal: 12),
              child: Row(
                children: [
                  _buildFilterChip("Status"),
                  _buildFilterChip("Date"),
                  _buildFilterChip("Quantity"),
                  _buildFilterChip("Water Type"),
                ],
              ),
            ),

            const SizedBox(height: 16),

            // Delivery Cards
            ...deliveries.map((d) => _buildDeliveryCard(d)).toList(),

            const SizedBox(height: 24),

            // Bottom Buttons
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Row(
                children: [
                  Expanded(
                    child: OutlinedButton(
                      onPressed: () {},
                      style: OutlinedButton.styleFrom(
                        side: const BorderSide(color: Color(0xFF8270DB)),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(24),
                        ),
                        padding: const EdgeInsets.symmetric(vertical: 14),
                      ),
                      child: Text("Edit Plan",
                          style: fontTextStyle(
                              14, const Color(0xFF8270DB), FontWeight.w600)),
                    ),
                  ),
                  const SizedBox(width: 12),
                  Expanded(
                    child: ElevatedButton(
                      onPressed: () {},
                      style: ElevatedButton.styleFrom(
                        backgroundColor: const Color(0xFFE2483D),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(24),
                        ),
                        padding: const EdgeInsets.symmetric(vertical: 14),
                      ),
                      child: Text("Discontinue",
                          style: fontTextStyle(
                              14, Colors.white, FontWeight.w600)),
                    ),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 24),
          ],
        ),
      ),
    );
  }
}