v0

frontend/src/App.vue

@@ -0,0 +1,3 @@
+<template>
+  <router-view />
+</template>

frontend/src/main.ts

@@ -0,0 +1,5 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import router from './router'
+
+createApp(App).use(router).mount('#app')

frontend/src/router/index.ts

@@ -0,0 +1,37 @@
+import { createRouter, createWebHistory } from 'vue-router'
+import Login from '../views/Login.vue'
+import Setup from '../views/Setup.vue'
+import Dashboard from '../views/Dashboard.vue'
+
+const routes = [
+  { path: '/login', component: Login },
+  { path: '/setup', component: Setup },
+  { path: '/', component: Dashboard, meta: { requiresAuth: true } }
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes
+})
+
+router.beforeEach(async (to, from, next) => {
+  const requiresAuth = to.matched.some(record => record.meta.requiresAuth)
+  const loggedIn = await checkAuth()  // запрос к /api/admin/users или специальному endpoint
+
+  if (requiresAuth && !loggedIn) {
+    next('/login')
+  } else {
+    next()
+  }
+})
+
+async function checkAuth(): Promise<boolean> {
+  try {
+    const res = await fetch('/api/admin/users')
+    return res.ok
+  } catch {
+    return false
+  }
+}
+
+export default router

frontend/src/views/Dashboard.vue

@@ -0,0 +1,43 @@
+<template>
+  <div>
+    <h2>Dashboard</h2>
+    <button @click="logout">Logout</button>
+    <h3>Users</h3>
+    <table>
+      <thead>
+      <tr><th>ID</th><th>Login</th><th>Created</th><th>IP</th></tr>
+      </thead>
+      <tbody>
+      <tr v-for="user in users" :key="user.id">
+        <td>{{ user.id }}</td>
+        <td>{{ user.login }}</td>
+        <td>{{ user.created }}</td>
+        <td>{{ user.ip }}</td>
+      </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import axios from 'axios'
+
+const router = useRouter()
+const users = ref([])
+
+onMounted(async () => {
+  try {
+    const res = await axios.get('/api/admin/users')
+    users.value = res.data
+  } catch {
+    router.push('/login')
+  }
+})
+
+async function logout() {
+  await axios.post('/api/logout')
+  router.push('/login')
+}
+</script>

frontend/src/views/Login.vue

@@ -0,0 +1,30 @@
+<template>
+  <div>
+    <h2>Login</h2>
+    <form @submit.prevent="login">
+      <input v-model="loginForm.login" placeholder="Login" />
+      <input v-model="loginForm.password" type="password" placeholder="Password" />
+      <button type="submit">Login</button>
+    </form>
+    <p v-if="error">{{ error }}</p>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import axios from 'axios'
+
+const router = useRouter()
+const loginForm = ref({ login: '', password: '' })
+const error = ref('')
+
+async function login() {
+  try {
+    await axios.post('/api/login', loginForm.value)
+    router.push('/')
+  } catch (e) {
+    error.value = 'Invalid credentials'
+  }
+}
+</script>

frontend/src/views/Setup.vue

@@ -0,0 +1,30 @@
+<template>
+  <div>
+    <h2>Setup Admin Account</h2>
+    <form @submit.prevent="setup">
+      <input v-model="form.login" placeholder="Admin login" />
+      <input v-model="form.password" type="password" placeholder="Password (min 6 chars)" />
+      <button type="submit">Create Admin</button>
+    </form>
+    <p v-if="error">{{ error }}</p>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import axios from 'axios'
+
+const router = useRouter()
+const form = ref({ login: '', password: '' })
+const error = ref('')
+
+async function setup() {
+  try {
+    await axios.post('/api/setup', form.value)
+    router.push('/login')
+  } catch (e) {
+    error.value = e.response?.data || 'Setup failed'
+  }
+}
+</script>