|
|
@@ -1,4 +1,5 @@
|
|
|
import React, { useState, useEffect, useRef } from 'react';
|
|
|
+import { useTranslation } from 'react-i18next';
|
|
|
import { Search, Plus, RefreshCw, ArrowLeft, Edit2, Trash2 } from 'lucide-react';
|
|
|
import { emailTemplateApi, MailTemplateVO } from '../../api/emailTemplate';
|
|
|
import { toast } from 'sonner';
|
|
|
@@ -14,6 +15,7 @@ interface MailTemplateManagementProps {
|
|
|
}
|
|
|
|
|
|
export default function MailTemplateManagement(props: MailTemplateManagementProps = {}) {
|
|
|
+ const { t } = useTranslation();
|
|
|
const { onBack } = props;
|
|
|
const [loading, setLoading] = useState(true);
|
|
|
const [list, setList] = useState<MailTemplateVO[]>([]);
|
|
|
@@ -39,7 +41,7 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
setList(response.list || []);
|
|
|
setTotal(response.total || 0);
|
|
|
} catch (error: any) {
|
|
|
- toast.error(error.message || '获取邮件模板列表失败');
|
|
|
+ toast.error(error.message || t('mailTemplate.fetchListFailed'));
|
|
|
} finally {
|
|
|
setLoading(false);
|
|
|
}
|
|
|
@@ -83,19 +85,19 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
// 删除
|
|
|
const handleDelete = (id: number) => {
|
|
|
Modal.confirm({
|
|
|
- title: '确认删除',
|
|
|
+ title: t('common.confirmDelete'),
|
|
|
icon: <ExclamationCircleOutlined />,
|
|
|
- content: '确定要删除这条邮件模板吗?',
|
|
|
- okText: '确定',
|
|
|
+ content: t('notificationManagement.deleteEmailConfirmContent'),
|
|
|
+ okText: t('common.confirm'),
|
|
|
okType: 'danger',
|
|
|
- cancelText: '取消',
|
|
|
+ cancelText: t('common.cancel'),
|
|
|
onOk: async () => {
|
|
|
try {
|
|
|
await emailTemplateApi.deleteMailTemplate(id);
|
|
|
- toast.success('删除成功');
|
|
|
+ toast.success(t('common.deleteSuccess'));
|
|
|
await getList();
|
|
|
} catch (error: any) {
|
|
|
- toast.error(error.message || '删除失败');
|
|
|
+ toast.error(error.message || t('common.deleteFailed'));
|
|
|
}
|
|
|
},
|
|
|
});
|
|
|
@@ -104,7 +106,7 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
// 表格列配置
|
|
|
const columns: ColumnsType<MailTemplateVO> = [
|
|
|
{
|
|
|
- title: '序号',
|
|
|
+ title: t('common.serialNumber'),
|
|
|
width: 80,
|
|
|
align: 'center',
|
|
|
render: (_: any, __: MailTemplateVO, index: number) => {
|
|
|
@@ -112,42 +114,42 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
- title: '模板名称',
|
|
|
+ title: t('mailTemplate.name'),
|
|
|
dataIndex: 'name',
|
|
|
key: 'name',
|
|
|
align: 'center',
|
|
|
},
|
|
|
{
|
|
|
- title: '模板编码',
|
|
|
+ title: t('mailTemplate.code'),
|
|
|
dataIndex: 'code',
|
|
|
key: 'code',
|
|
|
align: 'center',
|
|
|
},
|
|
|
{
|
|
|
- title: '标题',
|
|
|
+ title: t('mailTemplate.title'),
|
|
|
dataIndex: 'title',
|
|
|
key: 'title',
|
|
|
align: 'center',
|
|
|
render: (text: string) => text || '-',
|
|
|
},
|
|
|
{
|
|
|
- title: '状态',
|
|
|
+ title: t('mailTemplate.status'),
|
|
|
dataIndex: 'status',
|
|
|
width: 100,
|
|
|
align: 'center',
|
|
|
render: (status: number | undefined) => {
|
|
|
- return status === 1 ? '启用' : '禁用';
|
|
|
+ return status === 1 ? t('mailTemplate.enable') : t('mailTemplate.disable');
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
- title: '备注',
|
|
|
+ title: t('mailTemplate.remark'),
|
|
|
dataIndex: 'remark',
|
|
|
key: 'remark',
|
|
|
align: 'center',
|
|
|
render: (text: string) => text || '-',
|
|
|
},
|
|
|
{
|
|
|
- title: '操作',
|
|
|
+ title: t('common.operation'),
|
|
|
width: 200,
|
|
|
align: 'center',
|
|
|
fixed: 'right',
|
|
|
@@ -161,7 +163,7 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
className="h-8 px-2 transition-colors hover:text-[#1677ff] hover:underline"
|
|
|
>
|
|
|
<Search className="w-4 h-4" />
|
|
|
- <span className="ml-1">测试</span>
|
|
|
+ <span className="ml-1">{t('mailTemplate.test')}</span>
|
|
|
</UIButton>
|
|
|
<UIButton
|
|
|
variant="ghost"
|
|
|
@@ -170,7 +172,7 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
className="h-8 px-2 transition-colors hover:text-[#1677ff] hover:underline"
|
|
|
>
|
|
|
<Edit2 className="w-4 h-4" />
|
|
|
- <span className="ml-1">编辑</span>
|
|
|
+ <span className="ml-1">{t('common.edit')}</span>
|
|
|
</UIButton>
|
|
|
<UIButton
|
|
|
variant="ghost"
|
|
|
@@ -179,7 +181,7 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
className="h-8 px-2 text-red-600 hover:text-[#1677ff] transition-colors hover:underline"
|
|
|
>
|
|
|
<Trash2 className="w-4 h-4" />
|
|
|
- <span className="ml-1">删除</span>
|
|
|
+ <span className="ml-1">{t('common.delete')}</span>
|
|
|
</UIButton>
|
|
|
</div>
|
|
|
);
|
|
|
@@ -193,9 +195,9 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
<div className="bg-white rounded-2xl border border-gray-200/50 shadow-sm p-6">
|
|
|
<div className="flex items-center gap-4 flex-wrap">
|
|
|
<div className="flex items-center gap-2 flex-1 min-w-[200px]">
|
|
|
- <label className="text-sm text-gray-700 whitespace-nowrap">模板名称:</label>
|
|
|
+ <label className="text-sm text-gray-700 whitespace-nowrap">{t('mailTemplate.name')}:</label>
|
|
|
<Input
|
|
|
- placeholder="请输入模板名称"
|
|
|
+ placeholder={t('mailTemplate.namePlaceholder')}
|
|
|
value={queryParams.name}
|
|
|
onChange={(e) => setQueryParams({ ...queryParams, name: e.target.value })}
|
|
|
onPressEnter={handleQuery}
|
|
|
@@ -204,9 +206,9 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
/>
|
|
|
</div>
|
|
|
<div className="flex items-center gap-2 flex-1 min-w-[200px]">
|
|
|
- <label className="text-sm text-gray-700 whitespace-nowrap">模板编码:</label>
|
|
|
+ <label className="text-sm text-gray-700 whitespace-nowrap">{t('mailTemplate.code')}:</label>
|
|
|
<Input
|
|
|
- placeholder="请输入模板编码"
|
|
|
+ placeholder={t('mailTemplate.codePlaceholder')}
|
|
|
value={queryParams.code}
|
|
|
onChange={(e) => setQueryParams({ ...queryParams, code: e.target.value })}
|
|
|
onPressEnter={handleQuery}
|
|
|
@@ -220,24 +222,24 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
icon={<Search className="w-4 h-4" />}
|
|
|
onClick={handleQuery}
|
|
|
>
|
|
|
- 搜索
|
|
|
+ {t('common.search')}
|
|
|
</Button>
|
|
|
<Button icon={<RefreshCw className="w-4 h-4" />} onClick={resetQuery}>
|
|
|
- 重置
|
|
|
+ {t('common.reset')}
|
|
|
</Button>
|
|
|
<Button
|
|
|
type="primary"
|
|
|
icon={<Plus className="w-4 h-4" />}
|
|
|
onClick={() => openForm('create')}
|
|
|
>
|
|
|
- 新增
|
|
|
+ {t('common.addNew')}
|
|
|
</Button>
|
|
|
{onBack && (
|
|
|
<Button
|
|
|
icon={<ArrowLeft className="w-4 h-4" />}
|
|
|
onClick={onBack}
|
|
|
>
|
|
|
- 返回邮件提醒
|
|
|
+ {t('mailTemplate.backToEmailNotify')}
|
|
|
</Button>
|
|
|
)}
|
|
|
</div>
|
|
|
@@ -259,7 +261,7 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
<div className="bg-white rounded-lg border border-gray-200 px-6 py-4">
|
|
|
<div className="flex items-center justify-between">
|
|
|
<div className="text-sm text-gray-600">
|
|
|
- 共 <span className="text-blue-600 font-medium">{total}</span> 条记录
|
|
|
+ {t('common.total')} <span className="text-blue-600 font-medium">{total}</span> {t('common.records')}
|
|
|
</div>
|
|
|
<div className="flex items-center gap-2">
|
|
|
<Button
|
|
|
@@ -267,17 +269,17 @@ export default function MailTemplateManagement(props: MailTemplateManagementProp
|
|
|
disabled={queryParams.pageNo === 1}
|
|
|
onClick={() => setQueryParams({ ...queryParams, pageNo: queryParams.pageNo - 1 })}
|
|
|
>
|
|
|
- 上一页
|
|
|
+ {t('common.prevPage')}
|
|
|
</Button>
|
|
|
<span className="text-sm text-gray-600">
|
|
|
- 第 {queryParams.pageNo} / {Math.ceil(total / queryParams.pageSize)} 页
|
|
|
+ {queryParams.pageNo} / {Math.ceil(total / queryParams.pageSize) || 1}
|
|
|
</span>
|
|
|
<Button
|
|
|
size="small"
|
|
|
disabled={queryParams.pageNo >= Math.ceil(total / queryParams.pageSize)}
|
|
|
onClick={() => setQueryParams({ ...queryParams, pageNo: queryParams.pageNo + 1 })}
|
|
|
>
|
|
|
- 下一页
|
|
|
+ {t('common.nextPage')}
|
|
|
</Button>
|
|
|
</div>
|
|
|
</div>
|