mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2025-12-14 21:12:53 +00:00
redo&undo ok
This commit is contained in:
parent
4a673068ee
commit
07a681511d
@ -115,6 +115,7 @@ export default class Designer {
|
||||
selectionDispose();
|
||||
selectionDispose = undefined;
|
||||
}
|
||||
this.postEvent('selection-change', this.currentSelection);
|
||||
if (this.currentSelection) {
|
||||
const currentSelection = this.currentSelection;
|
||||
selectionDispose = currentSelection.onSelectionChange(() => {
|
||||
@ -128,6 +129,7 @@ export default class Designer {
|
||||
historyDispose();
|
||||
historyDispose = undefined;
|
||||
}
|
||||
this.postEvent('history-change', this.currentHistory);
|
||||
if (this.currentHistory) {
|
||||
const currentHistory = this.currentHistory;
|
||||
historyDispose = currentHistory.onStateChange(() => {
|
||||
@ -144,6 +146,8 @@ export default class Designer {
|
||||
});
|
||||
setupSelection();
|
||||
setupHistory();
|
||||
|
||||
this.postEvent('designer.ready', this);
|
||||
}
|
||||
|
||||
postEvent(event: string, ...args: any[]) {
|
||||
|
||||
@ -87,7 +87,7 @@ export class Selection {
|
||||
* 移除选中
|
||||
*/
|
||||
remove(id: string) {
|
||||
let i = this._selected.indexOf(id);
|
||||
const i = this._selected.indexOf(id);
|
||||
if (i > -1) {
|
||||
this._selected.splice(i, 1);
|
||||
this.emitter.emit('selectionchange', this._selected);
|
||||
@ -154,7 +154,7 @@ export class Selection {
|
||||
}
|
||||
|
||||
onSelectionChange(fn: () => void): () => void {
|
||||
this.emitter.addListener('selectionchange', fn);
|
||||
this.emitter.on('selectionchange', fn);
|
||||
return () => {
|
||||
this.emitter.removeListener('selectionchange', fn);
|
||||
};
|
||||
|
||||
@ -26,21 +26,18 @@ export function setSerialization(serializion: Serialization) {
|
||||
export default class History {
|
||||
private session: Session;
|
||||
private records: Session[];
|
||||
private point: number = 0;
|
||||
private point = 0;
|
||||
private emitter = new EventEmitter();
|
||||
private obx: Reaction;
|
||||
private justWokeup: boolean = false;
|
||||
private justWokeup = false;
|
||||
|
||||
constructor(
|
||||
logger: () => any,
|
||||
private redoer: (data: NodeSchema) => void,
|
||||
private timeGap: number = 1000,
|
||||
) {
|
||||
constructor(logger: () => any, private redoer: (data: NodeSchema) => void, private timeGap: number = 1000) {
|
||||
this.session = new Session(0, null, this.timeGap);
|
||||
this.records = [this.session];
|
||||
|
||||
this.obx = autorun(() => {
|
||||
const data = logger();
|
||||
// TODO: remove this line
|
||||
console.info('log');
|
||||
if (this.justWokeup) {
|
||||
this.justWokeup = false;
|
||||
@ -49,6 +46,7 @@ export default class History {
|
||||
untracked(() => {
|
||||
const log = currentSerializion.serialize(data);
|
||||
if (this.session.cursor === 0 && this.session.isActive()) {
|
||||
// first log
|
||||
this.session.log(log);
|
||||
this.session.end();
|
||||
} else if (this.session) {
|
||||
@ -56,10 +54,15 @@ export default class History {
|
||||
this.session.log(log);
|
||||
} else {
|
||||
this.session.end();
|
||||
const lastState = this.getState();
|
||||
const cursor = this.session.cursor + 1;
|
||||
const session = new Session(cursor, log, this.timeGap);
|
||||
this.session = session;
|
||||
this.records.splice(cursor, this.records.length - cursor, session);
|
||||
const currentState = this.getState();
|
||||
if (currentState !== lastState) {
|
||||
this.emitter.emit('statechange', currentState);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -335,6 +335,12 @@ export default {
|
||||
handleResourceDragStart: function(ev, tagName, schema) {
|
||||
// 物料面板中组件snippet的dragStart回调
|
||||
// ev: 原始的domEvent;tagName: 组件的描述文案;schema: snippet的schema
|
||||
if (editor.designer) {
|
||||
editor.designer.dragon.boost({
|
||||
type: 'nodedata',
|
||||
data: schema
|
||||
}, ev.nativeEvent);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -4,6 +4,7 @@ import { PluginProps } from '../../framework/definitions';
|
||||
import TopIcon from '../../skeleton/components/TopIcon/index';
|
||||
|
||||
export interface IProps {
|
||||
editor: any;
|
||||
logo?: string;
|
||||
}
|
||||
|
||||
@ -26,7 +27,7 @@ export default class UndoRedo extends PureComponent<IProps & PluginProps, IState
|
||||
if (props.editor.designer) {
|
||||
this.init();
|
||||
} else {
|
||||
props.editor.on('designer.ready', (): void => {
|
||||
props.editor.on('designer.ready', () => {
|
||||
this.init();
|
||||
});
|
||||
}
|
||||
@ -34,17 +35,17 @@ export default class UndoRedo extends PureComponent<IProps & PluginProps, IState
|
||||
|
||||
init = (): void => {
|
||||
const { editor } = this.props;
|
||||
this.history = editor.designer.currentHistory;
|
||||
this.updateState(this.history.getState());
|
||||
|
||||
this.history = editor.designer?.currentHistory;
|
||||
this.updateState(this.history?.getState() || 0);
|
||||
|
||||
editor.on('designer.history-change', (history): void => {
|
||||
this.history = history;
|
||||
this.history.onStateChange(this.updateState);
|
||||
this.updateState(this.history?.getState() || 0);
|
||||
});
|
||||
this.history.onStateChange(this.updateState);
|
||||
};
|
||||
|
||||
updateState = (state: number): void => {
|
||||
console.log('++++', !!(state & 1), !!(state & 2));
|
||||
this.setState({
|
||||
undoEnable: !!(state & 1),
|
||||
redoEnable: !!(state & 2)
|
||||
@ -52,15 +53,11 @@ export default class UndoRedo extends PureComponent<IProps & PluginProps, IState
|
||||
};
|
||||
|
||||
handleUndoClick = (): void => {
|
||||
if (this.history) {
|
||||
this.history.back();
|
||||
}
|
||||
this.history?.back();
|
||||
};
|
||||
|
||||
handleRedoClick = (): void => {
|
||||
if (this.history) {
|
||||
this.history.forward();
|
||||
}
|
||||
this.history?.forward();
|
||||
};
|
||||
|
||||
render(): React.ReactNode {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user