Files
vmall/apps/admin/pages/login.vue
T

69 lines
2.2 KiB
Vue

<script setup lang="ts">
import type { AuthTokens } from "@vmall/shared";
definePageMeta({ layout: false });
const { $api } = useNuxtApp();
const session = useSessionStore();
const { t } = useI18n();
const email = ref("admin@vmall.local");
const password = ref("admin1234");
const loading = ref(false);
const errorMessage = ref("");
async function submit(): Promise<void> {
if (!email.value.trim() || !password.value) {
errorMessage.value = t("common.required");
return;
}
loading.value = true;
errorMessage.value = "";
try {
const auth: AuthTokens = await $api.login(email.value.trim(), password.value);
if (auth.user.role !== "platform_admin") {
errorMessage.value = t("auth.wrongRole");
return;
}
session.setAuth(auth);
await navigateTo("/");
} catch (error: unknown) {
errorMessage.value = error instanceof Error ? error.message : t("common.error");
} finally {
loading.value = false;
}
}
</script>
<template>
<div class="bg-bg text-text grid min-h-screen place-items-center px-6 py-8 font-sans">
<form class="w-full max-w-[420px]" @submit.prevent="submit">
<VCard>
<p class="text-primary mb-2 text-xs font-bold tracking-[0.08em] uppercase">
{{ $t("common.appName") }} · Admin
</p>
<h1 class="mb-2 text-xl font-bold">{{ $t("auth.welcome") }}</h1>
<p class="text-muted mb-5 text-sm">{{ $t("admin.dashboardTitle") }}</p>
<VField :label="$t('common.email')">
<VInput id="email" v-model="email" type="email" autocomplete="username" required />
</VField>
<VField :label="$t('common.password')">
<VInput
id="password"
v-model="password"
type="password"
autocomplete="current-password"
required
/>
</VField>
<p v-if="errorMessage" class="text-danger my-2 text-sm" role="alert">{{ errorMessage }}</p>
<VBtn class="w-full" variant="primary" type="submit" :disabled="loading">
{{ loading ? $t("common.loading") : $t("common.login") }}
</VBtn>
<p class="text-muted mt-4 text-center text-xs">{{ $t("auth.adminHint") }}</p>
</VCard>
</form>
</div>
</template>