refactor: 主要功能实现
目前的工作已经实现的功能： - 基本 FastAPI 路由； - 基本 AI 聊天和创作功能； - 用户信息管理、权限验证、JWT 令牌签发和验证、端点保护； - HTML 验证码邮件发送和验证码验证。
This commit is contained in:
@@ -0,0 +1,197 @@
|
||||
<script setup lang="ts">
|
||||
import ConfigCard from "@/components/admin/ConfigCard.vue";
|
||||
import {useHead} from "@unhead/vue";
|
||||
import {ref} from "vue";
|
||||
import {api} from "@/tools/web.ts";
|
||||
import InDev from "@/components/InDev.vue";
|
||||
import {useMessage} from "naive-ui";
|
||||
import type {ReturnDto} from "@/types/response.ts";
|
||||
|
||||
interface SiteConfig {
|
||||
site_name: string;
|
||||
site_url: string;
|
||||
backend_url: string;
|
||||
|
||||
jwt_secret_key: string;
|
||||
|
||||
smtp_enable: boolean;
|
||||
smtp_sender: string;
|
||||
smtp_hostname: string;
|
||||
smtp_port: number;
|
||||
smtp_username: string;
|
||||
smtp_password: string;
|
||||
smtp_use_tls: boolean;
|
||||
}
|
||||
|
||||
const MESSAGE = useMessage()
|
||||
|
||||
useHead({
|
||||
title: "NyaHome 管理后台"
|
||||
})
|
||||
|
||||
const siteConfig = ref<SiteConfig | null>(null);
|
||||
|
||||
function getConfig() {
|
||||
api.get("/admin/site_config/")
|
||||
.then((res) => {
|
||||
siteConfig.value = res.data as SiteConfig
|
||||
MESSAGE.success("成功获取设置~")
|
||||
})
|
||||
}
|
||||
|
||||
function saveConfig() {
|
||||
api.post("/admin/site_config/", JSON.stringify(siteConfig.value))
|
||||
.then((res) => {
|
||||
siteConfig.value = res.data as SiteConfig
|
||||
MESSAGE.success("保存并刷新设置成功~")
|
||||
})
|
||||
}
|
||||
|
||||
const testMailTo = ref("25565@qq.com")
|
||||
|
||||
function sendTestMail() {
|
||||
api.post("/admin/email-test/", JSON.stringify({to: testMailTo.value}))
|
||||
.then(res => res.data as ReturnDto)
|
||||
.then(data => data.success)
|
||||
.then(success => {
|
||||
if (success) {
|
||||
MESSAGE.success("邮件发送成功，请稍等片刻，然后检查收件箱~")
|
||||
} else {
|
||||
MESSAGE.error("后端表示邮件发送失败，请检查日志输出。")
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<n-card>
|
||||
<template #header>
|
||||
<n-h3 prefix="bar" style="margin: 0;">NyaHome 管理后台</n-h3>
|
||||
</template>
|
||||
<template #header-extra>
|
||||
<n-flex>
|
||||
<n-button type="success" secondary @click="getConfig()">获取设置</n-button>
|
||||
<n-button type="error" secondary @click="saveConfig()">保存设置</n-button>
|
||||
</n-flex>
|
||||
</template>
|
||||
</n-card>
|
||||
|
||||
<n-tabs type="card" v-if="siteConfig !== null">
|
||||
<n-tab-pane name="user" tab="用户" display-directive="show">
|
||||
<config-card title="全部用户">
|
||||
<in-dev/>
|
||||
</config-card>
|
||||
</n-tab-pane>
|
||||
|
||||
<n-tab-pane name="chatroom" tab="聊天室" display-directive="show">
|
||||
<config-card title="全部聊天室">
|
||||
<in-dev/>
|
||||
</config-card>
|
||||
</n-tab-pane>
|
||||
|
||||
<n-tab-pane name="script" tab="剧本" display-directive="show">
|
||||
<config-card title="全部剧本">
|
||||
<in-dev/>
|
||||
</config-card>
|
||||
</n-tab-pane>
|
||||
|
||||
<n-tab-pane name="site_info" tab="站点信息" display-directive="show">
|
||||
<n-flex vertical>
|
||||
<config-card title="基本信息">
|
||||
<n-form>
|
||||
<n-form-item label="站点名称">
|
||||
<n-input v-model:value="siteConfig.site_name"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="站点地址">
|
||||
<n-input v-model:value="siteConfig.site_url"/>
|
||||
</n-form-item>
|
||||
<n-alert type="info" class="in-form-alert">
|
||||
如果您需要将 NyaHome 的前后端分开部署，则需要在此设置后端地址。您需要自行处理跨域问题。
|
||||
</n-alert>
|
||||
<n-form-item label="FastAPI 后端地址">
|
||||
<n-input v-model:value="siteConfig.backend_url"/>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
</config-card>
|
||||
|
||||
<config-card title="搜索引擎设置与 SEO">
|
||||
<in-dev/>
|
||||
</config-card>
|
||||
</n-flex>
|
||||
</n-tab-pane>
|
||||
|
||||
<n-tab-pane name="permission" tab="权限设置" display-directive="show">
|
||||
<config-card title="用户权限">
|
||||
<in-dev/>
|
||||
</config-card>
|
||||
</n-tab-pane>
|
||||
|
||||
<n-tab-pane name="security" tab="安全设置" display-directive="show">
|
||||
<n-flex vertical>
|
||||
<config-card title="JWT">
|
||||
<n-form>
|
||||
<n-alert type="info" class="in-form-alert">
|
||||
JWT（Json Web Token）签名需要一个密钥，你可以手动提供一个，或者自行生成一个。<br/>
|
||||
修改此密钥会导致所有用户的登录状态丢失（你也会），请一次性设置一个足够安全的。
|
||||
</n-alert>
|
||||
<n-form-item label="JWT 密钥">
|
||||
<n-input v-model:value="siteConfig.jwt_secret_key"/>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
</config-card>
|
||||
</n-flex>
|
||||
</n-tab-pane>
|
||||
|
||||
<n-tab-pane name="remote_service" tab="外部服务" display-directive="show">
|
||||
<n-flex vertical>
|
||||
<config-card title="邮件 SMTP">
|
||||
<n-form>
|
||||
<n-alert type="info" class="in-form-alert">
|
||||
NayHome 无法自己发送邮件，需要配置 SMTP 服务。<br/>
|
||||
或者你也可以关闭邮件功能，当然芒果还是建议你配置一下的。
|
||||
</n-alert>
|
||||
<n-form-item label="启用邮件功能（SMTP）">
|
||||
<n-switch v-model:value="siteConfig.smtp_enable"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="发件人邮件地址">
|
||||
<n-input v-model:value="siteConfig.smtp_sender"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="SMTP 主机名">
|
||||
<n-input v-model:value="siteConfig.smtp_hostname"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="SMTP 端口">
|
||||
<n-input-number v-model:value="siteConfig.smtp_port"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="SMTP 用户名">
|
||||
<n-input v-model:value="siteConfig.smtp_username"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="SMTP 密码（一般应当是一个独立的应用程序密码）">
|
||||
<n-input v-model:value="siteConfig.smtp_password"/>
|
||||
</n-form-item>
|
||||
<n-form-item label="使用 TLS/SSL 加密">
|
||||
<n-switch v-model:value="siteConfig.smtp_use_tls"/>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
<template #action>
|
||||
<n-flex vertical>
|
||||
<n-text>你可以在这里测试 NayHome 的邮件系统能否使用上述 SMTP
|
||||
设置工作，这会发送一封测试邮件。
|
||||
</n-text>
|
||||
<n-input v-model:value="testMailTo"/>
|
||||
<n-button secondary type="warning" @click="sendTestMail()">发送测试邮件</n-button>
|
||||
</n-flex>
|
||||
</template>
|
||||
</config-card>
|
||||
</n-flex>
|
||||
</n-tab-pane>
|
||||
</n-tabs>
|
||||
|
||||
<n-empty size="large" v-else description="请尝试手动获取设置..."/>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.in-form-alert {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user