feat: add login and register views with role-based redirect

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
TianyangZhang 2026-03-25 08:42:42 +08:00
parent 564fb06e3b
commit 0a44e4a18d
2 changed files with 86 additions and 2 deletions

View File

@ -1,3 +1,46 @@
<template> <template>
<div>登录页 - 开发中</div> <div class="auth-page">
<el-card class="auth-card">
<h2>登录</h2>
<el-form :model="form" @submit.prevent="handleLogin">
<el-form-item><el-input v-model="form.username" placeholder="用户名" /></el-form-item>
<el-form-item><el-input v-model="form.password" type="password" placeholder="密码" show-password /></el-form-item>
<el-button type="primary" native-type="submit" :loading="loading" style="width:100%">登录</el-button>
</el-form>
<div style="margin-top:12px;text-align:center">
没有账号<router-link to="/register">立即注册</router-link>
</div>
</el-card>
</div>
</template> </template>
<script setup>
import { reactive, ref } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { useAuthStore } from '@/stores/auth'
import { ElMessage } from 'element-plus'
const form = reactive({ username: '', password: '' })
const loading = ref(false)
const router = useRouter()
const route = useRoute()
const auth = useAuthStore()
async function handleLogin() {
loading.value = true
try {
await auth.login(form.username, form.password)
const redirect = route.query.redirect
if (redirect) return router.push(redirect)
if (auth.isSeeker) router.push('/seeker/resume')
else router.push('/admin/jobs')
} catch {
ElMessage.error('用户名或密码错误')
} finally {
loading.value = false
}
}
</script>
<style scoped>
.auth-page { display:flex; justify-content:center; align-items:center; min-height:60vh; }
.auth-card { width: 380px; }
</style>

View File

@ -1,3 +1,44 @@
<template> <template>
<div>注册页 - 开发中</div> <div class="auth-page">
<el-card class="auth-card">
<h2>求职者注册</h2>
<el-form :model="form" @submit.prevent="handleRegister">
<el-form-item><el-input v-model="form.username" placeholder="用户名" /></el-form-item>
<el-form-item><el-input v-model="form.email" placeholder="邮箱" /></el-form-item>
<el-form-item><el-input v-model="form.phone" placeholder="手机号(可选)" /></el-form-item>
<el-form-item><el-input v-model="form.password" type="password" placeholder="密码至少6位" show-password /></el-form-item>
<el-button type="primary" native-type="submit" :loading="loading" style="width:100%">注册</el-button>
</el-form>
<div style="margin-top:12px;text-align:center">
已有账号<router-link to="/login">立即登录</router-link>
</div>
</el-card>
</div>
</template> </template>
<script setup>
import { reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { register } from '@/api/auth'
import { ElMessage } from 'element-plus'
const form = reactive({ username: '', email: '', phone: '', password: '' })
const loading = ref(false)
const router = useRouter()
async function handleRegister() {
loading.value = true
try {
await register(form)
ElMessage.success('注册成功,请登录')
router.push('/login')
} catch (e) {
ElMessage.error(e.response?.data?.username?.[0] || '注册失败,请重试')
} finally {
loading.value = false
}
}
</script>
<style scoped>
.auth-page { display:flex; justify-content:center; align-items:center; min-height:60vh; }
.auth-card { width: 380px; }
</style>