@extends('master')
@section('content')
    <div class="page-wrapper">
        <div class="content">
            <div class="page-header">
                <div class="page-title">
                    <h4>{{ __('sitelabel.AddNewLeaveApplication') }}</h4>
                    <h6>{{ __('sitelabel.CreatenewLeaveApplication') }}</h6>
                </div>
            </div>

            <form method="post" action="{{ url('/leaveapplicationprocess') }}" enctype="multipart/form-data">
                @csrf
                <div class="card">
                    <div class="card-body">
                        <div class="row">
                            <!-- Employee Selection -->
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Employee') }}<span class="text-danger">*</span></label>
                                    <select class="form-select" name="employee_id" id="employee_id">
                                        <option value="">{{ __('sitelabel.SelectEmployee') }}</option>
                                        @foreach ($employees as $id => $name)
                                            <option value="{{ $id }}"
                                                {{ old('employee_id') == $id ? 'selected' : '' }}>
                                                {{ $name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('employee_id')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- Leave Type Selection -->
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.LeaveType') }}<span class="text-danger">*</span></label>
                                    <select class="form-select" name="leave_type_id" id="leave_type_id">
                                        <option value="">{{ __('sitelabel.SelectLeaveType') }}</option>
                                        @foreach ($leaveTypes as $id => $name)
                                            <option value="{{ $id }}"
                                                {{ old('leave_type_id') == $id ? 'selected' : '' }}>
                                                {{ $name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('leave_type_id')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- From Date -->
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.FromDate') }}<span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" name="from_date"
                                        value="{{ old('from_date', date('Y-m-d')) }}">
                                    @error('from_date')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- To Date -->
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.ToDate') }}<span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" name="to_date"
                                        value="{{ old('to_date', date('Y-m-d')) }}">
                                    @error('to_date')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- Leave Status (Full/Half) -->
                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.LeaveStatus') }}<span class="text-danger">*</span></label>
                                    <select class="form-select" name="leave_status" id="leave_status">
                                        <option value="Full" {{ old('leave_status') == 'Full' ? 'selected' : '' }}>
                                            {{ __('sitelabel.Full') }}
                                        </option>
                                        <option value="Half" {{ old('leave_status') == 'Half' ? 'selected' : '' }}>
                                            {{ __('sitelabel.Half') }}
                                        </option>
                                    </select>
                                    @error('leave_status')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- First/Second Half (only visible if Half is selected) -->
                            <div class="col-lg-3 col-sm-6 col-12" id="half_day_section" style="display:none;">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.FirstSecondHalf') }}<span class="text-danger">*</span></label>
                                    <select class="form-select" name="first_second_half" id="first_second_half">
                                        <option value="First" {{ old('first_second_half') == 'First' ? 'selected' : '' }}>
                                            {{ __('sitelabel.First') }}
                                        </option>
                                        <option value="Second"
                                            {{ old('first_second_half') == 'Second' ? 'selected' : '' }}>
                                            {{ __('sitelabel.Second') }}
                                        </option>
                                    </select>
                                    @error('first_second_half')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-3 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Status') }}</label>
                                    <input class="form-check-input" type="checkbox" id="status" name="status"
                                        value="1" {{ old('status', 1) ? 'checked' : '' }}>

                                </div>
                            </div>

                            <!-- Remarks -->
                            <div class="col-lg-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Remarks') }}</label>
                                    <textarea class="form-control" name="remarks" rows="3" placeholder="{{ __('sitelabel.EnterRemarks') }}">{{ old('remarks') }}</textarea>
                                    @error('remarks')
                                        <span class="text-danger">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- Form Buttons -->
                            <div class="col-lg-12">
                                <button type="submit" class="btn btn-primary">{{ __('sitelabel.Save') }}</button>
                                <button type="button"
                                    onclick="javascript:window.location='{{ url('/leaveapplication') }}';"
                                    class="btn btn-dark">{{ __('sitelabel.Back') }}</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('script')
    <script>
        $(document).ready(function() {
            // Initialize Select2
            $('#employee_id, #leave_type_id, #leave_status, #first_second_half').select2({
                theme: "bootstrap-5",
                width: '100%'
            });

            // Show/hide half day section based on leave status
            $('#leave_status').on('change', function() {
                if ($(this).val() == 'Half') {
                    $('#half_day_section').show();
                } else {
                    $('#half_day_section').hide();
                }
            });

            // Trigger on page load for edit cases
            if ($('#leave_status').val() == 'Half') {
                $('#half_day_section').show();
            }

            // If language is Urdu, enable Urdu text input
            @if (session()->get('locale') == 'ur')
                MakeTextBoxUrduEnabled(remarks);
            @endif
        });
    </script>
@endsection