<script setup lang="ts">

const { sendCommandToPython, isReady } = usePythonBridge()

// Список событий для отображения
const events = ref<Array<{ type: string; data: any; timestamp: Date }>>([])
async function init() {
    try {
        const initResult = await sendCommandToPython<{ status: string; message: string }>("init");
        console.warn("Init:", initResult);

        const sheets = await sendCommandToPython<string[]>("get_sheets");
        console.warn("Sheets:", sheets);

        const data = await sendCommandToPython<string[][]>("get_data");
        console.warn("Data:", data);
    } catch (err) {
        console.error("Ошибка при вызове Python:", err);
    }
}

watch(isReady, () => {
    if (isReady.value) init()
})
</script>

<template>
    <div class="p-4">
        <h1>Компас — прослушка событий от Python</h1>

        <div v-if="events.length === 0" class="text-gray-500 italic">
            Ожидание событий...
        </div>

        <div v-else class="space-y-2 mt-4">
            <div v-for="(event, index) in events.slice().reverse()" :key="index" class="border p-3 rounded bg-gray-50">
                <div class="text-sm text-gray-500">{{ event.timestamp.toLocaleTimeString() }}</div>
                <strong>Тип события:</strong> {{ event.type }}
                <pre class="mt-1 text-xs bg-gray-100 p-2 rounded overflow-auto max-h-40">
          {{ JSON.stringify(event.data, null, 2) }}
        </pre>
            </div>
        </div>
    </div>
</template>