mirror of
https://github.com/certd/certd.git
synced 2026-05-16 21:27:34 +08:00
chore: code format
This commit is contained in:
xiaojunnuo
@@ -6,7 +6,7 @@ export async function TestSend(receiver: string) {
|
||||
url: apiPrefix + "/test",
|
||||
method: "post",
|
||||
data: {
|
||||
receiver
|
||||
}
|
||||
receiver,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1,86 +1,75 @@
|
||||
<template>
|
||||
<fs-page class="page-setting-email">
|
||||
<template #header>
|
||||
<div class="title">
|
||||
{{ t('certd.emailServerSettings') }}
|
||||
<span class="sub">{{ t('certd.setEmailSendingServer') }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<fs-page class="page-setting-email">
|
||||
<template #header>
|
||||
<div class="title">
|
||||
{{ t("certd.emailServerSettings") }}
|
||||
<span class="sub">{{ t("certd.setEmailSendingServer") }}</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="flex-o">
|
||||
<a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }"
|
||||
autocomplete="off" class="email-form-box" @finish="onFinish" @finish-failed="onFinishFailed">
|
||||
<div v-if="!formState.usePlus" class="email-form">
|
||||
<a-form-item :label="t('certd.useCustomEmailServer')"> </a-form-item>
|
||||
<a-form-item :label="t('certd.smtpDomain')" name="host"
|
||||
:rules="[{ required: true, message: t('certd.pleaseEnterSmtpDomain') }]">
|
||||
<a-input v-model:value="formState.host" />
|
||||
</a-form-item>
|
||||
<div class="flex-o">
|
||||
<a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off" class="email-form-box" @finish="onFinish" @finish-failed="onFinishFailed">
|
||||
<div v-if="!formState.usePlus" class="email-form">
|
||||
<a-form-item :label="t('certd.useCustomEmailServer')"> </a-form-item>
|
||||
<a-form-item :label="t('certd.smtpDomain')" name="host" :rules="[{ required: true, message: t('certd.pleaseEnterSmtpDomain') }]">
|
||||
<a-input v-model:value="formState.host" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :label="t('certd.smtpPort')" name="port"
|
||||
:rules="[{ required: true, message: t('certd.pleaseEnterSmtpPort') }]">
|
||||
<a-input v-model:value="formState.port" />
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.smtpPort')" name="port" :rules="[{ required: true, message: t('certd.pleaseEnterSmtpPort') }]">
|
||||
<a-input v-model:value="formState.port" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item :label="t('certd.username')" :name="['auth', 'user']"
|
||||
:rules="[{ required: true, message: t('certd.pleaseEnterUsername') }]">
|
||||
<a-input v-model:value="formState.auth.user" />
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.password')" :name="['auth', 'pass']"
|
||||
:rules="[{ required: true, message: t('certd.pleaseEnterPassword') }]">
|
||||
<a-input-password v-model:value="formState.auth.pass" />
|
||||
<div class="helper">{{ t('certd.qqEmailAuthCodeHelper') }}</div>
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.senderEmail')" name="sender"
|
||||
:rules="[{ required: true, message: t('certd.pleaseEnterSenderEmail') }]">
|
||||
<a-input v-model:value="formState.sender" />
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.useSsl')" name="secure">
|
||||
<a-switch v-model:checked="formState.secure" />
|
||||
<div class="helper">{{ t('certd.sslPortNote') }}</div>
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.ignoreCertValidation')" :name="['tls', 'rejectUnauthorized']">
|
||||
<a-switch v-model:checked="formState.tls.rejectUnauthorized" />
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.username')" :name="['auth', 'user']" :rules="[{ required: true, message: t('certd.pleaseEnterUsername') }]">
|
||||
<a-input v-model:value="formState.auth.user" />
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.password')" :name="['auth', 'pass']" :rules="[{ required: true, message: t('certd.pleaseEnterPassword') }]">
|
||||
<a-input-password v-model:value="formState.auth.pass" />
|
||||
<div class="helper">{{ t("certd.qqEmailAuthCodeHelper") }}</div>
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.senderEmail')" name="sender" :rules="[{ required: true, message: t('certd.pleaseEnterSenderEmail') }]">
|
||||
<a-input v-model:value="formState.sender" />
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.useSsl')" name="secure">
|
||||
<a-switch v-model:checked="formState.secure" />
|
||||
<div class="helper">{{ t("certd.sslPortNote") }}</div>
|
||||
</a-form-item>
|
||||
<a-form-item :label="t('certd.ignoreCertValidation')" :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">{{ t('certd.save') }}</a-button>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="email-form">
|
||||
<a-form-item :label="t('certd.useOfficialEmailServer')" name="usePlus">
|
||||
<div class="flex-o">
|
||||
<a-switch v-model:checked="formState.usePlus" :disabled="!settingStore.isPlus"
|
||||
@change="onUsePlusChanged" />
|
||||
<vip-button class="ml-5" mode="button"></vip-button>
|
||||
</div>
|
||||
<div class="helper">{{ t('certd.useOfficialEmailServerHelper') }}</div>
|
||||
</a-form-item>
|
||||
</div>
|
||||
</a-form>
|
||||
</div>
|
||||
<div class="email-form">
|
||||
<a-form :model="testFormState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }"
|
||||
autocomplete="off" @finish="onTestSend">
|
||||
<a-form-item :label="t('certd.testReceiverEmail')" name="receiver"
|
||||
:rules="[{ required: true, message: t('certd.pleaseEnterTestReceiverEmail') }]">
|
||||
<a-input v-model:value="testFormState.receiver" />
|
||||
<div class="helper">{{ t('certd.saveBeforeTest') }}</div>
|
||||
<div class="helper">{{ t('certd.sendFailHelpDoc') }}<a
|
||||
href="https://certd.docmirror.cn/guide/use/email/" target="_blank">{{
|
||||
t('certd.emailConfigHelpDoc') }}</a></div>
|
||||
<div class="helper">{{ t('certd.tryOfficialEmailServer') }}</div>
|
||||
</a-form-item>
|
||||
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
|
||||
<a-button type="primary" :loading="testFormState.loading" html-type="submit">{{ t('certd.test')
|
||||
}}</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</fs-page>
|
||||
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
|
||||
<a-button type="primary" html-type="submit">{{ t("certd.save") }}</a-button>
|
||||
</a-form-item>
|
||||
</div>
|
||||
<div class="email-form">
|
||||
<a-form-item :label="t('certd.useOfficialEmailServer')" name="usePlus">
|
||||
<div class="flex-o">
|
||||
<a-switch v-model:checked="formState.usePlus" :disabled="!settingStore.isPlus" @change="onUsePlusChanged" />
|
||||
<vip-button class="ml-5" mode="button"></vip-button>
|
||||
</div>
|
||||
<div class="helper">{{ t("certd.useOfficialEmailServerHelper") }}</div>
|
||||
</a-form-item>
|
||||
</div>
|
||||
</a-form>
|
||||
</div>
|
||||
<div class="email-form">
|
||||
<a-form :model="testFormState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off" @finish="onTestSend">
|
||||
<a-form-item :label="t('certd.testReceiverEmail')" name="receiver" :rules="[{ required: true, message: t('certd.pleaseEnterTestReceiverEmail') }]">
|
||||
<a-input v-model:value="testFormState.receiver" />
|
||||
<div class="helper">{{ t("certd.saveBeforeTest") }}</div>
|
||||
<div class="helper">
|
||||
{{ t("certd.sendFailHelpDoc") }}<a href="https://certd.docmirror.cn/guide/use/email/" target="_blank">{{ t("certd.emailConfigHelpDoc") }}</a>
|
||||
</div>
|
||||
<div class="helper">{{ t("certd.tryOfficialEmailServer") }}</div>
|
||||
</a-form-item>
|
||||
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
|
||||
<a-button type="primary" :loading="testFormState.loading" html-type="submit">{{ t("certd.test") }}</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive } from "vue";
|
||||
import * as api from "../api";
|
||||
@@ -92,98 +81,96 @@ import { useI18n } from "vue-i18n";
|
||||
|
||||
const { t } = useI18n();
|
||||
defineOptions({
|
||||
name: "EmailSetting",
|
||||
name: "EmailSetting",
|
||||
});
|
||||
|
||||
interface FormState {
|
||||
host: string;
|
||||
port: number;
|
||||
auth: {
|
||||
user: string;
|
||||
pass: string;
|
||||
};
|
||||
secure: boolean; // use TLS
|
||||
tls: {
|
||||
// do not fail on invalid certs
|
||||
rejectUnauthorized?: boolean;
|
||||
};
|
||||
sender: string;
|
||||
usePlus: boolean;
|
||||
host: string;
|
||||
port: number;
|
||||
auth: {
|
||||
user: string;
|
||||
pass: string;
|
||||
};
|
||||
secure: boolean; // use TLS
|
||||
tls: {
|
||||
// do not fail on invalid certs
|
||||
rejectUnauthorized?: boolean;
|
||||
};
|
||||
sender: string;
|
||||
usePlus: boolean;
|
||||
}
|
||||
|
||||
const formState = reactive<Partial<FormState>>({
|
||||
auth: {
|
||||
user: "",
|
||||
pass: "",
|
||||
},
|
||||
tls: {},
|
||||
usePlus: false,
|
||||
auth: {
|
||||
user: "",
|
||||
pass: "",
|
||||
},
|
||||
tls: {},
|
||||
usePlus: false,
|
||||
});
|
||||
|
||||
async function load() {
|
||||
const data: any = await api.EmailSettingsGet();
|
||||
_.merge(formState, data);
|
||||
const data: any = await api.EmailSettingsGet();
|
||||
_.merge(formState, data);
|
||||
}
|
||||
|
||||
load();
|
||||
|
||||
const onFinish = async (form: any) => {
|
||||
console.log("Success:", form);
|
||||
await api.EmailSettingsSave(form);
|
||||
notification.success({
|
||||
message: t("certd.saveSuccess"),
|
||||
});
|
||||
console.log("Success:", form);
|
||||
await api.EmailSettingsSave(form);
|
||||
notification.success({
|
||||
message: t("certd.saveSuccess"),
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
const onFinishFailed = (errorInfo: any) => {
|
||||
// console.log("Failed:", errorInfo);
|
||||
// console.log("Failed:", errorInfo);
|
||||
};
|
||||
|
||||
async function onUsePlusChanged() {
|
||||
await api.EmailSettingsSave(formState);
|
||||
await api.EmailSettingsSave(formState);
|
||||
}
|
||||
|
||||
interface TestFormState {
|
||||
receiver: string;
|
||||
loading: boolean;
|
||||
receiver: string;
|
||||
loading: boolean;
|
||||
}
|
||||
const testFormState = reactive<TestFormState>({
|
||||
receiver: "",
|
||||
loading: false,
|
||||
receiver: "",
|
||||
loading: false,
|
||||
});
|
||||
async function onTestSend() {
|
||||
testFormState.loading = true;
|
||||
try {
|
||||
await emailApi.TestSend(testFormState.receiver);
|
||||
notification.success({
|
||||
message: t("certd.sendSuccess"),
|
||||
});
|
||||
} finally {
|
||||
testFormState.loading = false;
|
||||
}
|
||||
testFormState.loading = true;
|
||||
try {
|
||||
await emailApi.TestSend(testFormState.receiver);
|
||||
notification.success({
|
||||
message: t("certd.sendSuccess"),
|
||||
});
|
||||
} finally {
|
||||
testFormState.loading = false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const settingStore = useSettingStore();
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.page-setting-email {
|
||||
.email-form-box {
|
||||
display: flex;
|
||||
}
|
||||
.email-form-box {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.email-form {
|
||||
width: 500px;
|
||||
margin: 20px;
|
||||
}
|
||||
.email-form {
|
||||
width: 500px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.helper {
|
||||
padding: 1px;
|
||||
margin: 0px;
|
||||
color: #999;
|
||||
font-size: 10px;
|
||||
}
|
||||
.helper {
|
||||
padding: 1px;
|
||||
margin: 0px;
|
||||
color: #999;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user