import 'package:flutter/material.dart';
import 'package:mypoint_flutter_app/shared/direction_google_map.dart';

import '../models/product_store_model.dart';

class StoreListSection extends StatelessWidget {
  final List<ProductStoreModel> stores;
  final String? brandLogo;

  const StoreListSection({Key? key, required this.stores, this.brandLogo}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    if (stores.isEmpty) {
      return const SizedBox.shrink();
    }

    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(color: Colors.white, borderRadius: BorderRadius.circular(16)),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text('Địa điểm áp dụng:', style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16)),
          const SizedBox(height: 10),
          // ...stores.map((store) => _buildStoreItem(store)).toList(),
          ...stores.map((store) => InkWell(
            onTap: () {
                _onTapStore(store);
            },
            child: _buildStoreItem(store),
          )),
        ],
      ),
    );
  }

  _onTapStore(ProductStoreModel store) {
    showGoogleMap(lat: store.latitude, lng: store.longitude);
  }

  Widget _buildStoreItem(ProductStoreModel store) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 12),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              ClipOval(
                child: Image.network(
                  brandLogo ?? "",
                  width: 20,
                  height: 20,
                  fit: BoxFit.cover,
                  errorBuilder: (_, __, ___) => Image.asset('assets/images/ic_logo.png', width: 20, height: 20),
                ),
              ),
              const SizedBox(width: 8),
              Text(store.name ?? '', style: const TextStyle(fontWeight: FontWeight.w600)),
            ],
          ),
          const SizedBox(height: 4),
          Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const Icon(Icons.location_on_outlined, size: 18, color: Colors.grey),
              const SizedBox(width: 4),
              Expanded(
                child: Text(
                  store.address ?? '',
                  style: const TextStyle(color: Colors.grey, fontSize: 13),
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }
}
