init

frontend/src/views/LoginView.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="auth-page">
+    <div class="auth-card card">
+      <h2>Вход</h2>
+      <form @submit.prevent="handleLogin">
+        <div class="form-group">
+          <label>Email</label>
+          <input type="email" v-model="email" required />
+        </div>
+        <div class="form-group">
+          <label>Пароль</label>
+          <input type="password" v-model="password" required />
+        </div>
+        <p v-if="error" class="error-message">{{ error }}</p>
+        <button type="submit" class="btn-primary" :disabled="loading">
+          {{ loading ? 'Вход...' : 'Войти' }}
+        </button>
+      </form>
+      <p class="auth-link">
+        Нет аккаунта? <router-link to="/register">Зарегистрироваться</router-link>
+      </p>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { useAuthStore } from '../stores/auth'
+
+const router = useRouter()
+const authStore = useAuthStore()
+
+const email = ref('')
+const password = ref('')
+const error = ref('')
+const loading = ref(false)
+
+async function handleLogin() {
+  error.value = ''
+  loading.value = true
+
+  try {
+    await authStore.login(email.value, password.value)
+    router.push('/')
+  } catch (e) {
+    error.value = e.response?.data?.detail || 'Ошибка входа'
+  } finally {
+    loading.value = false
+  }
+}
+</script>
+
+<style scoped>
+.auth-page {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: calc(100vh - 100px);
+}
+
+.auth-card {
+  width: 100%;
+  max-width: 400px;
+}
+
+.auth-card h2 {
+  margin-bottom: 24px;
+  text-align: center;
+}
+
+.auth-card button {
+  width: 100%;
+  margin-top: 8px;
+}
+
+.auth-link {
+  text-align: center;
+  margin-top: 16px;
+  color: #aaa;
+}
+</style>