refactor: 拆分后台登录页面职责
This commit is contained in:
@@ -0,0 +1,59 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive } from "vue";
|
||||
|
||||
defineProps<{ loading: boolean }>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
submit: [credentials: { username: string; password: string }];
|
||||
}>();
|
||||
|
||||
const form = reactive({ username: "", password: "" });
|
||||
|
||||
function submit() {
|
||||
emit("submit", { username: form.username.trim(), password: form.password });
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main class="login-page">
|
||||
<section class="login-hero">
|
||||
<div class="login-hero-main">
|
||||
<div class="login-brand">
|
||||
<span>答</span>
|
||||
<strong>大本营千问千答</strong>
|
||||
</div>
|
||||
<h1>把大本营答疑、知识库和学员运营放在同一个控制台里。</h1>
|
||||
<p>统一维护学员名单、开放知识库、模型接入、Agent 调试、问答记录和系统运行参数,方便排查与交接。</p>
|
||||
<div class="login-highlights">
|
||||
<span>大本营知识库</span>
|
||||
<span>答疑 Agent 调试</span>
|
||||
<span>问答记录审计</span>
|
||||
</div>
|
||||
</div>
|
||||
<section class="login-card">
|
||||
<div class="login-card-head">
|
||||
<h2>登录答疑后台</h2>
|
||||
<p>请输入大本营答疑助手后台管理员账号和密码。</p>
|
||||
</div>
|
||||
<el-form label-position="top" autocomplete="off" @submit.prevent="submit">
|
||||
<el-form-item label="管理员账号">
|
||||
<el-input v-model="form.username" size="large" placeholder="请输入管理员账号" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="密码">
|
||||
<el-input
|
||||
v-model="form.password"
|
||||
size="large"
|
||||
type="password"
|
||||
placeholder="请输入密码"
|
||||
autocomplete="new-password"
|
||||
show-password
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-button type="primary" native-type="submit" :loading="loading" class="full-btn login-submit">
|
||||
进入答疑后台
|
||||
</el-button>
|
||||
</el-form>
|
||||
</section>
|
||||
</section>
|
||||
</main>
|
||||
</template>
|
||||
Reference in New Issue
Block a user