@extends('layouts.app')

@section('title', 'Manage Listings')

@section('content')
<div class="container-fluid">
    <div class="inside-body-campus">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header d-flex align-items-center justify-content-between flex-wrap gap-2 py-3">
                        <h3 class="m-0" >Listings Management</h3>
                        <div class="card-tools">
                            <a href="{{ route('principal.create.job') }}" class="btn btn-primary ">
                                <i class="fas fa-plus"></i> Add New job
                            </a>
                        </div>
                    </div>
                    <div class="card-body">
                        <!-- Filters -->
                        <form method="GET" action="{{ route('principal.my.jobs') }}" class="mb-4">
                            <div class="row g-3">

                                <!-- Search -->
                                <div class="col-sm-6 col-md-4 col-xxl-3">
                                    <input type="text" name="search" class="form-control"
                                        placeholder="Search jobs..." value="{{ request('search') }}">
                                </div>

                                <!-- Status -->
                                <div class="col-sm-6 col-md-3 col-xxl-2">
                                    <select name="status" class="form-select">
                                        <option value="">All Status</option>
                                        <option value="published" {{ request('status') == 'published' ? 'selected' : '' }}>Published</option>
                                        <option value="draft" {{ request('status') == 'draft' ? 'selected' : '' }}>Draft</option>
                                        <option value="expired" {{ request('status') == 'expired' ? 'selected' : '' }}>Expired</option>
                                    </select>
                                </div>

                                <!-- Job Type -->
                                <div class="col-sm-6 col-md-3 col-xxl-2">
                                    <select name="job_type" class="form-select">
                                        <option value="">All Job Types</option>
                                        <option value="full_time" {{ request('job_type') == 'full_time' ? 'selected' : '' }}>Full Time</option>
                                        <option value="part_time" {{ request('job_type') == 'part_time' ? 'selected' : '' }}>Part Time</option>
                                        <option value="contract" {{ request('job_type') == 'contract' ? 'selected' : '' }}>Contract</option>
                                        <option value="internship" {{ request('job_type') == 'internship' ? 'selected' : '' }}>Internship</option>
                                        <option value="freelance" {{ request('job_type') == 'freelance' ? 'selected' : '' }}>Freelance</option>
                                    </select>
                                </div>

                                <!-- Work Mode -->
                                <div class="col-sm-6 col-md-3 col-xxl-2">
                                    <select name="work_mode" class="form-select">
                                        <option value="">All Modes</option>
                                        <option value="remote" {{ request('work_mode') == 'remote' ? 'selected' : '' }}>Remote</option>
                                        <option value="onsite" {{ request('work_mode') == 'onsite' ? 'selected' : '' }}>Onsite</option>
                                        <option value="hybrid" {{ request('work_mode') == 'hybrid' ? 'selected' : '' }}>Hybrid</option>
                                    </select>
                                </div>

                                <!-- Salary Range -->
                                <div class="col-sm-6 col-md-3 col-xxl-2">
                                    <input type="number" name="salary_min" class="form-control"
                                        placeholder="Min Salary" value="{{ request('salary_min') }}">
                                </div>

                                <div class="col-sm-6 col-md-3 col-xxl-2">
                                    <input type="number" name="salary_max" class="form-control"
                                        placeholder="Max Salary" value="{{ request('salary_max') }}">
                                </div>

                                <!-- Buttons -->
                                <div class="col-12 col-md-6 col-xxl-3 d-flex gap-2">
                                    <button type="submit" class="btn btn-primary w-100">Filter</button>
                                    <a href="{{ route('principal.my.jobs') }}" class="btn btn-secondary w-100">Reset</a>
                                </div>

                            </div>
                        </form>

                        <!-- Listings Table -->
                        <div class="table-responsive">
                            <table class="table table-bordered table-hover align-middle">
                                <thead class="table-light">
                                    <tr>
                                        <th>#</th>
                                        <th>Image</th>
                                        <th>Title</th>
                                        <th>Job Type</th>
                                        <th>Work Mode</th>
                                        <th>Salary</th>
                                        <th>Status</th>
                                        <th>Posted</th>
                                        <th width="140">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($jobs as $job)
                                    <tr>
                                        <td>{{ $job->id }}</td>

                                        <!-- Image -->
                                        <td>
                                            @if($job->featuredImage)
                                                <img src="{{ asset('storage/'.$job->featuredImage->file_path) }}"
                                                    width="50" height="50"
                                                    style="object-fit:cover;border-radius:6px;">
                                            @else
                                                <div class="bg-light d-flex align-items-center justify-content-center"
                                                    style="width:50px;height:50px;border-radius:6px;">
                                                    <i class="fas fa-image text-muted"></i>
                                                </div>
                                            @endif
                                        </td>

                                        <!-- Title -->
                                        <td>
                                            <strong>{{ $job->title }}</strong><br>
                                            <small class="text-muted">{{ Str::limit($job->description, 50) }}</small>
                                        </td>
                                        <!-- Job Type -->
                                        <td>
                                            <span class="badge bg-info text-dark">
                                                {{ ucfirst(str_replace('_',' ',$job->job_type)) }}
                                            </span>
                                        </td>

                                        <!-- Work Mode -->
                                        <td>
                                            <span class="badge bg-secondary">
                                                {{ ucfirst($job->work_mode) }}
                                            </span>
                                        </td>

                                        <!-- Salary -->
                                        <td>
                                            @if($job->salary_min && $job->salary_max)
                                                ₹{{ number_format($job->salary_min) }} -
                                                ₹{{ number_format($job->salary_max) }}
                                            @else
                                                <span class="text-muted">Not Disclosed</span>
                                            @endif
                                        </td>

                                        <!-- Status -->
                                        <td>
                                            @php
                                                $statusClass = [
                                                    'published' => 'success',
                                                    'draft' => 'secondary',
                                                    'expired' => 'danger',
                                                ];
                                            @endphp

                                            <span class="badge bg-{{ $statusClass[$job->status] ?? 'secondary' }}">
                                                {{ ucfirst($job->status) }}
                                            </span>
                                        </td>

                                        <!-- Date -->
                                        <td>{{ $job->created_at->format('d M Y') }}</td>

                                        <!-- Actions -->
                                        <td>
                                            <a href="#"
                                            class="btn btn-sm btn-info">
                                                <i class="fas fa-eye"></i>
                                            </a>

                                            <a href="#"
                                            class="btn btn-sm btn-primary">
                                                <i class="fas fa-edit"></i>
                                            </a>

                                            <form action="#"
                                                method="POST" class="d-inline"
                                                onsubmit="return confirm('Delete this job?')">
                                                @csrf
                                                @method('DELETE')

                                                <button class="btn btn-sm btn-danger">
                                                    <i class="fas fa-trash"></i>
                                                </button>
                                            </form>
                                        </td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="10" class="text-center text-muted">
                                            No jobs found
                                        </td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>

                            
                        </div>

                        <!-- Pagination -->
                        <div class="mt-3">
                            {{ $jobs->links() }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection