Инициализация проекта

Загрузка проекта на GIT
2026-01-11 15:01:35 +07:00
commit 301e179160
28 changed files with 7769 additions and 0 deletions
--- a/front_vue/src/views/LoginPage.vue
+++ b/front_vue/src/views/LoginPage.vue
@@ -0,0 +1,187 @@
+<template>
+  <div class="login-page">
+    <div class="login-card">
+      <!-- Логотип -->
+      <div class="login-logo">
+        <i data-lucide="layout-grid"></i>
+        <span>TaskBoard</span>
+      </div>
+      
+      <form @submit.prevent="handleLogin" class="login-form">
+        <!-- Поле логина -->
+        <div class="field">
+          <input 
+            type="text" 
+            v-model="login" 
+            placeholder="Логин"
+            autocomplete="username"
+          >
+        </div>
+        
+        <!-- Поле пароля -->
+        <div class="field">
+          <input 
+            type="password" 
+            v-model="password" 
+            placeholder="Пароль"
+            autocomplete="current-password"
+          >
+        </div>
+        
+        <!-- Ошибка -->
+        <div v-if="error" class="error-message">
+          {{ error }}
+        </div>
+        
+        <!-- Кнопка входа -->
+        <button type="submit" class="login-btn" :disabled="loading">
+          <span v-if="loading">Вход...</span>
+          <span v-else>Войти</span>
+        </button>
+      </form>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import { authApi } from '../api'
+
+const router = useRouter()
+
+const login = ref('')
+const password = ref('')
+const error = ref('')
+const loading = ref(false)
+
+const handleLogin = async () => {
+  error.value = ''
+  loading.value = true
+  
+  try {
+    const data = await authApi.login({ 
+      login: login.value, 
+      password: password.value 
+    })
+    
+    if (data.status === 'ok') {
+      router.push('/')
+    } else {
+      error.value = 'Неверный логин или пароль'
+    }
+  } catch (e) {
+    error.value = 'Ошибка подключения к серверу'
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  if (window.lucide) {
+    window.lucide.createIcons()
+  }
+})
+</script>
+
+<style scoped>
+.login-page {
+  min-height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--bg-body);
+  padding: 20px;
+}
+
+.login-card {
+  width: 100%;
+  max-width: 400px;
+  background: var(--bg-sidebar);
+  border-radius: 16px;
+  padding: 40px;
+  border: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+.login-logo {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  margin-bottom: 32px;
+  color: var(--text-primary);
+}
+
+.login-logo i {
+  width: 32px;
+  height: 32px;
+  color: var(--accent);
+}
+
+.login-logo span {
+  font-size: 24px;
+  font-weight: 600;
+}
+
+.login-form {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.field input {
+  width: 100%;
+  padding: 14px 16px;
+  background: rgba(255, 255, 255, 0.04);
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-radius: 10px;
+  color: var(--text-primary);
+  font-family: inherit;
+  font-size: 14px;
+  transition: all 0.15s;
+}
+
+.field input::placeholder {
+  color: var(--text-muted);
+}
+
+.field input:focus {
+  outline: none;
+  border-color: var(--accent);
+  background: rgba(255, 255, 255, 0.06);
+}
+
+.error-message {
+  padding: 12px 16px;
+  background: rgba(239, 68, 68, 0.15);
+  border: 1px solid rgba(239, 68, 68, 0.3);
+  border-radius: 8px;
+  color: #ef4444;
+  font-size: 13px;
+  text-align: center;
+}
+
+.login-btn {
+  width: 100%;
+  padding: 14px;
+  background: var(--accent);
+  border: none;
+  border-radius: 10px;
+  color: #000;
+  font-family: inherit;
+  font-size: 15px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.15s;
+  margin-top: 8px;
+}
+
+.login-btn:hover:not(:disabled) {
+  background: #00e6b8;
+}
+
+.login-btn:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+</style>