fix: 添加预测加载状态

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>,
       });
     }
   }