feat: 邮箱账号
This commit is contained in:
178
src/pages/system/messages/mail/account/config.tsx
Normal file
178
src/pages/system/messages/mail/account/config.tsx
Normal file
@@ -0,0 +1,178 @@
|
||||
import type {
|
||||
ProColumns,
|
||||
ProDescriptionsItemProps,
|
||||
ProFormColumnsType,
|
||||
} from '@ant-design/pro-components';
|
||||
import dayjs from 'dayjs';
|
||||
import type { MailAccountVO } from '@/services/system/message/mail/account';
|
||||
export const baseTenantColumns: ProColumns<MailAccountVO>[] = [
|
||||
{
|
||||
title: '邮箱',
|
||||
dataIndex: 'mail',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '用户名',
|
||||
dataIndex: 'username',
|
||||
},
|
||||
{
|
||||
title: 'SMTP 服务器域名',
|
||||
dataIndex: 'host',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: 'SMTP 服务器端口',
|
||||
dataIndex: 'port',
|
||||
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: '是否开启 SSL',
|
||||
dataIndex: 'sslEnable',
|
||||
valueType: 'radio',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: '是否开启 STARTTLS',
|
||||
dataIndex: 'starttlsEnable',
|
||||
valueType: 'radio',
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
valueType: 'dateRange',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
render: (_, record: MailAccountVO) =>
|
||||
dayjs(record.createTime).format('YYYY-MM-DD HH:mm:ss'),
|
||||
},
|
||||
];
|
||||
|
||||
export const formColumns = (): ProFormColumnsType[] => [
|
||||
{
|
||||
title: '邮箱',
|
||||
dataIndex: 'mail',
|
||||
},
|
||||
{
|
||||
title: '用户名',
|
||||
dataIndex: 'username',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入用户名',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '密码',
|
||||
dataIndex: 'password',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入密码',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'SMTP 服务器域名',
|
||||
dataIndex: 'host',
|
||||
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入SMTP 服务器域名',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: 'SMTP 服务器端口',
|
||||
dataIndex: 'port',
|
||||
valueType: 'digit',
|
||||
fieldProps: {
|
||||
defaultValue: 465,
|
||||
},
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: 'SMTP 服务器端口',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '是否开启 SSL',
|
||||
dataIndex: 'sslEnable',
|
||||
valueType: 'select',
|
||||
fieldProps: {
|
||||
placeholder: '请选择是否开启 SSL',
|
||||
options: [
|
||||
{
|
||||
label: '正常',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '禁用',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择是否开启 SSL',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '是否开启 STARTTLS',
|
||||
dataIndex: 'starttlsEnable',
|
||||
valueType: 'select',
|
||||
fieldProps: {
|
||||
placeholder: '请选择是否开启 STARTTLS',
|
||||
options: [
|
||||
{
|
||||
label: '正常',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '禁用',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择是否开启 STARTTLS',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export const formTestColumns = (type: string): ProFormColumnsType[] => [
|
||||
{
|
||||
title: '模板内容',
|
||||
dataIndex: 'content',
|
||||
valueType: 'textarea',
|
||||
},
|
||||
{
|
||||
title: '手机号',
|
||||
dataIndex: 'mobile',
|
||||
},
|
||||
];
|
||||
// {
|
||||
// title: "模板内容",
|
||||
// dataIndex: "content",
|
||||
// valueType: "textarea",
|
||||
// },
|
||||
152
src/pages/system/messages/mail/account/index.tsx
Normal file
152
src/pages/system/messages/mail/account/index.tsx
Normal file
@@ -0,0 +1,152 @@
|
||||
import { PlusOutlined } from '@ant-design/icons';
|
||||
import type {
|
||||
ActionType,
|
||||
ProColumns,
|
||||
ProCoreActionType,
|
||||
} from '@ant-design/pro-components';
|
||||
import { message, Popconfirm } from 'antd';
|
||||
import React, { useCallback, useRef, useState } from 'react';
|
||||
import ConfigurableDrawerForm, {
|
||||
type ConfigurableDrawerFormRef,
|
||||
} from '@/components/DrawerForm';
|
||||
import EnhancedProTable from '@/components/EnhancedProTable';
|
||||
import type { ToolbarAction } from '@/components/EnhancedProTable/types';
|
||||
import { formStatusType } from '@/constants';
|
||||
import {
|
||||
createMailAccount,
|
||||
deleteMailAccount,
|
||||
getMailAccount,
|
||||
getMailAccountPage,
|
||||
type MailAccountVO,
|
||||
updateMailAccount,
|
||||
} from '@/services/system/message/mail/account';
|
||||
import { baseTenantColumns, formColumns, formTestColumns } from './config';
|
||||
|
||||
const SyStemMessageSmsTemplate = () => {
|
||||
const tableRef = useRef<ActionType>(null);
|
||||
const configurableDrawerRef = useRef<ConfigurableDrawerFormRef>(null);
|
||||
const [type, setType] = useState<'create' | 'update' | 'test'>('create');
|
||||
const testRef = useRef<ConfigurableDrawerFormRef>(null);
|
||||
const [currentItem, setCurrentItem] = useState<MailAccountVO>();
|
||||
const onFetch = async (
|
||||
params: MailAccountVO & {
|
||||
pageSize?: number;
|
||||
current?: number;
|
||||
},
|
||||
) => {
|
||||
const data = await getMailAccountPage({
|
||||
...params,
|
||||
pageNo: params.current,
|
||||
pageSize: params.pageSize,
|
||||
});
|
||||
return {
|
||||
data: data.list,
|
||||
success: true,
|
||||
total: data.total,
|
||||
};
|
||||
};
|
||||
|
||||
const handleSend = async (record: MailAccountVO) => {
|
||||
setType('test');
|
||||
setCurrentItem(record);
|
||||
testRef.current?.open(record);
|
||||
};
|
||||
|
||||
const handleEdit = (record: MailAccountVO) => {
|
||||
setType('update');
|
||||
setCurrentItem(record);
|
||||
|
||||
configurableDrawerRef.current?.open(record);
|
||||
};
|
||||
|
||||
const handleAdd = () => {
|
||||
setType('create');
|
||||
configurableDrawerRef.current?.open();
|
||||
};
|
||||
const handleSubmit = useCallback(
|
||||
async (values: MailAccountVO) => {
|
||||
if (type === 'create') {
|
||||
await createMailAccount(values);
|
||||
message.success('创建成功');
|
||||
} else {
|
||||
await updateMailAccount({
|
||||
...values,
|
||||
id: currentItem!.id,
|
||||
});
|
||||
message.success('编辑成功');
|
||||
}
|
||||
tableRef.current?.reload();
|
||||
return true;
|
||||
},
|
||||
[type, currentItem],
|
||||
);
|
||||
|
||||
const toolbarActions: ToolbarAction[] = [
|
||||
{
|
||||
key: 'add',
|
||||
label: '新建',
|
||||
type: 'primary',
|
||||
icon: <PlusOutlined />,
|
||||
onClick: handleAdd,
|
||||
},
|
||||
];
|
||||
const actionColumns: ProColumns<MailAccountVO> = {
|
||||
title: '操作',
|
||||
dataIndex: 'option',
|
||||
valueType: 'option',
|
||||
fixed: 'right',
|
||||
width: 120,
|
||||
render: (
|
||||
text: React.ReactNode,
|
||||
record: MailAccountVO,
|
||||
_: number,
|
||||
action: ProCoreActionType | undefined,
|
||||
) => [
|
||||
<a key="edit" onClick={() => handleEdit(record)}>
|
||||
编辑
|
||||
</a>,
|
||||
<a key="detail" onClick={() => handleSend(record)}>
|
||||
详情
|
||||
</a>,
|
||||
<Popconfirm
|
||||
title="是否删除?"
|
||||
key="delete"
|
||||
onConfirm={async () => {
|
||||
await deleteMailAccount(record.id);
|
||||
message.success('删除成功');
|
||||
action?.reload?.();
|
||||
}}
|
||||
okText="是"
|
||||
cancelText="否"
|
||||
>
|
||||
<a style={{ color: 'var(--ant-red)' }} key="delete">
|
||||
删除
|
||||
</a>
|
||||
</Popconfirm>,
|
||||
],
|
||||
};
|
||||
const columns = [...baseTenantColumns, actionColumns];
|
||||
return (
|
||||
<>
|
||||
<EnhancedProTable<MailAccountVO>
|
||||
ref={tableRef}
|
||||
columns={columns}
|
||||
request={onFetch}
|
||||
headerTitle="登录日志"
|
||||
showIndex={false}
|
||||
toolbarActions={toolbarActions}
|
||||
showSelection={false}
|
||||
/>
|
||||
<ConfigurableDrawerForm
|
||||
labelCol={{ span: 7 }}
|
||||
wrapperCol={{ span: 17 }}
|
||||
ref={configurableDrawerRef}
|
||||
title={formStatusType[type]}
|
||||
columns={formColumns()}
|
||||
onSubmit={handleSubmit}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default SyStemMessageSmsTemplate;
|
||||
171
src/pages/system/messages/mail/log/config.tsx
Normal file
171
src/pages/system/messages/mail/log/config.tsx
Normal file
@@ -0,0 +1,171 @@
|
||||
import type {
|
||||
ProColumns,
|
||||
ProDescriptionsItemProps,
|
||||
} from '@ant-design/pro-components';
|
||||
import dayjs from 'dayjs';
|
||||
import type { SmsLogVO } from '@/services/system/message/sms/log';
|
||||
export const baseTenantColumns: ProColumns<SmsLogVO>[] = [
|
||||
{
|
||||
title: '编号',
|
||||
dataIndex: 'id',
|
||||
width: 100,
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: '手机号',
|
||||
dataIndex: 'mobile',
|
||||
},
|
||||
{
|
||||
title: '短信内容',
|
||||
dataIndex: 'templateContent',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: '发送状态',
|
||||
dataIndex: 'sendStatus',
|
||||
},
|
||||
{
|
||||
title: '发送人名称',
|
||||
dataIndex: 'templateNickname',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
|
||||
{
|
||||
title: '接收状态',
|
||||
dataIndex: 'receiveStatus',
|
||||
},
|
||||
{
|
||||
title: '短信渠道',
|
||||
dataIndex: 'channelId',
|
||||
},
|
||||
{
|
||||
title: '模板编号',
|
||||
dataIndex: 'templateId',
|
||||
},
|
||||
{
|
||||
title: '短信类型',
|
||||
dataIndex: 'templateType',
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
valueType: 'dateRange',
|
||||
hideInSearch: true,
|
||||
search: {
|
||||
transform: (value) => {
|
||||
return {
|
||||
[`createTime[0]`]: dayjs(value[0])
|
||||
.startOf('day')
|
||||
.format('YYYY-MM-DD HH:mm:ss'),
|
||||
[`createTime[1]`]: dayjs(value[1])
|
||||
.endOf('day')
|
||||
.format('YYYY-MM-DD HH:mm:ss'),
|
||||
};
|
||||
},
|
||||
},
|
||||
render: (_, record: SmsLogVO) =>
|
||||
dayjs(record.createTime).format('YYYY-MM-DD HH:mm:ss'),
|
||||
},
|
||||
{
|
||||
title: '接收时间',
|
||||
dataIndex: 'receiveTime',
|
||||
valueType: 'dateRange',
|
||||
hideInTable: true,
|
||||
search: {
|
||||
transform: (value) => {
|
||||
return {
|
||||
[`createTime[0]`]: dayjs(value[0])
|
||||
.startOf('day')
|
||||
.format('YYYY-MM-DD HH:mm:ss'),
|
||||
[`createTime[1]`]: dayjs(value[1])
|
||||
.endOf('day')
|
||||
.format('YYYY-MM-DD HH:mm:ss'),
|
||||
};
|
||||
},
|
||||
},
|
||||
render: (_, record: SmsLogVO) =>
|
||||
dayjs(record.createTime).format('YYYY-MM-DD HH:mm:ss'),
|
||||
},
|
||||
];
|
||||
|
||||
export const descriptionsColumns = (): ProDescriptionsItemProps<
|
||||
Record<string, any>,
|
||||
'text'
|
||||
>[] => [
|
||||
{
|
||||
title: '日志主键',
|
||||
key: 'id',
|
||||
dataIndex: 'id',
|
||||
},
|
||||
{
|
||||
title: '短信渠道',
|
||||
key: 'channelId',
|
||||
dataIndex: 'channelId',
|
||||
},
|
||||
{
|
||||
title: '短信模板',
|
||||
key: 'templateCode',
|
||||
dataIndex: 'templateCode',
|
||||
},
|
||||
{
|
||||
title: 'API 的模板编号',
|
||||
key: 'apiTemplateId',
|
||||
dataIndex: 'apiTemplateId',
|
||||
},
|
||||
{
|
||||
title: '用户信息',
|
||||
key: 'mobile',
|
||||
dataIndex: 'mobile',
|
||||
},
|
||||
{
|
||||
title: '短信内容',
|
||||
key: 'templateContent',
|
||||
dataIndex: 'templateContent',
|
||||
},
|
||||
{
|
||||
title: '短信参数',
|
||||
key: 'templateParams',
|
||||
dataIndex: 'templateParams',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
key: 'createTime',
|
||||
dataIndex: 'createTime',
|
||||
},
|
||||
{
|
||||
title: '发送状态',
|
||||
key: 'sendStatus',
|
||||
dataIndex: 'sendStatus',
|
||||
},
|
||||
{
|
||||
title: '发送时间',
|
||||
key: 'sendTime',
|
||||
dataIndex: 'sendTime',
|
||||
},
|
||||
{
|
||||
title: 'API 发送结果',
|
||||
key: 'apiSendMsg',
|
||||
dataIndex: 'apiSendMsg',
|
||||
},
|
||||
{
|
||||
title: 'API 短信编号',
|
||||
key: 'apiSerialNo',
|
||||
dataIndex: 'apiSerialNo',
|
||||
},
|
||||
{
|
||||
title: 'API 请求编号',
|
||||
key: 'apiRequestId',
|
||||
dataIndex: 'apiRequestId',
|
||||
},
|
||||
{
|
||||
title: 'API 接收状态',
|
||||
key: 'receiveStatus',
|
||||
dataIndex: 'receiveStatus',
|
||||
},
|
||||
{
|
||||
title: 'API 接收结果',
|
||||
key: 'apiReceiveMsg',
|
||||
dataIndex: 'apiReceiveMsg',
|
||||
},
|
||||
];
|
||||
70
src/pages/system/messages/mail/log/index.tsx
Normal file
70
src/pages/system/messages/mail/log/index.tsx
Normal file
@@ -0,0 +1,70 @@
|
||||
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
||||
import React, { useRef } from 'react';
|
||||
import EnhancedProTable from '@/components/EnhancedProTable';
|
||||
import ModalDescriptions, {
|
||||
type DescriptionsFormRef,
|
||||
} from '@/components/ModalDescriptions';
|
||||
import {
|
||||
getSmsLogPage,
|
||||
type SmsLogVO,
|
||||
} from '@/services/system/message/sms/log';
|
||||
import { baseTenantColumns, descriptionsColumns } from './config';
|
||||
|
||||
const SyStemMessageNotifyMessage = () => {
|
||||
const tableRef = useRef<ActionType>(null);
|
||||
const descriptionsRef = useRef<DescriptionsFormRef>(null);
|
||||
const onFetch = async (
|
||||
params: SmsLogVO & {
|
||||
pageSize?: number;
|
||||
current?: number;
|
||||
},
|
||||
) => {
|
||||
const data = await getSmsLogPage({
|
||||
...params,
|
||||
pageNo: params.current,
|
||||
pageSize: params.pageSize,
|
||||
});
|
||||
return {
|
||||
data: data.list,
|
||||
success: true,
|
||||
total: data.total,
|
||||
};
|
||||
};
|
||||
|
||||
const handleDetail = (record: SmsLogVO) => {
|
||||
descriptionsRef.current?.open(record);
|
||||
};
|
||||
|
||||
const actionColumns: ProColumns<SmsLogVO> = {
|
||||
title: '操作',
|
||||
dataIndex: 'option',
|
||||
valueType: 'option',
|
||||
fixed: 'right',
|
||||
width: 80,
|
||||
render: (text: React.ReactNode, record: SmsLogVO) => [
|
||||
<a key="editable" onClick={() => handleDetail(record)}>
|
||||
详情
|
||||
</a>,
|
||||
],
|
||||
};
|
||||
const columns = [...baseTenantColumns, actionColumns];
|
||||
return (
|
||||
<>
|
||||
<EnhancedProTable<SmsLogVO>
|
||||
ref={tableRef}
|
||||
columns={columns}
|
||||
request={onFetch}
|
||||
headerTitle="登录日志"
|
||||
showIndex={false}
|
||||
showSelection={false}
|
||||
/>
|
||||
<ModalDescriptions
|
||||
ref={descriptionsRef}
|
||||
title="登录日志详情"
|
||||
columns={descriptionsColumns()}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default SyStemMessageNotifyMessage;
|
||||
171
src/pages/system/messages/mail/template/config.tsx
Normal file
171
src/pages/system/messages/mail/template/config.tsx
Normal file
@@ -0,0 +1,171 @@
|
||||
import type {
|
||||
ProColumns,
|
||||
ProDescriptionsItemProps,
|
||||
ProFormColumnsType,
|
||||
} from '@ant-design/pro-components';
|
||||
import dayjs from 'dayjs';
|
||||
import type { SmsTemplateVO } from '@/services/system/message/sms/template';
|
||||
export const baseTenantColumns: ProColumns<SmsTemplateVO>[] = [
|
||||
{
|
||||
title: '模板编码',
|
||||
dataIndex: 'code',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '模板名称',
|
||||
dataIndex: 'name',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: '模板内容',
|
||||
dataIndex: 'content',
|
||||
hideInSearch: true, // 在搜索表单中隐藏
|
||||
},
|
||||
{
|
||||
title: '短信类型',
|
||||
dataIndex: 'type',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '短信 API 的模板编号',
|
||||
dataIndex: 'apiTemplateId',
|
||||
},
|
||||
{
|
||||
title: '短信渠道',
|
||||
dataIndex: 'channelCode',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
valueType: 'dateRange',
|
||||
render: (_, record: SmsTemplateVO) =>
|
||||
dayjs(record.createTime).format('YYYY-MM-DD HH:mm:ss'),
|
||||
},
|
||||
];
|
||||
|
||||
export const formColumns = (type: string): ProFormColumnsType[] => [
|
||||
{
|
||||
title: '短信渠道编号',
|
||||
dataIndex: 'channelId',
|
||||
valueType: 'select',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择短信渠道编号',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '短信类型',
|
||||
dataIndex: 'type',
|
||||
valueType: 'select',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择短信类型',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '模板编号',
|
||||
dataIndex: 'code',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入模板编号',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '模板名称',
|
||||
dataIndex: 'name',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入模板名称',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '模板内容',
|
||||
dataIndex: 'type',
|
||||
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入模板内容',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '开启状态',
|
||||
dataIndex: 'status',
|
||||
valueType: 'select',
|
||||
|
||||
fieldProps: {
|
||||
placeholder: '请选择开启状态',
|
||||
options: [
|
||||
{
|
||||
label: '正常',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: '禁用',
|
||||
value: 2,
|
||||
},
|
||||
],
|
||||
},
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择状态',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '短信 API 模板编号',
|
||||
dataIndex: 'apiTemplateId',
|
||||
fieldProps: {
|
||||
placeholder: '请输入短信 API 的模板编号',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
fieldProps: {
|
||||
placeholder: '请输入备注',
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export const formTestColumns = (type: string): ProFormColumnsType[] => [
|
||||
{
|
||||
title: '模板内容',
|
||||
dataIndex: 'content',
|
||||
valueType: 'textarea',
|
||||
},
|
||||
{
|
||||
title: '手机号',
|
||||
dataIndex: 'mobile',
|
||||
},
|
||||
];
|
||||
174
src/pages/system/messages/mail/template/index.tsx
Normal file
174
src/pages/system/messages/mail/template/index.tsx
Normal file
@@ -0,0 +1,174 @@
|
||||
import { PlusOutlined } from '@ant-design/icons';
|
||||
import type {
|
||||
ActionType,
|
||||
ProColumns,
|
||||
ProCoreActionType,
|
||||
} from '@ant-design/pro-components';
|
||||
import { message, Popconfirm } from 'antd';
|
||||
import React, { useCallback, useRef, useState } from 'react';
|
||||
import ConfigurableDrawerForm, {
|
||||
type ConfigurableDrawerFormRef,
|
||||
} from '@/components/DrawerForm';
|
||||
import EnhancedProTable from '@/components/EnhancedProTable';
|
||||
import type { ToolbarAction } from '@/components/EnhancedProTable/types';
|
||||
import { formStatusType } from '@/constants';
|
||||
import {
|
||||
createSmsTemplate,
|
||||
deleteSmsTemplate,
|
||||
getSmsTemplatePage,
|
||||
type SmsTemplateVO,
|
||||
sendSms,
|
||||
updateSmsTemplate,
|
||||
} from '@/services/system/message/sms/template';
|
||||
import { baseTenantColumns, formColumns, formTestColumns } from './config';
|
||||
|
||||
const SyStemMessageSmsTemplate = () => {
|
||||
const tableRef = useRef<ActionType>(null);
|
||||
const configurableDrawerRef = useRef<ConfigurableDrawerFormRef>(null);
|
||||
const [type, setType] = useState<'create' | 'update' | 'test'>('create');
|
||||
const testRef = useRef<ConfigurableDrawerFormRef>(null);
|
||||
const [currentItem, setCurrentItem] = useState<SmsTemplateVO>();
|
||||
const onFetch = async (
|
||||
params: SmsTemplateVO & {
|
||||
pageSize?: number;
|
||||
current?: number;
|
||||
},
|
||||
) => {
|
||||
const data = await getSmsTemplatePage({
|
||||
...params,
|
||||
pageNo: params.current,
|
||||
pageSize: params.pageSize,
|
||||
});
|
||||
return {
|
||||
data: data.list,
|
||||
success: true,
|
||||
total: data.total,
|
||||
};
|
||||
};
|
||||
|
||||
const handleSend = async (record: SmsTemplateVO) => {
|
||||
setType('test');
|
||||
setCurrentItem(record);
|
||||
testRef.current?.open(record);
|
||||
};
|
||||
|
||||
const handleEdit = (record: SmsTemplateVO) => {
|
||||
setType('update');
|
||||
setCurrentItem(record);
|
||||
|
||||
configurableDrawerRef.current?.open(record);
|
||||
};
|
||||
|
||||
const handleAdd = () => {
|
||||
setType('create');
|
||||
configurableDrawerRef.current?.open();
|
||||
};
|
||||
const handleSubmit = useCallback(
|
||||
async (values: SmsTemplateVO) => {
|
||||
if (type === 'create') {
|
||||
await createSmsTemplate(values);
|
||||
message.success('创建成功');
|
||||
} else {
|
||||
await updateSmsTemplate({
|
||||
...values,
|
||||
id: currentItem!.id,
|
||||
});
|
||||
message.success('编辑成功');
|
||||
}
|
||||
tableRef.current?.reload();
|
||||
return true;
|
||||
},
|
||||
[type, currentItem],
|
||||
);
|
||||
|
||||
const handleTestSubmit = useCallback(
|
||||
async (values: SmsTemplateVO) => {
|
||||
if (currentItem?.status === 1) {
|
||||
return message.error('请先开启状态');
|
||||
}
|
||||
const res = await sendSms({
|
||||
...currentItem,
|
||||
...values,
|
||||
mobile: '',
|
||||
templateParams: new Map(),
|
||||
templateCode: currentItem!.code,
|
||||
});
|
||||
message.success('提交发送成功！发送结果，见发送日志编号：' + res);
|
||||
tableRef.current?.reload();
|
||||
return true;
|
||||
},
|
||||
[type, currentItem],
|
||||
);
|
||||
const toolbarActions: ToolbarAction[] = [
|
||||
{
|
||||
key: 'add',
|
||||
label: '新建',
|
||||
type: 'primary',
|
||||
icon: <PlusOutlined />,
|
||||
onClick: handleAdd,
|
||||
},
|
||||
];
|
||||
const actionColumns: ProColumns<SmsTemplateVO> = {
|
||||
title: '操作',
|
||||
dataIndex: 'option',
|
||||
valueType: 'option',
|
||||
fixed: 'right',
|
||||
width: 120,
|
||||
render: (
|
||||
text: React.ReactNode,
|
||||
record: SmsTemplateVO,
|
||||
_: number,
|
||||
action: ProCoreActionType | undefined,
|
||||
) => [
|
||||
<a key="edit" onClick={() => handleEdit(record)}>
|
||||
编辑
|
||||
</a>,
|
||||
<a key="detail" onClick={() => handleSend(record)}>
|
||||
测试
|
||||
</a>,
|
||||
<Popconfirm
|
||||
title="是否删除?"
|
||||
key="delete"
|
||||
onConfirm={async () => {
|
||||
await deleteSmsTemplate(record.id);
|
||||
message.success('删除成功');
|
||||
action?.reload?.();
|
||||
}}
|
||||
okText="是"
|
||||
cancelText="否"
|
||||
>
|
||||
<a style={{ color: 'var(--ant-red)' }} key="delete">
|
||||
删除
|
||||
</a>
|
||||
</Popconfirm>,
|
||||
],
|
||||
};
|
||||
const columns = [...baseTenantColumns, actionColumns];
|
||||
return (
|
||||
<>
|
||||
<EnhancedProTable<SmsTemplateVO>
|
||||
ref={tableRef}
|
||||
columns={columns}
|
||||
request={onFetch}
|
||||
headerTitle="登录日志"
|
||||
showIndex={false}
|
||||
toolbarActions={toolbarActions}
|
||||
showSelection={false}
|
||||
/>
|
||||
<ConfigurableDrawerForm
|
||||
ref={configurableDrawerRef}
|
||||
title={formStatusType[type]}
|
||||
columns={formColumns(type)}
|
||||
onSubmit={handleSubmit}
|
||||
/>
|
||||
<ConfigurableDrawerForm
|
||||
ref={testRef}
|
||||
title={formStatusType[type]}
|
||||
columns={formTestColumns(type)}
|
||||
onSubmit={handleTestSubmit}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default SyStemMessageSmsTemplate;
|
||||
Reference in New Issue
Block a user