@props([
    'action',
    'method' => 'POST',
    'vacancy' => null,
    'departments',
    'jobRequestOptions',
    'submitLabel',
])
@php
    $deptOptions = $departments->mapWithKeys(fn ($d) => [$d->id => $d->name])->all();
@endphp

<form method="POST" action="{{ $action }}" novalidate>
    @csrf
    @if (strtoupper($method) !== 'POST')
        @method($method)
    @endif
    <div class="card">
        <div class="card-body">
            @if ($jobRequestOptions === [])
                <div class="alert alert-warning border-0 mb-4" role="status">
                    <strong class="d-block mb-1">{{ __('recruitment.vacancies.errors.no_approved_job_requests') }}</strong>
                    <p class="mb-3 small mb-0">{{ __('recruitment.vacancies.errors.create_job_request_first') }}</p>
                    <x-ui.buttons.primary
                        :href="route('hr.recruitment.job-requests.create')"
                        icon="fe fe-plus"
                        size="sm"
                    >
                        {{ __('recruitment.vacancies.errors.go_to_job_requests') }}
                    </x-ui.buttons.primary>
                </div>
            @endif
            <div class="row g-3" data-geo-cascade>
                <div class="col-md-6">
                    <x-ui.form.select
                        name="job_request_id"
                        :label="__('recruitment.vacancies.fields.job_request')"
                        :options="$jobRequestOptions"
                        :selected="old('job_request_id', $vacancy?->job_request_id)"
                        required
                    />
                </div>
                <div class="col-md-6">
                    <x-ui.form.input name="title" :label="__('recruitment.vacancies.fields.title')" :value="old('title', $vacancy?->title)" required />
                </div>
                <div class="col-md-4">
                    <x-ui.form.select name="department_id" :label="__('recruitment.vacancies.fields.department')" :options="$deptOptions" :selected="old('department_id', $vacancy?->department_id)" required />
                </div>
                <div class="col-md-4">
                    <x-ui.form.search-select
                        name="position_id"
                        lookup="positions"
                        lookup-parent="department_id"
                        :label="__('recruitment.vacancies.fields.position')"
                        :options="[]"
                        :selected="old('position_id', $vacancy?->position_id)"
                        :placeholder="__('common.select')"
                    />
                </div>
                <div class="col-md-2">
                    <x-ui.form.input name="openings" type="number" min="1" :label="__('recruitment.vacancies.fields.openings')" :value="old('openings', $vacancy?->openings ?? 1)" required />
                </div>
                <div class="col-md-2">
                    <x-ui.form.input name="closes_at" type="date" :label="__('recruitment.vacancies.fields.closes_at')" :value="old('closes_at', $vacancy?->closes_at?->format('Y-m-d'))" />
                </div>
                <div class="col-12">
                    <x-ui.form.input name="description" :label="__('recruitment.vacancies.fields.description')" :value="old('description', $vacancy?->description)" />
                </div>
            </div>
        </div>
        <div class="card-footer d-flex justify-content-end gap-2 bg-white">
            <x-ui.buttons.secondary :href="route('hr.recruitment.vacancies.index')">{{ __('common.cancel') }}</x-ui.buttons.secondary>
            <x-ui.buttons.primary type="submit">{{ $submitLabel }}</x-ui.buttons.primary>
        </div>
    </div>
</form>

@if ($vacancy ?? null)
    <form method="POST" action="{{ route('hr.recruitment.vacancies.portal-meta', $vacancy) }}" class="card border-0 shadow-sm mt-3">
        @csrf
        @method('PUT')
        <div class="card-body">
            <div class="row g-3">
                <div class="col-12"><strong>{{ __('recruitment.career_portal.seo_section') }}</strong></div>
                <div class="col-md-4">
                    <label class="form-label">{{ __('recruitment.career_portal.fields.seo_title') }}</label>
                    <input name="seo_title" class="form-control" value="{{ old('seo_title', $vacancy->seo_title) }}">
                </div>
                <div class="col-md-4">
                    <label class="form-label">{{ __('recruitment.career_portal.fields.seo_description') }}</label>
                    <input name="seo_description" class="form-control" value="{{ old('seo_description', $vacancy->seo_description) }}">
                </div>
                <div class="col-md-4">
                    <label class="form-label">{{ __('recruitment.career_portal.fields.seo_keywords') }}</label>
                    <input name="seo_keywords" class="form-control" value="{{ old('seo_keywords', $vacancy->seo_keywords) }}">
                </div>
                <div class="col-md-6">
                    <label class="form-check">
                        <input type="checkbox" name="is_featured" value="1" class="form-check-input" @checked(old('is_featured', $vacancy->is_featured))>
                        <span class="form-check-label">{{ __('recruitment.career_portal.fields.is_featured') }}</span>
                    </label>
                </div>
                <div class="col-md-6 text-end">
                    <x-ui.buttons.secondary type="submit">{{ __('recruitment.career_portal.actions.save_portal_meta') }}</x-ui.buttons.secondary>
                </div>
            </div>
        </div>
    </form>
@endif

@once
    @push('scripts')
        <script src="{{ asset('assets/admin/js/erp-geo-cascade.js') }}"></script>
    @endpush
@endonce
