Merge branch 'dev-check' of https://gitlink.org.cn/ci4s/ci4sManagement-cloud into dev-check

react-ui/src/components/IFramePage/index.tsx

@@ -53,7 +53,9 @@ const getRequestAPI = (type: IframePageType): (() => Promise<any>) => {
 
 type IframePageProps = {
   /** 子系统 */
-  type: IframePageType;
+  type?: IframePageType;
+  /** url */
+  url?: string;
   /** 是否可以在页签上打开 */
   openInTab?: boolean;
   /** 自定义样式类名 */
@@ -63,13 +65,13 @@ type IframePageProps = {
 };
 
 /** 系统内嵌 iframe，目前系统有数据标注、应用开发、开发环境、GitLink 四个子系统，使用时可以添加其他子系统 */
-function IframePage({ type, openInTab = false, className, style }: IframePageProps) {
+function IframePage({ type, url, openInTab = false, className, style }: IframePageProps) {
   const [iframeUrl, setIframeUrl] = useState('');
   // const [loading, setLoading] = useState(false);
 
   useEffect(() => {
-    const requestIframeUrl = async () => {
-      //setLoading(true);
+    const requestIframeUrl = async (type: IframePageType) => {
+      // setLoading(true);
       Loading.show();
       const [res] = await to(getRequestAPI(type)());
       if (res && res.data) {
@@ -80,8 +82,13 @@ function IframePage({ type, openInTab = false, className, style }: IframePagePro
       }
     };
 
-    requestIframeUrl();
-  }, [type]);
+    if (type) {
+      requestIframeUrl(type);
+    } else if (url) {
+      Loading.show();
+      setIframeUrl(url);
+    }
+  }, [type, url]);
 
   const handleLoad = () => {
     // setLoading(false);
@@ -97,7 +104,7 @@ function IframePage({ type, openInTab = false, className, style }: IframePagePro
   return (
     <div className={classNames('kf-iframe-page', className)} style={style}>
       {/* {loading && createPortal(<KFSpin size="large" />, document.body)} */}
-      <FullScreenFrame url={iframeUrl} onLoad={handleLoad} onError={handleError} />
+      {iframeUrl && <FullScreenFrame url={iframeUrl} onLoad={handleLoad} onError={handleError} />}
       {openInTab && <FloatButton onClick={() => window.open(iframeUrl, '_blank')} />}
     </div>
   );

react-ui/src/pages/ModelDeployment/VersionInfo/index.tsx

@@ -3,7 +3,7 @@
  * @Date: 2024-04-16 13:58:08
  * @Description: 服务版本详情
  */
-import FullScreenFrame from '@/components/FullScreenFrame';
+import IframePage from '@/components/IFramePage';
 import KFIcon from '@/components/KFIcon';
 import PageTitle from '@/components/PageTitle';
 import { ServiceRunStatus } from '@/enums';
@@ -58,11 +58,7 @@ function ServiceVersionInfo() {
         key: ModelDeploymentTabKey.Predict,
         label: '预测',
         icon: <KFIcon type="icon-yuce" />,
-        children: (
-          <div style={{ height: '100%', width: '100%' }}>
-            <FullScreenFrame url={versionInfo?.page_path}></FullScreenFrame>
-          </div>
-        ),
+        children: <IframePage url={versionInfo?.page_path}></IframePage>,
       });
     }
 
@@ -71,11 +67,7 @@ function ServiceVersionInfo() {
         key: ModelDeploymentTabKey.Guide,
         label: '调用指南',
         icon: <KFIcon type="icon-tiaoyongzhinan" />,
-        children: (
-          <div style={{ height: '100%', width: '100%' }}>
-            <FullScreenFrame url={versionInfo?.doc_path}></FullScreenFrame>
-          </div>
-        ),
+        children: <IframePage url={versionInfo?.doc_path}></IframePage>,
       });
     }
   }

react-ui/src/pages/ModelDeployment/components/ServerLog/index.less

@@ -11,7 +11,11 @@
     font-family: 'Roboto Mono', 'Menlo', 'Consolas', 'Monaco', monospace;
     display: flex;
     flex-direction: column;
-    align-items: center;
+    align-items: left;
+
+    &--empty {
+      align-items: center;
+    }
 
     &__more {
       padding: 20px 0;

react-ui/src/pages/ModelDeployment/components/ServerLog/index.tsx

@@ -3,6 +3,7 @@ import { getServiceVersionLogReq } from '@/services/modelDeployment';
 import { to } from '@/utils/promise';
 import { DoubleRightOutlined } from '@ant-design/icons';
 import { Button, DatePicker, type TimeRangePickerProps } from 'antd';
+import classNames from 'classnames';
 import dayjs from 'dayjs';
 import { useEffect, useState } from 'react';
 import styles from './index.less';
@@ -106,6 +107,8 @@ function ServerLog({ info }: ServerLogProps) {
     }
   };
 
+  const logContent = logData.map((v) => v.log_content).join('');
+
   return (
     <div className={styles['server-log']}>
       <div>
@@ -122,9 +125,9 @@ function ServerLog({ info }: ServerLogProps) {
           查询
         </Button>
       </div>
-      {logData.length > 0 && (
+      {logContent ? (
         <div className={styles['server-log__data']} id="server-log">
-          <div>{logData.map((v) => v.log_content).join('') || '暂无日志'}</div>
+          <div>{logContent}</div>
           {hasMore && (
             <Button
               type="text"
@@ -137,6 +140,10 @@ function ServerLog({ info }: ServerLogProps) {
             </Button>
           )}
         </div>
+      ) : (
+        <div className={classNames(styles['server-log__data'], styles['server-log__data--empty'])}>
+          暂无日志
+        </div>
       )}
     </div>
   );