@extends('layouts.admin')

@section('title', 'Promover Serviços')

@section('content')
<div class="d-sm-flex align-items-center justify-content-between mb-4">
    <h1 class="h3 mb-0 text-gray-800">Promover Serviços</h1>
    <a href="{{ route('admin.marketing.index') }}" class="btn btn-sm btn-secondary shadow-sm">
        <i class="bi bi-arrow-left text-white-50"></i> Voltar
    </a>
</div>

<div class="card shadow mb-4">
    <div class="card-header py-3">
        <h6 class="m-0 font-weight-bold text-primary">Ferramentas de Compartilhamento de Serviços</h6>
    </div>
    <div class="card-body">
        <p class="text-muted mb-4">Escolha um serviço abaixo para gerar links de compartilhamento rápido e atrair novos orçamentos.</p>

        <div class="table-responsive">
            <table class="table table-hover border" width="100%" cellspacing="0">
                <thead class="bg-light">
                    <tr>
                        <th width="80">Ícone</th>
                        <th>Serviço</th>
                        <th width="350">Links de Promoção</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($services as $service)
                    <tr>
                        <td class="text-center">
                            @if($service->icon)
                                <i class="{{ $service->icon }} text-primary"></i>
                            @else
                                <i class="bi bi-bell text-muted"></i>
                            @endif
                        </td>
                        <td class="font-weight-bold text-dark">{{ $service->name }}</td>
                        <td>
                            @php
                                $serviceLink = route('servicos');
                                
                                $rawMessage = \App\Models\Setting::get('marketing_service_text', 'Precisa de {name}? Nós podemos te ajudar! Confira nossos serviços aqui: {link}');
                                $shareMessage = str_replace(
                                    ['{name}', '{link}'],
                                    [$service->name, $serviceLink],
                                    $rawMessage
                                );
                            @endphp
                            <div class="btn-group">
                                <!-- WhatsApp Share -->
                                <a href="https://wa.me/?text={{ urlencode($shareMessage) }}" 
                                   target="_blank" class="btn btn-sm btn-success" title="Enviar para WhatsApp">
                                    <i class="bi bi-whatsapp me-1"></i> WhatsApp
                                </a>
                                
                                <!-- Facebook Share -->
                                <a href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode($serviceLink) }}" 
                                   target="_blank" class="btn btn-sm btn-primary" title="Compartilhar no Facebook">
                                    <i class="bi bi-facebook me-1"></i> Facebook
                                </a>

                                <!-- LinkedIn Share -->
                                <a href="https://www.linkedin.com/sharing/share-offsite/?url={{ urlencode($serviceLink) }}" 
                                   target="_blank" class="btn btn-sm btn-info" title="Compartilhar no LinkedIn">
                                    <i class="bi bi-linkedin me-1"></i> LinkedIn
                                </a>

                                <!-- Copy Link -->
                                <button type="button" class="btn btn-sm btn-light border copy-link" 
                                        data-url="{{ $serviceLink }}" title="Copiar Link">
                                    <i class="bi bi-link-45deg"></i>
                                </button>
                            </div>
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection

@push('js')
<script>
    $(document).ready(function() {
        $('.copy-link').click(function() {
            var url = $(this).data('url');
            var tempInput = $("<input>");
            $("body").append(tempInput);
            tempInput.val(url).select();
            document.execCommand("copy");
            tempInput.remove();
            
            $(this).removeClass('btn-light').addClass('btn-dark text-white');
            var btn = $(this);
            setTimeout(function() {
                btn.removeClass('btn-dark text-white').addClass('btn-light');
            }, 1000);
            
            alert('Link copiado para a área de transferência!');
        });
    });
</script>
@endpush