脚本管理增加强制打开文件操作

This commit is contained in:
whyour
2025-03-16 17:57:13 +08:00
parent cf94ecfb11
commit 576408de01
14 changed files with 347 additions and 130 deletions
-15
View File
@@ -202,9 +202,6 @@ const CronDetailModal = ({
.catch((e) => reject(e));
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -232,9 +229,6 @@ const CronDetailModal = ({
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -259,9 +253,6 @@ const CronDetailModal = ({
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -298,9 +289,6 @@ const CronDetailModal = ({
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -337,9 +325,6 @@ const CronDetailModal = ({
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
+2 -23
View File
@@ -20,7 +20,7 @@ import {
PushpinOutlined,
SettingOutlined,
StopOutlined,
UnorderedListOutlined
UnorderedListOutlined,
} from '@ant-design/icons';
import { PageContainer } from '@ant-design/pro-layout';
import { history, useOutletContext } from '@umijs/max';
@@ -36,7 +36,7 @@ import {
TablePaginationConfig,
Tabs,
Tag,
Typography
Typography,
} from 'antd';
import { ColumnProps } from 'antd/lib/table';
import { FilterValue, SorterResult } from 'antd/lib/table/interface';
@@ -453,9 +453,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -488,9 +485,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -524,9 +518,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -569,9 +560,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -614,9 +602,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -738,9 +723,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -766,9 +748,6 @@ const Crontab = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
+1 -4
View File
@@ -85,7 +85,7 @@ const ViewManageModal = ({
title: intl.get('名称'),
dataIndex: 'name',
key: 'name',
render: (v) => (v === '全部任务' ? intl.get('全部任务') : v)
render: (v) => (v === '全部任务' ? intl.get('全部任务') : v),
},
{
title: intl.get('类型'),
@@ -162,9 +162,6 @@ const ViewManageModal = ({
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
-15
View File
@@ -315,9 +315,6 @@ const Dependence = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -342,9 +339,6 @@ const Dependence = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -367,9 +361,6 @@ const Dependence = () => {
getDependencies();
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -419,9 +410,6 @@ const Dependence = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -439,9 +427,6 @@ const Dependence = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
-12
View File
@@ -292,9 +292,6 @@ const Env = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -337,9 +334,6 @@ const Env = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -456,9 +450,6 @@ const Env = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -484,9 +475,6 @@ const Env = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
-3
View File
@@ -175,9 +175,6 @@ const Log = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -0,0 +1,67 @@
.container {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: var(--background-color);
padding: 16px;
}
.content {
text-align: center;
background: var(--card-background);
padding: 24px;
border-radius: 12px;
max-width: 360px;
width: 100%;
transition: all 0.3s ease;
}
.iconWrapper {
display: inline-flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
border-radius: 50%;
background: var(--background-color);
margin-bottom: 16px;
}
.icon {
font-size: 32px;
color: var(--text-color-secondary);
}
.message {
font-size: 16px;
color: var(--text-color);
margin-bottom: 16px;
font-weight: 500;
line-height: 1.5;
}
.actionArea {
width: 100%;
}
.button {
min-width: 140px;
height: 36px;
font-size: 14px;
}
.warning {
font-size: 13px;
color: var(--text-color-secondary);
line-height: 1.5;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
}
.warningIcon {
font-size: 14px;
color: #faad14;
}
@@ -0,0 +1,41 @@
import React from 'react';
import { Button, Space } from 'antd';
import { FileUnknownOutlined, WarningOutlined } from '@ant-design/icons';
import intl from 'react-intl-universal';
import styles from './index.module.less';
interface UnsupportedFilePreviewProps {
onForceOpen: () => void;
}
const UnsupportedFilePreview: React.FC<UnsupportedFilePreviewProps> = ({
onForceOpen,
}) => {
return (
<div className={styles.container}>
<div className={styles.content}>
<div className={styles.iconWrapper}>
<FileUnknownOutlined className={styles.icon} />
</div>
<div className={styles.message}>
{intl.get('当前文件不支持预览')}
</div>
<Space direction="vertical" size={8} className={styles.actionArea}>
<Button
type="primary"
onClick={onForceOpen}
className={styles.button}
>
{intl.get('强制打开')}
</Button>
<div className={styles.warning}>
<WarningOutlined className={styles.warningIcon} />
{intl.get('强制打开可能会导致编辑器显示异常')}
</div>
</Space>
</div>
</div>
);
};
export default UnsupportedFilePreview;
+63 -36
View File
@@ -43,6 +43,7 @@ import EditModal from './editModal';
import EditScriptNameModal from './editNameModal';
import styles from './index.module.less';
import RenameModal from './renameModal';
import UnsupportedFilePreview from './components/UnsupportedFilePreview';
const { Text } = Typography;
const Script = () => {
@@ -63,6 +64,7 @@ const Script = () => {
useState(false);
const [currentNode, setCurrentNode] = useState<any>();
const [expandedKeys, setExpandedKeys] = useState<string[]>([]);
const [showMonaco, setShowMonaco] = useState(true);
const handleIsEditing = (filename: string, value: boolean) => {
setIsEditing(value && canPreviewInMonaco(filename));
@@ -82,7 +84,7 @@ const Script = () => {
.finally(() => needLoading && setLoading(false));
};
const getDetail = (node: any) => {
const getDetail = (node: any, options: any = {}) => {
request
.get(
`${config.apiPrefix}scripts/detail?file=${encodeURIComponent(
@@ -92,6 +94,9 @@ const Script = () => {
.then(({ code, data }) => {
if (code === 200) {
setValue(data);
if (options.callback) {
options.callback();
}
}
});
};
@@ -126,7 +131,7 @@ const Script = () => {
if (item) {
obj.node = item;
setExpandedKeys([p as string]);
onTreeSelect([vkey], obj);
onSelect([vkey], obj);
}
}
};
@@ -141,18 +146,27 @@ const Script = () => {
if (node.type === 'directory') {
setValue(intl.get('请选择脚本文件'));
setShowMonaco(true);
return;
}
if (!canPreviewInMonaco(node.title)) {
setValue(intl.get('当前文件不支持预览'));
setShowMonaco(false);
return;
}
setShowMonaco(true);
const newMode = getEditorMode(value);
setMode(isPhone && newMode === 'typescript' ? 'javascript' : newMode);
setValue(intl.get('加载中...'));
getDetail(node);
getDetail(node, {
callback: () => {
if (isEditing) {
setIsEditing(true);
}
},
});
};
const onTreeSelect = useCallback(
@@ -161,20 +175,20 @@ const Script = () => {
if (node.key === select && isEditing) {
return;
}
const content = editorRef.current
const currentContent = editorRef.current
? editorRef.current.getValue().replace(/\r\n/g, '\n')
: value;
if (content !== value) {
const originalContent = value.replace(/\r\n/g, '\n');
if (currentContent !== originalContent && isEditing) {
Modal.confirm({
title: `确认离开`,
content: <>{intl.get('当前修改未保存,确离开吗')}</>,
title: intl.get('确认离开'),
content: <>{intl.get('当前文件未保存,确离开吗')}</>,
onOk() {
onSelect(keys[0], e.node);
handleIsEditing(e.node.title, false);
},
onCancel() {
console.log('Cancel');
},
});
} else {
handleIsEditing(e.node.title, false);
@@ -268,9 +282,6 @@ const Script = () => {
.catch((e) => reject(e));
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -320,9 +331,6 @@ const Script = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -493,7 +501,7 @@ const Script = () => {
label: intl.get('编辑'),
key: 'edit',
icon: <EditOutlined />,
disabled: !currentNode || !canPreviewInMonaco(currentNode?.title),
disabled: !currentNode,
},
{
label: intl.get('重命名'),
@@ -514,6 +522,20 @@ const Script = () => {
},
};
const handleForceOpen = () => {
if (!currentNode) return;
setMode('plaintext');
setValue(intl.get('加载中...'));
setShowMonaco(true);
getDetail(currentNode, {
callback: () => {
setIsEditing(true);
},
});
};
return (
<PageContainer
className="ql-container-wrapper log-wrapper"
@@ -575,9 +597,7 @@ const Script = () => {
</Tooltip>,
<Tooltip title={intl.get('编辑')}>
<Button
disabled={
!currentNode || !canPreviewInMonaco(currentNode?.title)
}
disabled={!currentNode}
type="primary"
onClick={editFile}
icon={<EditOutlined />}
@@ -666,21 +686,28 @@ const Script = () => {
</div>
)}
</div>
<Editor
language={mode}
value={value}
theme={theme}
options={{
readOnly: !isEditing,
fontSize: 12,
lineNumbersMinChars: 3,
glyphMargin: false,
accessibilitySupport: 'off',
}}
onMount={(editor) => {
editorRef.current = editor;
}}
/>
{showMonaco ? (
<Editor
language={mode}
value={value}
theme={theme}
options={{
readOnly: !isEditing,
fontSize: 12,
lineNumbersMinChars: 3,
glyphMargin: false,
accessibilitySupport: 'off',
}}
onMount={(editor) => {
editorRef.current = editor;
}}
/>
) : (
<UnsupportedFilePreview
filename={currentNode?.title || ''}
onForceOpen={handleForceOpen}
/>
)}
</SplitPane>
)}
{isPhone && (
-6
View File
@@ -181,9 +181,6 @@ const Setting = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -213,9 +210,6 @@ const Setting = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
-12
View File
@@ -266,9 +266,6 @@ const Subscription = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -302,9 +299,6 @@ const Subscription = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -370,9 +364,6 @@ const Subscription = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};
@@ -415,9 +406,6 @@ const Subscription = () => {
}
});
},
onCancel() {
console.log('Cancel');
},
});
};