feat: 短信模板
This commit is contained in:
171
src/pages/system/messages/sms/template/config.tsx
Normal file
171
src/pages/system/messages/sms/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/sms/template/index.tsx
Normal file
174
src/pages/system/messages/sms/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