refactor: 修复一些消息中心的 todo
parent
0e3d3af66a
commit
ab67eb049e
|
@ -1,12 +1,14 @@
|
||||||
import type { VbenFormSchema } from '#/adapter/form';
|
import type { VbenFormSchema } from '#/adapter/form';
|
||||||
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
|
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
import type { SystemMailTemplateApi } from '#/api/system/mail/template';
|
import type { SystemMailTemplateApi } from '#/api/system/mail/template';
|
||||||
|
import type { ComputedRef } from 'vue';
|
||||||
|
|
||||||
import { z } from '#/adapter/form';
|
import { z } from '#/adapter/form';
|
||||||
import { getSimpleMailAccountList } from '#/api/system/mail/account';
|
import { getSimpleMailAccountList } from '#/api/system/mail/account';
|
||||||
import { CommonStatusEnum } from '#/utils/constants';
|
import { CommonStatusEnum } from '#/utils/constants';
|
||||||
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
|
|
||||||
import { getRangePickerDefaultProps } from '#/utils/date';
|
import { getRangePickerDefaultProps } from '#/utils/date';
|
||||||
|
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
|
||||||
|
|
||||||
import { useAccess } from '@vben/access';
|
import { useAccess } from '@vben/access';
|
||||||
|
|
||||||
const { hasAccessByCodes } = useAccess();
|
const { hasAccessByCodes } = useAccess();
|
||||||
|
@ -59,7 +61,7 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请输入发送人名称',
|
placeholder: '请输入发送人名称',
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
fieldName: 'title',
|
fieldName: 'title',
|
||||||
|
@ -97,7 +99,7 @@ export function useFormSchema(): VbenFormSchema[] {
|
||||||
component: 'Textarea',
|
component: 'Textarea',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
placeholder: '请输入备注',
|
placeholder: '请输入备注',
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
@ -130,7 +132,7 @@ export function useSendMailFormSchema(): VbenFormSchema[] {
|
||||||
placeholder: '请输入收件邮箱',
|
placeholder: '请输入收件邮箱',
|
||||||
},
|
},
|
||||||
rules: z.string().email('请输入正确的邮箱地址'),
|
rules: z.string().email('请输入正确的邮箱地址'),
|
||||||
}
|
},
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -154,7 +156,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||||
componentProps: {
|
componentProps: {
|
||||||
allowClear: true,
|
allowClear: true,
|
||||||
placeholder: '请输入模板编码',
|
placeholder: '请输入模板编码',
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
fieldName: 'name',
|
fieldName: 'name',
|
||||||
|
@ -163,7 +165,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||||
componentProps: {
|
componentProps: {
|
||||||
allowClear: true,
|
allowClear: true,
|
||||||
placeholder: '请输入模板名称',
|
placeholder: '请输入模板名称',
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
fieldName: 'accountId',
|
fieldName: 'accountId',
|
||||||
|
@ -192,6 +194,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||||
/** 列表的字段 */
|
/** 列表的字段 */
|
||||||
export function useGridColumns<T = SystemMailTemplateApi.SystemMailTemplate>(
|
export function useGridColumns<T = SystemMailTemplateApi.SystemMailTemplate>(
|
||||||
onActionClick: OnActionClickFn<T>,
|
onActionClick: OnActionClickFn<T>,
|
||||||
|
getAccountName: ComputedRef<(cellValue: number) => string>,
|
||||||
): VxeTableGridOptions['columns'] {
|
): VxeTableGridOptions['columns'] {
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
|
@ -214,11 +217,11 @@ export function useGridColumns<T = SystemMailTemplateApi.SystemMailTemplate>(
|
||||||
title: '模板标题',
|
title: '模板标题',
|
||||||
minWidth: 120,
|
minWidth: 120,
|
||||||
},
|
},
|
||||||
// TODO @puhui999:这里差一个翻译
|
|
||||||
{
|
{
|
||||||
field: 'accountId',
|
field: 'accountId',
|
||||||
title: '邮箱账号',
|
title: '邮箱账号',
|
||||||
minWidth: 120,
|
minWidth: 120,
|
||||||
|
formatter: ({ cellValue }) => getAccountName.value(cellValue),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'nickname',
|
field: 'nickname',
|
||||||
|
|
|
@ -1,17 +1,20 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
|
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
|
import type { SystemMailAccountApi } from '#/api/system/mail/account';
|
||||||
import type { SystemMailTemplateApi } from '#/api/system/mail/template';
|
import type { SystemMailTemplateApi } from '#/api/system/mail/template';
|
||||||
|
|
||||||
|
import { DocAlert } from '#/components/doc-alert';
|
||||||
|
import Form from './modules/form.vue';
|
||||||
|
import SendForm from './modules/send-form.vue';
|
||||||
import { Page, useVbenModal } from '@vben/common-ui';
|
import { Page, useVbenModal } from '@vben/common-ui';
|
||||||
import { Plus } from '@vben/icons';
|
import { Plus } from '@vben/icons';
|
||||||
import { Button, message } from 'ant-design-vue';
|
import { Button, message } from 'ant-design-vue';
|
||||||
import Form from './modules/form.vue';
|
|
||||||
import SendForm from './modules/send-form.vue';
|
|
||||||
import { DocAlert } from '#/components/doc-alert';
|
|
||||||
|
|
||||||
import { $t } from '#/locales';
|
|
||||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||||
|
import { getSimpleMailAccountList } from '#/api/system/mail/account';
|
||||||
import { deleteMailTemplate, getMailTemplatePage } from '#/api/system/mail/template';
|
import { deleteMailTemplate, getMailTemplatePage } from '#/api/system/mail/template';
|
||||||
|
import { $t } from '#/locales';
|
||||||
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
import { useGridColumns, useGridFormSchema } from './data';
|
import { useGridColumns, useGridFormSchema } from './data';
|
||||||
|
|
||||||
|
@ -65,32 +68,32 @@ async function onDelete(row: SystemMailTemplateApi.SystemMailTemplate) {
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 表格操作按钮的回调函数 */
|
/** 表格操作按钮的回调函数 */
|
||||||
function onActionClick({
|
function onActionClick({ code, row }: OnActionClickParams<SystemMailTemplateApi.SystemMailTemplate>) {
|
||||||
code,
|
|
||||||
row,
|
|
||||||
}: OnActionClickParams<SystemMailTemplateApi.SystemMailTemplate>) {
|
|
||||||
switch (code) {
|
switch (code) {
|
||||||
case 'edit': {
|
|
||||||
onEdit(row);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case 'delete': {
|
case 'delete': {
|
||||||
onDelete(row);
|
onDelete(row);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
case 'edit': {
|
||||||
|
onEdit(row);
|
||||||
|
break;
|
||||||
|
}
|
||||||
case 'send': {
|
case 'send': {
|
||||||
onSend(row);
|
onSend(row);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
const mailAccountList = ref<SystemMailAccountApi.SystemMailAccount[]>([]);
|
||||||
|
const getAccountName = computed(
|
||||||
|
() => (cellValue: number) => mailAccountList.value.find((item) => item.id === cellValue)?.mail || '',
|
||||||
|
);
|
||||||
const [Grid, gridApi] = useVbenVxeGrid({
|
const [Grid, gridApi] = useVbenVxeGrid({
|
||||||
formOptions: {
|
formOptions: {
|
||||||
schema: useGridFormSchema(),
|
schema: useGridFormSchema(),
|
||||||
},
|
},
|
||||||
gridOptions: {
|
gridOptions: {
|
||||||
columns: useGridColumns(onActionClick),
|
columns: useGridColumns(onActionClick, getAccountName),
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
keepSource: true,
|
keepSource: true,
|
||||||
proxyConfig: {
|
proxyConfig: {
|
||||||
|
@ -113,6 +116,18 @@ const [Grid, gridApi] = useVbenVxeGrid({
|
||||||
},
|
},
|
||||||
} as VxeTableGridOptions<SystemMailTemplateApi.SystemMailTemplate>,
|
} as VxeTableGridOptions<SystemMailTemplateApi.SystemMailTemplate>,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/** 获取邮箱账号精简列表 */
|
||||||
|
async function initMailAccountList() {
|
||||||
|
try {
|
||||||
|
mailAccountList.value = await getSimpleMailAccountList();
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取邮箱账号精简列表失败', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 初始化 */
|
||||||
|
initMailAccountList();
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<Page auto-content-height>
|
<Page auto-content-height>
|
||||||
|
|
|
@ -2,8 +2,9 @@ import type { VbenFormSchema } from '#/adapter/form';
|
||||||
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
|
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
|
||||||
import type { SystemNotifyMessageApi } from '#/api/system/notify/message';
|
import type { SystemNotifyMessageApi } from '#/api/system/notify/message';
|
||||||
|
|
||||||
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
|
|
||||||
import { getRangePickerDefaultProps } from '#/utils/date';
|
import { getRangePickerDefaultProps } from '#/utils/date';
|
||||||
|
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
|
||||||
|
|
||||||
import { useAccess } from '@vben/access';
|
import { useAccess } from '@vben/access';
|
||||||
|
|
||||||
const { hasAccessByCodes } = useAccess();
|
const { hasAccessByCodes } = useAccess();
|
||||||
|
@ -44,10 +45,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
|
||||||
label: '模版类型',
|
label: '模版类型',
|
||||||
component: 'Select',
|
component: 'Select',
|
||||||
componentProps: {
|
componentProps: {
|
||||||
options: getDictOptions(
|
options: getDictOptions(DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE, 'number'),
|
||||||
DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE,
|
|
||||||
'number',
|
|
||||||
),
|
|
||||||
allowClear: true,
|
allowClear: true,
|
||||||
placeholder: '请选择模版类型',
|
placeholder: '请选择模版类型',
|
||||||
},
|
},
|
||||||
|
@ -103,11 +101,17 @@ export function useGridColumns<T = SystemNotifyMessageApi.SystemNotifyMessage>(
|
||||||
title: '模版内容',
|
title: '模版内容',
|
||||||
minWidth: 200,
|
minWidth: 200,
|
||||||
},
|
},
|
||||||
// TODO @puhui999:这个参数展示不对
|
|
||||||
{
|
{
|
||||||
field: 'templateParams',
|
field: 'templateParams',
|
||||||
title: '模版参数',
|
title: '模版参数',
|
||||||
minWidth: 180,
|
minWidth: 180,
|
||||||
|
formatter: ({ cellValue }) => {
|
||||||
|
try {
|
||||||
|
return JSON.stringify(cellValue);
|
||||||
|
} catch {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'templateType',
|
field: 'templateType',
|
||||||
|
|
Loading…
Reference in New Issue