pref(store): 实现多应用节点状态管理功能

master
钟良源 1 month ago
parent c9a61f762a
commit 7b2d995c54

@ -82,7 +82,7 @@ function IDEContainer() {
if (socketMessage?.socketId) dispatch(updateSocketId(socketMessage.socketId));
// 处理节点状态更新
if (socketMessage?.nodeLog) {
const { nodeId, state, runLog } = socketMessage.nodeLog;
const { nodeId, state, runLog, appId } = socketMessage.nodeLog;
// 将状态映射为前端使用的状态
let status = 'waiting';
switch (state) {
@ -100,7 +100,8 @@ function IDEContainer() {
break;
}
// 更新节点状态使用特殊的actionType标记这是运行时状态更新
dispatch(updateNodeStatus({ nodeId, status, actionType: 'RUNTIME_UPDATE' }));
// 如果后端提供了 appId则传递给 action 以确保更新正确的应用状态
dispatch(updateNodeStatus({ nodeId, status, appId, actionType: 'RUNTIME_UPDATE' }));
// 只有当存在runLog时才发送日志到logBar
if (runLog) {
@ -108,7 +109,8 @@ function IDEContainer() {
detail: {
type: 'runtime',
message: runLog,
timestamp: new Date().toISOString()
timestamp: new Date().toISOString(),
appId // 传递 appId 以便日志正确关联到对应的应用
}
});
document.dispatchEvent(logEvent);

@ -110,7 +110,7 @@ const LogBar: React.FC<LogBarProps> = () => {
// 监听日志消息事件
useEffect(() => {
const handleLogMessage = (event: CustomEvent) => {
const { type, message, timestamp } = event.detail;
const { type, message, timestamp, appId } = event.detail;
// 如果是校验类型的消息且当前校验日志tab可见则添加到校验日志中
if (type === 'validation') {
@ -141,14 +141,15 @@ const LogBar: React.FC<LogBarProps> = () => {
// 自动切换到运行日志tab并展开logBar
dispatch(updateLogBarStatus(true));
// 同时将日志添加到当前应用的运行日志中
const appKey = getCurrentAppKey();
if (appKey) {
// 同时将日志添加到对应应用的运行日志中
// 如果提供了 appId优先使用提供的 appId否则使用当前激活的应用
const targetAppKey = appId || getCurrentAppKey();
if (targetAppKey) {
dispatch({
type: 'ideContainer/addRuntimeLog',
payload: {
log: newLog,
appId: appKey // 使用 appKey 而不是 id
appId: targetAppKey
}
});
}

@ -93,6 +93,17 @@ const ideContainerSlice = createSlice({
},
updateCurrentAppData(state, action) {
state.currentAppData = action.payload;
// 切换应用时,同步全局 nodeStatusMap 为新应用的节点状态
const newAppKey = getCurrentAppKey(action.payload);
if (newAppKey && state.appRuntimeData[newAppKey]) {
state.nodeStatusMap = { ...state.appRuntimeData[newAppKey].nodeStatusMap };
state.isRunning = state.appRuntimeData[newAppKey].isRunning;
} else {
// 如果新应用没有运行时数据,清空节点状态
state.nodeStatusMap = {};
state.isRunning = false;
}
},
updateEventList(state, action) {
state.eventList = action.payload;
@ -114,21 +125,21 @@ const ideContainerSlice = createSlice({
},
// 更新节点状态
updateNodeStatus: (state, { payload }) => {
const { nodeId, status, actionType } = payload;
// 如果是运行时更新,不记录到历史记录中
if (actionType !== 'RUNTIME_UPDATE') {
state.nodeStatusMap[nodeId] = status;
}
else {
// 对于运行时更新,我们仍然更新状态但标记为运行时状态
const { nodeId, status, actionType, appId } = payload;
// 如果提供了 appId优先使用提供的 appId否则使用当前激活的应用
const targetAppKey = appId || getCurrentAppKey(state.currentAppData);
// 更新全局 nodeStatusMap仅当是当前激活应用时更新用于 UI 显示)
const currentAppKey = getCurrentAppKey(state.currentAppData);
if (targetAppKey === currentAppKey) {
state.nodeStatusMap[nodeId] = status;
}
// 同时更新当前应用的节点状态
const appKey = getCurrentAppKey(state.currentAppData);
if (appKey) {
if (!state.appRuntimeData[appKey]) {
state.appRuntimeData[appKey] = {
// 更新目标应用的节点状态
if (targetAppKey) {
if (!state.appRuntimeData[targetAppKey]) {
state.appRuntimeData[targetAppKey] = {
nodeStatusMap: {},
isRunning: false,
logs: [],
@ -137,7 +148,7 @@ const ideContainerSlice = createSlice({
eventlisteneList: []
};
}
state.appRuntimeData[appKey].nodeStatusMap[nodeId] = status;
state.appRuntimeData[targetAppKey].nodeStatusMap[nodeId] = status;
}
},
// 重置节点状态

Loading…
Cancel
Save