sam-manage/resources/views/equipment/partials/tabs/basic-info.blade.php

<!-- 기본정보 탭 -->
<div class="bg-white rounded-lg shadow-sm p-6 mb-6">
    <h2 class="text-lg font-semibold text-gray-800 mb-4 pb-2 border-b">기본정보</h2>
    <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
        <div>
            <label class="block text-sm text-gray-500 mb-1">설비코드</label>
            <p class="text-gray-900 font-mono font-medium">{{ $equipment->equipment_code }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">설비명</label>
            <p class="text-gray-900 font-medium">{{ $equipment->name }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">설비유형</label>
            <p class="text-gray-900">{{ $equipment->equipment_type ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">규격</label>
            <p class="text-gray-900">{{ $equipment->specification ?? '-' }}</p>
        </div>
    </div>
</div>

<div class="bg-white rounded-lg shadow-sm p-6 mb-6">
    <h2 class="text-lg font-semibold text-gray-800 mb-4 pb-2 border-b">제조사 정보</h2>
    <div class="grid grid-cols-2 md:grid-cols-3 gap-4">
        <div>
            <label class="block text-sm text-gray-500 mb-1">제조사</label>
            <p class="text-gray-900">{{ $equipment->manufacturer ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">모델명</label>
            <p class="text-gray-900">{{ $equipment->model_name ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">제조번호</label>
            <p class="text-gray-900 font-mono">{{ $equipment->serial_no ?? '-' }}</p>
        </div>
    </div>
</div>

<div class="bg-white rounded-lg shadow-sm p-6 mb-6">
    <h2 class="text-lg font-semibold text-gray-800 mb-4 pb-2 border-b">설치 정보</h2>
    <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
        <div>
            <label class="block text-sm text-gray-500 mb-1">위치</label>
            <p class="text-gray-900">{{ $equipment->location ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">생산라인</label>
            <p class="text-gray-900">{{ $equipment->production_line ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">구입일</label>
            <p class="text-gray-900">{{ $equipment->purchase_date?->format('Y-m-d') ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">설치일</label>
            <p class="text-gray-900">{{ $equipment->install_date?->format('Y-m-d') ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">구입가격</label>
            <p class="text-gray-900">{{ $equipment->purchase_price ? number_format($equipment->purchase_price) . '원' : '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">내용연수</label>
            <p class="text-gray-900">{{ $equipment->useful_life ? $equipment->useful_life . '년' : '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">담당자</label>
            <p class="text-gray-900">{{ $equipment->manager?->name ?? '-' }}</p>
        </div>
        <div>
            <label class="block text-sm text-gray-500 mb-1">상태</label>
            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium {{ $equipment->status_color }}">
                {{ $equipment->status_label }}
            </span>
        </div>
    </div>
    @if($equipment->memo)
        <div class="mt-4">
            <label class="block text-sm text-gray-500 mb-1">비고</label>
            <p class="text-gray-900 whitespace-pre-wrap">{{ $equipment->memo }}</p>
        </div>
    @endif
</div>

@if($equipment->photos->isNotEmpty())
<div class="bg-white rounded-lg shadow-sm p-6 mb-6">
    <h2 class="text-lg font-semibold text-gray-800 mb-4 pb-2 border-b">설비 사진</h2>
    <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-3">
        @foreach($equipment->photos as $photo)
            @php
                $url = $photo->gcs_object_name
                    ? app(\App\Services\GoogleCloudStorageService::class)->getSignedUrl($photo->gcs_object_name, 120)
                    : null;
            @endphp
            @if($url)
                <div>
                    <img src="{{ $url }}" alt="{{ $photo->original_name }}"
                         class="w-full rounded-lg border hover:opacity-80 transition cursor-pointer"
                         onclick="openPhotoModal(this.src, '{{ addslashes($photo->original_name) }}')">
                    <p class="text-xs text-gray-500 mt-1 truncate">{{ $photo->original_name }}</p>
                </div>
            @endif
        @endforeach
    </div>
</div>

<!-- 사진 확대 모달 -->
<div id="photoModal" class="fixed inset-0 z-50 hidden items-center justify-center bg-black/70" onclick="closePhotoModal(event)">
    <div class="relative max-w-4xl max-h-[90vh] mx-4">
        <button onclick="closePhotoModal()" class="absolute -top-10 right-0 text-white hover:text-gray-300 text-sm flex items-center gap-1">
            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>
            닫기
        </button>
        <img id="photoModalImg" src="" alt="" class="max-w-full max-h-[85vh] object-contain rounded-lg shadow-2xl">
        <p id="photoModalName" class="text-center text-white text-sm mt-2"></p>
    </div>
</div>

<script>
function openPhotoModal(src, name) {
    const modal = document.getElementById('photoModal');
    document.getElementById('photoModalImg').src = src;
    document.getElementById('photoModalName').textContent = name;
    modal.classList.remove('hidden');
    modal.classList.add('flex');
    document.body.style.overflow = 'hidden';
}
function closePhotoModal(e) {
    if (e && e.target !== e.currentTarget) return;
    const modal = document.getElementById('photoModal');
    modal.classList.add('hidden');
    modal.classList.remove('flex');
    document.body.style.overflow = '';
}
document.addEventListener('keydown', function(e) {
    if (e.key === 'Escape') closePhotoModal();
});
</script>
@endif

@if($equipment->processes->isNotEmpty())
<div class="bg-white rounded-lg shadow-sm p-6">
    <h2 class="text-lg font-semibold text-gray-800 mb-4 pb-2 border-b">연결된 공정</h2>
    <div class="flex flex-wrap gap-2">
        @foreach($equipment->processes as $process)
            <span class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-blue-100 text-blue-800">
                {{ $process->process_name }}
                @if($process->pivot->is_primary)
                    <span class="ml-1 text-xs text-blue-600">(주)</span>
                @endif
            </span>
        @endforeach
    </div>
</div>
@endif