fix: 解决编辑同步问题
This commit is contained in:
parent
9a23521524
commit
929aaebf20
34
pnpm-lock.yaml
generated
34
pnpm-lock.yaml
generated
@ -10,7 +10,7 @@ importers:
|
||||
dependencies:
|
||||
'@abearxiong/container':
|
||||
specifier: 0.0.1-alpha.11
|
||||
version: 0.0.1-alpha.11(@emotion/css@11.13.0)(crypto-js@4.2.0)(eventemitter3@5.0.1)
|
||||
version: 0.0.1-alpha.11(@emotion/css@11.13.4)(crypto-js@4.2.0)(eventemitter3@5.0.1)
|
||||
'@abearxiong/flows':
|
||||
specifier: 0.0.1-alpha.9
|
||||
version: 0.0.1-alpha.9(@xyflow/react@12.3.1(@types/react@18.3.11)(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(immer@10.1.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(zustand@4.5.5(@types/react@18.3.11)(immer@10.1.1)(react@18.3.1))
|
||||
@ -335,8 +335,8 @@ packages:
|
||||
'@emotion/cache@11.13.1':
|
||||
resolution: {integrity: sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==}
|
||||
|
||||
'@emotion/css@11.13.0':
|
||||
resolution: {integrity: sha512-BUk99ylT+YHl+W/HN7nv1RCTkDYmKKqa1qbvM/qLSQEg61gipuBF5Hptk/2/ERmX2DCv0ccuFGhz9i0KSZOqPg==}
|
||||
'@emotion/css@11.13.4':
|
||||
resolution: {integrity: sha512-CthbOD5EBw+iN0rfM96Tuv5kaZN4nxPyYDvGUs0bc7wZBBiU/0mse+l+0O9RshW2d+v5HH1cme+BAbLJ/3Folw==}
|
||||
|
||||
'@emotion/hash@0.8.0':
|
||||
resolution: {integrity: sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==}
|
||||
@ -347,8 +347,8 @@ packages:
|
||||
'@emotion/memoize@0.9.0':
|
||||
resolution: {integrity: sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==}
|
||||
|
||||
'@emotion/serialize@1.3.1':
|
||||
resolution: {integrity: sha512-dEPNKzBPU+vFPGa+z3axPRn8XVDetYORmDC0wAiej+TNcOZE70ZMJa0X7JdeoM6q/nWTMZeLpN/fTnD9o8MQBA==}
|
||||
'@emotion/serialize@1.3.2':
|
||||
resolution: {integrity: sha512-grVnMvVPK9yUVE6rkKfAJlYZgo0cu3l9iMC77V7DW6E1DUIrU68pSEXRmFZFOFB1QFo57TncmOcvcbMDWsL4yA==}
|
||||
|
||||
'@emotion/sheet@1.4.0':
|
||||
resolution: {integrity: sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==}
|
||||
@ -359,8 +359,8 @@ packages:
|
||||
'@emotion/unitless@0.7.5':
|
||||
resolution: {integrity: sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==}
|
||||
|
||||
'@emotion/utils@1.4.0':
|
||||
resolution: {integrity: sha512-spEnrA1b6hDR/C68lC2M7m6ALPUHZC0lIY7jAS/B/9DuuO1ZP04eov8SMv/6fwRd8pzmsn2AuJEznRREWlQrlQ==}
|
||||
'@emotion/utils@1.4.1':
|
||||
resolution: {integrity: sha512-BymCXzCG3r72VKJxaYVwOXATqXIZ85cuvg0YOUDxMGNrKc1DJRZk8MgV5wyXRyEayIMd4FuXJIUgTBXvDNW5cA==}
|
||||
|
||||
'@emotion/weak-memoize@0.4.0':
|
||||
resolution: {integrity: sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==}
|
||||
@ -2659,9 +2659,9 @@ packages:
|
||||
|
||||
snapshots:
|
||||
|
||||
'@abearxiong/container@0.0.1-alpha.11(@emotion/css@11.13.0)(crypto-js@4.2.0)(eventemitter3@5.0.1)':
|
||||
'@abearxiong/container@0.0.1-alpha.11(@emotion/css@11.13.4)(crypto-js@4.2.0)(eventemitter3@5.0.1)':
|
||||
dependencies:
|
||||
'@emotion/css': 11.13.0
|
||||
'@emotion/css': 11.13.4
|
||||
crypto-js: 4.2.0
|
||||
eventemitter3: 5.0.1
|
||||
nanoid: 5.0.7
|
||||
@ -2874,7 +2874,7 @@ snapshots:
|
||||
'@babel/runtime': 7.25.6
|
||||
'@emotion/hash': 0.9.2
|
||||
'@emotion/memoize': 0.9.0
|
||||
'@emotion/serialize': 1.3.1
|
||||
'@emotion/serialize': 1.3.2
|
||||
babel-plugin-macros: 3.1.0
|
||||
convert-source-map: 1.9.0
|
||||
escape-string-regexp: 4.0.0
|
||||
@ -2888,17 +2888,17 @@ snapshots:
|
||||
dependencies:
|
||||
'@emotion/memoize': 0.9.0
|
||||
'@emotion/sheet': 1.4.0
|
||||
'@emotion/utils': 1.4.0
|
||||
'@emotion/utils': 1.4.1
|
||||
'@emotion/weak-memoize': 0.4.0
|
||||
stylis: 4.2.0
|
||||
|
||||
'@emotion/css@11.13.0':
|
||||
'@emotion/css@11.13.4':
|
||||
dependencies:
|
||||
'@emotion/babel-plugin': 11.12.0
|
||||
'@emotion/cache': 11.13.1
|
||||
'@emotion/serialize': 1.3.1
|
||||
'@emotion/serialize': 1.3.2
|
||||
'@emotion/sheet': 1.4.0
|
||||
'@emotion/utils': 1.4.0
|
||||
'@emotion/utils': 1.4.1
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
|
||||
@ -2908,12 +2908,12 @@ snapshots:
|
||||
|
||||
'@emotion/memoize@0.9.0': {}
|
||||
|
||||
'@emotion/serialize@1.3.1':
|
||||
'@emotion/serialize@1.3.2':
|
||||
dependencies:
|
||||
'@emotion/hash': 0.9.2
|
||||
'@emotion/memoize': 0.9.0
|
||||
'@emotion/unitless': 0.10.0
|
||||
'@emotion/utils': 1.4.0
|
||||
'@emotion/utils': 1.4.1
|
||||
csstype: 3.1.3
|
||||
|
||||
'@emotion/sheet@1.4.0': {}
|
||||
@ -2922,7 +2922,7 @@ snapshots:
|
||||
|
||||
'@emotion/unitless@0.7.5': {}
|
||||
|
||||
'@emotion/utils@1.4.0': {}
|
||||
'@emotion/utils@1.4.1': {}
|
||||
|
||||
'@emotion/weak-memoize@0.4.0': {}
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
import { useShallow } from 'zustand/react/shallow';
|
||||
import { useUserAppStore } from '../store';
|
||||
import { useEffect } from 'react';
|
||||
import { Button, Form, Input, Modal, Select, Tooltip } from 'antd';
|
||||
import { Button, Form, Input, message, Modal, Select, Tooltip } from 'antd';
|
||||
import { CodeOutlined, DashboardOutlined, DeleteOutlined, EditOutlined, LinkOutlined, PlusOutlined, UnorderedListOutlined } from '@ant-design/icons';
|
||||
import { isObjectNull } from '@/utils/is-null';
|
||||
import { useNavigate } from 'react-router';
|
||||
@ -158,12 +158,23 @@ export const List = () => {
|
||||
navicate(`/app/${item.key}/version/list`);
|
||||
}}></Button>
|
||||
</Tooltip>
|
||||
<Tooltip title={'App Version List'}>
|
||||
<Tooltip title={'To App'}>
|
||||
<Button
|
||||
icon={<LinkOutlined />}
|
||||
onClick={() => {
|
||||
const link = new URL(`/${item.user}/${item.key}`, 'https://kevisual.xiongxiao.me');
|
||||
window.open(link.toString(), '_blank');
|
||||
if (isRunning) {
|
||||
let baseUri = 'https://kevisual.xiongxiao.me';
|
||||
if (item.domain) {
|
||||
baseUri = item.domain;
|
||||
}
|
||||
if (DEV_SERVER) {
|
||||
baseUri = 'http://localhost:3005';
|
||||
}
|
||||
const link = new URL(`/${item.user}/${item.key}`, baseUri);
|
||||
window.open(link.toString(), '_blank');
|
||||
} else {
|
||||
message.error('The app is not running');
|
||||
}
|
||||
}}></Button>
|
||||
</Tooltip>
|
||||
<Tooltip title={'Delete'}>
|
||||
|
||||
@ -11,7 +11,16 @@ import { CloseOutlined, MessageOutlined, SaveOutlined, SelectOutlined } from '@a
|
||||
import { useDeckPageStore } from './deck-store';
|
||||
import { FormModal } from './Model.tsx';
|
||||
import { useAiStore } from '@/pages/ai-chat/index.tsx';
|
||||
|
||||
export const clearBlank = (newStyle: any) => {
|
||||
let change = false;
|
||||
for (let key in newStyle) {
|
||||
if (newStyle[key] === '' || newStyle[key] === undefined || newStyle[key] === null) {
|
||||
delete newStyle[key];
|
||||
change = true;
|
||||
}
|
||||
}
|
||||
return change;
|
||||
};
|
||||
export const useListener = (id?: string, opts?: any) => {
|
||||
const { refresh } = opts || {};
|
||||
const connected = useStore((state) => state.connected);
|
||||
@ -138,7 +147,6 @@ export const Deck = () => {
|
||||
await new Promise((resolve) => {
|
||||
setTimeout(resolve, 2000);
|
||||
});
|
||||
console.log('containerList update', containerList);
|
||||
// container.reRender();
|
||||
containerList.forEach((item) => {
|
||||
container.hotReload(item.id);
|
||||
@ -189,6 +197,8 @@ export const Deck = () => {
|
||||
},
|
||||
};
|
||||
if (width && height) {
|
||||
// @ts-ignore
|
||||
newData.nodeData.data.style.position = 'absolute';
|
||||
panelStore.updateNodeDataStyle(newData);
|
||||
}
|
||||
updateStyle(cid, { width, height });
|
||||
@ -217,6 +227,7 @@ export const Deck = () => {
|
||||
message.error('JSON format error');
|
||||
return;
|
||||
}
|
||||
// clearBlank(data);
|
||||
const newData = {
|
||||
id: rid,
|
||||
nodeData: {
|
||||
@ -226,7 +237,9 @@ export const Deck = () => {
|
||||
},
|
||||
},
|
||||
};
|
||||
panelStore.updateNodeDataStyle(newData);
|
||||
panelStore.updateNodeDataStyle(newData, true);
|
||||
const newDataStyle = updateStyle(cid, data);
|
||||
reRender(newDataStyle, cid);
|
||||
};
|
||||
const setCodeStyle = (cid: string) => {
|
||||
const pageData = deckPageStore.getPageData();
|
||||
@ -249,18 +262,22 @@ export const Deck = () => {
|
||||
const pageData = deckPageStore.getPageData();
|
||||
const _pageData = pageData.map((item) => {
|
||||
if (item.id === rid) {
|
||||
const newStyle = {
|
||||
...item.data.node.data.style,
|
||||
...style,
|
||||
};
|
||||
// 过滤掉空的style
|
||||
clearBlank(newStyle);
|
||||
return {
|
||||
...item,
|
||||
style: newStyle,
|
||||
data: {
|
||||
...item.data,
|
||||
node: {
|
||||
...item.data.node,
|
||||
data: {
|
||||
...item.data.node.data,
|
||||
style: {
|
||||
...item.data.node.data.style,
|
||||
...style,
|
||||
},
|
||||
style: newStyle,
|
||||
},
|
||||
},
|
||||
},
|
||||
@ -269,6 +286,7 @@ export const Deck = () => {
|
||||
return item;
|
||||
});
|
||||
deckPageStore.setPageData([..._pageData]);
|
||||
return _pageData;
|
||||
};
|
||||
const init = async (data: any[]) => {
|
||||
// console.log('data', data, ref.current);
|
||||
@ -285,6 +303,14 @@ export const Deck = () => {
|
||||
const { id, code } = data;
|
||||
});
|
||||
};
|
||||
const reRender = async (data: any[], cid?: string) => {
|
||||
if (containerRef.current) {
|
||||
const container = containerRef.current;
|
||||
await container.updateData(data);
|
||||
await container.renderId(cid!);
|
||||
return;
|
||||
}
|
||||
};
|
||||
return (
|
||||
<div className='w-full h-full relative'>
|
||||
<div className='w-full h-full bg-gray-200 '>
|
||||
|
||||
@ -13,7 +13,7 @@ type PanelStore = {
|
||||
getPanel: (id?: string) => Promise<void>;
|
||||
saveNodesEdges: (data: { nodes?: any[]; edges?: any[]; viewport?: any }) => Promise<void>;
|
||||
updateNodeData: (data: any) => Promise<void>;
|
||||
updateNodeDataStyle: (data: any) => Promise<any>;
|
||||
updateNodeDataStyle: (data: any, force?: boolean) => Promise<any>;
|
||||
};
|
||||
export const usePanelStore = create<PanelStore>((set, get) => {
|
||||
return {
|
||||
@ -98,7 +98,7 @@ export const usePanelStore = create<PanelStore>((set, get) => {
|
||||
message.error(res.message || 'Request failed');
|
||||
}
|
||||
},
|
||||
updateNodeDataStyle: async (data) => {
|
||||
updateNodeDataStyle: async (data, force) => {
|
||||
const { loading } = get();
|
||||
if (loading) {
|
||||
message.error('Request in progress, please wait');
|
||||
@ -110,6 +110,7 @@ export const usePanelStore = create<PanelStore>((set, get) => {
|
||||
path: 'page',
|
||||
key: 'updateNode',
|
||||
data: data,
|
||||
force,
|
||||
});
|
||||
loaded();
|
||||
set({ loading: false });
|
||||
|
||||
@ -31,12 +31,12 @@ export default defineConfig({
|
||||
host: '0.0.0.0',
|
||||
proxy: {
|
||||
'/api': {
|
||||
target: 'http://localhost:4000',
|
||||
target: 'http://localhost:4002',
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(/^\/api/, '/api'),
|
||||
},
|
||||
'/api/router': {
|
||||
target: 'ws://localhost:4000',
|
||||
target: 'ws://localhost:4002',
|
||||
changeOrigin: true,
|
||||
ws: true,
|
||||
rewriteWsOrigin: true,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user