chore: deploy model from local path

src/components/icon-font/index.tsx

@@ -1,7 +1,7 @@
 import { createFromIconfontCN } from '@ant-design/icons';
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: '//at.alicdn.com/t/c/font_4613488_l9554igzbh.js'
+  scriptUrl: '//at.alicdn.com/t/c/font_4613488_flbkvujyhg4.js'
 });
 
 export default IconFont;

src/components/logs-viewer/config.ts

@@ -1,2 +1,4 @@
 export const controlSeqRegex = /\x1b\[(\d*);?(\d*)?([A-DJKHfm])/g;
 export const replaceLineRegex = /\r\n/g;
+
+export const PageSize = 500;

src/components/logs-viewer/logs-list.tsx

@@ -1,7 +1,14 @@
 import useOverlayScroller from '@/hooks/use-overlay-scroller';
 import classNames from 'classnames';
 import _, { throttle } from 'lodash';
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+  useState
+} from 'react';
 import './styles/logs-list.less';
 
 interface LogsListProps {
@@ -9,12 +16,14 @@ interface LogsListProps {
   height?: number;
   onScroll?: (isTop: boolean) => void;
   diffHeight?: number;
+  ref?: any;
 }
-const LogsList: React.FC<LogsListProps> = (props) => {
+const LogsList: React.FC<LogsListProps> = forwardRef((props, ref) => {
   const { dataList, height, onScroll, diffHeight = 96 } = props;
   const {
     initialize,
     updateScrollerPosition,
+    updateScrollerPositionToTop,
     generateInstance,
     scrollEventElement,
     instance,
@@ -28,6 +37,19 @@ const LogsList: React.FC<LogsListProps> = (props) => {
   const scroller = useRef<any>({});
   const stopScroll = useRef(false);
 
+  const scrollToBottom = useCallback(() => {
+    updateScrollerPosition(0);
+  }, [updateScrollerPosition]);
+
+  const scrollToTop = useCallback(() => {
+    updateScrollerPositionToTop();
+  }, [updateScrollerPositionToTop]);
+
+  useImperativeHandle(ref, () => ({
+    scrollToBottom,
+    scrollToTop
+  }));
+
   const debounceResetStopScroll = _.debounce(() => {
     stopScroll.current = false;
   }, 30000);
@@ -106,6 +128,6 @@ const LogsList: React.FC<LogsListProps> = (props) => {
       </div>
     </div>
   );
-};
+});
 
 export default React.memo(LogsList);

src/components/logs-viewer/use-logs-pagination.ts

@@ -1,7 +1,8 @@
 import { useState } from 'react';
+import { PageSize } from './config';
 
 const useLogsPagination = () => {
-  const [pageSize, setPageSize] = useState(500);
+  const [pageSize, setPageSize] = useState(PageSize);
   const [page, setPage] = useState(1);
   const [total, setTotal] = useState(1);
 

src/components/logs-viewer/virtual-log-list.tsx

@@ -23,10 +23,11 @@ interface LogsViewerProps {
   url: string;
   params?: object;
   ref?: any;
+  tail?: number;
   diffHeight?: number;
 }
 const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
-  const { diffHeight, url } = props;
+  const { diffHeight, url, tail: defaultTail } = props;
   const { pageSize, page, setPage, setTotalPage, totalPage } =
     useLogsPagination();
   const { setChunkFetch } = useSetChunkFetch();
@@ -34,10 +35,12 @@ const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
   const cacheDataRef = useRef<any>('');
   const [logs, setLogs] = useState<any[]>([]);
   const logParseWorker = useRef<any>(null);
-  const tail = useRef<any>(pageSize);
+  const tail = useRef<any>(defaultTail);
   const [isLoadend, setIsLoadend] = useState(false);
   const [loading, setLoading] = useState(false);
   const [isAtTop, setIsAtTop] = useState(false);
+  const [scrollPos, setScrollPos] = useState<any[]>([]);
+  const logListRef = useRef<any>(null);
 
   useImperativeHandle(ref, () => ({
     abort() {
@@ -110,6 +113,7 @@ const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
     const end = newPage * pageSize;
     const prePage = list.slice(start, end).join('\n');
     setPage(newPage);
+    setScrollPos(['bottom', newPage]);
     logParseWorker.current.postMessage({
       inputStr: prePage
     });
@@ -125,6 +129,7 @@ const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
     const end = newPage * pageSize;
     const nextPage = list.slice(start, end).join('\n');
     setPage(newPage);
+    setScrollPos(['top', newPage]);
     logParseWorker.current.postMessage({
       inputStr: nextPage
     });
@@ -183,11 +188,21 @@ const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
     };
   }, [url, props.params]);
 
+  useEffect(() => {
+    if (scrollPos[0] === 'top') {
+      logListRef.current?.scrollToTop();
+    }
+    if (scrollPos[0] === 'bottom') {
+      logListRef.current?.scrollToBottom();
+    }
+  }, [scrollPos]);
+
   return (
     <div className="logs-viewer-wrap-w2">
       <div className="wrap">
         <div className={classNames('content')}>
           <LogsList
+            ref={logListRef}
             dataList={logs}
             diffHeight={diffHeight}
             onScroll={handleOnScroll}