Setup de SeaORM + SQLite comme base de données #64
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<NuxtLoadingIndicator />
|
||||
<NuxtRouteAnnouncer />
|
||||
<NavBar />
|
||||
<NuxtPage />
|
||||
|
@ -6,6 +6,7 @@
|
||||
<nav class="navbar-center">
|
||||
<NuxtLink to="/" class="btn btn-ghost">Accueil</NuxtLink>
|
||||
<NuxtLink to="/CPS" class="btn btn-ghost">Carte CPS</NuxtLink>
|
||||
<NuxtLink to="/debug" class="btn btn-ghost">Debug</NuxtLink>
|
||||
</nav>
|
||||
<div class="navbar-end">
|
||||
<template v-if="!current_user">
|
||||
|
67
frontend/pages/debug.vue
Normal file
67
frontend/pages/debug.vue
Normal file
@ -0,0 +1,67 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1 class="text-3xl mb-8">Debug</h1>
|
||||
<div class="stats shadow mb-8">
|
||||
<div class="stat">
|
||||
<div class="stat-title">DB Ping Status</div>
|
||||
<div class="stat-value">{{ data?.db_ping_status || "?" }}</div>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<div class="stat-title">Entries Count</div>
|
||||
<div class="stat-value">{{ data?.entries.length || "?" }}</div>
|
||||
<div class="stat-actions">
|
||||
<button class="btn btn-sm" @click="addRandomEntry">Add entry</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<div class="stat-title">Network status</div>
|
||||
<div class="stat-value">{{ status }}</div>
|
||||
<div class="stat-description">{{ error }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-2xl mb-4">Entries</h2>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Id</th>
|
||||
<th>Title</th>
|
||||
<th>Text</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="entry in data?.entries" :key="entry.id">
|
||||
<td>{{ entry.id }}</td>
|
||||
<td>{{ entry.title }}</td>
|
||||
<td>{{ entry.text }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
type Entry = {
|
||||
id: number;
|
||||
title: string;
|
||||
text: string;
|
||||
};
|
||||
type DebugResponse = {
|
||||
db_ping_status: string;
|
||||
entries: Entry[];
|
||||
};
|
||||
|
||||
|
||||
// TODO : handle a default backend URL by building a custom `$fetch` and `useFetch` functions with a `baseURL` option : https://nuxt.com/docs/guide/recipes/custom-usefetch#custom-fetch
|
||||
|
||||
const { data, refresh, error, status } = await useFetch<DebugResponse>('http://127.0.0.1:8080/debug');
|
||||
|
||||
async function addRandomEntry() {
|
||||
await $fetch('http://127.0.0.1:8080/debug/add_random', {
|
||||
method: 'POST',
|
||||
});
|
||||
refresh();
|
||||
}
|
||||
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user