refactor: storechanger&functioncenter

packages/dooringx-example/src/plugin/formComponents/actionButton.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-07-07 14:46:01
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-07-13 11:30:17
+ * @LastEditTime: 2022-04-23 18:40:40
  * @FilePath: \dooringx\packages\dooringx-example\src\plugin\formComponents\actionButton.tsx
  */
 
@@ -39,14 +39,8 @@ function ActionButton(props: ActionButtonProps) {
 	const functionConfig = functionCenter.getConfigMap();
 	const functionMap = functionCenter.getFunctionMap();
 	const functionNameMap = functionCenter.getNameMap();
-	const isEdit = props.config.getStoreChanger().isEdit();
 	const dataMap = props.config.getDataCenter().getDataMap();
-	let modalMap: Record<string, IStoreData>;
+	let modalMap = props.config.getStore().getData().modalMap;
-	if (isEdit) {
-		modalMap = props.config.getStoreChanger().getOrigin()?.now.modalMap || {};
-	} else {
-		modalMap = props.config.getStore().getData().modalMap;
-	}
 
 	const handleInputDataSource = useCallback(
 		(

packages/dooringx-example/src/plugin/functionMap/index.ts

@@ -2,12 +2,37 @@
  * @Author: yehuozhili
  * @Date: 2021-07-07 14:22:51
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-08-05 14:53:12
+ * @LastEditTime: 2022-04-24 00:11:35
  * @FilePath: \dooringx\packages\dooringx-example\src\plugin\functionMap\index.ts
  */
 import { FunctionCenterType } from 'dooringx-lib/dist/core/functionCenter';
 
 export const functionMap: FunctionCenterType = {
+	sleep: {
+		fn: (ctx, next, _config, args) => {
+			const arr = args['_sk'];
+			let num = parseInt(arr[0]);
+			if (isNaN(num)) {
+				next();
+			} else {
+				setTimeout(() => {
+					next();
+				}, arr[0]);
+			}
+		},
+		config: [
+			{
+				name: '输入数值单位ms',
+				data: ['input'],
+				options: {
+					receive: '_sk',
+					multi: false,
+				},
+			},
+		],
+		name: '等待',
+		componentId: '_inner',
+	},
 	上下文转对象: {
 		fn: (ctx, next, _config, args) => {
 			const arr = args['_sk'];
@@ -39,5 +64,6 @@ export const functionMap: FunctionCenterType = {
 			},
 		],
 		name: '上下文转对象',
+		componentId: '_inner',
 	},
 };

packages/dooringx-example/src/plugin/registComponents/button.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-07-07 14:35:38
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-08-05 15:10:31
+ * @LastEditTime: 2022-04-24 00:29:46
  * @FilePath: \dooringx\packages\dooringx-example\src\plugin\registComponents\button.tsx
  */
 
@@ -16,7 +16,7 @@ import {
 } from 'dooringx-lib';
 import { FormMap } from '../formTypes';
 import { ComponentRenderConfigProps } from 'dooringx-lib/dist/core/components/componentItem';
-
+let s = 0;
 function ButtonTemp(pr: ComponentRenderConfigProps) {
 	const props = pr.data.props;
 	const eventCenter = useMemo(() => {
@@ -35,12 +35,13 @@ function ButtonTemp(pr: ComponentRenderConfigProps) {
 	const [text, setText] = useState('');
 	const op1 = props.op1;
 	useEffect(() => {
-		let unregist = () => {};
+		let unRegist = () => {};
 		if (op1) {
+			console.log('kkk');
 			const functionCenter = eventCenter.getFunctionCenter();
-			unregist = functionCenter.register(
+			unRegist = functionCenter.register({
-				`${pr.data.id}+changeText`,
+				id: `${pr.data.id}+changeText`,
-				async (ctx, next, config, args: any, _eventList, iname) => {
+				fn: async (ctx, next, config, args: any, _eventList, iname) => {
 					const userSelect = iname.data;
 					const ctxVal = changeUserValue(
 						userSelect['改变文本数据源'],
@@ -49,11 +50,13 @@ function ButtonTemp(pr: ComponentRenderConfigProps) {
 						config,
 						ctx
 					);
-					const text = ctxVal[0];
+					s = s++;
+					const text = ctxVal[0] + s;
+
 					setText(text);
 					next();
 				},
-				[
+				config: [
 					{
 						name: '改变文本数据源',
 						data: ['ctx', 'input', 'dataSource'],
@@ -63,14 +66,16 @@ function ButtonTemp(pr: ComponentRenderConfigProps) {
 						},
 					},
 				],
-				`${pr.data.id}+改变文本函数`
+				name: `${pr.data.id}+改变文本函数`,
-			);
+				componentId: pr.data.id,
+			});
 		}
 		return () => {
-			unregist();
+			if (pr.context === 'preview') {
+				unRegist(); // 必须在预览时注销，否则影响二次点击效果，不在预览注销影响编辑时跨弹窗
+			}
 		};
 	}, [op1]);
-
 	return (
 		<Button
 			style={{

packages/dooringx-example/src/plugin/registComponents/inputCo.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-08-05 10:50:57
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-08-05 15:10:46
+ * @LastEditTime: 2022-04-23 23:38:31
  * @FilePath: \dooringx\packages\dooringx-example\src\plugin\registComponents\inputCo.tsx
  */
 
@@ -33,9 +33,9 @@ const InputTemp = (pr: InputProps) => {
 		let unregist = () => {};
 		if (props.op1) {
 			const functionCenter = eventCenter.getFunctionCenter();
-			unregist = functionCenter.register(
+			unregist = functionCenter.register({
-				`${pr.data.id}+validate-func`,
+				id: `${pr.data.id}+validate-func`,
-				async (_ctx, next, _config, _args: any, _eventList, _iname) => {
+				fn: async (_ctx, next, _config, _args: any, _eventList, _iname) => {
 					if (value === '') {
 						setErr(props.warnning);
 					} else {
@@ -43,7 +43,7 @@ const InputTemp = (pr: InputProps) => {
 						next();
 					}
 				},
-				[
+				config: [
 					{
 						name: '验证已填函数',
 						data: [],
@@ -53,8 +53,9 @@ const InputTemp = (pr: InputProps) => {
 						},
 					},
 				],
-				`${pr.data.id}+验证已填函数`
+				name: `${pr.data.id}+验证已填函数`,
-			);
+				componentId: pr.data.id,
+			});
 		}
 		return () => {
 			unregist();
@@ -65,14 +66,14 @@ const InputTemp = (pr: InputProps) => {
 		let unregist = () => {};
 		if (props.op2) {
 			const functionCenter = eventCenter.getFunctionCenter();
-			unregist = functionCenter.register(
+			unregist = functionCenter.register({
-				`${pr.data.id}+get-input`,
+				id: `${pr.data.id}+get-input`,
-				async (ctx, next, _config, args: any, _eventList, _iname) => {
+				fn: async (ctx, next, _config, args: any, _eventList, _iname) => {
 					const key = args['_changeval'][0];
 					ctx[key] = value;
 					next();
 				},
-				[
+				config: [
 					{
 						name: '获取数据至上下文',
 						data: ['ctx'],
@@ -82,8 +83,9 @@ const InputTemp = (pr: InputProps) => {
 						},
 					},
 				],
-				`${pr.data.id}+获取输入数据`
+				name: `${pr.data.id}+获取输入数据`,
-			);
+				componentId: pr.data.id,
+			});
 		}
 		return () => {
 			unregist();

packages/dooringx-lib/src/components/container.tsx

@@ -30,7 +30,7 @@ function Container(props: PropsWithChildren<ContainerProps>) {
 	}, [props.context, scaleState]);
 
 	const bgColor = () => {
-		const isEdit = props.config.getStoreChanger().isEdit();
+		const isEdit = props.config.getStore().isEdit();
 		if (isEdit) {
 			return 'rgba(255,255,255,1)';
 		} else {

packages/dooringx-lib/src/components/control/control.tsx

@@ -13,6 +13,7 @@ import { wrapperMoveState } from '../wrapperMove/event';
 import { replaceLocale } from '../../locale';
 import { mouseUp, moveState } from './state';
 import SettingsModal from './settings';
+import deepcopy from 'deepcopy';
 
 export interface ControlProps {
 	config: UserConfig;
@@ -124,12 +125,12 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 				footer={null}
 			>
 				<List>
-					{props.config.getStoreChanger().getState().modalEditName !== '' && (
+					{props.config.getStore().isEdit() && (
 						<div>
 							{replaceLocale('modal.popup.exit', '请退出编辑弹窗后再打开该配置', props.config)}
 						</div>
 					)}
-					{props.config.getStoreChanger().getState().modalEditName === '' &&
+					{!props.config.getStore().isEdit() &&
 						Object.keys(props.config.getStore().getData().modalMap).map((v) => {
 							return (
 								<List.Item
@@ -142,9 +143,9 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 												props.config
 											)}
 											onConfirm={() => {
-												const sign = props.config
+												const store = props.config.getStore();
-													.getStoreChanger()
+												const clone = deepcopy(store.getData());
-													.updateModal(props.config.getStore(), v);
+												const sign = store.changeNormalToModal(clone, v);
 												if (!sign.success && sign.sign === 0) {
 													api.error(
 														replaceLocale(
@@ -153,6 +154,7 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 															props.config
 														)
 													);
+													return;
 												}
 												if (!sign.success && sign.sign === 1) {
 													api.error(
@@ -164,21 +166,21 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 															'未找到该弹窗 {name}'
 														)
 													);
+													return;
 												}
 												setConfigVisible(false);
+												store.setData(clone);
 											}}
 											okText={replaceLocale('yes', '确定', props.config)}
 											cancelText={replaceLocale('no', '取消', props.config)}
 										>
-											<Button type="link">修改</Button>
+											<Button type="link">{replaceLocale('edit', '编辑', props.config)}</Button>
 										</Popconfirm>,
 
 										<Popconfirm
 											title="您确定要删除这个弹窗吗?"
 											onConfirm={() => {
-												const sign = props.config
+												const sign = props.config.getStore().removeModal(v);
-													.getStoreChanger()
-													.removeModal(props.config.getStore(), v);
 												if (!sign.success && sign.sign === 0) {
 													api.error(
 														replaceLocale(
@@ -215,7 +217,7 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 								</List.Item>
 							);
 						})}
-					{props.config.getStoreChanger().getState().modalEditName === '' &&
+					{!props.config.getStore().isEdit() &&
 						Object.keys(props.config.getStore().getData().modalMap).length === 0 && (
 							<div style={{ textAlign: 'center' }}>
 								{replaceLocale('modal.popup.nomodal', `暂时没有弹窗`, props.config)}
@@ -232,9 +234,7 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 						.then((values) => {
 							form.resetFields();
 							const modalName = values.modalName;
-							const sign = props.config
+							const sign = props.config.getStore().newModalMap(modalName);
-								.getStoreChanger()
-								.newModalMap(props.config.getStore(), modalName);
 
 							if (!sign.succeess && sign.sign === 0) {
 								api.error(
@@ -283,7 +283,6 @@ export function Control(props: PropsWithChildren<ControlProps>) {
 				config={props.config}
 				visible={settingVisible}
 				onOk={(v: any) => {
-					console.log(v);
 					props.config.marklineConfig.isAbsorb = v.absorb;
 					props.config.marklineConfig.indent = v.indent;
 					props.config.scaleState.minValue = v.min;

packages/dooringx-lib/src/components/leftDataPannel.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2022-04-09 21:44:55
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-10 15:59:37
+ * @LastEditTime: 2022-04-24 00:34:55
  * @FilePath: \dooringx\packages\dooringx-lib\src\components\leftDataPannel.tsx
  */
 import {
@@ -62,6 +62,7 @@ function LeftDataPannel(props: LeftDataPannelProps) {
 		},
 		{
 			title: '操作',
+			align: 'center',
 			render: (_v, record: any) => {
 				return (
 					<Space size="middle">

packages/dooringx-lib/src/components/modalRender.tsx

@@ -17,13 +17,13 @@ export const unmountMap: Map<string, Function> = new Map();
 
 export function ModalRender(props: ModalRenderProps) {
 	//先获取数据
-	const storeData: IStoreData = useMemo(() => {
+	const storeData = useMemo(() => {
 		const z = props.data.modalMap[props.name];
 		if (z) {
 			const data = deepCopy(z);
 			//需要把第一个mask扔了手动写一个
-			data.block.shift();
+			data.shift();
-			return data;
+			return { block: data };
 		}
 		return { block: [] };
 	}, [props.data.modalMap, props.name]);

packages/dooringx-lib/src/components/preview.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 05:40:37
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-06 22:07:33
+ * @LastEditTime: 2022-04-23 18:01:55
  * @FilePath: \dooringx\packages\dooringx-lib\src\components\preview.tsx
  */
 import Container from './container';
@@ -43,7 +43,7 @@ export interface PreviewProps {
 }
 
 function Preview(props: PreviewProps): ReactElement {
-	const isEdit = props.config.getStoreChanger().isEdit();
+	const isEdit = props.config.getStore().isEdit();
 	/// 这里需要在渲染组件之前必须把所有config加载完成，否则会导致先运行的函数无法运行
 	const [loading, setLoading] = useState(true);
 
@@ -53,13 +53,11 @@ function Preview(props: PreviewProps): ReactElement {
 			props.config.createdFn.forEach((v) => v());
 			setTimeout(() => {
 				// 链接数据
-				props.config
+				props.config.getDataCenter().initAddToDataMap(props.config.getStore().getData());
-					.getDataCenter()
-					.initAddToDataMap(props.config.getStore().getData(), props.config.getStoreChanger());
 				// 链接事件
 				props.config
 					.getEventCenter()
-					.syncEventMap(props.config.getStore().getData(), props.config.getStoreChanger());
+					.syncEventMap(props.config.getStore().getData(), props.config.getStore());
 
 				// 设置全局
 				const global = props.config.getStore().getData().globalState;
@@ -129,10 +127,12 @@ function Preview(props: PreviewProps): ReactElement {
 
 	if (isEdit) {
 		// 正常情况不会走这
-		const state = props.config.getStoreChanger().getOrigin()!.now;
+		const store = props.config.getStore();
+		const data = store.getData();
+		store.changeModaltoNormal(data);
 		return (
 			<>
-				<Container config={props.config} context="preview" state={state}></Container>
+				<Container config={props.config} context="preview" state={store.getData()}></Container>
 			</>
 		);
 	} else {

packages/dooringx-lib/src/components/rightConfig.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 05:42:13
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-08 01:37:25
+ * @LastEditTime: 2022-04-23 18:12:53
  * @FilePath: \dooringx\packages\dooringx-lib\src\components\rightConfig.tsx
  */
 import { CreateOptionsRes } from '../core/components/formTypes';
@@ -96,29 +96,21 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
 			return null;
 		};
 	}, [props.config]);
-
 	const initColor = useMemo(() => {
-		return props.config.getStoreChanger().isEdit()
+		return rgba2Obj(props.config.getStore().getData().globalState.containerColor);
-			? rgba2Obj(props.config.getStoreChanger().getOrigin()?.now.globalState.containerColor)
-			: rgba2Obj(props.config.getStore().getData().globalState.containerColor);
 	}, [props.config]);
 	const initColor2 = useMemo(() => {
-		return props.config.getStoreChanger().isEdit()
+		return rgba2Obj(props.config.getStore().getData().globalState.bodyColor);
-			? rgba2Obj(props.config.getStoreChanger().getOrigin()?.now.globalState.bodyColor)
-			: rgba2Obj(props.config.getStore().getData().globalState.bodyColor);
 	}, [props.config]);
 	const initTitle = useMemo(() => {
-		const title = props.config.getStoreChanger().isEdit()
+		return props.config.getStore().getData().globalState.title;
-			? props.config.getStoreChanger().getOrigin()?.now.globalState.title
-			: props.config.getStore().getData().globalState.title;
-		return title;
 	}, [props.config]);
 	const [title, setTitle] = useState(initTitle);
 
 	const customGlobal = props.config.getConfig().rightGlobalCustom;
-	const isEdit = props.config.getStoreChanger().isEdit();
+	const isEdit = props.config.getStore().isEdit();
-	const modalName = props.config.getStoreChanger().getState().modalEditName;
+	const data = props.config.getStore().getData();
-	const originData = props.config.getStoreChanger().getOrigin()?.now;
+	const modalName = data.modalEditName;
 	return (
 		<div
 			className="ant-menu right-pannel-wrap"
@@ -173,18 +165,9 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
 								onChange={(e) => {
 									const val = e.target.value;
 									setTitle(val);
-									const isEdit = props.config.getStoreChanger().isEdit();
+									const originData = deepcopy(props.config.getStore().getData());
-									if (isEdit) {
+									originData.globalState.title = val;
-										const originData: IStoreData = deepcopy(
+									props.config.getStore().setData(originData);
-											props.config.getStoreChanger().getOrigin()!.now
-										);
-										originData.globalState.title = val;
-										props.config.getStoreChanger().updateOrigin(originData);
-									} else {
-										const originData = deepcopy(props.config.getStore().getData());
-										originData.globalState.title = val;
-										props.config.getStore().setData(originData);
-									}
 								}}
 							/>
 						</Col>
@@ -199,18 +182,9 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
 								value={props.config.getStore().getData().container.height}
 								onChange={(e) => {
 									const val = e;
-									const isEdit = props.config.getStoreChanger().isEdit();
+									const originData = deepcopy(props.config.getStore().getData());
-									if (isEdit) {
+									originData.container.height = val;
-										const originData: IStoreData = deepcopy(
+									props.config.getStore().setData(originData);
-											props.config.getStoreChanger().getOrigin()!.now
-										);
-										originData.container.height = val;
-										props.config.getStoreChanger().updateOrigin(originData);
-									} else {
-										const originData = deepcopy(props.config.getStore().getData());
-										originData.container.height = val;
-										props.config.getStore().setData(originData);
-									}
 								}}
 							/>
 						</Col>
@@ -223,18 +197,9 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
 							<ColorPicker
 								initColor={initColor}
 								onChange={(newcolor) => {
-									const isEdit = props.config.getStoreChanger().isEdit();
+									const originData = deepcopy(props.config.getStore().getData());
-									if (isEdit) {
+									originData.globalState.containerColor = `rgba(${newcolor.r}, ${newcolor.g}, ${newcolor.b}, ${newcolor.a})`;
-										const originData: IStoreData = deepcopy(
+									props.config.getStore().setData(originData);
-											props.config.getStoreChanger().getOrigin()!.now
-										);
-										originData.globalState.containerColor = `rgba(${newcolor.r}, ${newcolor.g}, ${newcolor.b}, ${newcolor.a})`;
-										props.config.getStoreChanger().updateOrigin(originData);
-									} else {
-										const originData = deepcopy(props.config.getStore().getData());
-										originData.globalState.containerColor = `rgba(${newcolor.r}, ${newcolor.g}, ${newcolor.b}, ${newcolor.a})`;
-										props.config.getStore().setData(originData);
-									}
 								}}
 							></ColorPicker>
 						</Col>
@@ -247,18 +212,9 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
 							<ColorPicker
 								initColor={initColor2}
 								onChange={(newcolor) => {
-									const isEdit = props.config.getStoreChanger().isEdit();
+									const originData = deepcopy(props.config.getStore().getData());
-									if (isEdit) {
+									originData.globalState.bodyColor = `rgba(${newcolor.r}, ${newcolor.g}, ${newcolor.b}, ${newcolor.a})`;
-										const originData: IStoreData = deepcopy(
+									props.config.getStore().setData(originData);
-											props.config.getStoreChanger().getOrigin()!.now
-										);
-										originData.globalState.bodyColor = `rgba(${newcolor.r}, ${newcolor.g}, ${newcolor.b}, ${newcolor.a})`;
-										props.config.getStoreChanger().updateOrigin(originData);
-									} else {
-										const originData = deepcopy(props.config.getStore().getData());
-										originData.globalState.bodyColor = `rgba(${newcolor.r}, ${newcolor.g}, ${newcolor.b}, ${newcolor.a})`;
-										props.config.getStore().setData(originData);
-									}
 								}}
 							></ColorPicker>
 						</Col>
@@ -278,15 +234,12 @@ function RightConfig(props: PropsWithChildren<RightConfigProps>) {
 						</Col>
 						<Col span={16} style={{ ...colStyle }}>
 							<Checkbox
-								checked={originData ? originData.modalConfig[modalName] : false}
+								checked={data.modalConfig[modalName] || false}
 								onChange={(e) => {
 									const val = e.target.checked;
-									const cloneData = deepcopy(originData);
+									const cloneData = deepcopy(data);
-									if (cloneData) {
+									cloneData.modalConfig[modalName] = val;
-										cloneData.modalConfig[modalName] = val;
+									props.config.getStore().setData(cloneData);
-										props.config.getStoreChanger().updateOrigin(cloneData);
-										props.config.getStore().forceUpdate();
-									}
 								}}
 							></Checkbox>
 						</Col>

packages/dooringx-lib/src/components/timeLine/timeline.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-08-09 15:15:25
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-01 13:41:34
+ * @LastEditTime: 2022-04-23 18:34:46
  * @FilePath: \dooringx\packages\dooringx-lib\src\components\timeLine\timeline.tsx
  */
 import deepcopy from 'deepcopy';
@@ -294,7 +294,7 @@ export function TimeLine(props: TimeLineProps) {
 	const onSortEnd = (sort: SortEnd) => {
 		const { oldIndex, newIndex } = sort;
 		const newblocks: IBlockType[] = arrayMove(data, oldIndex, newIndex);
-		const isEdit = props.config.getStoreChanger().isEdit();
+		const isEdit = props.config.getStore().isEdit();
 		if (isEdit) {
 			const firstType = newblocks[0].name;
 			if (firstType !== 'modalMask') {

packages/dooringx-lib/src/config/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-02-25 21:16:58
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-08 01:37:07
+ * @LastEditTime: 2022-04-23 23:03:56
  * @FilePath: \dooringx\packages\dooringx-lib\src\config\index.tsx
  */
 import React from 'react';
@@ -28,7 +28,6 @@ import MmodalMask from '../core/components/defaultFormComponents/modalMask';
 import CommanderWrapper from '../core/command';
 import { focusState } from '../core/focusHandler/state';
 import ComponentRegister from '../core/components';
-import { StoreChanger } from '../core/storeChanger';
 import Store from '../core/store';
 import { VerticalAlignMiddleOutlined } from '@ant-design/icons';
 import { wrapperMoveState } from '../components/wrapperMove/event';
@@ -177,6 +176,8 @@ export const defaultStore: IMainStoreData = {
 		customAnimate: [],
 	},
 	modalConfig: {},
+	modalEditName: '',
+	origin: null,
 };
 
 export const defaultConfig: InitConfig = {
@@ -189,7 +190,7 @@ export const defaultConfig: InitConfig = {
 		modalMask: { component: MmodalMask }, // 这个组件不配置显示
 	},
 	initFunctionMap: {
-		打开弹窗函数: {
+		open_modal: {
 			fn: (_ctx, next, config, args) => {
 				const modalName = args['_modal'];
 				const storeData = config.getStore().getData();
@@ -207,8 +208,9 @@ export const defaultConfig: InitConfig = {
 				},
 			],
 			name: '打开弹窗函数',
+			componentId: '_inner',
 		},
-		关闭弹窗函数: {
+		close_modal: {
 			fn: (_ctx, next, _config, args) => {
 				const modalName = args['_modal'];
 				const fn = unmountMap.get(modalName);
@@ -228,6 +230,7 @@ export const defaultConfig: InitConfig = {
 				},
 			],
 			name: '关闭弹窗函数',
+			componentId: '_inner',
 		},
 	},
 	initDataCenterMap: {},
@@ -338,7 +341,6 @@ export class UserConfig {
 	public store = new Store();
 	public componentRegister = new ComponentRegister();
 	public formRegister = new FormComponentRegister();
-	public storeChanger = new StoreChanger();
 	public animateFactory = new AnimateFactory();
 	public componentCache = {};
 	public asyncComponentUrlMap = {} as AsyncCacheComponentType;
@@ -427,11 +429,11 @@ export class UserConfig {
 		// 注册data
 		this.dataCenter = new DataCenter(this.initConfig.initDataCenterMap);
 		//数据需要加上store上的
-		this.dataCenter.initAddToDataMap(this.store.getData(), this.storeChanger);
+		this.dataCenter.initAddToDataMap(this.store.getData());
 		// 修改事件与数据初始
 		this.eventCenter = new EventCenter({}, this.initConfig.initFunctionMap);
 		// 注册画布事件
-		this.eventCenter.syncEventMap(this.store.getData(), this.storeChanger);
+		this.eventCenter.syncEventMap(this.store.getData(), this.store);
 	}
 
 	init() {
@@ -482,9 +484,6 @@ export class UserConfig {
 	getEventCenter() {
 		return this.eventCenter;
 	}
-	getStoreChanger() {
-		return this.storeChanger;
-	}
 	getAnimateFactory() {
 		return this.animateFactory;
 	}
@@ -514,14 +513,7 @@ export class UserConfig {
 	 * @memberof UserConfig
 	 */
 	getCurrentData() {
-		let data: IStoreData;
+		return this.store.getData();
-		const isEdit = this.storeChanger.isEdit();
-		if (isEdit) {
-			data = this.storeChanger.getOrigin()!.now;
-		} else {
-			data = this.store.getData();
-		}
-		return data;
 	}
 
 	/**
@@ -679,13 +671,8 @@ export class UserConfig {
 		leftProps: Partial<LeftRegistComponentMapItem>,
 		callback?: Function
 	) {
-		let isEdit = this.storeChanger.isEdit();
 		let storeData = this.store.getData();
 		let globalState = storeData.globalState;
-		if (isEdit) {
-			storeData = this.storeChanger.getOrigin()!.now;
-			globalState = storeData.globalState;
-		}
 		if (globalState['script'].includes(src)) {
 			console.error(src + 'scripts have been loaded');
 			return;
@@ -707,11 +694,7 @@ export class UserConfig {
 				// 前面加载会重置store 新增组件需要事件初始化
 				setTimeout(() => {
 					window[this.SCRIPTGLOBALNAME as any] = undefined as any;
-					isEdit = this.storeChanger.isEdit();
 					globalState = this.store.getData().globalState;
-					if (isEdit) {
-						globalState = this.storeChanger.getOrigin()!.now.globalState;
-					}
 					globalState['script'].push(src);
 					storeData.globalState = globalState;
 					this.store.resetToInitData([storeData], true);

packages/dooringx-lib/src/core/AnimateFactory/index.ts

@@ -139,22 +139,11 @@ export class AnimateFactory {
 	syncToStore(config: UserConfig) {
 		// 先判断global的位置
 		const store = config.getStore();
-		let data: IStoreData;
+		let data = store.getData();
-		const isEdit = config.getStoreChanger().isEdit();
-		if (isEdit) {
-			const origin = config.getStoreChanger().getOrigin()!;
-			data = origin.data[origin.current];
-		} else {
-			data = store.getData();
-		}
 		const copy: IMainStoreData = deepCopy(data);
 		const originGlobal = copy.globalState as IMainStoreData['globalState'];
 		originGlobal.customAnimate = [...this.customAnimateName];
-		if (isEdit) {
+		store.setData(copy);
-			config.getStoreChanger().updateOrigin(copy);
-		} else {
-			store.setData(copy);
-		}
 	}
 
 	/**
@@ -166,13 +155,7 @@ export class AnimateFactory {
 	syncStoreToConfig(config: UserConfig) {
 		const store = config.getStore();
 		let data: IStoreData;
-		const isEdit = config.getStoreChanger().isEdit();
+		data = store.getData();
-		if (isEdit) {
-			const origin = config.getStoreChanger().getOrigin()!;
-			data = origin.data[origin.current];
-		} else {
-			data = store.getData();
-		}
 		const dataAnimate = data.globalState?.customAnimate;
 		this.customAnimateName = [...dataAnimate];
 	}

packages/dooringx-lib/src/core/components/defaultFormComponents/modalMask.tsx

@@ -2,8 +2,8 @@
  * @Author: yehuozhili
  * @Date: 2021-04-04 20:35:11
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-07-05 23:55:53
+ * @LastEditTime: 2022-04-23 18:36:23
- * @FilePath: \DooringV2\packages\dooring-v2-lib\src\core\components\defaultFormComponents\modalMask.tsx
+ * @FilePath: \dooringx\packages\dooringx-lib\src\core\components\defaultFormComponents\modalMask.tsx
  */
 import { SaveOutlined } from '@ant-design/icons';
 import { Button } from 'antd';
@@ -45,7 +45,7 @@ const MmodalMask = new ComponentItemFactory(
 						style={{ position: 'absolute', right: '10px', top: '10px' }}
 						icon={<SaveOutlined></SaveOutlined>}
 						onClick={() => {
-							config.getStoreChanger().closeModal(config.getStore());
+							config.getStore().closeModal();
 						}}
 					></Button>
 				)}

packages/dooringx-lib/src/core/dataCenter/index.ts

@@ -2,13 +2,12 @@
  * @Author: yehuozhili
  * @Date: 2021-04-13 11:20:55
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-10 01:02:03
+ * @LastEditTime: 2022-04-23 17:54:22
  * @FilePath: \dooringx\packages\dooringx-lib\src\core\dataCenter\index.ts
  */
 
 import UserConfig from '../../config';
 import { IStoreData } from '../store/storetype';
-import { StoreChanger } from '../storeChanger';
 
 /**
  *
@@ -56,19 +55,9 @@ export class DataCenter {
 	 */
 	staticSetToMap(data: Record<string, any>, config: UserConfig) {
 		this.dataMap = data;
-		const storeChanger = config.getStoreChanger();
 		const store = config.getStore();
 		const storeCurrentData = store.getData();
-		const sign = storeChanger.isEdit();
+		storeCurrentData.dataSource = data;
-		if (sign) {
-			const originData = storeChanger.getOrigin();
-			if (originData) {
-				const currentData = originData.now;
-				currentData.dataSource = data;
-			}
-		} else {
-			storeCurrentData.dataSource = data;
-		}
 	}
 
 	/**
@@ -77,19 +66,8 @@ export class DataCenter {
 	 * @param {IStoreData} data
 	 * @memberof DataCenter
 	 */
-	initAddToDataMap(data: IStoreData, storeChanger: StoreChanger) {
+	initAddToDataMap(data: IStoreData) {
-		const sign = storeChanger.isEdit();
+		this.dataMap = data.dataSource;
-		//这里只能初始触发，一般不会走编辑状态，否则逻辑可能会有问题
-		if (sign) {
-			// 编辑状态收集orgin
-			const originData = storeChanger.getOrigin();
-			if (originData) {
-				const currentData = originData.data[originData.current];
-				this.dataMap = currentData.dataSource;
-			}
-		} else {
-			this.dataMap = data.dataSource;
-		}
 	}
 
 	/**

packages/dooringx-lib/src/core/eventCenter/index.ts

@@ -2,14 +2,14 @@
  * @Author: yehuozhili
  * @Date: 2021-04-06 19:33:17
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-06 17:23:54
+ * @LastEditTime: 2022-04-24 00:18:18
  * @FilePath: \dooringx\packages\dooringx-lib\src\core\eventCenter\index.ts
  */
 import UserConfig from '../../config';
 import { FunctionCenter, FunctionCenterType } from '../functionCenter';
 import { FunctionDataType } from '../functionCenter/config';
+import Store from '../store';
 import { IStoreData } from '../store/storetype';
-import { StoreChanger } from '../storeChanger';
 import { EventQuene } from './eventQuene';
 
 // 每个组件制作时可以抛出多个事件，事件名为id+自定义name，
@@ -64,35 +64,32 @@ export class EventCenter {
 	 * @param {IStoreData} data
 	 * @memberof EventCenter
 	 */
-	syncEventMap(data: IStoreData, storeChanger: StoreChanger) {
+	syncEventMap(data: IStoreData, store: Store) {
-		// 需要判断是否在弹窗状态。如果在弹窗状态，数据以storeChanger为准，否则就以store为准
+		const sign = store.isEdit();
-		const sign = storeChanger.isEdit();
 		this.eventMap = {};
 		if (sign) {
-			const originData = storeChanger.getOrigin();
+			// 收集源block数据
-			if (originData) {
+			if (data.origin) {
-				const currentData = originData.data[originData.current];
+				data.origin.forEach((v) => {
-				// 收集源block数据
-				currentData.block.forEach((v) => {
-					this.eventMap = Object.assign(this.eventMap, v.eventMap);
-				});
-				//收集源modal数据
-				Object.keys(currentData.modalMap).forEach((v) => {
-					currentData.modalMap[v].block.forEach((k) => {
-						this.eventMap = Object.assign(this.eventMap, k.eventMap);
-					});
-				});
-				//收集当前modal数据
-				data.block.forEach((v) => {
 					this.eventMap = Object.assign(this.eventMap, v.eventMap);
 				});
 			}
+			//收集源modal数据
+			Object.keys(data.modalMap).forEach((v) => {
+				data.modalMap[v].forEach((k) => {
+					this.eventMap = Object.assign(this.eventMap, k.eventMap);
+				});
+			});
+			//收集当前modal数据
+			data.block.forEach((v) => {
+				this.eventMap = Object.assign(this.eventMap, v.eventMap);
+			});
 		} else {
 			data.block.forEach((v) => {
 				this.eventMap = Object.assign(this.eventMap, v.eventMap);
 			});
 			Object.keys(data.modalMap).forEach((v) => {
-				data.modalMap[v].block.forEach((k) => {
+				data.modalMap[v].forEach((k) => {
 					this.eventMap = Object.assign(this.eventMap, k.eventMap);
 				});
 			});

packages/dooringx-lib/src/core/functionCenter/index.ts

@@ -2,12 +2,14 @@
  * @Author: yehuozhili
  * @Date: 2021-04-08 19:59:01
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-07-09 16:23:02
+ * @LastEditTime: 2022-04-24 00:14:25
- * @FilePath: \DooringV2\packages\dooringx-lib\src\core\functionCenter\index.ts
+ * @FilePath: \dooringx\packages\dooringx-lib\src\core\functionCenter\index.ts
  */
 
 import UserConfig from '../../config';
 import { EventCenterMapItem, EventCenterUserSelect } from '../eventCenter';
+import Store from '../store';
+import { specialFnList } from '../utils/special';
 import { FunctionConfigType } from './config';
 
 /**
@@ -32,6 +34,7 @@ export type FunctionCenterValue = {
 	fn: FunctionCenterFunction;
 	config: FunctionConfigType;
 	name: string;
+	componentId: string;
 };
 
 export type FunctionCenterType = Record<string, FunctionCenterValue>;
@@ -39,6 +42,7 @@ export type FunctionCenterType = Record<string, FunctionCenterValue>;
 /**
  *
  * 初始化时可以加载初始已配好的函数
+ * {}
  * @export
  * @class FunctionCenter
  */
@@ -52,6 +56,7 @@ export class FunctionCenter {
 	public configMap: Record<string, FunctionConfigType> = {};
 	public funcitonMap: Record<string, FunctionCenterFunction> = {};
 	public nameMap: Record<string, string> = {}; // id对名字
+	public componentIdMap: Record<string, Set<string>> = {}; // 组件id对函数id
 	constructor(public initConfig: FunctionCenterType = {}) {
 		this.init(initConfig);
 	}
@@ -76,12 +81,25 @@ export class FunctionCenter {
 			prev[next] = initConfig[next].name;
 			return prev;
 		}, {});
+		this.componentIdMap = Object.keys(initConfig).reduce<Record<string, Set<string>>>(
+			(prev, next) => {
+				const cid = initConfig[next].componentId;
+				if (prev[cid]) {
+					prev[cid].add(next);
+				} else {
+					prev[cid] = new Set([next]);
+				}
+				return prev;
+			},
+			{}
+		);
 	}
 
 	reset() {
 		this.funcitonMap = {};
 		this.configMap = {};
 		this.nameMap = {};
+		this.componentIdMap = {};
 	}
 
 	getFunctionMap() {
@@ -117,31 +135,34 @@ export class FunctionCenter {
 
 	/**
 	 *
-	 * 删除的组件需要删除动态注册的函数
-	 * @param {string} name
-	 * @memberof FunctionCenter
-	 */
-	deleteFunc(name: string) {
-		delete this.funcitonMap[name];
-		delete this.configMap[name];
-		delete this.nameMap[name];
-	}
-
-	/**
 	 *
-	 *注册函数，同id覆盖，返回删除函数
+	 * @param {{
-	 * @param {string} id 唯一值 注意！每个组件都要不一样，所以需要带着每个组件的id，这样也方便区分是哪个组件抛出的函数!!
+	 * 		id: string;唯一值 注意！每个组件都要不一样，所以需要带着每个组件的id，这样也方便区分是哪个组件抛出的函数!!
-	 * @param {FunctionCenterFunction} fn 函数体
+	 * 		fn: FunctionCenterFunction;函数体
-	 * @param {FunctionConfigType} config 配置项
+	 * 		config: FunctionConfigType;配置项
-	 * @param {string} name 显示名
+	 * 		name: string;显示名
-	 * @return {*}
+	 * 		componentId: string;所属组件id名用于卸载函数
+	 * 	}} obj
+	 * @returns
 	 * @memberof FunctionCenter
 	 */
-	register(id: string, fn: FunctionCenterFunction, config: FunctionConfigType, name: string) {
+	register(obj: {
+		id: string;
+		fn: FunctionCenterFunction;
+		config: FunctionConfigType;
+		name: string;
+		componentId: string;
+	}) {
+		const { id, fn, config, name, componentId } = obj;
 		// 注册时，需要通知asyncmap已经拿到
 		this.funcitonMap[id] = fn;
 		this.configMap[id] = config;
 		this.nameMap[id] = name;
+		if (this.componentIdMap[componentId]) {
+			this.componentIdMap[componentId].add(id);
+		} else {
+			this.componentIdMap[componentId] = new Set([id]);
+		}
 		if (this.asyncMap[id]) {
 			this.asyncMap[id]();
 		}
@@ -149,12 +170,60 @@ export class FunctionCenter {
 			delete this.funcitonMap[id];
 			delete this.configMap[id];
 			delete this.nameMap[id];
+			this.componentIdMap[componentId].delete(id);
 		};
 	}
 
 	/**
 	 *
-	 * 获取函数，包含异步获取函数
+	 * 画布更新时检查所有组件，不存在的组件和其挂载函数则删除，剔除_inner下的
+	 * @memberof FunctionCenter
+	 */
+	syncFunction(store: Store) {
+		const special = specialFnList;
+		const allId: string[] = [];
+		const data = store.getData();
+		// modalmap上
+		const map = data.modalMap;
+		Object.keys(map).forEach((v) => {
+			map[v].forEach((k) => {
+				allId.push(k.id);
+			});
+		});
+		// block上
+		data.block.forEach((v) => {
+			allId.push(v.id);
+		});
+		if (store.isEdit()) {
+			// 额外origin上
+			if (data.origin)
+				data.origin?.forEach((v) => {
+					allId.push(v.id);
+				});
+		}
+		const needDelete: string[] = [];
+		Object.keys(this.componentIdMap).forEach((v) => {
+			if (!special.includes(v)) {
+				if (!allId.includes(v)) {
+					needDelete.push(v);
+				}
+			}
+		});
+
+		needDelete.forEach((v) => {
+			const ids = this.componentIdMap[v];
+			ids.forEach((id) => {
+				delete this.funcitonMap[id];
+				delete this.configMap[id];
+				delete this.nameMap[id];
+			});
+			delete this.componentIdMap[v];
+		});
+	}
+
+	/**
+	 *
+	 * 获取函数，包含异步获取函数 注意某些情况执行顺序
 	 * @param {string} name
 	 * @return {*}  {Promise<FunctionCenterFunction>}
 	 * @memberof FunctionCenter

packages/dooringx-lib/src/core/store/createModal.ts

@@ -0,0 +1,39 @@
+/*
+ * @Author: yehuozhili
+ * @Date: 2022-04-23 17:03:36
+ * @LastEditors: yehuozhili
+ * @LastEditTime: 2022-04-23 17:03:37
+ * @FilePath: \dooringx\packages\dooringx-lib\src\core\store\createModal.ts
+ */
+import { createUid } from '../utils';
+import { IStoreData } from './storetype';
+
+export function createDefaultModalBlock(): IStoreData['block'] {
+	return [
+		{
+			id: createUid('modal-mask'),
+			name: 'modalMask',
+			top: 0,
+			left: 0,
+			width: '100%',
+			height: '100%',
+			zIndex: 0,
+			props: {},
+			resize: true,
+			focus: false,
+			canSee: true,
+			position: 'absolute',
+			display: 'block',
+			syncList: [],
+			canDrag: false,
+			eventMap: {},
+			functionList: [],
+			animate: [],
+			fixed: true,
+			rotate: {
+				value: 0,
+				canRotate: false,
+			},
+		},
+	];
+}

packages/dooringx-lib/src/core/store/index.ts

@@ -2,11 +2,12 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 04:29:09
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-05 17:08:35
+ * @LastEditTime: 2022-04-23 18:53:36
  * @FilePath: \dooringx\packages\dooringx-lib\src\core\store\index.ts
  */
-import { IStoreData } from './storetype';
+import deepcopy from 'deepcopy';
-import { storeChangerState } from '../storeChanger/state';
+import { createDefaultModalBlock } from './createModal';
+import { IBlockType, IStoreData } from './storetype';
 
 export const initialData: IStoreData = {
 	container: {
@@ -18,6 +19,8 @@ export const initialData: IStoreData = {
 	dataSource: {},
 	globalState: {},
 	modalConfig: {},
+	origin: null,
+	modalEditName: '',
 };
 
 class Store {
@@ -43,6 +46,190 @@ class Store {
 	getIndex() {
 		return this.current;
 	}
+	getOriginBlock() {
+		if (this.isEdit()) {
+			return this.getData().origin as IBlockType[];
+		} else {
+			return this.getData().block;
+		}
+	}
+
+	/**
+	 *
+	 * 编辑状态转普通
+	 * @param {IStoreData} data
+	 * @returns
+	 * @memberof Store
+	 */
+	changeModaltoNormal(data: IStoreData) {
+		if (data.modalEditName === '') {
+			return;
+		}
+		const tmp = data.origin || [];
+		data.modalMap = { ...data.modalMap, [data.modalEditName]: data.block };
+		data.block = tmp;
+		data.modalEditName = '';
+		data.origin = null;
+		return {};
+	}
+	/**
+	 *
+	 * 非编辑转编辑且已有弹窗
+	 * @param {IStoreData} data
+	 * @returns
+	 * @memberof Store
+	 */
+	changeNormalToModal(data: IStoreData, name: string) {
+		if (data.modalEditName !== '') {
+			return {
+				success: false,
+				sign: 0,
+			};
+		}
+		const sign2 = this.isInModalMap(name);
+		if (!sign2) {
+			return {
+				success: false,
+				sign: 1,
+				param: name,
+			};
+		}
+		const tmp = data.block || [];
+		const modalBlock = data.modalMap[name];
+		data.block = modalBlock;
+		data.modalEditName = name;
+		data.origin = tmp;
+		return { success: true, sign: -1 };
+	}
+	/**
+	 *
+	 * 非编辑状态新增
+	 * @param {IStoreData} data
+	 * @returns
+	 * @memberof Store
+	 */
+	newModaltoNormal(data: IStoreData, name: string) {
+		if (data.modalEditName !== '') {
+			return;
+		}
+		const tmp = data.block || [];
+		const modalBlock = createDefaultModalBlock();
+		data.modalMap = { ...data.modalMap, [name]: modalBlock };
+		data.block = modalBlock;
+		data.modalEditName = name;
+		data.origin = tmp;
+	}
+
+	/**
+	 *
+	 * 判断是否编辑
+	 * @returns
+	 * @memberof Store
+	 */
+	isEdit() {
+		if (this.getData().modalEditName !== '') {
+			return true;
+		}
+		return false;
+	}
+
+	/**
+	 *
+	 *  判断有没有这个弹窗
+	 * @param {Store} store
+	 * @param {string} name
+	 * @returns
+	 * @memberof Store
+	 */
+	isInModalMap(name: string) {
+		const modalNameList = Object.keys(this.getData().modalMap);
+		if (modalNameList.includes(name)) {
+			return true;
+		}
+		return false;
+	}
+
+	/**
+	 *
+	 * 保存现阶段store，将store替换为新modal数据
+	 */
+	newModalMap(name: string) {
+		const sign = this.isEdit();
+		if (sign) {
+			return {
+				succeess: false,
+				sign: 0,
+			};
+		}
+		//新建modal name不能重名，否则直接报错
+		const sign2 = this.isInModalMap(name);
+		if (sign2) {
+			return {
+				succeess: false,
+				sign: 1,
+				param: name,
+			};
+		}
+		const copyData = deepcopy(this.getData());
+		this.newModaltoNormal(copyData, name);
+		this.setData(copyData);
+		return {
+			succeess: true,
+			sign: -1,
+		};
+	}
+
+	/**
+	 *
+	 * 存储modal到主store的map中，切换主store
+	 * @memberof StoreChanger
+	 */
+	closeModal() {
+		const sign = this.isEdit();
+		if (!sign) {
+			return {
+				success: false,
+				sign: 0,
+			};
+		}
+		const data = deepcopy(this.getData());
+		this.changeModaltoNormal(data);
+		this.setData(data);
+		return {
+			success: true,
+			sign: 0,
+		};
+	}
+	/**
+	 *
+	 * 删除弹窗，不能处于编辑弹窗状态
+	 * @param {string} name
+	 * @returns
+	 */
+	removeModal(name: string) {
+		const sign = this.isEdit();
+		if (sign) {
+			return {
+				success: false,
+				sign: 0,
+			};
+		}
+		const sign2 = this.isInModalMap(name);
+		if (!sign2) {
+			return {
+				success: false,
+				sign: 1,
+				param: name,
+			};
+		}
+		const cloneData: IStoreData = deepcopy(this.getData());
+		delete cloneData.modalMap[name];
+		this.setData(cloneData);
+		return {
+			success: true,
+			sign: -1,
+		};
+	}
 	/**
 	 *
 	 * 重置需要注册事件
@@ -53,9 +240,10 @@ class Store {
 	resetToInitData(initData: IStoreData[], check = false) {
 		this.storeDataList = initData;
 		this.current = 0;
+		const d = this.getData();
 		//如果是编辑模式，需要修改
-		if (storeChangerState.modalEditName !== '' && check) {
+		if (d.modalEditName !== '' && check) {
-			storeChangerState.modalEditName = '';
+			this.changeModaltoNormal(d);
 		}
 		this.emit();
 	}
@@ -71,8 +259,9 @@ class Store {
 		this.storeDataList = initData;
 		this.current = current;
 		//如果是编辑模式，需要修改
-		if (storeChangerState.modalEditName !== '' && check) {
+		const d = this.getData();
-			storeChangerState.modalEditName = '';
+		if (d.modalEditName !== '' && check) {
+			this.changeModaltoNormal(d);
 		}
 		this.emit();
 	}

packages/dooringx-lib/src/core/store/storetype.ts

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 04:29:09
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-08-09 11:30:52
+ * @LastEditTime: 2022-04-23 17:07:19
  * @FilePath: \dooringx\packages\dooringx-lib\src\core\store\storetype.ts
  */
 
@@ -23,10 +23,12 @@ export interface IStoreData {
 		height: number;
 	};
 	block: Array<IBlockType>;
-	modalMap: Record<string, IStoreData>;
+	modalMap: Record<string, Array<IBlockType>>;
 	dataSource: Record<string, any>;
 	globalState: Record<string, any>;
 	modalConfig: Record<string, any>;
+	modalEditName: string;
+	origin: Array<IBlockType> | null;
 }
 export interface IMainStoreData extends IStoreData {
 	globalState: GlobalState;

packages/dooringx-lib/src/core/storeChanger/index.ts

@@ -1,267 +0,0 @@
-/*
- * @Author: yehuozhili
- * @Date: 2021-04-05 14:55:31
- * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-05 17:02:34
- * @FilePath: \dooringx\packages\dooringx-lib\src\core\storeChanger\index.ts
- */
-
-import Store from '../store';
-import { IStoreData } from '../store/storetype';
-import { createUid, deepCopy } from '../utils';
-import { storeChangerState } from './state';
-
-export type StoreChangerMap = Record<
-	'ORIGIN',
-	{
-		data: Array<IStoreData>;
-		current: number;
-		now: IStoreData;
-	} | null
->;
-
-function createDefaultModalBlock(): IStoreData['block'] {
-	return [
-		{
-			id: createUid('modal-mask'),
-			name: 'modalMask',
-			top: 0,
-			left: 0,
-			width: '100%',
-			height: '100%',
-			zIndex: 0,
-			props: {},
-			resize: true,
-			focus: false,
-			canSee: true,
-			position: 'absolute',
-			display: 'block',
-			syncList: [],
-			canDrag: false,
-			eventMap: {},
-			functionList: [],
-			animate: [],
-			fixed: true,
-			rotate: {
-				value: 0,
-				canRotate: false,
-			},
-		},
-	];
-}
-
-// 用来存储主store
-const ORIGIN = 'ORIGIN';
-
-const defaultModalStore: () => IStoreData = () => {
-	const newblock = createDefaultModalBlock();
-	return {
-		container: {
-			width: 375,
-			height: 600,
-		},
-		block: newblock,
-		modalMap: {},
-		dataSource: {},
-		globalState: {},
-		modalConfig: {},
-	};
-};
-
-export class StoreChanger {
-	public map: StoreChangerMap;
-	constructor() {
-		this.map = { ORIGIN: null };
-	}
-
-	getState() {
-		return storeChangerState;
-	}
-
-	getOrigin() {
-		return this.map[ORIGIN];
-	}
-
-	/**
-	 *  判断是否在编辑模式。
-	 *  一次也没进行编辑时，storeChanger中未存store，所以只能判断去获取。
-	 * @return {*}
-	 * @memberof StoreChanger
-	 */
-	isEdit() {
-		if (storeChangerState.modalEditName !== '') {
-			return true;
-		}
-		return false;
-	}
-
-	isInModalMap(store: Store, name: string) {
-		const modalNameList = Object.keys(store.getData().modalMap);
-		if (modalNameList.includes(name)) {
-			return true;
-		}
-		return false;
-	}
-
-	initStoreChanger() {
-		storeChangerState.modalEditName = '';
-		this.map = { ORIGIN: null };
-	}
-
-	/**
-	 *
-	 * 更新origin内容，用于编辑模式下更新全局属性
-	 * 需要判断是否在编辑模式,否则会报错
-	 * @memberof StoreChanger
-	 */
-	updateOrigin(data: IStoreData) {
-		const origin = this.getOrigin();
-		if (origin!.data.length === origin!.current + 1) {
-			//说明为末尾，
-			origin!.data.push(data);
-		} else {
-			//替换下一个索引
-			origin!.data[origin!.current + 1] = data;
-		}
-		origin!.now = data;
-		origin!.current = origin!.current + 1;
-	}
-
-	/**
-	 *
-	 * 保存现阶段store，将store替换为新modal数据
-	 * @memberof StoreChanger
-	 */
-	newModalMap(store: Store, name: string) {
-		const sign = this.isEdit();
-		if (sign) {
-			return {
-				succeess: false,
-				sign: 0,
-			};
-		}
-		//新建modal name不能重名，否则直接报错
-		const sign2 = this.isInModalMap(store, name);
-		if (sign2) {
-			return {
-				succeess: false,
-				sign: 1,
-				param: name,
-			};
-		}
-		storeChangerState.modalEditName = name;
-		this.map[ORIGIN] = {
-			data: store.getStoreList(),
-			current: store.getIndex(),
-			now: store.getStoreList()[store.getIndex()],
-		};
-		store.resetToInitData([defaultModalStore()]);
-		return {
-			succeess: true,
-			sign: -1,
-		};
-	}
-
-	/**
-	 *
-	 * 存储modal到主store的map中，切换主store
-	 * @param {Store} store
-	 * @memberof StoreChanger
-	 */
-	closeModal(store: Store) {
-		const sign = this.isEdit();
-		if (!sign) {
-			return {
-				success: false,
-				sign: 0,
-			};
-		}
-		const main = this.map[ORIGIN];
-		const tmpModalData = deepCopy(store.getData());
-		if (main) {
-			store.resetToCustomData(main.data, main.current);
-			const cloneData: IStoreData = deepCopy(store.getData());
-			cloneData.modalMap[storeChangerState.modalEditName] = tmpModalData;
-			store.setData(cloneData);
-			storeChangerState.modalEditName = '';
-			return {
-				success: true,
-				sign: 0,
-			};
-		}
-		return {
-			success: false,
-			sign: 1,
-		};
-	}
-
-	/**
-	 *
-	 * 在已经保存的map中获取，如果正在编辑别的弹窗，则报错。
-	 * @param {Store} store store必须为主store
-	 * @param {string} name
-	 * @memberof StoreChanger
-	 */
-	updateModal(store: Store, name: string) {
-		const sign = this.isEdit();
-		if (sign) {
-			return {
-				success: false,
-				sign: 0,
-			};
-		}
-		const sign2 = this.isInModalMap(store, name);
-		if (!sign2) {
-			return {
-				success: false,
-				sign: 1,
-				param: name,
-			};
-		}
-		storeChangerState.modalEditName = name;
-		const modalData = store.getData().modalMap[name];
-		this.map[ORIGIN] = {
-			data: store.getStoreList(),
-			current: store.getIndex(),
-			now: store.getStoreList()[store.getIndex()],
-		};
-		store.resetToInitData([modalData]);
-		return {
-			success: true,
-			sign: -1,
-		};
-	}
-
-	/**
-	 *
-	 * 删除弹窗，不能处于编辑弹窗状态
-	 * @param {Store} store
-	 * @param {string} name
-	 * @returns
-	 * @memberof StoreChanger
-	 */
-	removeModal(store: Store, name: string) {
-		const sign = this.isEdit();
-		if (sign) {
-			return {
-				success: false,
-				sign: 0,
-			};
-		}
-		const sign2 = this.isInModalMap(store, name);
-		if (!sign2) {
-			return {
-				success: false,
-				sign: 1,
-				param: name,
-			};
-		}
-		const cloneData: IStoreData = deepCopy(store.getData());
-		delete cloneData.modalMap[name];
-		store.setData(cloneData);
-		return {
-			success: true,
-			sign: -1,
-		};
-	}
-}

packages/dooringx-lib/src/core/storeChanger/state.ts

@@ -1,11 +0,0 @@
-/*
- * @Author: yehuozhili
- * @Date: 2021-04-05 15:40:04
- * @LastEditors: yehuozhili
- * @LastEditTime: 2021-04-05 15:40:47
- * @FilePath: \dooringv2\src\core\storeChanger\state.ts
- */
-
-export const storeChangerState = {
-	modalEditName: '',
-};

packages/dooringx-lib/src/core/utils/index.ts

@@ -8,7 +8,7 @@ import deepCopys from 'deepcopy';
 import { FunctionDataMap } from '../functionCenter/config';
 import UserConfig from '../../config';
 
-export function deepCopy<T = any>(obj: any): T {
+export function deepCopy<T = any>(obj: T): T {
 	return deepCopys(obj);
 }
 

packages/dooringx-lib/src/core/utils/special.ts

@@ -1 +1,9 @@
+/*
+ * @Author: yehuozhili
+ * @Date: 2021-07-09 00:05:51
+ * @LastEditors: yehuozhili
+ * @LastEditTime: 2022-04-23 23:01:25
+ * @FilePath: \dooringx\packages\dooringx-lib\src\core\utils\special.ts
+ */
 export const specialCoList = ['modalMask'];
+export const specialFnList = ['_inner'];

packages/dooringx-lib/src/hooks/index.ts

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 05:35:15
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-04 20:13:58
+ * @LastEditTime: 2022-04-23 23:34:15
  * @FilePath: \dooringx\packages\dooringx-lib\src\hooks\index.ts
  */
 import { useEffect, useMemo, useState } from 'react';
@@ -23,7 +23,8 @@ export function useStoreState(
 		const unRegister = store.subscribe(() => {
 			const data = store.getData();
 			setState(data);
-			config.getEventCenter().syncEventMap(store.getData(), config.getStoreChanger());
+			config.getEventCenter().syncEventMap(store.getData(), config.getStore());
+			config.getEventCenter().getFunctionCenter().syncFunction(store);
 			extraFn();
 		});
 		store.setForceUpdate(() => forceUpdate((v) => v + 1));
@@ -124,11 +125,8 @@ export function useIframePostMessage(
 			const data = {
 				store: store.getData(),
 				scaleState: config.getScaleState(),
-				origin: config.getStoreChanger().getOrigin(),
-				isEdit: config.getStoreChanger().isEdit(),
 				wrapperState: config.getWrapperMove().iframe,
 			};
-
 			postMessage(data, origin, target);
 		};
 	}, [config, origin, store, target]);

packages/dooringx-lib/src/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 04:22:18
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-04-09 21:49:01
+ * @LastEditTime: 2022-04-23 23:02:04
  * @FilePath: \dooringx\packages\dooringx-lib\src\index.tsx
  */
 
@@ -58,7 +58,7 @@ export { defaultStore } from './config';
 export { focusState } from './core/focusHandler/state';
 //utils
 export { deepCopy, rgba2Obj, swap, createUid, arrayMove, postMessage } from './core/utils';
-export { specialCoList } from './core/utils/special';
+export { specialCoList, specialFnList } from './core/utils/special';
 // iframe
 export { default as IframeContainer } from './components/iframeContainer';
 export { default as IframeContainerWrapper } from './components/IframeWrapperMove';

packages/dooringx-lib/src/locale/en.ts

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-08-27 10:20:23
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-01-21 10:56:25
+ * @LastEditTime: 2022-04-23 18:58:39
  * @FilePath: \dooringx\packages\dooringx-lib\src\locale\en.ts
  */
 
@@ -30,6 +30,7 @@ export const en: typeof zhCN = {
 	'modal.popup.name': 'Please enter modal name',
 	'modal.name': 'Modal name',
 	'modal.control.remove': 'Delete click to delete the effect of the modal',
+	edit: 'Edit',
 	yes: 'Ok',
 	no: 'Cancel',
 	'right.noprops': 'No properties have been configured',

packages/dooringx-lib/src/locale/zh-CN.ts

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-08-27 10:20:15
  * @LastEditors: yehuozhili
- * @LastEditTime: 2022-01-21 10:55:56
+ * @LastEditTime: 2022-04-23 18:58:26
  * @FilePath: \dooringx\packages\dooringx-lib\src\locale\zh-CN.ts
  */
 export const zhCN = {
@@ -27,6 +27,7 @@ export const zhCN = {
 	'modal.popup.name': '请输入弹窗名称',
 	'modal.name': '弹窗名称',
 	'modal.control.remove': '取消点击删除弹窗',
+	edit: '编辑',
 	yes: '确定',
 	no: '取消',
 	'right.noprops': '还没有配置属性',