From 2f5e9469794e3f7ed5877e55e0438b008afa5c45 Mon Sep 17 00:00:00 2001
From: whyour <imwhyour@gmail.com>
Date: Tue, 23 Nov 2021 23:36:43 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=B0=83=E8=AF=95=E8=BF=90?=
 =?UTF-8?q?=E8=A1=8C=E6=97=B6=E6=96=87=E4=BB=B6=E8=B7=AF=E5=BE=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 back/api/script.ts             | 22 +++++++++-------
 src/layouts/index.tsx          | 18 +++++++------
 src/pages/script/editModal.tsx | 48 +++++++++++++++++++++-------------
 src/pages/script/index.tsx     |  6 ++---
 4 files changed, 55 insertions(+), 39 deletions(-)

diff --git a/back/api/script.ts b/back/api/script.ts
index 75f85f8a..0fdc5654 100644
--- a/back/api/script.ts
+++ b/back/api/script.ts
@@ -9,7 +9,7 @@ import { Logger } from 'winston';
 import config from '../config';
 import * as fs from 'fs';
 import { celebrate, Joi } from 'celebrate';
-import path from 'path';
+import path, { join } from 'path';
 import ScriptService from '../services/script';
 const route = Router();
 
@@ -44,7 +44,7 @@ export default (app: Router) => {
                 children.push({
                   title: childFile,
                   value: childFile,
-                  key: `${fileOrDir}-${childFile}`,
+                  key: `${fileOrDir}/${childFile}`,
                   mtime: statObj.mtimeMs,
                   parent: fileOrDir,
                 });
@@ -84,10 +84,12 @@ export default (app: Router) => {
     async (req: Request, res: Response, next: NextFunction) => {
       const logger: Logger = Container.get('logger');
       try {
-        const path = req.query.path ? `${req.query.path}/` : '';
-        const content = getFileContentByName(
-          `${config.scriptPath}${path}${req.params.file}`,
+        const filePath = join(
+          config.scriptPath,
+          req.query.path as string,
+          req.params.file,
         );
+        const content = getFileContentByName(filePath);
         res.send({ code: 200, data: content });
       } catch (e) {
         logger.error('🔥 error: %o', e);
@@ -101,7 +103,7 @@ export default (app: Router) => {
     celebrate({
       body: Joi.object({
         filename: Joi.string().required(),
-        path: Joi.string().allow(''),
+        path: Joi.string().optional().allow(''),
         content: Joi.string().allow(''),
         originFilename: Joi.string().allow(''),
       }),
@@ -161,7 +163,7 @@ export default (app: Router) => {
     celebrate({
       body: Joi.object({
         filename: Joi.string().required(),
-        path: Joi.string().allow(''),
+        path: Joi.string().optional().allow(''),
         content: Joi.string().required(),
       }),
     }),
@@ -173,7 +175,7 @@ export default (app: Router) => {
           content: string;
           path: string;
         };
-        const filePath = `${config.scriptPath}${path}/${filename}`;
+        const filePath = join(config.scriptPath, path, filename);
         fs.writeFileSync(filePath, content);
         return res.send({ code: 200 });
       } catch (e) {
@@ -198,7 +200,7 @@ export default (app: Router) => {
           filename: string;
           path: string;
         };
-        const filePath = `${config.scriptPath}${path}/${filename}`;
+        const filePath = join(config.scriptPath, path, filename);
         fs.unlinkSync(filePath);
         res.send({ code: 200 });
       } catch (e) {
@@ -254,7 +256,7 @@ export default (app: Router) => {
           filename: string;
           path: string;
         };
-        const filePath = `${path}/${filename}`;
+        const filePath = join(path, filename);
         const scriptService = Container.get(ScriptService);
         const result = await scriptService.runScript(filePath);
         res.send(result);
diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx
index 8baa5123..e69dbaf2 100644
--- a/src/layouts/index.tsx
+++ b/src/layouts/index.tsx
@@ -275,14 +275,16 @@ export default function (props: any) {
       }}
       onCollapse={setCollapsed}
       collapsed={collapsed}
-      rightContentRender={() => (
-        <Dropdown overlay={menu} trigger={['click']}>
-          <span className="side-menu-user-wrapper">
-            <Avatar shape="square" size="small" icon={<UserOutlined />} />
-            <span style={{ marginLeft: 5 }}>admin</span>
-          </span>
-        </Dropdown>
-      )}
+      rightContentRender={() =>
+        ctx.isPhone && (
+          <Dropdown overlay={menu} trigger={['click']}>
+            <span className="side-menu-user-wrapper">
+              <Avatar shape="square" size="small" icon={<UserOutlined />} />
+              <span style={{ marginLeft: 5 }}>admin</span>
+            </span>
+          </Dropdown>
+        )
+      }
       collapsedButtonRender={(collapsed) => (
         <span
           className="side-menu-container"
diff --git a/src/pages/script/editModal.tsx b/src/pages/script/editModal.tsx
index 1ee1c1d1..487825ba 100644
--- a/src/pages/script/editModal.tsx
+++ b/src/pages/script/editModal.tsx
@@ -24,22 +24,22 @@ const prefixMap: any = {
 
 const EditModal = ({
   treeData,
-  currentFile,
+  currentNode,
   content,
   handleCancel,
   visible,
   socketMessage,
 }: {
   treeData?: any;
-  currentFile?: string;
   content?: string;
   visible: boolean;
   socketMessage: any;
+  currentNode: any;
   handleCancel: () => void;
 }) => {
   const [value, setValue] = useState('');
   const [language, setLanguage] = useState<string>('javascript');
-  const [fileName, setFileName] = useState<string>('');
+  const [cNode, setCNode] = useState<any>();
   const [selectedKey, setSelectedKey] = useState<string>('');
   const [saveModalVisible, setSaveModalVisible] = useState<boolean>(false);
   const [settingModalVisible, setSettingModalVisible] =
@@ -53,28 +53,31 @@ const EditModal = ({
   };
 
   const onSelect = (value: any, node: any) => {
-    if (node.value === fileName || !value) {
+    if (node.key === selectedKey || !value) {
       return;
     }
     const newMode = LangMap[value.slice(-3)] || '';
-    setFileName(value);
+    setCNode(node);
     setLanguage(newMode);
     getDetail(node);
     setSelectedKey(node.key);
   };
 
   const getDetail = (node: any) => {
-    request.get(`${config.apiPrefix}scripts/${node.value}`).then((data) => {
-      setValue(data.data);
-    });
+    request
+      .get(`${config.apiPrefix}scripts/${node.value}?path=${node.parent || ''}`)
+      .then((data) => {
+        setValue(data.data);
+      });
   };
 
   const run = () => {
+    setLog('');
     request
       .put(`${config.apiPrefix}scripts/run`, {
         data: {
-          filename: fileName,
-          path: '',
+          filename: cNode.value,
+          path: cNode.parent || '',
         },
       })
       .then((data) => {});
@@ -98,21 +101,21 @@ const EditModal = ({
   }, [socketMessage]);
 
   useEffect(() => {
-    if (currentFile) {
-      setFileName(currentFile);
+    if (currentNode) {
+      setCNode(currentNode);
       setValue(content as string);
-      setSelectedKey(currentFile);
+      setSelectedKey(currentNode.key);
     }
-  }, [currentFile, content]);
+  }, [content, currentNode]);
 
   return (
     <Drawer
       className="edit-modal"
+      closable={false}
       title={
         <>
-          <span style={{ marginRight: 8 }}>{fileName}</span>
           <TreeSelect
-            style={{ marginRight: 8, width: 120 }}
+            style={{ marginRight: 8, width: 150 }}
             value={selectedKey}
             dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
             treeData={treeData}
@@ -122,7 +125,7 @@ const EditModal = ({
           />
           <Select
             value={language}
-            style={{ width: 120, marginRight: 8 }}
+            style={{ width: 110, marginRight: 8 }}
             onChange={(e) => {
               setLanguage(e);
             }}
@@ -162,6 +165,15 @@ const EditModal = ({
           >
             保存
           </Button>
+          <Button
+            type="primary"
+            style={{ marginRight: 8 }}
+            onClick={() => {
+              handleCancel();
+            }}
+          >
+            退出
+          </Button>
         </>
       }
       width={'100%'}
@@ -197,7 +209,7 @@ const EditModal = ({
           content:
             editorRef.current &&
             editorRef.current.getValue().replace(/\r\n/g, '\n'),
-          filename: fileName,
+          filename: cNode?.value,
         }}
       />
       <SettingModal
diff --git a/src/pages/script/index.tsx b/src/pages/script/index.tsx
index 4eca1f9e..9e600aec 100644
--- a/src/pages/script/index.tsx
+++ b/src/pages/script/index.tsx
@@ -116,12 +116,12 @@ const Script = ({ headerStyle, isPhone, theme, socketMessage }: any) => {
         node: {
           title: s,
           value: s,
-          key: p ? `${p}-${s}` : s,
+          key: p ? `${p}/${s}` : s,
           parent: p,
         },
       };
       setExpandedKeys([p]);
-      onTreeSelect([`${p}-${s}`], obj);
+      onTreeSelect([`${p}/${s}`], obj);
     }
   };
 
@@ -525,7 +525,7 @@ const Script = ({ headerStyle, isPhone, theme, socketMessage }: any) => {
         <EditModal
           visible={isLogModalVisible}
           treeData={data}
-          currentFile={select}
+          currentNode={currentNode}
           content={value}
           socketMessage={socketMessage}
           handleCancel={() => {