73 lines
2.1 KiB
Vue
73 lines
2.1 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import { ElMessage } from 'element-plus'
|
|
import { useUserStore } from '@/stores/user'
|
|
import apiClient from '@/api/client'
|
|
|
|
const router = useRouter()
|
|
const userStore = useUserStore()
|
|
|
|
const form = ref({
|
|
username_or_email: '',
|
|
password: '',
|
|
})
|
|
const loading = ref(false)
|
|
|
|
async function handleLogin() {
|
|
loading.value = true
|
|
try {
|
|
const { data } = await apiClient.post('/auth/internal-login', form.value)
|
|
userStore.setUser(data)
|
|
ElMessage.success('内部登录成功！')
|
|
router.push('/')
|
|
} catch {
|
|
// 错误由拦截器处理
|
|
} finally {
|
|
loading.value = false
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="internal-login-page">
|
|
<el-card class="login-card">
|
|
<template #header>
|
|
<div style="text-align: center">
|
|
<h2 style="margin: 0">🔐 内部登录</h2>
|
|
<p style="color: #999; font-size: 13px; margin: 8px 0 0">仅限公司内部员工使用</p>
|
|
</div>
|
|
</template>
|
|
<el-form :model="form" label-position="top" @submit.prevent="handleLogin">
|
|
<el-form-item label="用户名或邮箱">
|
|
<el-input v-model="form.username_or_email" placeholder="请输入用户名或邮箱" size="large" />
|
|
</el-form-item>
|
|
<el-form-item label="密码">
|
|
<el-input v-model="form.password" type="password" placeholder="请输入密码" show-password size="large" />
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" :loading="loading" style="width: 100%" native-type="submit" size="large">
|
|
登录
|
|
</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
<div style="text-align: center; margin-top: 10px">
|
|
<router-link to="/login" style="color: #409eff; font-size: 14px">客户登录 →</router-link>
|
|
</div>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.internal-login-page {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
min-height: 100vh;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
}
|
|
.login-card {
|
|
width: 420px;
|
|
border-radius: 12px;
|
|
}
|
|
</style> |