@extends('layouts.app')

@push('pg_btn')
    <a href="{{ route('candidates.index') }}" class="btn btn-sm btn-neutral">All Candidates</a>
@endpush

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card mb-5">
                <div class="card-body">
                    {!! Form::open(['route' => 'candidates.store', 'files' => true]) !!}
                        <h6 class="heading-small text-muted mb-4">Candidate information</h6>
                        <div class="pl-lg-4">
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('name', 'Candidate Name', ['class' => 'form-control-label']) }}
                                        {{ Form::text('name', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('nic', 'CNIC/Passport', ['class' => 'form-control-label']) }}
                                        {{ Form::text('nic', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('email', 'E-mail', ['class' => 'form-control-label']) }}
                                        {{ Form::email('email', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('company_name', 'Company Name', ['class' => 'form-control-label']) }}
                                        {{ Form::text('company_name', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('certificate_type_id', 'Certificate Type', ['class' => 'form-control-label']) }}
                                        {{ Form::select('certificate_type_id', $certificateTypes, null, ['class'=> 'selectpicker form-control', 'placeholder' => 'Select certificate type']) }}
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('instructor_id', 'Instructor', ['class' => 'form-control-label']) }}
                                        {{ Form::select('instructor_id', $instructors, null, ['class'=> 'selectpicker form-control', 'placeholder' => 'Select instructor']) }}
                                    </div>
                                </div>
                            </div>

                            <div class="row align-items-end">
                                <div class="col-lg-4">
                                    <div class="form-group">
                                        {{ Form::label('issue_date', 'Issue Date', ['class' => 'form-control-label']) }}
                                        {{ Form::date('issue_date', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                                <div class="col-lg-4">
                                    <div class="form-group mb-3">
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input" id="set_expiry" name="set_expiry" value="1">
                                            <label class="custom-control-label" for="set_expiry">Set Expiry</label>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="row" id="expiry_fields" style="display:none;">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('valid_from', 'Valid From', ['class' => 'form-control-label']) }}
                                        {{ Form::date('valid_from', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('valid_until', 'Valid Until', ['class' => 'form-control-label']) }}
                                        {{ Form::date('valid_until', null, ['class' => 'form-control']) }}
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        {{ Form::label('profile_photo', 'Photo', ['class' => 'form-control-label d-block']) }}
                                        <input id="profile_photo" class="form-control" type="file" name="profile_photo" accept="image/*">
                                    </div>
                                </div>
                            </div>

                        </div>

                        <hr class="my-4" />
                        <div class="pl-lg-4">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="custom-control custom-checkbox">
                                        <input type="checkbox" name="status" value="1" class="custom-control-input" id="status" checked>
                                        {{ Form::label('status', 'Active', ['class' => 'custom-control-label']) }}
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    {{ Form::submit('Submit', ['class'=> 'mt-5 btn btn-primary']) }}
                                </div>
                            </div>
                        </div>
                    {!! Form::close() !!}
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
<script>
    document.getElementById('set_expiry').addEventListener('change', function () {
        var fields = document.getElementById('expiry_fields');
        fields.style.display = this.checked ? 'flex' : 'none';
        if (!this.checked) {
            fields.querySelectorAll('input[type="date"]').forEach(function (el) {
                el.value = '';
            });
        }
    });
</script>
@endpush