<template>
    <div class="p-4">
        <h2 class="text-xl font-bold mb-4">Результаты сохранения в IGES</h2>

        <table class="min-w-full border-collapse mt-4">
            <thead class="bg-gray-100">
                <tr>
                    <th class="border px-4 py-2 text-left">Документ</th>
                    <th class="border px-4 py-2 text-left">Файл</th>
                    <th class="border px-4 py-2 text-left">Успешно</th>
                    <th class="border px-4 py-2 text-left">Ошибка</th>
                </tr>
            </thead>
            <tbody>
                <tr v-for="file in files" :key="file.timestamp" class="hover:bg-gray-50">
                    <td class="border px-4 py-2">{{ file.document_name }}</td>
                    <td class="border px-4 py-2">
                        <a :href="`file://${file.file}`" target="_blank">{{ file.file }}</a>
                    </td>
                    <td class="border px-4 py-2">
                        <span :class="file.success ? 'text-green-500' : 'text-red-500'">
                            {{ file.success ? '✅ Да' : '❌ Нет' }}
                        </span>
                    </td>
                    <td class="border px-4 py-2">
                        {{ file.error || '-' }}
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup>
defineProps({
    files: {
        type: Array,
        required: true
    }
})
</script>