脚本管理移动端支持添加脚本、编辑脚本

src/pages/crontab/index.tsx

@@ -273,7 +273,7 @@ const Crontab = ({ headerStyle, isPhone }: any) => {
       title: '操作',
       key: 'action',
       align: 'center' as const,
-      width: 90,
+      width: 100,
       render: (text: string, record: any, index: number) => {
         const isPc = !isPhone;
         return (
@@ -518,7 +518,7 @@ const Crontab = ({ headerStyle, isPhone }: any) => {
     });
   };
 
-  const pinOrunPinCron = (record: any, index: number) => {
+  const pinOrUnPinCron = (record: any, index: number) => {
     Modal.confirm({
       title: `确认${record.isPinned === 1 ? '取消置顶' : '置顶'}`,
       content: (
@@ -575,7 +575,7 @@ const Crontab = ({ headerStyle, isPhone }: any) => {
             编辑
           </Menu.Item>
           <Menu.Item
-            key="enableordisable"
+            key="enableOrDisable"
             icon={
               record.isDisabled === 1 ? (
                 <CheckCircleOutlined />
@@ -590,7 +590,7 @@ const Crontab = ({ headerStyle, isPhone }: any) => {
             删除
           </Menu.Item>
           <Menu.Item
-            key="pinOrunPin"
+            key="pinOrUnPin"
             icon={
               record.isPinned === 1 ? <StopOutlined /> : <PushpinOutlined />
             }
@@ -611,14 +611,14 @@ const Crontab = ({ headerStyle, isPhone }: any) => {
       case 'edit':
         editCron(record, index);
         break;
-      case 'enableordisable':
+      case 'enableOrDisable':
         enabledOrDisabledCron(record, index);
         break;
       case 'delete':
         delCron(record, index);
         break;
-      case 'pinOrunPin':
+      case 'pinOrUnPin':
-        pinOrunPinCron(record, index);
+        pinOrUnPinCron(record, index);
         break;
       default:
         break;

src/pages/env/index.tsx

@@ -166,11 +166,12 @@ const Env = ({ headerStyle, isPhone, theme }: any) => {
     {
       title: '操作',
       key: 'action',
+      width: 100,
       align: 'center' as const,
       render: (text: string, record: any, index: number) => {
         const isPc = !isPhone;
         return (
-          <Space size="middle" style={{ paddingLeft: 8 }}>
+          <Space size="middle">
             <Tooltip title={isPc ? '编辑' : ''}>
               <a onClick={() => editEnv(record, index)}>
                 <EditOutlined />

src/pages/script/index.tsx

@@ -8,6 +8,8 @@ import {
   message,
   Typography,
   Tooltip,
+  Dropdown,
+  Menu,
 } from 'antd';
 import config from '@/utils/config';
 import { PageContainer } from '@ant-design/pro-layout';
@@ -21,10 +23,12 @@ import {
   DeleteOutlined,
   DownloadOutlined,
   EditOutlined,
+  EllipsisOutlined,
   FormOutlined,
   PlusOutlined,
   PlusSquareOutlined,
   SearchOutlined,
+  UserOutlined,
 } from '@ant-design/icons';
 import EditScriptNameModal from './editNameModal';
 
@@ -65,6 +69,7 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
   const [isEditing, setIsEditing] = useState(false);
   const editorRef = useRef<any>(null);
   const [isAddFileModalVisible, setIsAddFileModalVisible] = useState(false);
+  const [dropdownIsVisible, setDropdownIsVisible] = useState(false);
 
   const getScripts = () => {
     setLoading(true);
@@ -133,7 +138,9 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
   );
 
   const editFile = () => {
+    setTimeout(() => {
       setIsEditing(true);
+    }, 300);
   };
 
   const cancelEdit = () => {
@@ -234,6 +241,7 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
       newData.unshift(_file);
       setData(newData);
       onSelect(_file.value, _file);
+      setIsEditing(true);
     }
     setIsAddFileModalVisible(false);
   };
@@ -273,6 +281,29 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
     }
   }, []);
 
+  const menu = isEditing ? (
+    <Menu>
+      <Menu.Item key="save" icon={<PlusOutlined />} onClick={saveFile}>
+        保存
+      </Menu.Item>
+      <Menu.Item key="exit" icon={<EditOutlined />} onClick={cancelEdit}>
+        退出编辑
+      </Menu.Item>
+    </Menu>
+  ) : (
+    <Menu>
+      <Menu.Item key="add" icon={<PlusOutlined />} onClick={addFile}>
+        添加
+      </Menu.Item>
+      <Menu.Item key="edit" icon={<EditOutlined />} onClick={editFile}>
+        编辑
+      </Menu.Item>
+      <Menu.Item key="delete" icon={<DeleteOutlined />} onClick={deleteFile}>
+        删除
+      </Menu.Item>
+    </Menu>
+  );
+
   return (
     <PageContainer
       className="ql-container-wrapper log-wrapper"
@@ -291,9 +322,13 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
                 key="value"
                 onSelect={onSelect}
               />,
-              <Button type="primary" onClick={deleteFile}>
+              <Dropdown
-                删除
+                overlay={menu}
-              </Button>,
+                trigger={['click']}
+                onVisibleChange={(visible) => setDropdownIsVisible(visible)}
+              >
+                <Button type="primary" icon={<EllipsisOutlined />} />
+              </Dropdown>,
             ]
           : isEditing
           ? [
@@ -326,9 +361,6 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
                   icon={<DeleteOutlined />}
                 />
               </Tooltip>,
-              // <Tooltip title="下载">
-              //   <Button type="primary" onClick={downloadFile} icon={<DownloadOutlined />} />
-              // </Tooltip>,
               <Button
                 type="primary"
                 onClick={() => {
@@ -389,7 +421,7 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
               styleActiveLine: true,
               matchBrackets: true,
               mode,
-              readOnly: true,
+              readOnly: !isEditing,
             }}
             onBeforeChange={(editor, data, value) => {
               setValue(value);