重构消息通知弹窗
This commit is contained in:
dengqichen
parent
f108781983
commit
0128d7b03b
@ -52,6 +52,9 @@ const PropertyPanel: React.FC<PropertyPanelProps> = ({
|
||||
|
||||
React.useEffect(() => {
|
||||
if (selectedField) {
|
||||
// 🔄 先重置表单，清除旧字段的状态
|
||||
form.resetFields();
|
||||
|
||||
// 确保嵌套对象被正确设置到表单
|
||||
const formValues: any = {
|
||||
...selectedField,
|
||||
@ -73,6 +76,9 @@ const PropertyPanel: React.FC<PropertyPanelProps> = ({
|
||||
};
|
||||
|
||||
form.setFieldsValue(formValues);
|
||||
} else {
|
||||
// 如果没有选中字段，也清空表单
|
||||
form.resetFields();
|
||||
}
|
||||
}, [selectedField, form]);
|
||||
|
||||
|
||||
@ -59,6 +59,19 @@ const ScheduleJobList: React.FC = () => {
|
||||
}
|
||||
};
|
||||
|
||||
// 局部更新单条记录（避免全量刷新导致滚动位置丢失）
|
||||
const updateRecordInList = (id: number, updates: Partial<ScheduleJobResponse>) => {
|
||||
setData(prevData => {
|
||||
if (!prevData) return prevData;
|
||||
return {
|
||||
...prevData,
|
||||
content: prevData.content.map(item =>
|
||||
item.id === id ? { ...item, ...updates } : item
|
||||
)
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
// 加载分类
|
||||
const loadCategories = async () => {
|
||||
try {
|
||||
@ -125,7 +138,8 @@ const ScheduleJobList: React.FC = () => {
|
||||
title: '暂停成功',
|
||||
description: `任务 "${record.jobName}" 已暂停`,
|
||||
});
|
||||
loadData();
|
||||
// 局部更新，避免页面滚动
|
||||
updateRecordInList(record.id, { status: 'PAUSED' });
|
||||
} catch (error) {
|
||||
console.error('暂停失败:', error);
|
||||
toast({
|
||||
@ -144,7 +158,8 @@ const ScheduleJobList: React.FC = () => {
|
||||
title: '恢复成功',
|
||||
description: `任务 "${record.jobName}" 已恢复`,
|
||||
});
|
||||
loadData();
|
||||
// 局部更新，避免页面滚动
|
||||
updateRecordInList(record.id, { status: 'ENABLED' });
|
||||
} catch (error) {
|
||||
console.error('恢复失败:', error);
|
||||
toast({
|
||||
@ -163,7 +178,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
title: '触发成功',
|
||||
description: `任务 "${record.jobName}" 已立即触发执行`,
|
||||
});
|
||||
loadData();
|
||||
// 立即执行不改变任务状态，无需更新列表
|
||||
} catch (error) {
|
||||
console.error('触发失败:', error);
|
||||
toast({
|
||||
@ -182,7 +197,8 @@ const ScheduleJobList: React.FC = () => {
|
||||
title: '禁用成功',
|
||||
description: `任务 "${record.jobName}" 已禁用`,
|
||||
});
|
||||
loadData();
|
||||
// 局部更新，避免页面滚动
|
||||
updateRecordInList(record.id, { status: 'DISABLED' });
|
||||
} catch (error) {
|
||||
console.error('禁用失败:', error);
|
||||
toast({
|
||||
@ -201,7 +217,8 @@ const ScheduleJobList: React.FC = () => {
|
||||
title: '启用成功',
|
||||
description: `任务 "${record.jobName}" 已启用`,
|
||||
});
|
||||
loadData();
|
||||
// 局部更新，避免页面滚动
|
||||
updateRecordInList(record.id, { status: 'ENABLED' });
|
||||
} catch (error) {
|
||||
console.error('启用失败:', error);
|
||||
toast({
|
||||
@ -309,11 +326,11 @@ const ScheduleJobList: React.FC = () => {
|
||||
<CardHeader className="flex flex-row items-center justify-between">
|
||||
<CardTitle>任务列表</CardTitle>
|
||||
<div className="flex items-center gap-2">
|
||||
<Button variant="outline" onClick={() => setCategoryDialogOpen(true)}>
|
||||
<Button type="button" variant="outline" onClick={() => setCategoryDialogOpen(true)}>
|
||||
<FolderKanban className="h-4 w-4 mr-2"/>
|
||||
分类管理
|
||||
</Button>
|
||||
<Button onClick={handleCreate}>
|
||||
<Button type="button" onClick={handleCreate}>
|
||||
<Plus className="h-4 w-4 mr-2"/>
|
||||
新建任务
|
||||
</Button>
|
||||
@ -360,11 +377,11 @@ const ScheduleJobList: React.FC = () => {
|
||||
<SelectItem value="PAUSED">暂停</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<Button onClick={handleSearch}>
|
||||
<Button type="button" onClick={handleSearch}>
|
||||
<Search className="h-4 w-4 mr-2"/>
|
||||
查询
|
||||
</Button>
|
||||
<Button variant="outline" onClick={handleReset}>
|
||||
<Button type="button" variant="outline" onClick={handleReset}>
|
||||
重置
|
||||
</Button>
|
||||
</div>
|
||||
@ -440,6 +457,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
<>
|
||||
{/* 暂停 */}
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7"
|
||||
@ -450,6 +468,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
</Button>
|
||||
{/* 禁用 */}
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7 text-orange-600 hover:text-orange-700 hover:bg-orange-50 dark:text-orange-500 dark:hover:bg-orange-950/20"
|
||||
@ -460,6 +479,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
</Button>
|
||||
{/* 立即执行 */}
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7 text-green-600 hover:text-green-700 hover:bg-green-50 dark:text-green-500 dark:hover:bg-green-950/20"
|
||||
@ -475,6 +495,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
<>
|
||||
{/* 恢复 */}
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7"
|
||||
@ -485,6 +506,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
</Button>
|
||||
{/* 禁用 */}
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7 text-orange-600 hover:text-orange-700 hover:bg-orange-50 dark:text-orange-500 dark:hover:bg-orange-950/20"
|
||||
@ -498,6 +520,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
{/* DISABLED 按钮控制 */}
|
||||
{record.status === 'DISABLED' && (
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7 text-blue-600 hover:text-blue-700 hover:bg-blue-50 dark:text-blue-400 dark:hover:bg-blue-950/20"
|
||||
@ -509,6 +532,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
)}
|
||||
{/* 删除按钮 所有状态显示 */}
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7 text-destructive hover:text-destructive"
|
||||
@ -518,6 +542,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
<Trash2 className="h-4 w-4"/>
|
||||
</Button>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7"
|
||||
@ -527,6 +552,7 @@ const ScheduleJobList: React.FC = () => {
|
||||
<FileText className="h-4 w-4"/>
|
||||
</Button>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-7 w-7"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user