feat: 🚀 用户模板用户配置

This commit is contained in:
bunny 2024-10-14 16:00:14 +08:00
parent b042370e92
commit 269a71532f
12 changed files with 72 additions and 35 deletions

View File

@ -6,11 +6,6 @@ export const fetchGetEmailTemplateList = (data: any) => {
return http.request<BaseResult<ResultTable>>('get', `emailTemplate/getEmailTemplateList/${data.currentPage}/${data.pageSize}`, { params: data });
};
/** 邮件模板表---查询所有邮件模板 */
export const fetchGetAllEmailTemplates = () => {
return http.request<BaseResult<any>>('get', 'emailTemplate/getAllEmailTemplates');
};
/** 邮件模板表---添加邮件模板表 */
export const fetchAddEmailTemplate = (data: any) => {
return http.request<BaseResult<object>>('post', 'emailTemplate/addEmailTemplate', { data });

View File

@ -6,6 +6,11 @@ export const fetchGetEmailUsersList = (data: any) => {
return http.request<BaseResult<ResultTable>>('get', `emailUsers/getEmailUsersList/${data.currentPage}/${data.pageSize}`, { params: data });
};
/** 邮箱用户发送配置管理---获取所有邮箱配置用户 */
export const fetchGetAllMailboxConfigurationUsers = () => {
return http.request<BaseResult<any>>('get', 'emailUsers/getAllMailboxConfigurationUsers');
};
/** 邮箱用户发送配置管理---添加邮箱用户发送配置管理 */
export const fetchAddEmailUsers = (data: any) => {
return http.request<BaseResult<object>>('post', 'emailUsers/addEmailUsers', { data });

View File

@ -3,6 +3,7 @@ import { fetchAddEmailTemplate, fetchDeleteEmailTemplate, fetchGetEmailTemplateL
import { pageSizes } from '@/enums/baseConstant';
import { storeMessage } from '@/utils/message';
import { storePagination } from '@/store/useStorePagination';
import { fetchGetAllMailboxConfigurationUsers } from '@/api/v1/emailUsers';
/**
* Store
@ -12,6 +13,8 @@ export const useEmailTemplateStore = defineStore('emailTemplateStore', {
return {
// 邮件模板表列表
datalist: [],
// 邮件模板用户列表
emailUserList: [],
// 查询表单
form: {
// 模板名称
@ -34,7 +37,13 @@ export const useEmailTemplateStore = defineStore('emailTemplateStore', {
loading: false,
};
},
getters: {},
getters: {
getMailboxConfigurationUser(state) {
const map = {};
state.emailUserList.forEach(user => (map[user.value] = user.key));
return map;
},
},
actions: {
/** 获取邮件模板表 */
async getEmailTemplateList() {
@ -52,6 +61,14 @@ export const useEmailTemplateStore = defineStore('emailTemplateStore', {
return pagination(result);
},
/** 获取所有邮箱配置用户 */
async getAllMailboxConfigurationUsers() {
const result = await fetchGetAllMailboxConfigurationUsers();
if (result.code !== 200) return;
this.emailUserList = result.data;
},
/** 添加邮件模板表 */
async addEmailTemplate(data: any) {
const result = await fetchAddEmailTemplate(data);

View File

@ -4,11 +4,14 @@ import { FormInstance } from 'element-plus';
import { rules } from '@/views/configuration/emailTemplate/utils/columns';
import { FormProps } from '@/views/configuration/emailTemplate/utils/types';
import { $t } from '@/plugins/i18n';
import { useEmailTemplateStore } from '@/store/configuration/emailTemplate';
const props = withDefaults(defineProps<FormProps>(), {
formInline: () => ({
//
templateName: undefined,
//
emailUser: undefined,
//
subject: undefined,
//
@ -20,21 +23,37 @@ const props = withDefaults(defineProps<FormProps>(), {
const formRef = ref<FormInstance>();
const form = ref(props.formInline);
const emailUserList = ref();
const emailTemplateStore = useEmailTemplateStore();
defineExpose({ formRef });
</script>
<template>
<el-form ref="formRef" :model="form" :rules="rules" label-width="auto">
<!-- 模板名称 -->
<el-form-item :label="$t('emailTemplate_templateName')" prop="templateName">
<el-input v-model="form.templateName" autocomplete="off" type="text" />
</el-form-item>
<!-- 配置模板邮件关联用户邮件 -->
<el-form-item :label="$t('emailTemplate_emailUser')" prop="emailUser">
<el-select v-model="form.emailUser" :placeholder="$t('emailTemplate_emailUser')" clearable filterable>
<el-option v-for="(item, index) in emailTemplateStore.emailUserList" :key="index" :label="item.key" :navigationBar="false" :value="item.value" />
</el-select>
</el-form-item>
<!-- 配置主题内容 -->
<el-form-item :label="$t('emailTemplate_subject')" prop="subject">
<el-input v-model="form.subject" autocomplete="off" type="text" />
</el-form-item>
<!-- 配置邮件发送体 -->
<el-form-item :label="$t('emailTemplate_body')" prop="body">
<el-input v-model="form.body" :autosize="{ minRows: 2, maxRows: 26 }" autocomplete="off" type="textarea" />
</el-form-item>
<!--配置邮件类型-->
<el-form-item :label="$t('emailTemplate_type')" prop="type">
<el-input v-model="form.type" autocomplete="off" type="text" />
</el-form-item>

View File

@ -50,6 +50,7 @@ const onSelectionChange = (rows: Array<any>) => {
};
onMounted(() => {
emailTemplateStore.getAllMailboxConfigurationUsers();
onSearch();
});
</script>
@ -106,6 +107,10 @@ onMounted(() => {
@page-size-change="onPageSizeChange"
@page-current-change="onCurrentPageChange"
>
<template #emailUser="{ row }">
{{ emailTemplateStore.getMailboxConfigurationUser[row.emailUser] }}
</template>
<template #createUser="{ row }">
<el-button link type="primary" @click="selectUserinfo(row.createUser)">{{ $t('table.createUser') }} </el-button>
</template>

View File

@ -7,6 +7,8 @@ export const columns: TableColumnList = [
{ type: 'index', index: (index: number) => index + 1, label: '序号', width: 60 },
// 模板名称
{ label: $t('emailTemplate_templateName'), prop: 'templateName' },
// 模板名称
{ label: $t('emailTemplate_emailUser'), prop: 'emailUser', slot: 'emailUser' },
// 主题
{ label: $t('emailTemplate_subject'), prop: 'subject' },
// 邮件内容
@ -24,6 +26,8 @@ export const columns: TableColumnList = [
export const rules = reactive({
// 模板名称
templateName: [{ required: true, message: `${$t('input')}${$t('emailTemplate_templateName')}`, trigger: 'blur' }],
// 模板名称
emailUser: [{ required: true, message: `${$t('input')}${$t('emailTemplate_templateName')}`, trigger: 'blur' }],
// 主题
subject: [{ required: true, message: `${$t('input')}${$t('emailTemplate_subject')}`, trigger: 'blur' }],
// 邮件内容

View File

@ -1,6 +1,6 @@
import { addDialog } from '@/components/BaseDialog/index';
import EmailTemplateDialog from '@/views/configuration/emailTemplate/email-template-dialog.vue';
import { useEmailTemplateStore } from '@/store/configuration/emailTemplate.ts';
import { useEmailTemplateStore } from '@/store/configuration/emailTemplate';
import { h, ref } from 'vue';
import { messageBox } from '@/utils/message';
import type { FormItemProps } from '@/views/configuration/emailTemplate/utils/types';
@ -30,6 +30,7 @@ export function onAdd() {
props: {
formInline: {
templateName: undefined,
emailUser: undefined,
subject: undefined,
body: undefined,
type: undefined,
@ -64,6 +65,7 @@ export function onUpdate(row: any) {
props: {
formInline: {
templateName: row.templateName,
emailUser: row.emailUser,
subject: row.subject,
body: row.body,
type: row.type,

View File

@ -2,6 +2,8 @@
export interface FormItemProps {
// 模板名称
templateName: string;
// 模板名称
emailUser: string;
// 主题
subject: string;
// 邮件内容

View File

@ -1,17 +1,15 @@
<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import { ref } from 'vue';
import { FormInstance } from 'element-plus';
import { rules } from '@/views/configuration/emailUsers/utils/columns';
import { FormProps } from '@/views/configuration/emailUsers/utils/types';
import { $t } from '@/plugins/i18n';
import { usePublicHooks } from '@/views/hooks';
import { fetchGetAllEmailTemplates } from '@/api/v1/emailTemplate';
const props = withDefaults(defineProps<FormProps>(), {
formInline: () => ({
//
email: undefined,
//
emailTemplate: undefined,
//
password: undefined,
@ -30,48 +28,38 @@ const formRef = ref<FormInstance>();
const form = ref(props.formInline);
//
const { switchStyle } = usePublicHooks();
//
const emailTemplateList = ref();
/** 查询所有邮件模板 */
const getAllEmailTemplates = async () => {
const result = await fetchGetAllEmailTemplates();
if (result.code !== 200) return;
emailTemplateList.value = result.data.map(({ id, templateName }) => ({
value: id,
label: templateName,
}));
};
onMounted(() => {
getAllEmailTemplates();
});
defineExpose({ formRef });
</script>
<template>
<el-form ref="formRef" :model="form" :rules="rules" label-width="auto">
<!-- 邮箱账号 -->
<el-form-item :label="$t('emailUsers_email')" prop="email">
<el-input v-model="form.email" autocomplete="off" type="text" />
</el-form-item>
<el-form-item :label="$t('emailUsers_emailTemplate')" prop="emailTemplate">
<el-select v-model="form.emailTemplate" :placeholder="$t('input') + $t('emailUsers_emailTemplate')" clearable filterable>
<el-option v-for="(item, index) in emailTemplateList" :key="index" :label="item.label" :navigationBar="false" :value="item.value" />
</el-select>
</el-form-item>
<!-- 邮箱密码 -->
<el-form-item :label="$t('emailUsers_password')" prop="password">
<el-input v-model="form.password" autocomplete="off" type="text" />
</el-form-item>
<!-- 配置主机 -->
<el-form-item :label="$t('emailUsers_host')" prop="host">
<el-input v-model="form.host" autocomplete="off" type="text" />
</el-form-item>
<!-- 邮箱端口号 -->
<el-form-item :label="$t('emailUsers_port')" prop="port">
<el-input v-model="form.port" autocomplete="off" max="9999" type="number" />
</el-form-item>
<!-- smtp协议 -->
<el-form-item :label="$t('emailUsers_smtpAgreement')" prop="smtpAgreement">
<el-input v-model="form.smtpAgreement" autocomplete="off" maxlength="10" show-word-limit type="text" />
</el-form-item>
<!-- 是否为默认 -->
<el-form-item :label="$t('emailUsers_isDefault')" prop="isDefault">
<el-switch v-model="form.isDefault" :active-text="$t('default')" :active-value="true" :inactive-text="$t('no_default')" :inactive-value="false" :style="switchStyle" inline-prompt />
</el-form-item>

View File

@ -32,7 +32,6 @@ export function onAdd() {
props: {
formInline: {
email: undefined,
emailTemplate: undefined,
password: undefined,
host: undefined,
port: undefined,
@ -69,7 +68,6 @@ export function onUpdate(row: any) {
props: {
formInline: {
email: row.email,
emailTemplate: row.emailTemplate,
password: row.password,
host: row.host,
port: row.port,

View File

@ -2,8 +2,6 @@
export interface FormItemProps {
// 邮箱
email: string;
// 邮件模板
emailTemplate: number;
// 密码
password: string;
// Host地址

View File

@ -29,6 +29,10 @@ const upload = ref();
const form = ref(props.formInline);
const filesStore = useFilesStore();
/**
* * 修改时替换之前文件
* @param files
*/
const handleExceed: UploadProps['onExceed'] = files => {
upload.value!.clearFiles();
const file = files[0] as UploadRawFile;