perf: email proxy

This commit is contained in:
xiaojunnuo
2024-08-23 11:35:34 +08:00
parent 14ab93dc2f
commit 453f1baa0b
8 changed files with 166 additions and 35 deletions
@@ -1,7 +1,6 @@
<template>
<div id="userLayout" :class="['user-layout-wrapper']">
<div class="login-container flex-center">
<div class="user-layout-lang"></div>
<div class="user-layout-content">
<div class="top flex flex-col items-center justify-center">
<div class="header flex flex-row items-center">
@@ -47,6 +47,9 @@ export const useUserStore = defineStore({
},
isAdmin(): boolean {
return this.getUserInfo?.id === 1;
},
isPlus(): boolean {
return this.plusInfo?.isPlus || false;
}
},
actions: {
@@ -4,32 +4,47 @@
<div class="title">邮件设置</div>
</template>
<div class="email-form">
<a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off" @finish="onFinish" @finish-failed="onFinishFailed">
<a-form-item label="SMTP域名" name="host" :rules="[{ required: true, message: '请输入smtp域名或ip' }]">
<a-input v-model:value="formState.host" />
<a-form
:model="formState"
name="basic"
:label-col="{ span: 8 }"
:wrapper-col="{ span: 16 }"
autocomplete="off"
@finish="onFinish"
@finish-failed="onFinishFailed"
>
<a-form-item label="使用邮件代理" name="usePlus">
<a-switch v-model:checked="formState.usePlus" :disabled="!userStore.isPlus" />
<div class="helper">专业版功能免除繁琐的邮件配置直接发邮件</div>
</a-form-item>
<template v-if="!formState.usePlus">
<a-form-item label="SMTP域名" name="host" :rules="[{ required: true, message: '请输入smtp域名或ip' }]">
<a-input v-model:value="formState.host" />
</a-form-item>
<a-form-item label="SMTP端口" name="port" :rules="[{ required: true, message: '请输入smtp端口号' }]">
<a-input v-model:value="formState.port" />
</a-form-item>
<a-form-item label="SMTP端口" name="port" :rules="[{ required: true, message: '请输入smtp端口号' }]">
<a-input v-model:value="formState.port" />
</a-form-item>
<a-form-item label="用户名" :name="['auth', 'user']" :rules="[{ required: true, message: '请输入用户名' }]">
<a-input v-model:value="formState.auth.user" />
</a-form-item>
<a-form-item label="密码" :name="['auth', 'pass']" :rules="[{ required: true, message: '请输入密码' }]">
<a-input-password v-model:value="formState.auth.pass" />
<div class="helper">如果是qq邮箱需要到qq邮箱的设置里面申请授权码作为密码</div>
</a-form-item>
<a-form-item label="发件邮箱" name="sender" :rules="[{ required: true, message: '请输入发件邮箱' }]">
<a-input v-model:value="formState.sender" />
</a-form-item>
<a-form-item label="是否ssl" name="secure">
<a-switch v-model:checked="formState.secure" />
<div class="helper">ssl和非ssl的smtp端口是不一样的注意修改端口</div>
</a-form-item>
<a-form-item label="忽略证书校验" name="tls.rejectUnauthorized">
<a-switch v-model:checked="formState.tls.rejectUnauthorized" />
</a-form-item>
</template>
<a-form-item label="用户名" :name="['auth', 'user']" :rules="[{ required: true, message: '请输入用户名' }]">
<a-input v-model:value="formState.auth.user" />
</a-form-item>
<a-form-item label="密码" :name="['auth', 'pass']" :rules="[{ required: true, message: '请输入密码' }]">
<a-input-password v-model:value="formState.auth.pass" />
<div class="helper">如果是qq邮箱需要到qq邮箱的设置里面申请授权码作为密码</div>
</a-form-item>
<a-form-item label="发件邮箱" name="sender" :rules="[{ required: true, message: '请输入发件邮箱' }]">
<a-input v-model:value="formState.sender" />
</a-form-item>
<a-form-item label="是否ssl" name="secure">
<a-switch v-model:checked="formState.secure" />
<div class="helper">ssl和非ssl的smtp端口是不一样的注意修改端口</div>
</a-form-item>
<a-form-item label="忽略证书校验" name="tls.rejectUnauthorized">
<a-switch v-model:checked="formState.tls.rejectUnauthorized" />
</a-form-item>
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
<a-button type="primary" html-type="submit">保存</a-button>
</a-form-item>
@@ -55,6 +70,7 @@ import * as emailApi from "./api.email";
import { SettingKeys } from "./api";
import { notification } from "ant-design-vue";
import { useUserStore } from "/@/store/modules/user";
interface FormState {
host: string;
@@ -69,6 +85,7 @@ interface FormState {
rejectUnauthorized?: boolean;
};
sender: string;
usePlus: boolean;
}
const formState = reactive<Partial<FormState>>({
@@ -76,7 +93,8 @@ const formState = reactive<Partial<FormState>>({
user: "",
pass: ""
},
tls: {}
tls: {},
usePlus: false
});
async function load() {
@@ -118,6 +136,8 @@ async function onTestSend() {
testFormState.loading = false;
}
}
const userStore = useUserStore();
</script>
<style lang="less">
@@ -127,9 +147,9 @@ async function onTestSend() {
margin: 20px;
}
.helper{
padding:1px;
margin:0px;
.helper {
padding: 1px;
margin: 0px;
color: #999;
font-size: 10px;
}