web/front/pages/kompas.vue

45 lines
1.6 KiB
Vue

<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>