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

class OrderStatusOverlayMulti extends StatelessWidget {
  final bool isVisible;
  final List<MyOrdersModel> activeOrders;
  final void Function(MyOrdersModel order)? onTap;

  const OrderStatusOverlayMulti({
    super.key,
    required this.isVisible,
    required this.activeOrders,
    this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    if (!isVisible || activeOrders.isEmpty) return const SizedBox.shrink();

    return Positioned(
      bottom: 0,
      left: 0,
      right: 0,
      child: SizedBox(
        height: 67, // Enough height for full details
        width: double.infinity,
        child: PageView.builder(
          itemCount: activeOrders.length,
          controller: PageController(viewportFraction: 1.0),
          itemBuilder: (context, index) {
            final order = activeOrders[index];
            return GestureDetector(
              onTap: () => onTap?.call(order),
              child: Container(
                margin: const EdgeInsets.symmetric(horizontal: 4),
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                  color: Color(0XFF0A9E04),
                  borderRadius: BorderRadius.circular(10),
                ),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    /// Supplier name
                    /* Text(
                            order.supplierName,
                            style: const TextStyle(
                              color: Colors.black,
                              fontSize: 14,
                              fontWeight: FontWeight.w700,
                            ),
                            overflow: TextOverflow.ellipsis,
                          ),
                          const SizedBox(height: 4),
*/
                    /*  /// Address
                          Text(
                            order.displayAddress,
                            style: const TextStyle(
                              color: Colors.black54,
                              fontSize: 12,
                            ),
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                          ),
                          const SizedBox(height: 8),*/

                    /// Row for type & price
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          order.typeofwater,
                          style:  fontTextStyle(12,Color(0XFFFFFFFF),FontWeight.w600),
                        ),
                        Text(
                          order.capacity,
                          style: fontTextStyle(12,Color(0XFFFFFFFF),FontWeight.w600),
                        ),

                      ],
                    ),
                    const SizedBox(height: 6),

                    /// Optional date or status
                    if (order.price != '' && order.price.isNotEmpty)
                      Text(
                        "₹ ${order.price}",
                        style: fontTextStyle(12,Color(0XFFFFFFFF),FontWeight.w600),
                      ),
                  ],
                ),
              ),
            );
          },
        ),
      ),
    );
  }
}