Add public map with JWT admin login and protect admin APIs.
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>
This commit is contained in:
Cursor
@@ -0,0 +1,146 @@
|
||||
<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>
|
||||
@@ -16,12 +16,14 @@ import CoordsTools from "../components/map/CoordsTools.vue";
|
||||
import MapToolbar from "../components/map/MapToolbar.vue";
|
||||
import PlaceSearch from "../components/map/PlaceSearch.vue";
|
||||
import ObjectPanel from "../components/ObjectPanel.vue";
|
||||
import { useAuth } from "../composables/useAuth";
|
||||
import type { LeafletMapApi } from "../composables/useLeafletMap";
|
||||
import type { DateRangePreset, MapFilters, MapObjectWithEvent, MapQueryParams } from "../types/map";
|
||||
import type { MapObjectCreate, ObjectType } from "../types/object";
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const { authenticated } = useAuth();
|
||||
|
||||
const objects = ref<MapObjectWithEvent[]>([]);
|
||||
const mapFilters = ref<MapFilters | null>(null);
|
||||
@@ -162,6 +164,7 @@ function handleMapContextMenu(payload: {
|
||||
longitude: number;
|
||||
object: MapObjectWithEvent | null;
|
||||
}) {
|
||||
if (!authenticated.value) return;
|
||||
contextMenu.value = {
|
||||
visible: true,
|
||||
x: payload.x,
|
||||
@@ -257,6 +260,7 @@ async function handleMoveObject(payload: {
|
||||
latitude: number;
|
||||
longitude: number;
|
||||
}) {
|
||||
if (!authenticated.value) return;
|
||||
if (payload.object.event_id) return;
|
||||
try {
|
||||
await updateObject(payload.object.id, {
|
||||
@@ -327,17 +331,22 @@ onUnmounted(() => {
|
||||
:objects="objects"
|
||||
:selected-id="selectedId"
|
||||
:open-popup-id="openPopupId"
|
||||
:editable="authenticated"
|
||||
@ready="onMapReady"
|
||||
@center-change="onCenterChange"
|
||||
@select="handleSelectObject"
|
||||
@contextmenu="handleMapContextMenu"
|
||||
@move="handleMoveObject"
|
||||
/>
|
||||
<ObjectPanel :object="selectedObject" @open-events="openInEvents" />
|
||||
<ObjectPanel
|
||||
:object="selectedObject"
|
||||
:can-edit="authenticated"
|
||||
@open-events="openInEvents"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<ContextMenu
|
||||
v-if="contextMenu.visible"
|
||||
v-if="contextMenu.visible && authenticated"
|
||||
:x="contextMenu.x"
|
||||
:y="contextMenu.y"
|
||||
:target="contextMenu.target"
|
||||
@@ -350,7 +359,7 @@ onUnmounted(() => {
|
||||
/>
|
||||
|
||||
<CreateObjectModal
|
||||
v-if="createModal.visible"
|
||||
v-if="createModal.visible && authenticated"
|
||||
:latitude="createModal.latitude"
|
||||
:longitude="createModal.longitude"
|
||||
@close="closeCreateModal"
|
||||
@@ -358,7 +367,7 @@ onUnmounted(() => {
|
||||
/>
|
||||
|
||||
<EditObjectModal
|
||||
v-if="editModal.visible && editModal.object"
|
||||
v-if="editModal.visible && editModal.object && authenticated"
|
||||
:object="editModal.object"
|
||||
@close="closeEditModal"
|
||||
@submit="handleEditObject"
|
||||
|
||||
@@ -25,14 +25,14 @@ const editingJob = ref<ParseJob | null>(null);
|
||||
const pairForm = ref({
|
||||
channel_id: null as number | null,
|
||||
profile_id: null as number | null,
|
||||
limit: 100,
|
||||
limit: 10,
|
||||
interval_seconds: 3600,
|
||||
});
|
||||
|
||||
const editForm = ref({
|
||||
channel_id: null as number | null,
|
||||
profile_id: null as number | null,
|
||||
limit: 100,
|
||||
limit: 10,
|
||||
interval_seconds: 3600,
|
||||
is_active: true,
|
||||
});
|
||||
@@ -62,7 +62,7 @@ function isPairJob(job: ParseJob | null): boolean {
|
||||
|
||||
function limitFromConfig(config: Record<string, unknown>): number {
|
||||
const limit = config.limit;
|
||||
return typeof limit === "number" ? limit : 100;
|
||||
return typeof limit === "number" ? limit : 10;
|
||||
}
|
||||
|
||||
function sourceSummary(job: ParseJob): string {
|
||||
|
||||
Reference in New Issue
Block a user