@extends('admin.layouts.app')

@section('title', 'Create Job Position')
@section('page-title', 'Thêm Vị trí Tuyển dụng Mới')

@section('content')
<div class="max-w-4xl mx-auto">
    <form method="POST" action="{{ route('admin.job-positions.store') }}" class="space-y-6">
        @csrf
        
        <div class="bg-white shadow rounded-lg p-6">
            <h3 class="text-lg font-medium text-gray-900 mb-4">Thông tin cơ bản</h3>
            
            <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
                <div>
                    <label for="title" class="block text-sm font-medium text-gray-700 mb-2 ">Tiêu đề vị trí *</label>
                    <input type="text" name="title" id="title" value="{{ old('title') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                    @error('title')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="department" class="block text-sm font-medium text-gray-700 mb-2">Phòng ban *</label>
                    <select name="department" id="department" 
                            class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                        <option value="">Chọn phòng ban</option>
                        <option value="IT" {{ old('department') == 'IT' ? 'selected' : '' }}>IT</option>
                        <option value="Marketing" {{ old('department') == 'Marketing' ? 'selected' : '' }}>Marketing</option>
                        <option value="Sales" {{ old('department') == 'Sales' ? 'selected' : '' }}>Sales</option>
                        <option value="HR" {{ old('department') == 'HR' ? 'selected' : '' }}>HR</option>
                        <option value="Finance" {{ old('department') == 'Finance' ? 'selected' : '' }}>Finance</option>
                    </select>
                    @error('department')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="location" class="block text-sm font-medium text-gray-700 mb-2">Địa điểm *</label>
                    <input type="text" name="location" id="location" value="{{ old('location') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                    @error('location')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="employment_type" class="block text-sm font-medium text-gray-700 mb-2">Loại hình công việc *</label>
                    <select name="employment_type" id="employment_type" 
                            class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                        <option value="">Chọn loại hình</option>
                        <option value="full-time" {{ old('employment_type') == 'full-time' ? 'selected' : '' }}>Toàn thời gian</option>
                        <option value="part-time" {{ old('employment_type') == 'part-time' ? 'selected' : '' }}>Bán thời gian</option>
                        <option value="contract" {{ old('employment_type') == 'contract' ? 'selected' : '' }}>Hợp đồng</option>
                        <option value="internship" {{ old('employment_type') == 'internship' ? 'selected' : '' }}>Thực tập</option>
                    </select>
                    @error('employment_type')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="experience_level" class="block text-sm font-medium text-gray-700 mb-2">Cấp độ kinh nghiệm *</label>
                    <select name="experience_level" id="experience_level" 
                            class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                        <option value="">Chọn cấp độ</option>
                        <option value="entry" {{ old('experience_level') == 'entry' ? 'selected' : '' }}>Mới tốt nghiệp</option>
                        <option value="mid" {{ old('experience_level') == 'mid' ? 'selected' : '' }}>Trung cấp</option>
                        <option value="senior" {{ old('experience_level') == 'senior' ? 'selected' : '' }}>Cao cấp</option>
                        <option value="executive" {{ old('experience_level') == 'executive' ? 'selected' : '' }}>Quản lý</option>
                    </select>
                    @error('experience_level')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="status" class="block text-sm font-medium text-gray-700 mb-2">Trạng thái *</label>
                    <select name="status" id="status" 
                            class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                        <option value="active" {{ old('status') == 'active' ? 'selected' : '' }}>Đang tuyển</option>
                        <option value="inactive" {{ old('status') == 'inactive' ? 'selected' : '' }}>Tạm dừng</option>
                        <option value="closed" {{ old('status') == 'closed' ? 'selected' : '' }}>Đã đóng</option>
                    </select>
                    @error('status')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
            </div>
        </div>
        
        <div class="bg-white shadow rounded-lg p-6">
            <h3 class="text-lg font-medium text-gray-900 mb-4">Mô tả công việc</h3>
            
            <div class="space-y-6">
                <div>
                    <label for="description" class="block text-sm font-medium text-gray-700 mb-2">Mô tả công việc *</label>
                    <textarea name="description" id="description" rows="6" 
                              class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>{{ old('description') }}</textarea>
                    @error('description')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="requirements" class="block text-sm font-medium text-gray-700 mb-2">Yêu cầu *</label>
                    <textarea name="requirements" id="requirements" rows="6" 
                              class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>{{ old('requirements') }}</textarea>
                    @error('requirements')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="benefits" class="block text-sm font-medium text-gray-700 mb-2">Quyền lợi *</label>
                    <textarea name="benefits" id="benefits" rows="4" 
                              class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>{{ old('benefits') }}</textarea>
                    @error('benefits')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
            </div>
        </div>
        
        <div class="bg-white shadow rounded-lg p-6">
            <h3 class="text-lg font-medium text-gray-900 mb-4">Thông tin lương và thời gian</h3>
            
            <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
                <div>
                    <label for="salary_min" class="block text-sm font-medium text-gray-700 mb-2">Lương tối thiểu</label>
                    <input type="number" name="salary_min" id="salary_min" value="{{ old('salary_min') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" min="0">
                    @error('salary_min')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="salary_max" class="block text-sm font-medium text-gray-700 mb-2">Lương tối đa</label>
                    <input type="number" name="salary_max" id="salary_max" value="{{ old('salary_max') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" min="0">
                    @error('salary_max')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="currency" class="block text-sm font-medium text-gray-700 mb-2">Đơn vị tiền tệ *</label>
                    <select name="currency" id="currency" 
                            class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" required>
                        <option value="VND" {{ old('currency') == 'VND' ? 'selected' : '' }}>VND</option>
                        <option value="USD" {{ old('currency') == 'USD' ? 'selected' : '' }}>USD</option>
                    </select>
                    @error('currency')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="max_applications" class="block text-sm font-medium text-gray-700 mb-2">Số lượng ứng viên tối đa</label>
                    <input type="number" name="max_applications" id="max_applications" value="{{ old('max_applications') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" min="1">
                    @error('max_applications')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="application_deadline" class="block text-sm font-medium text-gray-700 mb-2">Hạn nộp hồ sơ</label>
                    <input type="date" name="application_deadline" id="application_deadline" value="{{ old('application_deadline') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('application_deadline')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
                
                <div>
                    <label for="start_date" class="block text-sm font-medium text-gray-700 mb-2">Ngày bắt đầu làm việc</label>
                    <input type="date" name="start_date" id="start_date" value="{{ old('start_date') }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
                    @error('start_date')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
            </div>
        </div>
        
        <div class="bg-white shadow rounded-lg p-6">
            <h3 class="text-lg font-medium text-gray-900 mb-4">Cài đặt khác</h3>
            
            <div class="space-y-4">
                <div class="flex items-center">
                    <input type="checkbox" name="is_featured" id="is_featured" value="1" {{ old('is_featured') ? 'checked' : '' }}
                           class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">
                    <label for="is_featured" class="ml-2 block text-sm text-gray-900">
                        Vị trí nổi bật
                    </label>
                </div>
                
                <div>
                    <label for="sort_order" class="block text-sm font-medium text-gray-700 mb-2">Thứ tự sắp xếp</label>
                    <input type="number" name="sort_order" id="sort_order" value="{{ old('sort_order', 0) }}" 
                           class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500" min="0">
                    @error('sort_order')
                        <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
                    @enderror
                </div>
            </div>
        </div>
        
        <div class="flex justify-end space-x-4">
            <a href="{{ route('admin.job-positions.index') }}" 
               class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50">
                Hủy
            </a>
            <button type="submit" 
                    class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500">
                Lưu
            </button>
        </div>
    </form>
</div>
@endsection