@extends('layouts.app')

@section('title', '사원 상세')

@section('content')
<div class="container mx-auto px-4 py-6 max-w-3xl">
    {{-- 페이지 헤더 --}}
    <div class="mb-6">
        <a href="{{ route('hr.employees.index') }}" class="text-sm text-gray-500 hover:text-gray-700 inline-flex items-center gap-1 mb-2">
            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
            </svg>
            사원 목록으로
        </a>
        <div class="flex items-center justify-between">
            <h1 class="text-2xl font-bold text-gray-800">사원 상세</h1>
            <a href="{{ route('hr.employees.edit', $employee->id) }}"
               class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                </svg>
                수정
            </a>
        </div>
    </div>

    {{-- 프로필 카드 --}}
    <div class="bg-white rounded-lg shadow-sm p-6 mb-6">
        <div class="flex items-center gap-5">
            <div class="shrink-0 w-16 h-16 rounded-full bg-blue-100 text-blue-600 flex items-center justify-center text-2xl font-bold">
                {{ mb_substr($employee->display_name ?? $employee->user?->name ?? '?', 0, 1) }}
            </div>
            <div>
                <h2 class="text-xl font-bold text-gray-900">
                    {{ $employee->display_name ?? $employee->user?->name ?? '-' }}
                </h2>
                <div class="flex flex-wrap items-center gap-2 mt-1">
                    @if($employee->department)
                        <span class="text-sm text-gray-500">{{ $employee->department->name }}</span>
                        <span class="text-gray-300">|</span>
                    @endif
                    <span class="text-sm text-gray-500">{{ $employee->position_label ?? '-' }}</span>
                    @if($employee->job_title_label)
                        <span class="text-gray-300">|</span>
                        <span class="text-sm text-gray-500">{{ $employee->job_title_label }}</span>
                    @endif
                </div>
                <div class="mt-2">
                    @switch($employee->employee_status)
                        @case('active')
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-emerald-100 text-emerald-700">재직</span>
                            @break
                        @case('leave')
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-amber-100 text-amber-700">휴직</span>
                            @break
                        @case('resigned')
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-700">퇴직</span>
                            @break
                    @endswitch
                </div>
            </div>
        </div>
    </div>

    {{-- 상세 정보 --}}
    <div class="bg-white rounded-lg shadow-sm overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-200">
            <h3 class="text-lg font-semibold text-gray-800">상세 정보</h3>
        </div>
        <div class="divide-y divide-gray-100">
            {{-- 기본 정보 --}}
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">이름</div>
                <div class="text-sm text-gray-900">{{ $employee->user?->name ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">표시 이름</div>
                <div class="text-sm text-gray-900">{{ $employee->display_name ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">이메일</div>
                <div class="text-sm text-gray-900">{{ $employee->user?->email ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">연락처</div>
                <div class="text-sm text-gray-900">{{ $employee->user?->phone ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">주민등록번호</div>
                <div class="text-sm text-gray-900">
                    @if($employee->resident_number)
                        {{ Str::mask($employee->resident_number, '*', 8) }}
                    @else
                        -
                    @endif
                </div>
            </div>

            {{-- 근무 정보 --}}
            <div class="px-6 py-4 bg-gray-50">
                <span class="text-sm font-semibold text-gray-600">근무 정보</span>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">부서</div>
                <div class="text-sm text-gray-900">{{ $employee->department?->name ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">직급</div>
                <div class="text-sm text-gray-900">{{ $employee->position_label ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">직책</div>
                <div class="text-sm text-gray-900">{{ $employee->job_title_label ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">입사일</div>
                <div class="text-sm text-gray-900">{{ $employee->hire_date ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">퇴직일</div>
                <div class="text-sm text-gray-900">{{ $employee->resign_date ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">재직상태</div>
                <div class="text-sm text-gray-900">
                    @switch($employee->employee_status)
                        @case('active') 재직 @break
                        @case('leave') 휴직 @break
                        @case('resigned') 퇴직 @break
                        @default {{ $employee->employee_status }} @break
                    @endswitch
                </div>
            </div>

            {{-- 추가 정보 --}}
            <div class="px-6 py-4 bg-gray-50">
                <span class="text-sm font-semibold text-gray-600">추가 정보</span>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">주소</div>
                <div class="text-sm text-gray-900">{{ $employee->address ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">비상연락처</div>
                <div class="text-sm text-gray-900">{{ $employee->emergency_contact ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">등록일</div>
                <div class="text-sm text-gray-900">{{ $employee->created_at?->format('Y-m-d H:i') ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">수정일</div>
                <div class="text-sm text-gray-900">{{ $employee->updated_at?->format('Y-m-d H:i') ?? '-' }}</div>
            </div>

            {{-- 급여이체정보 --}}
            <div class="px-6 py-4 bg-gray-50">
                <span class="text-sm font-semibold text-gray-600">급여이체정보</span>
            </div>
            @php $bankAccount = $employee->bank_account ?? []; @endphp
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">이체은행</div>
                <div class="text-sm text-gray-900">{{ $bankAccount['bank_name'] ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">예금주</div>
                <div class="text-sm text-gray-900">{{ $bankAccount['account_holder'] ?? '-' }}</div>
            </div>
            <div class="px-6 py-3 flex" style="flex-wrap: wrap;">
                <div class="shrink-0 text-sm font-medium text-gray-500" style="width: 140px;">계좌번호</div>
                <div class="text-sm text-gray-900">{{ $bankAccount['account_number'] ?? '-' }}</div>
            </div>

            {{-- 부양가족 정보 --}}
            <div class="px-6 py-4 bg-gray-50">
                <span class="text-sm font-semibold text-gray-600">부양가족 정보</span>
            </div>
            @php $dependents = $employee->dependents ?? []; @endphp
            @if(count($dependents) > 0)
                <div class="px-6 py-3">
                    <div class="overflow-x-auto">
                        <table class="w-full text-sm">
                            <thead>
                                <tr class="border-b border-gray-200 text-gray-500">
                                    <th class="text-left py-2 pr-3 font-medium">이름</th>
                                    <th class="text-left py-2 pr-3 font-medium">내/외국인</th>
                                    <th class="text-left py-2 pr-3 font-medium">주민등록번호</th>
                                    <th class="text-left py-2 pr-3 font-medium">관계</th>
                                    <th class="text-left py-2 pr-3 font-medium">장애인</th>
                                    <th class="text-left py-2 font-medium">피부양자</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y divide-gray-100">
                                @foreach($dependents as $dep)
                                    <tr class="text-gray-900">
                                        <td class="py-2 pr-3">{{ $dep['name'] ?? '-' }}</td>
                                        <td class="py-2 pr-3">{{ ($dep['nationality'] ?? 'korean') === 'korean' ? '내국인' : '외국인' }}</td>
                                        <td class="py-2 pr-3">
                                            @if(!empty($dep['resident_number']))
                                                {{ Str::mask($dep['resident_number'], '*', 8) }}
                                            @else
                                                -
                                            @endif
                                        </td>
                                        <td class="py-2 pr-3">
                                            @switch($dep['relationship'] ?? '')
                                                @case('spouse') 배우자 @break
                                                @case('child') 자녀 @break
                                                @case('parent') 부모 @break
                                                @case('sibling') 형제자매 @break
                                                @case('grandparent') 조부모 @break
                                                @case('other') 기타 @break
                                                @default - @break
                                            @endswitch
                                        </td>
                                        <td class="py-2 pr-3">{{ !empty($dep['is_disabled']) ? 'Y' : 'N' }}</td>
                                        <td class="py-2">{{ !empty($dep['is_dependent']) ? 'Y' : 'N' }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            @else
                <div class="px-6 py-3">
                    <p class="text-sm text-gray-400">등록된 부양가족이 없습니다.</p>
                </div>
            @endif

            {{-- 첨부파일 --}}
            <div class="px-6 py-4 bg-gray-50">
                <span class="text-sm font-semibold text-gray-600">첨부파일</span>
            </div>
            @if(!empty($files) && count($files) > 0)
                <div class="px-6 py-3 space-y-2">
                    @foreach($files as $file)
                        <div class="flex items-center gap-2">
                            <svg class="w-4 h-4 text-gray-400 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13"/>
                            </svg>
                            <a href="{{ route('api.admin.hr.employees.download-file', [$employee->id, $file->id]) }}"
                               class="text-sm text-blue-600 hover:text-blue-800">
                                {{ $file->original_name }}
                            </a>
                            <span class="text-xs text-gray-400">{{ number_format(($file->file_size ?? 0) / 1024, 0) }}KB</span>
                        </div>
                    @endforeach
                </div>
            @else
                <div class="px-6 py-3">
                    <p class="text-sm text-gray-400">등록된 파일이 없습니다.</p>
                </div>
            @endif
        </div>
    </div>
</div>
@endsection
