@extends('layouts.app')

@section('title', 'Quotes')

@section('content')
<div class="row align-items-center mb-4">
    <div class="col">
        <h2 class="h3 mb-0">Quotes</h2>
    </div>
    <div class="col-auto">
        <a href="{{ route('quotes.create') }}" class="btn btn-primary rounded-pill">
            <i class="fas fa-plus me-2"></i>New Quote
        </a>
        <a href="#" class="btn btn-outline-secondary rounded-pill ms-2">
            <i class="fas fa-file-import me-2"></i>Import Quotes
        </a>
    </div>
</div>

<!-- Status Filters -->
<div class="card border-0 shadow-sm rounded-4 mb-4">
    <div class="card-body p-3">
        <div class="nav nav-pills gap-2">
            <a href="{{ route('quotes.index', ['status' => 'all']) }}" class="nav-link rounded-pill {{ request('status', 'all') == 'all' ? 'active' : 'text-muted' }} small px-4">All</a>
            <a href="{{ route('quotes.index', ['status' => 'draft']) }}" class="nav-link rounded-pill {{ request('status') == 'draft' ? 'active' : 'text-muted' }} small px-4">Draft</a>
            <a href="{{ route('quotes.index', ['status' => 'sent']) }}" class="nav-link rounded-pill {{ request('status') == 'sent' ? 'active' : 'text-muted' }} small px-4">Sent</a>
            <a href="{{ route('quotes.index', ['status' => 'accepted']) }}" class="nav-link rounded-pill {{ request('status') == 'accepted' ? 'active' : 'text-muted' }} small px-4">Accepted</a>
            <a href="{{ route('quotes.index', ['status' => 'rejected']) }}" class="nav-link rounded-pill {{ request('status') == 'rejected' ? 'active' : 'text-muted' }} small px-4">Rejected</a>
        </div>
    </div>
</div>

<div class="card border-0 shadow-sm rounded-4 overflow-hidden">
    <div class="table-responsive">
        <table class="table table-hover align-middle mb-0">
            <thead class="bg-light">
                <tr>
                    <th class="ps-4">Date</th>
                    <th>Quote Number</th>
                    <th>Reference</th>
                    <th>Customer Name</th>
                    <th>Status</th>
                    <th>Amount</th>
                    <th class="text-end pe-4">Actions</th>
                </tr>
            </thead>
            <tbody>
                @forelse($quotes as $quote)
                <tr>
                    <td class="ps-4 small text-muted">{{ $quote->quote_date }}</td>
                    <td class="fw-bold">
                        <a href="{{ route('quotes.show', $quote->id) }}" class="text-decoration-none">{{ $quote->quote_number }}</a>
                    </td>
                    <td class="small text-muted">{{ $quote->reference_number ?: '-' }}</td>
                    <td>{{ $quote->customer->display_name ?: $quote->customer->name }}</td>
                    <td>
                        @php
                            $badgeClass = [
                                'draft' => 'bg-secondary',
                                'sent' => 'bg-primary',
                                'accepted' => 'bg-success',
                                'rejected' => 'bg-danger',
                            ][$quote->status] ?? 'bg-secondary';
                        @endphp
                        <span class="badge {{ $badgeClass }} rounded-pill px-3">{{ ucfirst($quote->status) }}</span>
                    </td>
                    <td class="fw-bold">{{ formatCurrency($quote->total_amount) }}</td>
                    <td class="text-end pe-4">
                        <div class="dropdown">
                            <button class="btn btn-light btn-sm rounded-circle" type="button" data-bs-toggle="dropdown">
                                <i class="fas fa-ellipsis-v"></i>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-end shadow border-0 rounded-3">
                                <li><a class="dropdown-item" href="{{ route('quotes.show', $quote->id) }}"><i class="fas fa-eye me-2 text-muted"></i>View</a></li>
                                <li><a class="dropdown-item" href="{{ route('quotes.edit', $quote->id) }}"><i class="fas fa-edit me-2 text-muted"></i>Edit</a></li>
                                @if($quote->status == 'accepted')
                                <li><hr class="dropdown-divider"></li>
                                <li><a class="dropdown-item text-primary" href="{{ route('quotes.convert', $quote->id) }}"><i class="fas fa-file-invoice me-2"></i>Convert to Invoice</a></li>
                                @endif
                                <li><hr class="dropdown-divider"></li>
                                <li>
                                    <form action="{{ route('quotes.destroy', $quote->id) }}" method="POST" onsubmit="return confirm('Delete this quote?')">
                                        @csrf @method('DELETE')
                                        <button class="dropdown-item text-danger"><i class="fas fa-trash-alt me-2"></i>Delete</button>
                                    </form>
                                </li>
                            </ul>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="7" class="text-center py-5">
                        <img src="https://via.placeholder.com/150x100?text=No+Quotes" alt="No data" class="mb-3 opacity-50">
                        <p class="text-muted mb-0">No quotes found. Start by creating a new one!</p>
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($quotes->hasPages())
    <div class="card-footer bg-white border-0 p-3">
        {{ $quotes->links() }}
    </div>
    @endif
</div>
@endsection