From 2e6ca5419dba35b7d4849ae689ce293a9b6b85fe Mon Sep 17 00:00:00 2001
From: whyour <imwhyour@gmail.com>
Date: Thu, 23 Dec 2021 23:25:39 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E8=AF=95=E8=84=9A=E6=9C=AC=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E5=81=9C=E6=AD=A2=EF=BC=8C=E4=BF=AE=E5=A4=8D=E8=B0=83?=
 =?UTF-8?q?=E8=AF=95=E4=BA=A4=E4=BA=92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 back/api/script.ts             | 26 ++++++++++++++++++++
 back/services/cron.ts          |  2 +-
 back/services/script.ts        | 26 +++++++++++++++++---
 src/pages/script/editModal.tsx | 45 ++++++++++++++++++++++++++++------
 4 files changed, 87 insertions(+), 12 deletions(-)

diff --git a/back/api/script.ts b/back/api/script.ts
index bd2805bf..619404da 100644
--- a/back/api/script.ts
+++ b/back/api/script.ts
@@ -266,4 +266,30 @@ export default (app: Router) => {
       }
     },
   );
+
+  route.put(
+    '/stop',
+    celebrate({
+      body: Joi.object({
+        filename: Joi.string().required(),
+        path: Joi.string().optional().allow(''),
+      }),
+    }),
+    async (req: Request, res: Response, next: NextFunction) => {
+      const logger: Logger = Container.get('logger');
+      try {
+        let { filename, path } = req.body as {
+          filename: string;
+          path: string;
+        };
+        const filePath = join(path, filename);
+        const scriptService = Container.get(ScriptService);
+        const result = await scriptService.stopScript(filePath);
+        res.send(result);
+      } catch (e) {
+        logger.error('🔥 error: %o', e);
+        return next(e);
+      }
+    },
+  );
 };
diff --git a/back/services/cron.ts b/back/services/cron.ts
index f9d49f61..a1da0adc 100644
--- a/back/services/cron.ts
+++ b/back/services/cron.ts
@@ -241,7 +241,7 @@ export default class CronService {
     });
   }
 
-  private async killTask(name: string) {
+  public async killTask(name: string) {
     let taskCommand = `ps -ef | grep "${name}" | grep -v grep | awk '{print $1}'`;
     const execAsync = promisify(exec);
     try {
diff --git a/back/services/script.ts b/back/services/script.ts
index 5d1f3cfa..c44d7530 100644
--- a/back/services/script.ts
+++ b/back/services/script.ts
@@ -2,21 +2,19 @@ import { Service, Inject } from 'typedi';
 import winston from 'winston';
 import { spawn } from 'child_process';
 import SockService from './sock';
+import CronService from './cron';
 
 @Service()
 export default class ScriptService {
   constructor(
     @Inject('logger') private logger: winston.Logger,
     private sockService: SockService,
+    private cronService: CronService,
   ) {}
 
   public async runScript(path: string) {
     const cp = spawn(`task -l ${path} now`, { shell: '/bin/bash' });
 
-    this.sockService.sendMessage({
-      type: 'manuallyRunScript',
-      message: `开始执行脚本`,
-    });
     cp.stdout.on('data', (data) => {
       this.sockService.sendMessage({
         type: 'manuallyRunScript',
@@ -38,6 +36,26 @@ export default class ScriptService {
       });
     });
 
+    cp.on('close', (err) => {
+      this.sockService.sendMessage({
+        type: 'manuallyRunScript',
+        message: `执行结束`,
+      });
+    });
+
+    return { code: 200 };
+  }
+
+  public async stopScript(path: string) {
+    const err = await this.cronService.killTask(`task -l ${path} now`);
+    const str = err ? `\n${err}` : '';
+    this.sockService.sendMessage({
+      type: 'manuallyRunScript',
+      message: `${str}\n## 执行结束...  ${new Date()
+        .toLocaleString('zh', { hour12: false })
+        .replace(' 24:', ' 00:')} `,
+    });
+
     return { code: 200 };
   }
 }
diff --git a/src/pages/script/editModal.tsx b/src/pages/script/editModal.tsx
index 487825ba..f5ca8494 100644
--- a/src/pages/script/editModal.tsx
+++ b/src/pages/script/editModal.tsx
@@ -47,6 +47,7 @@ const EditModal = ({
   const [log, setLog] = useState<string>('');
   const { theme } = useTheme();
   const editorRef = useRef<any>(null);
+  const [isRunning, setIsRunning] = useState(false);
 
   const cancel = () => {
     handleCancel();
@@ -80,7 +81,22 @@ const EditModal = ({
           path: cNode.parent || '',
         },
       })
-      .then((data) => {});
+      .then((data) => {
+        setIsRunning(true);
+      });
+  };
+
+  const stop = () => {
+    request
+      .put(`${config.apiPrefix}scripts/stop`, {
+        data: {
+          filename: cNode.value,
+          path: cNode.parent || '',
+        },
+      })
+      .then((data) => {
+        setIsRunning(false);
+      });
   };
 
   useEffect(() => {
@@ -94,6 +110,13 @@ const EditModal = ({
       return;
     }
 
+    if (_message === '执行结束') {
+      _message = '';
+      setTimeout(() => {
+        setIsRunning(false);
+      }, 300);
+    }
+
     if (log) {
       _message = `\n${_message}`;
     }
@@ -135,8 +158,12 @@ const EditModal = ({
             <Option value="shell">shell</Option>
             <Option value="python">python</Option>
           </Select>
-          <Button type="primary" style={{ marginRight: 8 }} onClick={run}>
-            运行
+          <Button
+            type="primary"
+            style={{ marginRight: 8 }}
+            onClick={isRunning ? stop : run}
+          >
+            {isRunning ? '停止' : '运行'}
           </Button>
           <Button
             type="primary"
@@ -169,6 +196,7 @@ const EditModal = ({
             type="primary"
             style={{ marginRight: 8 }}
             onClick={() => {
+              stop();
               handleCancel();
             }}
           >
@@ -181,7 +209,12 @@ const EditModal = ({
       onClose={cancel}
       visible={visible}
     >
-      <SplitPane split="vertical" minSize={200} defaultSize="50%">
+      <SplitPane
+        split="vertical"
+        minSize={200}
+        defaultSize="50%"
+        style={{ height: 'calc(100vh - 55px)' }}
+      >
         <Editor
           language={language}
           value={value}
@@ -196,9 +229,7 @@ const EditModal = ({
             editorRef.current = editor;
           }}
         />
-        <div>
-          <pre>{log}</pre>
-        </div>
+        <pre style={{ height: '100%', whiteSpace: 'break-spaces' }}>{log}</pre>
       </SplitPane>
       <SaveModal
         visible={saveModalVisible}