diff --git a/src/pages/crontab/index.less b/src/pages/crontab/index.less index c33e54f8..b7ae00af 100644 --- a/src/pages/crontab/index.less +++ b/src/pages/crontab/index.less @@ -1,3 +1,11 @@ .ant-table-pagination.ant-pagination { margin-bottom: 0 !important; } + +tr { + td:nth-child(2) { + span { + cursor: pointer; + } + } +} diff --git a/src/pages/crontab/index.tsx b/src/pages/crontab/index.tsx index 4ff5ceb1..63c0ab63 100644 --- a/src/pages/crontab/index.tsx +++ b/src/pages/crontab/index.tsx @@ -35,6 +35,7 @@ import CronLogModal from './logModal'; import cron_parser from 'cron-parser'; import { diffTime } from '@/utils/date'; import { getTableScroll } from '@/utils/index'; +import { history } from 'umi'; import './index.less'; const { Text } = Typography; @@ -76,7 +77,11 @@ const Crontab = ({ headerStyle, isPhone }: any) => { width: 150, align: 'center' as const, render: (text: string, record: any) => ( - + { + goToScriptManager(record); + }} + > {record.name || record._id}{' '} {record.isPinned ? ( @@ -329,6 +334,20 @@ const Crontab = ({ headerStyle, isPhone }: any) => { const [pageSize, setPageSize] = useState(20); const [tableScrollHeight, setTableScrollHeight] = useState(); + const goToScriptManager = (record: any) => { + const cmd = record.command.split(' '); + if (cmd[0] === 'task') { + let [p, s] = cmd[1].split('/'); + if (!s) { + s = p; + p = ''; + } + history.push(`/script?p=${p}&s=${s}`); + } else if (cmd[1] === 'repo') { + location.href = cmd[2]; + } + }; + const getCrons = () => { setLoading(true); request diff --git a/src/pages/script/index.tsx b/src/pages/script/index.tsx index b71b91a6..db1e8d4b 100644 --- a/src/pages/script/index.tsx +++ b/src/pages/script/index.tsx @@ -31,6 +31,8 @@ import { UserOutlined, } from '@ant-design/icons'; import EditScriptNameModal from './editNameModal'; +import debounce from 'lodash/debounce'; +import { history } from 'umi'; const { Text } = Typography; @@ -95,7 +97,10 @@ const Script = ({ headerStyle, isPhone, theme }: any) => { setData(data.data); setFilterData(data.data); }) - .finally(() => setLoading(false)); + .finally(() => { + setLoading(false); + initGetScript(); + }); }; const getDetail = (node: any) => { @@ -106,6 +111,22 @@ const Script = ({ headerStyle, isPhone, theme }: any) => { }); }; + const initGetScript = () => { + const { p, s } = history.location.query as any; + if (s) { + const obj = { + node: { + title: s, + value: s, + key: p ? `${p}-${s}` : s, + parent: p, + }, + }; + setExpandedKeys([p]); + onTreeSelect([`${p}-${s}`], obj); + } + }; + const onSelect = (value: any, node: any) => { if (node.key === select || !value) { return; @@ -119,6 +140,10 @@ const Script = ({ headerStyle, isPhone, theme }: any) => { getDetail(node); }; + const onExpand = (expKeys: any) => { + setExpandedKeys(expKeys); + }; + const onTreeSelect = useCallback( (keys: Key[], e: any) => { const content = editorRef.current @@ -147,6 +172,13 @@ const Script = ({ headerStyle, isPhone, theme }: any) => { const onSearch = useCallback( (e) => { const keyword = e.target.value; + debounceSearch(keyword); + }, + [data, setFilterData], + ); + + const debounceSearch = useCallback( + debounce((keyword) => { setSearchValue(keyword); const { tree, expandedKeys } = getFilterData( keyword.toLocaleLowerCase(), @@ -154,7 +186,7 @@ const Script = ({ headerStyle, isPhone, theme }: any) => { ); setExpandedKeys(expandedKeys); setFilterData(tree); - }, + }, 300), [data, setFilterData], ); @@ -451,6 +483,8 @@ const Script = ({ headerStyle, isPhone, theme }: any) => { showIcon={true} height={height} selectedKeys={[select]} + expandedKeys={expandedKeys} + onExpand={onExpand} showLine={{ showLeafIcon: true }} onSelect={onTreeSelect} >