@extends('admin.layouts.layout')

@section('title', 'View Employee: ' . $employee->full_name)

@section('content')
<div class="mb-4">
    <div class="servicestitle">
        <h3>View Employee: {{ $employee->full_name }}</h3>
        <div class="d-flex gap-2 ms-auto">            
            @if($permission['edit'] ?? true)
            <a href="{{ route('employees.edit', $employee->id) }}" class="btn btn-primary">
                <i class="fas fa-edit"></i> Edit Employee
            </a>
            @endif
            @if($permission['index'] ?? true)
            <a href="{{ route('employees.index') }}" class="btn btn-dark waves-effect">
                <i class="fas fa-arrow-left"></i> Back to Employee List
            </a>
            @endif
        </div>
    </div>
    
    <div class="service_contentarea">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h5 class="mb-0">Employee Details</h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <!-- Left Column - Avatar -->
                            <div class="col-md-2">
                                <div class="employee_image text-center">
                                    @php
                                        $avatarThumb = isset($employee->avatar['thumb'])
                                            ? $employee->avatar['thumb']
                                            : asset('img/200x200/no-profile.jpg');
                                    @endphp
                                    <img src="{{ $avatarThumb }}" alt="Profile" style="width: 120px; height: 120px; border-radius: 50%; object-fit: cover; border: 2px solid #dee2e6;">
                                </div>
                            </div>
                            
                            <!-- Right Column - All Information -->
                            <div class="col-md-10">
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="mb-2"><span class="form-label fw-bold">Username:</span> <span class="form-control-plaintext d-inline">{{ $employee->username ?? 'N/A' }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">First Name:</span> <span class="form-control-plaintext d-inline">{{ $employee->first_name ?? 'N/A' }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">Last Name:</span> <span class="form-control-plaintext d-inline">{{ $employee->last_name ?? 'N/A' }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">Title:</span> <span class="form-control-plaintext d-inline">{{ $employee->inspectorProfile->title ?? 'N/A' }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">Email Address:</span> 
                                            <span class="form-control-plaintext d-inline">
                                                @if($employee->email)
                                                    <a href="mailto:{{ $employee->email }}">{{ $employee->email }}</a>
                                                @else
                                                    N/A
                                                @endif
                                            </span>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-2"><span class="form-label fw-bold">Mobile:</span> <span class="form-control-plaintext d-inline">{{ \App\Helpers\Helper::formatPhone($employee->mobile ?? '') }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">Office Number:</span> <span class="form-control-plaintext d-inline">{{ \App\Helpers\Helper::formatPhone($employee->phone ?? '') }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">Office Email:</span> 
                                            <span class="form-control-plaintext d-inline">
                                                @if($employee->inspectorProfile->office_email ?? false)
                                                    <a href="mailto:{{ $employee->inspectorProfile->office_email }}">{{ $employee->inspectorProfile->office_email }}</a>
                                                @else
                                                    N/A
                                                @endif
                                            </span>
                                        </div>
                                        <div class="mb-2"><span class="form-label fw-bold">License Number:</span> <span class="form-control-plaintext d-inline">{{ $employee->inspectorProfile->license_number ?? 'N/A' }}</span></div>
                                        <div class="mb-2"><span class="form-label fw-bold">Status:</span> 
                                            <span class="form-control-plaintext d-inline">
                                                @if($employee->status == 1)
                                                    <span class="badge bg-success">Active</span>
                                                @else
                                                    <span class="badge bg-secondary">Inactive</span>
                                                @endif
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Address Information -->
                        @if($employee->addresses)
                        <hr>
                        <h6 class="mb-3">Address Information</h6>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-2"><span class="form-label fw-bold">Address:</span> <span class="form-control-plaintext d-inline">{{ $employee->addresses->address_line1 ?? 'N/A' }}</span></div>
                                <div class="mb-2"><span class="form-label fw-bold">State:</span> <span class="form-control-plaintext d-inline">{{ $employee->addresses->state ?? 'N/A' }}</span></div>
                                <div class="mb-2"><span class="form-label fw-bold">Country:</span> <span class="form-control-plaintext d-inline">{{ $employee->addresses->country ?? 'N/A' }}</span></div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-2"><span class="form-label fw-bold">City:</span> <span class="form-control-plaintext d-inline">{{ $employee->addresses->city ?? 'N/A' }}</span></div>
                                <div class="mb-2"><span class="form-label fw-bold">Zip:</span> <span class="form-control-plaintext d-inline">{{ $employee->addresses->zip ?? 'N/A' }}</span></div>
                            </div>
                        </div>
                        @endif

                        <!-- Additional Options -->
                        <hr>
                        <h6 class="mb-3">Additional Options</h6>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-2"><span class="form-label fw-bold">Calendar Color:</span> 
                                    <span class="form-control-plaintext d-inline">
                                        @if($employee->inspectorProfile->calendar_color ?? false)
                                            <span class="badge" style="background-color: {{ $employee->inspectorProfile->calendar_color }}; color: white; padding: 8px 16px;">
                                                {{ $employee->inspectorProfile->calendar_color }}
                                            </span>
                                        @else
                                            N/A
                                        @endif
                                    </span>
                                </div>
                                <!-- <div class="mb-2"><span class="form-label fw-bold">Event Color:</span> 
                                    <span class="form-control-plaintext d-inline">
                                        @if($employee->inspectorProfile->event_color ?? false)
                                            <span class="badge" style="background-color: {{ $employee->inspectorProfile->event_color }}; color: white; padding: 8px 16px;">
                                                {{ $employee->inspectorProfile->event_color }}
                                            </span>
                                        @else
                                            N/A
                                        @endif
                                    </span>
                                </div> -->
                                <div class="mb-2"><span class="form-label fw-bold">Time Off Color:</span> 
                                    <span class="form-control-plaintext d-inline">
                                        @if($employee->inspectorProfile->timeoff_color ?? false)
                                            <span class="badge" style="background-color: {{ $employee->inspectorProfile->timeoff_color }}; color: white; padding: 8px 16px;">
                                                {{ $employee->inspectorProfile->timeoff_color }}
                                            </span>
                                        @else
                                            N/A
                                        @endif
                                    </span>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-2"><span class="form-label fw-bold">Online Resume:</span> 
                                    <span class="form-control-plaintext d-inline">
                                        @if($employee->inspectorProfile->online_resume_url ?? false)
                                            <a href="{{ $employee->inspectorProfile->online_resume_url }}" target="_blank">View Resume</a>
                                        @else
                                            N/A
                                        @endif
                                    </span>
                                </div>
                                <div class="mb-2"><span class="form-label fw-bold">Subcontractor:</span> 
                                    <span class="form-control-plaintext d-inline">
                                        @if($employee->inspectorProfile->is_subcontractor ?? false)
                                            <span class="badge bg-success">Yes</span>
                                        @else
                                            <span class="badge bg-secondary">No</span>
                                        @endif
                                    </span>
                                </div>
                                {{-- Removed sponsor field --}} 
                        <!-- Files Section -->
                        <hr>
                        <h6 class="mb-3">Files & Documents</h6>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3"><span class="form-label fw-bold">Digital Signature:</span> 
                                    <div class="mt-2">
                                        @if($employee->signFile)
                                            <img src="{{ \App\Models\Masters\File::getImage($employee->signFile, '200x200') }}" 
                                                alt="Digital Signature" 
                                                style="max-width: 150px; max-height: 100px; border: 1px solid #dee2e6; border-radius: 4px; cursor: pointer;"
                                                data-bs-toggle="modal" 
                                                data-bs-target="#imageModal"
                                                data-src="{{ \App\Models\Masters\File::getImage($employee->signFile) }}"
                                                data-title="Digital Signature">
                                        @else
                                            <span class="text-muted">No signature uploaded</span>
                                        @endif
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3"><span class="form-label fw-bold">Certificate:</span> 
                                    <div class="mt-2">
                                        @if($employee->certificateFile)
                                            @php($certExt = strtolower($employee->certificateFile->file_ext ?? ''))
                                            @if(in_array($certExt, ['jpg','jpeg','png','gif']))
                                                <img src="{{ \App\Models\Masters\File::getImage($employee->certificateFile, '200x200') }}"
                                                     alt="Certificate"
                                                     style="max-width: 150px; max-height: 100px; border: 1px solid #dee2e6; border-radius: 4px; cursor: pointer;"
                                                     data-bs-toggle="modal"
                                                     data-bs-target="#imageModal"
                                                     data-src="{{ \App\Models\Masters\File::getImage($employee->certificateFile) }}"
                                                     data-title="Certificate">
                                            @else
                                                <a href="{{ \App\Models\Masters\File::getImage($employee->certificateFile) }}" target="_blank" class="btn btn-sm btn-outline-primary">View Certificate</a>
                                            @endif
                                        @else
                                            <span class="text-muted">No certificate uploaded</span>
                                        @endif
                                    </div>
                                </div>
                            </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Image Preview Modal -->
<div class="modal fade" id="imageModal" tabindex="-1" aria-labelledby="imageModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="imageModalLabel">Image Preview</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body text-center">
                <img id="modalImage" src="" alt="Preview" class="img-fluid">
            </div>
        </div>
    </div>
</div>

@endsection

@push('page_script')
<script>
$(function(){
    // Image preview modal functionality
    $('[data-bs-toggle="modal"]').on('click', function() {
        const src = $(this).data('src');
        const title = $(this).data('title');
        $('#modalImage').attr('src', src);
        $('#imageModalLabel').text(title);
    });
});
</script>
@endpush