修复antd兼容性，日志详情自动滚动

src/pages/crontab/index.tsx

@@ -14,6 +14,7 @@ import {
   Popover,
   Tabs,
   TablePaginationConfig,
+  MenuProps,
 } from 'antd';
 import {
   ClockCircleOutlined,
@@ -684,15 +685,13 @@ const Crontab = () => {
       arrow={{ pointAtCenter: true }}
       placement="bottomRight"
       trigger={['click']}
-      overlay={
-        <Menu
-          items={getMenuItems(record)}
-          onClick={({ key, domEvent }) => {
-            domEvent.stopPropagation();
-            action(key, record, index);
-          }}
-        />
-      }
+      menu={{
+        items: getMenuItems(record),
+        onClick: ({ key, domEvent }) => {
+          domEvent.stopPropagation();
+          action(key, record, index);
+        },
+      }}
     >
       <a onClick={(e) => e.stopPropagation()}>
         <EllipsisOutlined />
@@ -889,41 +888,39 @@ const Crontab = () => {
     }
   };
 
-  const menu = (
-    <Menu
-      onClick={({ key, domEvent }) => {
-        domEvent.stopPropagation();
-        viewAction(key);
-      }}
-      items={[
-        ...[...enabledCronViews].slice(4).map((x) => ({
-          label: (
-            <Space style={{ display: 'flex', justifyContent: 'space-between' }}>
-              <span>{x.name}</span>
-              {viewConf?.id === x.id && (
-                <CheckOutlined style={{ color: '#1890ff' }} />
-              )}
-            </Space>
-          ),
-          key: x.id,
-          icon: <UnorderedListOutlined />,
-        })),
-        {
-          type: 'divider',
-        },
-        {
-          label: '新建视图',
-          key: 'new',
-          icon: <PlusOutlined />,
-        },
-        {
-          label: '视图管理',
-          key: 'manage',
-          icon: <SettingOutlined />,
-        },
-      ]}
-    />
-  );
+  const menu: MenuProps = {
+    onClick: ({ key, domEvent }) => {
+      domEvent.stopPropagation();
+      viewAction(key);
+    },
+    items: [
+      ...[...enabledCronViews].slice(4).map((x) => ({
+        label: (
+          <Space style={{ display: 'flex', justifyContent: 'space-between' }}>
+            <span>{x.name}</span>
+            {viewConf?.id === x.id && (
+              <CheckOutlined style={{ color: '#1890ff' }} />
+            )}
+          </Space>
+        ),
+        key: x.id,
+        icon: <UnorderedListOutlined />,
+      })),
+      {
+        type: 'divider' as 'group',
+      },
+      {
+        label: '新建视图',
+        key: 'new',
+        icon: <PlusOutlined />,
+      },
+      {
+        label: '视图管理',
+        key: 'manage',
+        icon: <SettingOutlined />,
+      },
+    ],
+  };
 
   const getCronViews = () => {
     setLoading(true);
@@ -975,7 +972,7 @@ const Crontab = () => {
         className={`crontab-view ${moreMenuActive ? 'more-active' : ''}`}
         tabBarExtraContent={
           <Dropdown
-            overlay={menu}
+            menu={menu}
             trigger={['click']}
             overlayStyle={{ minWidth: 200 }}
           >

src/pages/crontab/logModal.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { Modal, message, Input, Form, Statistic, Button } from 'antd';
 import { request } from '@/utils/http';
 import config from '@/utils/config';
@@ -34,7 +34,6 @@ const CronLogModal = ({
   const [loading, setLoading] = useState<any>(true);
   const [executing, setExecuting] = useState<any>(true);
   const [isPhone, setIsPhone] = useState(false);
-  const [theme, setTheme] = useState<string>('');
 
   const getCronLog = (isFirst?: boolean) => {
     if (isFirst) {
@@ -49,10 +48,14 @@ const CronLogModal = ({
         ) {
           const log = data as string;
           setValue(log || '暂无日志');
-          setExecuting(
-            log && !logEnded(log) && !log.includes('重启面板'),
-          );
-          if (log && !logEnded(log) && !log.includes('重启面板')) {
+          const hasNext = log && !logEnded(log) && !log.includes('重启面板');
+          setExecuting(hasNext);
+          setTimeout(() => {
+            document
+              .querySelector('#log-flag')!
+              .scrollIntoView({ behavior: 'smooth' });
+          });
+          if (hasNext) {
             setTimeout(() => {
               getCronLog();
             }, 2000);
@@ -155,6 +158,7 @@ const CronLogModal = ({
           {value}
         </pre>
       )}
+      <div id="log-flag"></div>
     </Modal>
   );
 };