feat: add admin login

frontend/admin/src/pages/LoginPage.vue

@@ -0,0 +1,72 @@
+<script setup>
+import { useAuthStore } from '@/stores/auth';
+import Button from 'primevue/button';
+import Card from 'primevue/card';
+import InputText from 'primevue/inputtext';
+import Password from 'primevue/password';
+import { ref } from 'vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+const authStore = useAuthStore();
+
+const username = ref('');
+const password = ref('');
+const loading = ref(false);
+const errorMessage = ref('');
+
+const handleLogin = async () => {
+    loading.value = true;
+    errorMessage.value = '';
+
+    try {
+        await authStore.login(username.value, password.value);
+        router.push('/');
+    } catch (error) {
+        errorMessage.value = error.message || '登录失败';
+    } finally {
+        loading.value = false;
+    }
+};
+</script>
+
+<template>
+    <div class="min-h-screen bg-gray-100 flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
+        <div class="max-w-md w-full space-y-8">
+            <Card class="mt-8 bg-white shadow-lg">
+                <template #content>
+                    <div class="space-y-6">
+                        <div class="flex flex-col gap-2">
+                            <label for="username" class="text-sm font-medium text-gray-700">用户名</label>
+                            <InputText id="username" v-model="username" class="appearance-none relative block w-full"
+                                placeholder="请输入用户名" @keyup.enter="handleLogin" />
+                        </div>
+
+                        <div class="flex flex-col gap-2">
+                            <label for="password" class="text-sm font-medium text-gray-700">密码</label>
+                            <Password id="password" v-model="password" class="w-full" placeholder="请输入密码" toggleMask
+                                :feedback="false" @keyup.enter="handleLogin" />
+                        </div>
+
+                        <div v-if="errorMessage" class="text-red-500 text-sm text-center">
+                            {{ errorMessage }}
+                        </div>
+
+                        <Button label="登录" @click="handleLogin" :loading="loading" class="w-full p-button-primary"
+                            :class="{ 'p-disabled': loading }" />
+                    </div>
+                </template>
+            </Card>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+:deep(.p-password input) {
+    width: 100%;
+}
+
+:deep(.p-inputtext) {
+    padding: 0.75rem 1rem;
+}
+</style>