github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2026-01-15 18:58:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat:😈 history undo-redo功能完成

Browse Source
This commit is contained in:
荣彬 2020-08-02 08:52:58 +08:00
parent 9d8a7306a6
commit 59292259a6
3 changed files with 35 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/plugin-undo-redo/package.json
View File

@ -24,6 +24,7 @@
"@ali/lowcode-editor-skeleton": "^0.8.33", "@ali/lowcode-editor-skeleton": "^0.8.33",
"@ali/lowcode-types": "^0.8.11", "@ali/lowcode-types": "^0.8.11",
"@ali/lowcode-utils": "^0.8.12", "@ali/lowcode-utils": "^0.8.12",
"@ali/ve-icons": "^4.1.14",
"react": "^16.8.1", "react": "^16.8.1",
"react-dom": "^16.8.1" "react-dom": "^16.8.1"
}, },

8
packages/plugin-undo-redo/src/index.scss
View File

@ -0,0 +1,8 @@
.lowcode-plugin-undo-redo{
.next-btn-ghost.next-btn-dark{
color: #3c3c3c;
}
.next-btn-ghost.next-btn-dark[disabled]{
color: #ccc;
}
}

30
packages/plugin-undo-redo/src/index.tsx
View File

@ -1,10 +1,12 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import './index.scss';
import { Editor, Title } from '@ali/lowcode-editor-core'; import { Editor, Title } from '@ali/lowcode-editor-core';
import { TopIcon } from '@ali/lowcode-editor-skeleton'; import Icon from '@ali/ve-icons';
import { Button } from '@alifd/next';
import { Designer } from '@ali/lowcode-designer'; import { Designer } from '@ali/lowcode-designer';
import { PluginProps } from '@ali/lowcode-types'; import { PluginProps } from '@ali/lowcode-types';
import './index.scss';
export interface IProps extends PluginProps { export interface IProps extends PluginProps {
editor: Editor; editor: Editor;
logo?: string; logo?: string;
@ -78,8 +80,28 @@ export default class UndoRedo extends PureComponent<IProps, IState> {
const { undoEnable, redoEnable } = this.state; const { undoEnable, redoEnable } = this.state;
return ( return (
<div className="lowcode-plugin-undo-redo"> <div className="lowcode-plugin-undo-redo">
<TopIcon icon="houtui" title="后退" disabled={!undoEnable} onClick={this.handleUndoClick} /> <Button
<TopIcon icon="qianjin" title="前进" disabled={!redoEnable} onClick={this.handleRedoClick} /> size="18px"
data-tip="撤销"
data-dir="bottom"
className="ve-local-history-item"
onClick={this.handleUndoClick}
ghost
disabled={!undoEnable}
>
<Icon name="amindUndo" size="18px" />
</Button>
<Button
size="18px"
data-tip="恢复"
data-dir="bottom"
className="ve-local-history-item"
onClick={this.handleRedoClick}
ghost
disabled={!redoEnable}
>
<Icon name="forward" size="18px" />
</Button>
</div> </div>
); );
} }