@extends('layouts.app')
@section('title', $prospect->fullName())
@section('heading', $prospect->company ?: $prospect->fullName())
@section('subheading', trim($prospect->civilName().($prospect->job_title ? ' · '.$prospect->job_title : '')))
@section('actions')
    <x-btn variant="secondary" :href="route('prospects.edit',$prospect)">✏️ Modifier</x-btn>
    @if($prospect->isConverted())
        <x-btn variant="secondary" :href="route('clients.show',$prospect->converted_client_id)">Voir le client →</x-btn>
    @elseif($prospect->isLost())
        <form method="POST" action="{{ route('prospects.reopen',$prospect) }}" onsubmit="return confirm('Rouvrir ce prospect ?')">@csrf
            <x-btn type="submit" variant="secondary">↩️ Rouvrir le prospect</x-btn>
        </form>
    @else
        <form method="POST" action="{{ route('prospects.convert',$prospect) }}" onsubmit="return confirm('Convertir ce prospect en client ?')">@csrf
            <x-btn type="submit">✅ Convertir en client</x-btn>
        </form>
        {{-- Ouvre le panneau « perte » situé en haut du contenu (l'événement remonte jusqu'à window) --}}
        <x-btn variant="danger" x-data @click="$dispatch('prospect-lost')">❌ Marquer perdu</x-btn>
    @endif
@endsection
@section('content')

@if($prospect->isLost())
    <div class="mb-6 rounded-2xl border border-rose-200 bg-rose-50 px-5 py-4">
        <div class="flex items-start gap-3">
            <span class="text-xl">❌</span>
            <div class="text-sm">
                <p class="font-semibold text-rose-800">
                    Prospect perdu{{ $prospect->lost_at ? ' le '.$prospect->lost_at->format('d/m/Y') : '' }}
                    @if($prospect->lostReasonLabel()) — {{ $prospect->lostReasonLabel() }} @endif
                </p>
                @if($prospect->lost_note)<p class="text-rose-700 mt-1">{{ $prospect->lost_note }}</p>@endif
            </div>
        </div>
    </div>
@endif

