sam-manage/resources/views/document-templates/partials/table.blade.php

<div class="overflow-x-auto">
    <table class="min-w-full divide-y divide-gray-200 text-sm">
        <thead class="bg-gray-50">
            <tr>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider w-16">번호</th>
                <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">양식명</th>
                <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">분류</th>
                <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">문서 제목</th>
                <th class="px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">연결 품목</th>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">섹션</th>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">컬럼</th>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">미리보기</th>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">활성</th>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">수정일</th>
                <th class="px-4 py-3 text-center text-xs font-medium text-gray-500 uppercase tracking-wider">작업</th>
            </tr>
        </thead>
        <tbody class="bg-white divide-y divide-gray-200">
            @forelse($templates as $template)
                <tr class="hover:bg-gray-50" data-template-id="{{ $template->id }}">
                    <td class="px-4 py-3 text-center text-sm text-gray-500 whitespace-nowrap">
                        {{ $template->id }}
                    </td>
                    <td class="px-4 py-3 whitespace-nowrap">
                        <div class="flex items-center gap-1.5">
                            @if($template->builder_type === 'block')
                                <span class="inline-flex items-center px-1.5 py-0.5 rounded text-[10px] font-medium bg-indigo-100 text-indigo-700">디자이너</span>
                            @endif
                            <a href="{{ $template->builder_type === 'block' ? route('document-templates.block-edit', $template->id) : route('document-templates.edit', $template->id) }}"
                               class="text-blue-600 hover:text-blue-800 font-medium">
                                {{ $template->name }}
                            </a>
                        </div>
                    </td>
                    <td class="px-4 py-3 whitespace-nowrap">
                        @if($template->category)
                            @php
                                $categoryName = $categoryNames[$template->category] ?? $template->category;
                            @endphp
                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
                                @if(str_contains($categoryName, '수입')) bg-blue-100 text-blue-800
                                @elseif(str_contains($categoryName, '출하')) bg-green-100 text-green-800
                                @elseif(str_contains($categoryName, '품질')) bg-purple-100 text-purple-800
                                @elseif(str_contains($categoryName, '중간')) bg-orange-100 text-orange-800
                                @else bg-gray-100 text-gray-800
                                @endif
                            ">
                                {{ $categoryName }}
                            </span>
                        @else
                            <span class="text-gray-400">-</span>
                        @endif
                    </td>
                    <td class="px-4 py-3 max-w-xs truncate" title="{{ $template->title }}">
                        {{ $template->title ?: '-' }}
                    </td>
                    <td class="px-4 py-3 text-sm">
                        @php
                            $linkedIds = $template->linked_item_ids ?? [];
                            $linkedCount = count($linkedIds);
                        @endphp
                        @if($linkedCount > 0)
                            <div class="flex flex-wrap gap-1 max-w-[200px]">
                                @foreach(array_slice($linkedIds, 0, 3) as $itemId)
                                    <span class="inline-flex items-center px-2 py-0.5 rounded text-xs bg-blue-50 text-blue-700 truncate max-w-[120px]"
                                          title="{{ $itemNames[$itemId] ?? 'ID:'.$itemId }}">
                                        {{ $itemNames[$itemId] ?? 'ID:'.$itemId }}
                                    </span>
                                @endforeach
                                @if($linkedCount > 3)
                                    <span class="inline-flex items-center px-2 py-0.5 rounded text-xs bg-gray-100 text-gray-600">
                                        +{{ $linkedCount - 3 }}
                                    </span>
                                @endif
                            </div>
                        @else
                            <span class="text-gray-400">-</span>
                        @endif
                    </td>
                    <td class="px-4 py-3 text-center text-sm text-gray-600">
                        {{ $template->sections_count ?? 0 }}
                    </td>
                    <td class="px-4 py-3 text-center text-sm text-gray-600">
                        {{ $template->columns_count ?? 0 }}
                    </td>
                    <td class="px-4 py-3 text-center">
                        <button onclick="previewTemplate({{ $template->id }})"
                                class="text-gray-500 hover:text-indigo-600 transition"
                                title="미리보기">
                            <svg class="w-5 h-5 mx-auto" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
                            </svg>
                        </button>
                    </td>
                    <td class="px-4 py-3 text-center">
                        <button onclick="toggleActive({{ $template->id }}, this)"
                                class="relative inline-flex h-5 w-9 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none {{ $template->is_active ? 'bg-blue-500' : 'bg-gray-400' }}">
                            <span class="pointer-events-none inline-block h-4 w-4 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out {{ $template->is_active ? 'translate-x-3.5' : 'translate-x-0.5' }}"></span>
                        </button>
                    </td>
                    <td class="px-4 py-3 text-center text-sm text-gray-500">
                        {{ $template->updated_at->format('Y-m-d') }}
                    </td>
                    <td class="px-4 py-3 text-center">
                        <div class="flex items-center justify-center gap-2">
                            @if(!empty($showTrashed))
                                <button onclick="restoreTemplate({{ $template->id }}, '{{ addslashes($template->name) }}')"
                                        class="text-green-600 hover:text-green-800 transition text-sm font-medium"
                                        title="복원">
                                    복원
                                </button>
                                <button onclick="forceDeleteTemplate({{ $template->id }}, '{{ addslashes($template->name) }}')"
                                        class="text-red-700 hover:text-red-900 transition text-sm font-medium"
                                        title="영구삭제">
                                    영구삭제
                                </button>
                            @else
                                <a href="{{ $template->builder_type === 'block' ? route('document-templates.block-edit', $template->id) : route('document-templates.edit', $template->id) }}"
                                   class="text-gray-600 hover:text-blue-600 transition"
                                   title="편집">
                                    <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="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>
                                <button onclick="duplicateTemplate({{ $template->id }}, '{{ addslashes($template->name) }}')"
                                        class="text-gray-600 hover:text-green-600 transition"
                                        title="복제">
                                    <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="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
                                    </svg>
                                </button>
                                <button onclick="confirmDelete({{ $template->id }}, '{{ addslashes($template->name) }}')"
                                        class="text-gray-600 hover:text-red-600 transition"
                                        title="삭제">
                                    <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="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                                    </svg>
                                </button>
                            @endif
                        </div>
                    </td>
                </tr>
            @empty
                <tr>
                    <td colspan="11" class="px-4 py-12 text-center text-gray-500">
                        <div class="flex flex-col items-center">
                            <svg class="w-12 h-12 text-gray-300 mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
                            </svg>
                            <p>등록된 문서양식이 없습니다.</p>
                            <a href="{{ route('document-templates.create') }}" class="mt-2 text-blue-600 hover:text-blue-800">
                                + 새 양식 만들기
                            </a>
                        </div>
                    </td>
                </tr>
            @endforelse
        </tbody>
    </table>
</div>

<!-- 페이지네이션 -->
@if($templates->hasPages())
    <div class="px-4 py-3 border-t border-gray-200">
        @include('partials.pagination', ['paginator' => $templates, 'htmxTarget' => '#template-table', 'htmxTrigger' => 'filterSubmit'])
    </div>
@endif