From da47fb43364d46f0571850d349e47f0a4296d9a8 Mon Sep 17 00:00:00 2001 From: smallstonesk <575913857@qq.com> Date: Tue, 19 Jan 2021 00:51:24 +0800 Subject: [PATCH] feat: add running code status --- .../src/components/codeRun/index.module.less | 14 +++++------ .../core/src/components/codeRun/index.tsx | 23 +++++++++++++------ 2 files changed, 23 insertions(+), 14 deletions(-) diff --git a/packages/core/src/components/codeRun/index.module.less b/packages/core/src/components/codeRun/index.module.less index 9b4b5c0..6b489be 100644 --- a/packages/core/src/components/codeRun/index.module.less +++ b/packages/core/src/components/codeRun/index.module.less @@ -1,19 +1,19 @@ .container { - position: relative; display: flex; flex-direction: column; flex: 1; height: 100%; - .runWrapper { - position: absolute; - top: 0; - right: 0; - } - .pane { + position: relative; display: flex; flex: 1; + + .runWrapper { + position: absolute; + top: 0; + right: 0; + } } } diff --git a/packages/core/src/components/codeRun/index.tsx b/packages/core/src/components/codeRun/index.tsx index e124283..a03d9d8 100644 --- a/packages/core/src/components/codeRun/index.tsx +++ b/packages/core/src/components/codeRun/index.tsx @@ -12,7 +12,7 @@ import Console from '../console'; import InputPanel from './inputPanel'; import JsonView from 'react-json-view'; import { executeScript } from '../../utils'; -import { PlayCircleFilled } from '@ant-design/icons'; +import { PlayCircleFilled, LoadingOutlined } from '@ant-design/icons'; import { compileForOnline } from '@imove/compile-code'; import { toSelectedCellsJSON } from '../../utils/flowChartUtils'; @@ -53,12 +53,14 @@ interface ICodeRunProps { const CodeRun: React.FC = (props) => { const {flowChart} = props; + const [isRunning, setIsRunning] = useState(false); const [input, setInput] = useState(defaultInput); const [output, setOutput] = useState({}); useEffect(() => { // NOTE: listen the event that iMove online exec ends const handler = (data: any) => { + setIsRunning(false); setOutput(data.detail || {}); }; window.addEventListener('iMoveOnlineExecEnds', handler); @@ -68,6 +70,7 @@ const CodeRun: React.FC = (props) => { }, []); const onClickRun = useCallback(() => { + setIsRunning(true); const selectedCelssJson = toSelectedCellsJSON(flowChart); const compiledCode = compileForOnline(selectedCelssJson, input); executeScript(compiledCode); @@ -79,15 +82,21 @@ const CodeRun: React.FC = (props) => { return (
-
- -
+
+ {isRunning ? ( + + ) : ( + + )} +
= (props) => {
- +