{{-- Formulaire de perte : masqué tant que le bouton « Marquer perdu » n'a pas été cliqué --}}
@unless($prospect->isConverted() || $prospect->isLost())
    <div x-data="{ open: false }" @prospect-lost.window="open = true; $nextTick(() => $el.scrollIntoView({ behavior: 'smooth', block: 'center' }))"
         x-show="open" x-cloak x-transition class="mb-6">
        <x-card title="Marquer ce prospect comme perdu">
            <form method="POST" action="{{ route('prospects.lost',$prospect) }}" class="space-y-3">@csrf
                <div class="grid sm:grid-cols-2 gap-3">
                    <label class="text-sm">Motif de la perte *
                        <select name="lost_reason" required class="mt-1 w-full rounded-lg border border-slate-300 px-3 py-2 text-sm">
                            @foreach(App\Models\Prospect::LOST_REASONS as $k => $lab)<option value="{{ $k }}">{{ $lab }}</option>@endforeach
                        </select>
                    </label>
                    <label class="text-sm">Date de la perte
                        <input type="date" name="lost_at" value="{{ now()->format('Y-m-d') }}" class="mt-1 w-full rounded-lg border border-slate-300 px-3 py-2 text-sm">
                    </label>
                </div>
                <textarea name="lost_note" rows="2" placeholder="Commentaire (concurrent retenu, budget annoncé, à recontacter dans 6 mois…)" class="w-full rounded-lg border border-slate-300 px-3 py-2 text-sm"></textarea>
                @if($prospect->projects->filter->isOpen()->isNotEmpty())
                    <label class="flex items-center gap-2 text-sm text-slate-600">
                        <input type="checkbox" name="close_projects" value="1" checked class="rounded border-slate-300">
                        Clôturer aussi les {{ $prospect->projects->filter->isOpen()->count() }} projet(s) en cours
                    </label>
                @endif
                <div class="flex items-center gap-2">
                    <x-btn type="submit" variant="danger">❌ Confirmer la perte</x-btn>
                    <button type="button" @click="open = false" class="px-3.5 py-2 text-sm rounded-lg border border-slate-300 hover:bg-slate-50">Annuler</button>
                </div>
            </form>
        </x-card>
    </div>
@endunless

<div class="grid lg:grid-cols-3 gap-6">
    <div class="space-y-6">
        <x-card title="Coordonnées">
            <dl class="space-y-2 text-sm">
                @foreach([['Société',$prospect->company],['Civilité',$prospect->civility],['Contact',$prospect->civilName()],['Fonction',$prospect->job_title],['Email',$prospect->email],['Téléphone',$prospect->phone],['Mobile',$prospect->mobile],['Ville',$prospect->city],['Site',$prospect->website],['SIRET',$prospect->siret],['Secteur',$prospect->sector],['Taille',$prospect->size],['Source',$prospect->source]] as [$k,$v])
                    @if($v)<div class="flex justify-between border-b border-slate-50 py-1"><dt class="text-slate-400">{{ $k }}</dt><dd class="font-medium text-right">{{ $v }}</dd></div>@endif
                @endforeach
            </dl>
        </x-card>
        <x-card title="Suivi commercial">
            <dl class="space-y-2 text-sm">
                <div class="flex justify-between py-1"><dt class="text-slate-400">Statut</dt><dd><x-badge :status="$prospect->status" :label="$prospect->status" /></dd></div>
                <div class="flex justify-between py-1"><dt class="text-slate-400">Étape</dt><dd><x-badge :status="$prospect->pipeline_stage" :label="$prospect->pipeline_stage" /></dd></div>
                <div class="flex justify-between py-1"><dt class="text-slate-400">Priorité</dt><dd><x-badge :status="$prospect->priority" :label="$prospect->priority" /></dd></div>
                <div class="flex justify-between py-1"><dt class="text-slate-400">Probabilité</dt><dd class="font-medium">{{ $prospect->probability }}%</dd></div>
                <div class="flex justify-between py-1"><dt class="text-slate-400">Relance</dt><dd class="font-medium">{{ optional($prospect->next_action_date)->format('d/m/Y') ?? '—' }}</dd></div>
                <div class="flex justify-between py-1"><dt class="text-slate-400">Prochaine action</dt><dd class="font-medium text-right">{{ $prospect->next_action ?? '—' }}</dd></div>
                <div class="flex justify-between py-1"><dt class="text-slate-400">Commercial</dt><dd class="font-medium">{{ $prospect->commercial?->name ?? '—' }}</dd></div>
            </dl>
        </x-card>
    </div>
    <div class="lg:col-span-2 space-y-6">
        @include('partials.projects-card', [
            'model' => $prospect,
            'ownerField' => 'prospect_id',
            'users' => $commercials,
            'defaultUser' => $prospect->commercial_id,
        ])
        @include('partials.events-card', [
            'model' => $prospect,
            'relatedKey' => 'prospect',
            'users' => $commercials,
            'defaultTitle' => 'RDV — '.($prospect->company ?: $prospect->civilName()),
            'defaultUser' => $prospect->commercial_id,
        ])
        <x-card title="Ajouter une activité">
            <form method="POST" action="{{ route('prospects.activity',$prospect) }}" class="space-y-3">@csrf
                <div class="flex gap-2">
                    <select name="type" class="rounded-lg border border-slate-300 px-3 py-2 text-sm">@foreach(['note'=>'📝 Note','email'=>'✉️ Email','appel'=>'📞 Appel','rendez-vous'=>'📅 RDV','activite'=>'⚡ Activité'] as $k=>$v)<option value="{{ $k }}">{{ $v }}</option>@endforeach</select>
                    <input name="title" placeholder="Titre" class="flex-1 rounded-lg border border-slate-300 px-3 py-2 text-sm">
                </div>
                <textarea name="content" rows="2" placeholder="Détails…" class="w-full rounded-lg border border-slate-300 px-3 py-2 text-sm"></textarea>
                <x-btn type="submit">Ajouter</x-btn>
            </form>
        </x-card>
        <x-card title="Historique">
            @forelse($prospect->activities as $a)
                <div class="flex gap-3 py-3 border-b border-slate-50 last:border-0">
                    <div class="text-lg">{{ ['note'=>'📝','email'=>'✉️','appel'=>'📞','rendez-vous'=>'📅','activite'=>'⚡'][$a->type] ?? '•' }}</div>
                    <div class="flex-1">
                        <div class="flex justify-between gap-2">
                            <span class="font-medium text-sm">{{ $a->title ?: ucfirst($a->type) }}</span>
                            <div class="flex items-center gap-2 whitespace-nowrap">
                                <span class="text-xs text-slate-400">{{ $a->happened_at?->format('d/m/Y H:i') }}</span>
                                <form method="POST" action="{{ route('activities.destroy', $a) }}" onsubmit="return confirm('Supprimer cette entrée d\'historique ?')">@csrf @method('DELETE')
                                    <button class="text-slate-300 hover:text-rose-600 text-sm" title="Supprimer cette entrée">🗑️</button>
                                </form>
                            </div>
                        </div>
                        <p class="text-sm text-slate-600">{{ $a->content }}</p>
                        <span class="text-xs text-slate-400">{{ $a->user?->name }}</span>
                    </div>
                </div>
            @empty <x-empty message="Aucune activité enregistrée" /> @endforelse
        </x-card>
    </div>
</div>
@endsection