gitrusprusandCursor
8ab606747f
Keep map reads open; gate admin UI/nav and object mutations behind env-based admin credentials, and default parser batch limit to 10. Co-authored-by: Cursor <cursoragent@cursor.com>
147 lines
2.9 KiB
Vue
147 lines
2.9 KiB
Vue
<script setup lang="ts">
|
||
import { ref } from "vue";
|
||
import { useRoute, useRouter } from "vue-router";
|
||
|
||
import { useAuth } from "../composables/useAuth";
|
||
|
||
const route = useRoute();
|
||
const router = useRouter();
|
||
const { login, busy, error, authenticated } = useAuth();
|
||
|
||
const username = ref("admin");
|
||
const password = ref("");
|
||
|
||
if (authenticated.value) {
|
||
const next = typeof route.query.next === "string" ? route.query.next : "/";
|
||
void router.replace(next || "/");
|
||
}
|
||
|
||
async function onSubmit() {
|
||
const ok = await login(username.value, password.value);
|
||
if (!ok) return;
|
||
const next = typeof route.query.next === "string" ? route.query.next : "/";
|
||
await router.replace(next || "/");
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div class="login-page">
|
||
<form class="login-card" @submit.prevent="onSubmit">
|
||
<h1>Вход в админку</h1>
|
||
<p class="hint">Карта доступна без входа. Остальные разделы — после авторизации.</p>
|
||
|
||
<label>
|
||
Логин
|
||
<input v-model="username" type="text" autocomplete="username" required />
|
||
</label>
|
||
|
||
<label>
|
||
Пароль
|
||
<input v-model="password" type="password" autocomplete="current-password" required />
|
||
</label>
|
||
|
||
<p v-if="error" class="error">{{ error }}</p>
|
||
|
||
<button type="submit" class="btn-primary" :disabled="busy">
|
||
{{ busy ? "Вход..." : "Войти" }}
|
||
</button>
|
||
|
||
<router-link class="back-link" to="/">← К карте</router-link>
|
||
</form>
|
||
</div>
|
||
</template>
|
||
|
||
<style scoped>
|
||
.login-page {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
min-height: 100%;
|
||
padding: 2rem 1rem;
|
||
background: linear-gradient(160deg, #eef2f7 0%, #f5f5f5 45%, #e8edf3 100%);
|
||
}
|
||
|
||
.login-card {
|
||
width: 100%;
|
||
max-width: 380px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.85rem;
|
||
padding: 1.75rem;
|
||
background: #fff;
|
||
border: 1px solid #e0e0e0;
|
||
border-radius: 10px;
|
||
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
|
||
}
|
||
|
||
h1 {
|
||
margin: 0;
|
||
font-size: 1.25rem;
|
||
font-weight: 650;
|
||
}
|
||
|
||
.hint {
|
||
margin: 0;
|
||
font-size: 0.875rem;
|
||
color: #666;
|
||
line-height: 1.4;
|
||
}
|
||
|
||
label {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.35rem;
|
||
font-size: 0.875rem;
|
||
color: #444;
|
||
}
|
||
|
||
input {
|
||
padding: 0.55rem 0.7rem;
|
||
border: 1px solid #d0d0d0;
|
||
border-radius: 6px;
|
||
background: #fff;
|
||
}
|
||
|
||
input:focus {
|
||
outline: 2px solid #bbdefb;
|
||
border-color: #64b5f6;
|
||
}
|
||
|
||
.error {
|
||
margin: 0;
|
||
font-size: 0.85rem;
|
||
color: #b91c1c;
|
||
}
|
||
|
||
.btn-primary {
|
||
margin-top: 0.25rem;
|
||
padding: 0.65rem 1rem;
|
||
border: none;
|
||
border-radius: 6px;
|
||
background: #1565c0;
|
||
color: #fff;
|
||
font-weight: 500;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.btn-primary:disabled {
|
||
opacity: 0.65;
|
||
cursor: not-allowed;
|
||
}
|
||
|
||
.btn-primary:not(:disabled):hover {
|
||
background: #0d47a1;
|
||
}
|
||
|
||
.back-link {
|
||
text-align: center;
|
||
font-size: 0.875rem;
|
||
color: #1565c0;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.back-link:hover {
|
||
text-decoration: underline;
|
||
}
|
||
</style>
|