Initial commit

src/components/Authe.vue

@@ -0,0 +1,92 @@
+<script setup>
+import { ref, onMounted, onUnmounted } from "vue";
+import axios from "axios";
+
+// Получение props
+const props = defineProps({
+  currentPage: String,
+});
+
+// Объявление события для обновления страницы
+const emit = defineEmits(["update"]);
+
+const login = ref("");
+const password = ref("");
+const authError = ref(false);
+
+// Функция авторизации
+const auth_my = async () => {
+  try {
+    const response = await axios.post("http://45.129.78.228:8004/login", { 
+      username: login.value,
+      password: password.value,
+    });
+    if (response.data.message === "Login successful") {
+      authError.value = false;
+      emit("update", "rezylt");
+    } else {
+      authError.value = true;
+    }
+  } catch (err) {
+    authError.value = true;
+    console.log(err);
+  }
+};
+
+// Обработка глобального нажатия Enter
+const handleKeyDown = (event) => {
+  if (event.key === "Enter") {
+    auth_my();
+  }
+};
+
+// Добавляем глобальный слушатель при монтировании
+onMounted(() => {
+  window.addEventListener("keydown", handleKeyDown);
+});
+
+// Удаляем при размонтировании
+onUnmounted(() => {
+  window.removeEventListener("keydown", handleKeyDown);
+});
+
+// Переход на стартовую страницу (сброс данных)
+function showStartPage() {
+  emit("update", "admin-panel");
+  login.value = "";
+  password.value = "";
+  authError.value = false;
+}
+</script>
+
+<template>
+  <div
+    v-if="props.currentPage === 'admin-panel'"
+    class="p-4 bg-white rounded shadow max-w-md mx-auto mt-10 dark:bg-gray-800 dark:text-neutral-300"
+  >
+    <h2>Вход для администратора</h2>
+    <div class="mb-2">
+      <label>Логин:</label>
+      <input v-model="login" type="text" class="border p-1 w-full" />
+    </div>
+    <div class="mb-2">
+      <label>Пароль:</label>
+      <input v-model="password" type="password" class="border p-1 w-full" />
+    </div>
+    <button
+      @click="auth_my"
+      class="mr-2 bg-teal-600 hover:bg-teal-800 text-white px-4 py-2 rounded cursor-pointer"
+    >
+      Войти
+    </button>
+    <button
+      @click="showStartPage"
+      class="dark:bg-gray-600 dark:hover:bg-gray-700 bg-gray-500 hover:bg-gray-600 px-4 py-2 rounded cursor-pointer"
+    >
+      Отмена
+    </button>
+    <div v-if="authError" class="mt-2 text-red-600">
+      Неверный логин или пароль
+    </div>
+  </div>
+</template>