feat: 应用程序 & 实验对比排序

react-ui/config/routes.ts

@@ -229,7 +229,7 @@ export default [
         name: '应用开发',
         path: '',
         key: 'appsDeployment',
-        component: './missingPage.jsx',
+        component: './Application',
       },
     ],
   },

react-ui/src/pages/DatasetPreparation/DatasetAnnotation/index.less → react-ui/src/components/FullScreenFrame/index.less

@@ -1,8 +1,8 @@
-.container {
+.kf-full-screen-frame {
   width: 100%;
   height: 100%;
 
-  .frame {
+  &__iframe {
     width: 100%;
     height: 100%;
     border: none;

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

@@ -0,0 +1,18 @@
+import classNames from 'classnames';
+import './index.less';
+
+type FullScreenFrameProps = {
+  url: string;
+  className?: string;
+  style?: React.CSSProperties;
+};
+
+function FullScreenFrame({ url, className, style }: FullScreenFrameProps) {
+  return (
+    <div className={classNames('kf-full-screen-frame', className ?? '')} style={style}>
+      {url && <iframe src={url} className="kf-full-screen-frame__iframe"></iframe>}
+    </div>
+  );
+}
+
+export default FullScreenFrame;

react-ui/src/pages/Application/index.tsx

@@ -0,0 +1,9 @@
+import FullScreenFrame from '@/components/FullScreenFrame';
+import { useState } from 'react';
+
+function Application() {
+  const [iframeUrl] = useState('http://172.20.32.181:30080/');
+  return <FullScreenFrame url={iframeUrl}></FullScreenFrame>;
+}
+
+export default Application;

react-ui/src/pages/DatasetPreparation/DatasetAnnotation/index.tsx

@@ -1,7 +1,7 @@
+import FullScreenFrame from '@/components/FullScreenFrame';
 import { getLabelStudioUrl } from '@/services/developmentEnvironment';
 import { to } from '@/utils/promise';
 import { useEffect, useState } from 'react';
-import styles from './index.less';
 
 function DatasetAnnotation() {
   const [iframeUrl, setIframeUrl] = useState('');
@@ -14,11 +14,7 @@ function DatasetAnnotation() {
       setIframeUrl(res.data);
     }
   };
-  return (
-    <div className={styles.container}>
-      {iframeUrl && <iframe src={iframeUrl} className={styles.frame}></iframe>}
-    </div>
-  );
+  return <FullScreenFrame url={iframeUrl} />;
 }
 
 export default DatasetAnnotation;

react-ui/src/pages/Experiment/Comparison/index.tsx

@@ -93,8 +93,7 @@ function ExperimentComparison() {
     type: 'checkbox',
     fixed: 'left',
     selectedRowKeys,
-    onChange: (selectedRowKeys: React.Key[], selectedRows: any[]) => {
-      // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+    onChange: (selectedRowKeys: React.Key[]) => {
       setSelectedRowKeys(selectedRowKeys);
     },
   };
@@ -159,6 +158,8 @@ function ExperimentComparison() {
           align: 'center',
           render: tableCellRender(true),
           ellipsis: { showTitle: false },
+          sorter: (a, b) => a.params[name] - b.params[name],
+          showSorterTooltip: false,
         })),
       },
       {
@@ -176,6 +177,8 @@ function ExperimentComparison() {
           align: 'center',
           render: tableCellRender(true),
           ellipsis: { showTitle: false },
+          sorter: (a, b) => a.metrics[name] - b.metrics[name],
+          showSorterTooltip: false,
         })),
       },
     ];

react-ui/src/pages/Tool/Swagger/index.tsx

@@ -18,7 +18,7 @@ const CacheInfo: React.FC = () => {
   });
 
   return (
-    <div style={{}}>
+    <div>
       <iframe
         style={{ width: '100%', border: '0px', height: '100%' }}
         src={`/api/swagger-ui/index.html`}

react-ui/src/pages/Workspace/index.less

@@ -49,6 +49,7 @@
     position: fixed;
     right: 30px;
     bottom: 20px;
+    z-index: 999;
     width: 64px;
     height: 64px;
     background-color: white;

react-ui/src/pages/Workspace/index.tsx

@@ -71,7 +71,7 @@ function Workspace() {
           <AssetsManagement></AssetsManagement>
         </div>
       </div>
-      <Draggable onStart={handleStart} onStop={handleStop} onDrag={handleDrag}>
+      <Draggable onStart={handleStart} onStop={handleStop} onDrag={handleDrag} bounds="body">
         <img
           className={styles['workspace__robot-img']}
           src={require('@/assets/img/robot.png')}

react-ui/src/services/developmentEnvironment/index.ts

@@ -7,10 +7,9 @@ export function getJupyterUrl() {
 }
 
 // 查询 labelStudio url
-export function getLabelStudioUrl(params: any) {
+export function getLabelStudioUrl() {
   return request(`/api/mmp/labelStudio/getURL`, {
     method: 'GET',
-    params,
   });
 }