|
|
|
|
@ -7,6 +7,7 @@ import { useSelector, useDispatch } from 'react-redux';
|
|
|
|
|
const ButtonGroup = Button.Group;
|
|
|
|
|
|
|
|
|
|
interface ActionBarProps {
|
|
|
|
|
useDefault: boolean;
|
|
|
|
|
onSave?: () => void;
|
|
|
|
|
onUndo?: () => void;
|
|
|
|
|
onRedo?: () => void;
|
|
|
|
|
@ -17,6 +18,7 @@ interface ActionBarProps {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const ActionBar: React.FC<ActionBarProps> = ({
|
|
|
|
|
useDefault,
|
|
|
|
|
onSave,
|
|
|
|
|
onUndo,
|
|
|
|
|
onRedo,
|
|
|
|
|
@ -39,50 +41,54 @@ const ActionBar: React.FC<ActionBarProps> = ({
|
|
|
|
|
return (
|
|
|
|
|
<div className="action-bar">
|
|
|
|
|
<Button onClick={onSave} type="primary" shape="round" icon={<IconSave />}>保存</Button>
|
|
|
|
|
<ButtonGroup style={{ marginLeft: 8 }}>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconPlayArrow />}
|
|
|
|
|
onClick={() => handleRun()}
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
status={isRunning ? 'danger' : undefined}
|
|
|
|
|
>
|
|
|
|
|
{isRunning ? '停止' : '运行'}
|
|
|
|
|
</Button>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconCodeSquare />}
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
onClick={() => changeLogBarStatus()}
|
|
|
|
|
>
|
|
|
|
|
日志
|
|
|
|
|
</Button>
|
|
|
|
|
</ButtonGroup>
|
|
|
|
|
<ButtonGroup style={{ marginLeft: 15 }}>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconUndo />}
|
|
|
|
|
onClick={onUndo}
|
|
|
|
|
disabled={!canUndo}
|
|
|
|
|
status='danger'
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
>
|
|
|
|
|
撤销
|
|
|
|
|
</Button>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconRedo />}
|
|
|
|
|
onClick={onRedo}
|
|
|
|
|
disabled={!canRedo}
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
>
|
|
|
|
|
重做
|
|
|
|
|
</Button>
|
|
|
|
|
</ButtonGroup>
|
|
|
|
|
{useDefault && (
|
|
|
|
|
<>
|
|
|
|
|
<ButtonGroup style={{ marginLeft: 8 }}>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconPlayArrow />}
|
|
|
|
|
onClick={() => handleRun()}
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
status={isRunning ? 'danger' : undefined}
|
|
|
|
|
>
|
|
|
|
|
{isRunning ? '停止' : '运行'}
|
|
|
|
|
</Button>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconCodeSquare />}
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
onClick={() => changeLogBarStatus()}
|
|
|
|
|
>
|
|
|
|
|
日志
|
|
|
|
|
</Button>
|
|
|
|
|
</ButtonGroup>
|
|
|
|
|
<ButtonGroup style={{ marginLeft: 15 }}>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconUndo />}
|
|
|
|
|
onClick={onUndo}
|
|
|
|
|
disabled={!canUndo}
|
|
|
|
|
status="danger"
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
>
|
|
|
|
|
撤销
|
|
|
|
|
</Button>
|
|
|
|
|
<Button
|
|
|
|
|
type="outline"
|
|
|
|
|
shape="round"
|
|
|
|
|
icon={<IconRedo />}
|
|
|
|
|
onClick={onRedo}
|
|
|
|
|
disabled={!canRedo}
|
|
|
|
|
style={{ padding: '0 8px', backgroundColor: '#fff' }}
|
|
|
|
|
>
|
|
|
|
|
重做
|
|
|
|
|
</Button>
|
|
|
|
|
</ButtonGroup>
|
|
|
|
|
</>
|
|
|
|
|
)}
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|