92 lines
2.3 KiB
TypeScript
92 lines
2.3 KiB
TypeScript
import { message } from 'antd';
|
||
import React from 'react';
|
||
|
||
// 定义同步结果的数据类型
|
||
export interface SyncResultData {
|
||
total?: number;
|
||
processed?: number;
|
||
synced?: number;
|
||
created?: number;
|
||
updated?: number;
|
||
errors?: Array<{
|
||
identifier: string;
|
||
error: string;
|
||
}>;
|
||
}
|
||
|
||
// 定义组件的 Props 类型
|
||
interface SyncResultMessageProps {
|
||
data?: SyncResultData;
|
||
entityType?: string; // 实体类型，如"订单"、"客户"等
|
||
}
|
||
|
||
// 显示同步结果的函数
|
||
export const showSyncResult = (
|
||
data: SyncResultData,
|
||
entityType: string = '订单',
|
||
) => {
|
||
const result = data || {};
|
||
const {
|
||
total = 0,
|
||
processed = 0,
|
||
synced = 0,
|
||
created = 0,
|
||
updated = 0,
|
||
errors = [],
|
||
} = result;
|
||
|
||
// 构建结果消息
|
||
let resultMessage = `同步完成！共处理 ${processed} 个${entityType}（总数 ${total} 个）：`;
|
||
if (created > 0) resultMessage += ` 新建 ${created} 个`;
|
||
if (updated > 0) resultMessage += ` 更新 ${updated} 个`;
|
||
if (synced > 0) resultMessage += ` 同步成功 ${synced} 个`;
|
||
if (errors.length > 0) resultMessage += ` 失败 ${errors.length} 个`;
|
||
|
||
// 根据是否有错误显示不同的消息类型
|
||
if (errors.length > 0) {
|
||
// 如果有错误，显示警告消息
|
||
message.warning({
|
||
content: (
|
||
<div>
|
||
<div>{resultMessage}</div>
|
||
<div style={{ marginTop: 8, fontSize: 12, color: '#faad14' }}>
|
||
失败详情：
|
||
{errors
|
||
.slice(0, 3)
|
||
.map((err: any) => `${err.identifier}: ${err.error}`)
|
||
.join(', ')}
|
||
{errors.length > 3 && ` 等 ${errors.length - 3} 个错误...`}
|
||
</div>
|
||
</div>
|
||
),
|
||
duration: 8,
|
||
key: 'sync-result',
|
||
});
|
||
} else {
|
||
// 完全成功
|
||
message.success({
|
||
content: resultMessage,
|
||
duration: 4,
|
||
key: 'sync-result',
|
||
});
|
||
}
|
||
};
|
||
|
||
// 同步结果显示组件
|
||
const SyncResultMessage: React.FC<SyncResultMessageProps> = ({
|
||
data,
|
||
entityType = '订单',
|
||
}) => {
|
||
// 当组件挂载时显示结果
|
||
React.useEffect(() => {
|
||
if (data) {
|
||
showSyncResult(data, entityType);
|
||
}
|
||
}, [data, entityType]);
|
||
|
||
// 这个组件不渲染任何内容，只用于显示消息
|
||
return null;
|
||
};
|
||
|
||
export default SyncResultMessage;
|