@extends('layouts.admin')

@section('page-title') Gestion des devis @endsection
@section('page-subtitle') Gestion et suivi des devis @endsection

@section('styles')
<link href="{{ asset('css/layouts/admin.css') }}?v={{ time() }}" rel="stylesheet">
<link href="{{ asset('css/pages/admin/components.css') }}?v={{ time() }}" rel="stylesheet">
<link href="{{ asset('css/pages/admin/quotes/index.css') }}?v={{ time() }}"rel="stylesheet">
@endsection

@section('scripts')
<script src="{{ asset('js/pages/admin/quotes/index.js') }}"></script>
@endsection

@section('content')
<div class="quotes-page">
    <div class="page-header-row">
        <div class="main-header-navigation">
            <div class="main-header-actions">
                <a href="{{ route('admin.quotes.create') }}" class="btn btn-primary">
                    <i class="fas fa-plus-circle me-1"></i>Demander un nouveau devis
                </a>
            </div>
        </div>
    </div>

    <div class="filters-card">
        <div class="filters-card-content">
            <!-- Barre de recherche -->
            <div class="search-box">
                <i class="fas fa-search search-box__icon"></i>
                <input type="text" class="search-box__input" placeholder="Rechercher une intervention..." id="search-input">
            </div>
        </div>
    </div>

    <div class="status-cards">
        <div class="status-card status-card--pending status-card--active" data-filter="pending">
            <div class="status-card__icon">
                <i class="fas fa-hourglass-half"></i>
            </div>
            <div class="status-card__content">
                <div class="status-card__title">En attente</div>
                <div class="status-card__count">0</div>
            </div>
        </div>

        <div class="status-card status-card--uploaded" data-filter="uploaded">
            <div class="status-card__icon">
                <i class="fas fa-file-upload"></i>
            </div>
            <div class="status-card__content">
                <div class="status-card__title">Devis uploadé</div>
                <div class="status-card__count">0</div>
            </div>
        </div>

        <div class="status-card status-card--approved" data-filter="approved">
            <div class="status-card__icon">
                <i class="fas fa-check-circle"></i>
            </div>
            <div class="status-card__content">
                <div class="status-card__title">Approuvé</div>
                <div class="status-card__count">0</div>
            </div>
        </div>

        <div class="status-card status-card--rejected" data-filter="rejected">
            <div class="status-card__icon">
                <i class="fas fa-times-circle"></i>
            </div>
            <div class="status-card__content">
                <div class="status-card__title">Rejeté</div>
                <div class="status-card__count">0</div>
            </div>
        </div>


        <div class="status-card status-card--all" data-filter="all">
            <div class="status-card__icon">
                <i class="fas fa-file-alt"></i>
            </div>
            <div class="status-card__content">
                <div class="status-card__title">Tous</div>
                <div class="status-card__count">0</div>
            </div>
        </div>
    </div>
    
    <!-- Conteneurs pour les devis par statut -->
    <div class="quotes-container" id="pending-container" data-status="pending">
        <!-- Les devis en attente seront affichés ici -->
        @include('admin.quotes.partials.empty-pending')
    </div>
    
    <div class="quotes-container d-none" id="uploaded-container" data-status="uploaded">
        <!-- Les devis uploadés seront affichés ici -->
        @include('admin.quotes.partials.empty-uploaded')
    </div>
    
    <div class="quotes-container d-none" id="approved-container" data-status="approved">
        <!-- Les devis approuvés seront affichés ici -->
        @include('admin.quotes.partials.empty-approved')
    </div>
    
    <div class="quotes-container d-none" id="rejected-container" data-status="rejected">
        <!-- Les devis rejetés seront affichés ici -->
        @include('admin.quotes.partials.empty-rejected')
    </div>
    
    <div class="quotes-container d-none" id="all-container" data-status="all">
        <!-- Tous les devis seront affichés ici -->
        @include('admin.quotes.partials.empty-all')
    </div>
</div>
@endsection