@extends('master')
@section('content')
    <div class="page-wrapper">
        <div class="content">
            <div class="page-header">
                <div class="page-title">
                    <h4>{{ __('sitelabel.EditLeaveRequest') }}</h4>
                    <h6>{{ __('sitelabel.UpdateLeaveRequest') }}</h6>
                </div>
            </div>
            <div class="card">
                <div class="card-body">
                    <form action="{{ route('editleaverequestprocess') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <input type="hidden" name="id" value="{{ $leaveRequest->Id }}">
                        <div class="row">
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.DocumentType') }} <span class="manitory">*</span></label>
                                    <select name="document_type_id" class="form-control" disabled>
                                        @foreach ($lookupData['document_types'] as $type)
                                            <option value="{{ $type->Id }}"
                                                {{ $type->Id == $leaveRequest->DocumentTypeId ? 'selected' : '' }}>
                                                {{ $type->Name }}</option>
                                        @endforeach
                                    </select>
                                    <input type="hidden" name="document_type_id"
                                        value="{{ $leaveRequest->DocumentTypeId }}">
                                </div>
                            </div>
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.DocumentStatus') }} <span class="manitory">*</span></label>
                                    <select name="document_status_id" class="form-control" disabled>
                                        @foreach ($lookupData['document_statuses'] as $status)
                                            <option value="{{ $status->Id }}"
                                                {{ $status->Id == $leaveRequest->DocumentStatusId ? 'selected' : '' }}>
                                                {{ $status->Name }}</option>
                                        @endforeach
                                    </select>
                                    <input type="hidden" name="document_status_id"
                                        value="{{ $leaveRequest->DocumentStatusId }}">
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label>Request Date <span class="text-danger">*</span></label>
                                    <input type="date" name="leave_request_date" class="form-control"
                                        value="{{ old('leave_request_date', $leaveRequest->LeaveRequestDate) }}">
                                    @error('leave_request_date')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.LeaveType') }} <span class="manitory">*</span></label>
                                    <select name="leave_type_id" class="form-control" id="cmbleavetype">
                                        <option value="">{{ __('sitelabel.SelectLeaveType') }}</option>
                                        @foreach ($lookupData['app_hr_att_leave_type'] as $type)
                                            <option value="{{ $type->Id }}"
                                                {{ $type->Id == $leaveRequest->LeaveTypeId ? 'selected' : '' }}>
                                                {{ $type->Name }}</option>
                                        @endforeach
                                    </select>
                                    @error('leave_type_id')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label>Start Date <span class="text-danger">*</span></label>
                                    <input type="date" name="start_date" id="startDate" class="form-control"
                                        value="{{ old('start_date', $leaveRequest->StartDate) }}">
                                    @error('start_date')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label>End Date <span class="text-danger">*</span></label>
                                    <input type="date" name="end_date" id="endDate" class="form-control"
                                        value="{{ old('end_date', $leaveRequest->EndDate) }}">
                                    @error('end_date')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Status') }}</label>
                                    <input type="checkbox" name="status" class="form-check-input"
                                        {{ $leaveRequest->Status ? 'checked' : '' }}>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.FullHalyDay') }}</label>
                                    <input type="checkbox" name="full_half_day" id="fullHalfDay" class="form-check-input"
                                        {{ $leaveRequest->FullHalyDay ? 'checked' : '' }}>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.FirstSecondHalf') }}</label>
                                    <select name="first_second_half" id="firstSecondHalf" class="form-control"
                                        {{ $leaveRequest->FullHalyDay ? 'disabled' : '' }}>
                                        <option value="2" {{ $leaveRequest->FirstSecondHalf == 2 ? 'selected' : '' }}>
                                            First Half</option>
                                        <option value="3" {{ $leaveRequest->FirstSecondHalf == 3 ? 'selected' : '' }}>
                                            Second Half</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-4 col-sm-6 col-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Document') }}</label>
                                    <input type="file" name="document_file" class="form-control">

                                    @if ($leaveRequest->LeaveDocument && $leaveRequest->LeaveDocument != 'NoDocument')
                                        <div class="mt-2 document-preview">
                                            <a href="{{ asset($leaveRequest->LeaveDocument) }}" target="_blank"
                                                class="btn btn-sm btn-info preview-btn"
                                                data-url="{{ asset($leaveRequest->LeaveDocument) }}">
                                                <i class="fa fa-eye"></i> {{ __('sitelabel.Preview') }}
                                            </a>
                                            <button type="button" class="btn btn-sm btn-danger delete-document"
                                                data-id="{{ $leaveRequest->Id }}">
                                                <i class="fa fa-trash"></i> {{ __('sitelabel.Delete') }}
                                            </button>
                                        </div>
                                    @endif

                                    @error('document_file')
                                        <div class="alert alert-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>{{ __('sitelabel.Reason') }}<span class="text-danger">*</span></label>
                                    <textarea name="reason" class="form-control">{{ old('reason', $leaveRequest->Reason) }}</textarea>
                                    @error('reason')
                                        <div class="text-danger">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-md-12">
                                <button type="submit" class="btn btn-primary">{{ __('sitelabel.Update') }}</button>
                                <a href="{{ route('leaverequest') }}"
                                    class="btn btn-dark">{{ __('sitelabel.Back') }}</a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- Document Preview Modal -->
    <div class="modal fade" id="previewModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ __('sitelabel.DocumentPreview') }}</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body text-center">
                    <img src="" alt="Document Preview" class="img-fluid">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary"
                        data-bs-dismiss="modal">{{ __('sitelabel.Close') }}</button>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const fullHalfDay = document.getElementById('fullHalfDay');
            const firstSecondHalf = document.getElementById('firstSecondHalf');
            const startDate = document.getElementById('startDate');
            const endDate = document.getElementById('endDate');

            // Initial state
            firstSecondHalf.disabled = fullHalfDay.checked;

            // Handle Full/Half Day checkbox change
            fullHalfDay.addEventListener('change', function() {
                firstSecondHalf.disabled = this.checked;
                if (!this.checked) {
                    // When half day is selected, set end date same as start date
                    if (startDate.value) {
                        endDate.value = startDate.value;
                        endDate.readOnly = true; // Lock end date for half day
                    }
                } else {
                    endDate.readOnly = false; // Allow end date modification for full day
                }
            });

            // Sync end date with start date when half day is selected
            startDate.addEventListener('change', function() {
                if (!fullHalfDay.checked && this.value) {
                    endDate.value = this.value;
                }
            });

            // Prevent end date modification when half day is selected
            endDate.addEventListener('change', function() {
                if (!fullHalfDay.checked && startDate.value && this.value !== startDate.value) {
                    this.value = startDate.value;
                    alert('For half day leave, end date must match start date');
                }
            });
        });

        $(document).ready(function() {
            $('#firstSecondHalf, #cmbleavetype').select2({
                theme: "bootstrap-5",
            });
        });
    </script>
    <script>$(document).ready(function() {
        // Document preview functionality (if needed)
        $('.preview-btn').on('click', function(e) {
            e.preventDefault();
            const url = $(this).data('url');
            const fileExtension = url.split('.').pop().toLowerCase();
            
            // For images, you could show them in a modal
            if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
                // Option to display in a modal
                $('#previewModal').find('img').attr('src', url);
                $('#previewModal').modal('show');
            } else {
                // For PDFs and other files, open in a new tab
                window.open(url, '_blank');
            }
        });
        
        // Document delete functionality
        $('.delete-document').on('click', function() {
            const leaveRequestId = $(this).data('id');
            
            if (confirm('{{ __("sitelabel.ConfirmDeleteDocument") }}')) {
                $.ajax({
                    url: '{{ route("deleteleavedocument") }}',
                    type: 'POST',
                    data: {
                        leaveRequestId: leaveRequestId,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        if (response.success) {
                            // Remove the document preview section
                            $('.document-preview').remove();
                            // Show success message
                            alert('{{ __("sitelabel.DocumentDeletedSuccessfully") }}');
                        }
                    },
                    error: function(xhr) {
                        let errorMessage = '{{ __("sitelabel.ErrorDeletingDocument") }}';
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            errorMessage = xhr.responseJSON.message;
                        }
                        alert(errorMessage);
                    }
                });
            }
        });
    });</script>
@endsection