Files
jobifygarden/resources/views/jobs/category.blade.php
T
2026-04-04 02:14:57 +03:00

145 lines
7.0 KiB
PHP

@extends('layouts.app')
@section('title', $category->name . ' Jobs - JobifyGarden')
@section('description', 'Browse ' . $jobs->total() . ' ' . $category->name . ' job opportunities. ' . ($category->description ?? 'Find your next career in ' . $category->name . '.'))
@section('canonical', route('jobs.category', $category->slug))
@push('structured_data')
<script type="application/ld+json">
{!! json_encode(app(\App\Services\SeoService::class)->generateBreadcrumbStructuredData([
['name' => 'Home', 'url' => route('home')],
['name' => 'Jobs', 'url' => route('jobs.index')],
['name' => $category->name, 'url' => route('jobs.category', $category->slug)]
]), JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT) !!}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "CollectionPage",
"name": "{{ $category->name }} Jobs",
"description": "{{ 'Browse ' . $jobs->total() . ' ' . $category->name . ' job opportunities' }}",
"url": "{{ route('jobs.category', $category->slug) }}"
}
</script>
@endpush
@section('content')
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<!-- Page Header -->
<div class="py-8">
<div class="flex items-center mb-4">
<span class="text-4xl mr-3">{{ $category->icon ?? '📁' }}</span>
<div>
<h1 class="text-3xl font-bold text-gray-900">{{ $category->name }} Jobs</h1>
@if($category->description)
<p class="text-gray-600 mt-1">{{ $category->description }}</p>
@endif
</div>
</div>
<p class="text-gray-600">{{ $jobs->total() }} jobs found in this category</p>
</div>
<div class="grid grid-cols-1 lg:grid-cols-4 gap-8">
<!-- Filters Sidebar -->
<aside class="lg:col-span-1">
<div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6 sticky top-4">
<h2 class="text-lg font-semibold text-gray-900 mb-4">Filters</h2>
<form action="{{ route('jobs.category', $category->slug) }}" method="GET" class="space-y-6">
<!-- Keywords -->
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">Keywords</label>
<input type="text"
name="keywords"
value="{{ $filters['keywords'] ?? '' }}"
placeholder="Job title, skills..."
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-emerald-500 focus:border-emerald-500">
</div>
<!-- Location -->
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">Location</label>
<input type="text"
name="location"
value="{{ $filters['location'] ?? '' }}"
placeholder="City, state, or country"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-emerald-500 focus:border-emerald-500">
</div>
<!-- Job Type -->
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">Job Type</label>
<select name="job_type"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-emerald-500 focus:border-emerald-500">
<option value="">All Types</option>
@foreach($filterOptions['job_types'] ?? [] as $type)
<option value="{{ $type }}" {{ ($filters['job_type'] ?? '') == $type ? 'selected' : '' }}>
{{ ucfirst(str_replace('_', ' ', $type)) }}
</option>
@endforeach
</select>
</div>
<!-- Experience Level -->
<div>
<label class="block text-sm font-medium text-gray-700 mb-2">Experience Level</label>
<select name="experience_level"
class="w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-emerald-500 focus:border-emerald-500">
<option value="">All Levels</option>
@foreach($filterOptions['experience_levels'] ?? [] as $level)
<option value="{{ $level }}" {{ ($filters['experience_level'] ?? '') == $level ? 'selected' : '' }}>
{{ ucfirst(str_replace('_', ' ', $level)) }}
</option>
@endforeach
</select>
</div>
<!-- Remote -->
<div>
<label class="flex items-center">
<input type="checkbox"
name="remote"
value="1"
{{ ($filters['remote'] ?? false) ? 'checked' : '' }}
class="rounded border-gray-300 text-emerald-600 focus:ring-emerald-500">
<span class="ml-2 text-sm text-gray-700">Remote jobs only</span>
</label>
</div>
<!-- Submit Button -->
<button type="submit"
class="w-full px-4 py-2 bg-emerald-600 hover:bg-emerald-700 text-white font-medium rounded-md transition-colors duration-200">
Apply Filters
</button>
</form>
</div>
</aside>
<!-- Jobs List -->
<div class="lg:col-span-3">
@if($jobs->count() > 0)
<div class="space-y-4">
@foreach($jobs as $job)
<x-job-card :job="$job" />
@endforeach
</div>
<!-- Pagination -->
<div class="mt-8">
{{ $jobs->appends($filters)->links() }}
</div>
@else
<div class="bg-white rounded-lg border border-gray-200 p-12 text-center">
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
<h3 class="mt-2 text-sm font-medium text-gray-900">No jobs found</h3>
<p class="mt-1 text-sm text-gray-500">Try adjusting your search or filter criteria.</p>
</div>
@endif
</div>
</div>
</div>
@endsection