@extends('welcome')

@section('content')
<!-- Breadcrumb -->
<nav class="hk-breadcrumb" aria-label="breadcrumb">
    <ol class="breadcrumb breadcrumb-light bg-transparent">
        <li class="breadcrumb-item"><a href="{{ route('ouvrier.index') }}">Ouvriers</a></li>
        <li class="breadcrumb-item active" aria-current="page">Détails Ouvrier</li>
    </ol>
</nav>
<!-- /Breadcrumb -->

<!-- Container -->
<div class="container">
    <div class="row">
        <!-- Left Column: Profile Card -->
        <div class="col-lg-4 col-md-5 mb-30">
            <div class="card card-profile shadow-sm border-0" style="border-radius: 12px; overflow: hidden;">
                <div class="card-header bg-primary text-center pt-40 pb-40 position-relative">
                    <div class="position-absolute" style="top: 15px; right: 15px;">
                        <a href="{{ route('ouvrier.edit', $ouvrier->id) }}" class="btn btn-xs btn-light" title="Modifier"><i class="fas fa-edit"></i></a>
                    </div>
                </div>
                <div class="card-body text-center position-relative pt-0">
                    <div class="d-flex justify-content-center" style="margin-top: -60px;">
                        @if(!empty($ouvrier->photo))
                            <img src="{{ asset('images/'.$ouvrier->photo) }}" class="avatar-img rounded-circle shadow-md bg-white p-1" style="width: 120px; height: 120px; object-fit: cover; border: 4px solid white;">
                        @else
                            <div class="avatar-img rounded-circle shadow-md bg-soft-primary text-primary d-flex align-items-center justify-content-center p-1" style="width: 120px; height: 120px; font-size: 3rem; font-weight: bold; border: 4px solid white; background-color: #e3f2fd !important;">
                                {{ strtoupper(substr($ouvrier->prenom, 0, 1) . substr($ouvrier->nom, 0, 1)) }}
                            </div>
                        @endif
                    </div>
                    
                    <h5 class="mt-15 mb-5" style="font-weight: 600;">{{ $ouvrier->prenom }} {{ $ouvrier->nom }}</h5>
                    <p class="text-muted mb-10">{{ $ouvrier->adresse ?? 'Adresse non spécifiée' }}</p>
                    
                    <div class="mb-20">
                        @if($ouvrier->etat)
                            <span class="badge badge-success">Actif / Validé</span>
                        @else
                            <span class="badge badge-danger">Inactif / Non Validé</span>
                        @endif
                    </div>
                    
                    <hr class="hr-light">
                    
                    <div class="text-left mt-20">
                        <div class="mb-15">
                            <span class="text-muted d-block" style="font-size: 0.8rem; text-transform: uppercase;">Métier / Spécialité</span>
                            <span style="font-weight: 500; font-size: 1rem;"><i class="fas fa-tools mr-10 text-primary"></i> {{ $ouvrier->sous_categorie ? $ouvrier->sous_categorie->nom : 'Non défini' }}</span>
                        </div>
                        <div class="mb-15">
                            <span class="text-muted d-block" style="font-size: 0.8rem; text-transform: uppercase;">Téléphone</span>
                            <span style="font-weight: 500; font-size: 1rem;"><i class="fas fa-phone mr-10 text-primary"></i> {{ $ouvrier->tel }}</span>
                        </div>
                        <div class="mb-15">
                            <span class="text-muted d-block" style="font-size: 0.8rem; text-transform: uppercase;">Note générale</span>
                            <span class="badge badge-soft-warning" style="font-size: 0.95rem; letter-spacing: 1px;"><i class="fas fa-star mr-5"></i> {{ $ouvrier->note }} / 5</span>
                        </div>
                        <div class="mb-15">
                            <span class="text-muted d-block" style="font-size: 0.8rem; text-transform: uppercase;">Code d'activation</span>
                            <span class="badge badge-soft-success" style="font-size: 0.95rem; letter-spacing: 1px;"><i class="fas fa-key mr-5"></i> {{ $ouvrier->code }}</span>
                        </div>
                        <div class="mb-15">
                            <span class="text-muted d-block" style="font-size: 0.8rem; text-transform: uppercase;">Inscrit depuis</span>
                            <span style="font-weight: 500;"><i class="far fa-calendar-alt mr-10 text-primary"></i> {{ $ouvrier->created_at ? $ouvrier->created_at->format('d/m/Y à H:i') : 'Inconnu' }}</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Right Column: Reservation History -->
        <div class="col-lg-8 col-md-7">
            <section class="hk-sec-wrapper shadow-sm border-0" style="border-radius: 12px;">
                <h5 class="hk-sec-title mb-20"><i class="fas fa-history mr-10 text-primary"></i>Missions & Réservations ({{ $ouvrier->reservations->count() }})</h5>
                
                @if($ouvrier->reservations->isEmpty())
                    <div class="text-center py-40">
                        <div class="mb-15 text-muted" style="font-size: 3rem;"><i class="far fa-folder-open"></i></div>
                        <p class="text-muted">Aucune mission enregistrée pour cet artisan.</p>
                    </div>
                @else
                    <div class="table-wrap">
                        <table class="table table-hover w-100 display">
                            <thead>
                                <tr>
                                    <th>Date</th>
                                    <th>Client</th>
                                    <th>Commentaire</th>
                                    <th>Note client</th>
                                    <th>État</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($ouvrier->reservations as $res)
                                    <tr>
                                        <td>{{ \Carbon\Carbon::parse($res->dater)->format('d/m/Y H:i') }}</td>
                                        <td>
                                            @if($res->client)
                                                <a href="{{ route('client.show', $res->client->id) }}" class="text-primary fw-500">
                                                    {{ $res->client->prenom }} {{ $res->client->nom }}
                                                </a>
                                            @else
                                                <span class="text-muted">Client supprimé</span>
                                            @endif
                                        </td>
                                        <td>
                                            <span class="text-muted" style="font-size: 0.9rem;">
                                                {{ !empty($res->commentaire) ? Str::limit($res->commentaire, 40) : 'Aucun commentaire' }}
                                            </span>
                                        </td>
                                        <td>
                                            @if($res->note > 0)
                                                <span class="text-warning"><i class="fas fa-star mr-5"></i>{{ $res->note }}</span>
                                            @else
                                                <span class="text-muted">Non noté</span>
                                            @endif
                                        </td>
                                        <td>
                                            @if($res->etat == 'terminé' || $res->validation == 1)
                                                <span class="badge badge-soft-success">Validée</span>
                                            @elseif($res->etat == 'annulé')
                                                <span class="badge badge-soft-danger">Annulée</span>
                                            @else
                                                <span class="badge badge-soft-warning">En cours</span>
                                            @endif
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </section>
        </div>
    </div>
</div>
@endsection