@extends('layouts.app')

@php
    $eyebrow = 'Manage';
    $pageTitle = $title;
@endphp

@section('content')

<div class="d-flex flex-wrap justify-content-between align-items-center mb-3 gap-2">
    <div>
        @if($description)<p class="text-muted mb-0">{{ $description }}</p>@endif
    </div>
    <div class="d-flex align-items-center gap-2">
        <div class="search-box">
            <i class="bi bi-search"></i>
            <input type="text" id="rowSearch" class="form-control form-control-sm" placeholder="Search {{ strtolower($title) }}...">
        </div>
        <a href="{{ route($table.'.create') }}" class="btn btn-brand btn-sm">
            <i class="bi bi-plus-lg me-1"></i>New
        </a>
    </div>
</div>

<div class="surface-card">
    <div class="table-responsive">
        <table class="table table-modern mb-0 align-middle" id="rowsTable">
            <thead>
                <tr>
                    @foreach($fields as $f)
                        @continue(!empty($f['hideInTable']))
                        <th>{{ $f['label'] }}</th>
                    @endforeach
                    <th class="text-end">Actions</th>
                </tr>
            </thead>
            <tbody>
                @forelse($rows as $row)
                    <tr>
                        @foreach($fields as $f)
                            @continue(!empty($f['hideInTable']))
                            <td>
                                @php
                                    $type = $f['type'] ?? null;
                                    $val = $row->{$f['name']};
                                @endphp

                                @if($type === 'money')
                                    <span class="fw-semibold">${{ number_format((float) $val, 2) }}</span>
                                @elseif($type === 'reference')
                                    @php
                                        $relation = \Illuminate\Support\Str::camel(\Illuminate\Support\Str::before($f['name'], '_id'));
                                        $related = $row->{$relation} ?? null;
                                        $relLabel = $related ? ($related->{$f['refLabel'] ?? 'name'} ?? '—') : '—';
                                    @endphp
                                    @if($related)
                                        <span class="badge-status st-blue">{{ $relLabel }}</span>
                                    @else
                                        <span class="text-muted">—</span>
                                    @endif
                                @elseif(in_array($type, ['file', 'image']))
                                    @if($val)
                                        @if($type === 'image')
                                            <a href="{{ \Illuminate\Support\Facades\Storage::url($val) }}" target="_blank">
                                                <img src="{{ \Illuminate\Support\Facades\Storage::url($val) }}" class="row-thumb" alt="">
                                            </a>
                                        @else
                                            <a href="{{ \Illuminate\Support\Facades\Storage::url($val) }}" target="_blank" class="fw-semibold">
                                                <i class="bi bi-file-earmark-arrow-down me-1"></i>View
                                            </a>
                                        @endif
                                    @else
                                        <span class="text-muted">—</span>
                                    @endif
                                @elseif($type === 'select')
                                    @php
                                        $statusColors = [
                                            'active' => 'st-green', 'occupied' => 'st-green', 'renewed' => 'st-blue',
                                            'vacant' => 'st-gray', 'draft' => 'st-gray', 'moved out' => 'st-gray',
                                            'notice given' => 'st-orange', 'expiring' => 'st-orange', 'reserved' => 'st-orange', 'under maintenance' => 'st-orange',
                                            'expired' => 'st-red', 'terminated' => 'st-red', 'blacklisted' => 'st-red', 'unavailable' => 'st-red',
                                        ];
                                        $cls = $statusColors[$val] ?? 'st-violet';
                                    @endphp
                                    <span class="badge-status {{ $cls }}">{{ $val ?? '—' }}</span>
                                @elseif($type === 'checkbox')
                                    @if($val)
                                        <span class="badge-status st-green"><i class="bi bi-check-lg"></i>Yes</span>
                                    @else
                                        <span class="badge-status st-gray">No</span>
                                    @endif
                                @else
                                    {{ $val ?? '—' }}
                                @endif
                            </td>
                        @endforeach
                        <td class="text-end text-nowrap">
                            <a href="{{ route($table.'.edit', $row->id) }}" class="btn btn-sm btn-outline-secondary">
                                <i class="bi bi-pencil-fill"></i>
                            </a>
                            <form method="POST" action="{{ route($table.'.destroy', $row->id) }}" class="d-inline"
                                  onsubmit="return confirm('Delete this record? This cannot be undone.')">
                                @csrf
                                @method('DELETE')
                                <button class="btn btn-sm btn-outline-danger">
                                    <i class="bi bi-trash-fill"></i>
                                </button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="{{ count($fields) + 1 }}">
                            <div class="empty-state">
                                <div class="icon-wrap"><i class="bi bi-inbox"></i></div>
                                <p class="fw-semibold mb-1">Nothing here yet</p>
                                <p class="text-muted small mb-3">Use the New button to add your first record.</p>
                                <a href="{{ route($table.'.create') }}" class="btn btn-brand btn-sm">
                                    <i class="bi bi-plus-lg me-1"></i>New {{ \Illuminate\Support\Str::singular($title) }}
                                </a>
                            </div>
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection

@section('scripts')
<script>
    const searchInput = document.getElementById('rowSearch');
    const table = document.getElementById('rowsTable');
    searchInput?.addEventListener('input', function () {
        const q = this.value.trim().toLowerCase();
        table.querySelectorAll('tbody tr').forEach(function (row) {
            row.style.display = row.textContent.toLowerCase().includes(q) ? '' : 'none';
        });
    });
</script>
@endsection