chore: 代码优化

react-ui/src/app.tsx

@@ -2,7 +2,6 @@ import RightContent from '@/components/RightContent';
 import type { Settings as LayoutSettings } from '@ant-design/pro-components';
 import type { RunTimeLayoutConfig } from '@umijs/max';
 import { history } from '@umijs/max';
-import axios from 'axios';
 import defaultSettings from '../config/defaultSettings';
 import '../public/fonts/font.css';
 import { getAccessToken } from './access';
@@ -17,8 +16,7 @@ import {
   setRemoteMenu,
 } from './services/session';
 export { requestConfig as request } from './requestConfig';
-axios.defaults.baseUrl = 'http://172.20.32.150:8082';
-const isDev = process.env.NODE_ENV === 'development';
+// const isDev = process.env.NODE_ENV === 'development';
 
 /**
  * @see  https://umijs.org/zh-CN/plugins/plugin-initial-state
@@ -34,10 +32,9 @@ export async function getInitialState(): Promise<{
       const response = await getUserInfo({
         skipErrorHandler: true,
       });
-      if (response.user.avatar === '') {
-        response.user.avatar =
-          'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png';
-      }
+      response.user.avatar =
+        response.user.avatar ||
+        'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png';
       return {
         ...response.user,
         permissions: response.permissions,
@@ -66,7 +63,7 @@ export async function getInitialState(): Promise<{
 }
 
 // ProLayout 支持的api https://procomponents.ant.design/components/layout
-export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) => {
+export const layout: RunTimeLayoutConfig = ({ initialState }) => {
   return {
     rightContentRender: () => <RightContent />,
     waterMarkProps: {
@@ -155,26 +152,26 @@ export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) =
   };
 };
 
-export async function onRouteChange({ clientRoutes, location }) {
+export async function onRouteChange({ clientRoutes, location }: any) {
   const menus = getRemoteMenu();
-  // console.log('onRouteChange', clientRoutes, location, menus);
+  console.log('onRouteChange', clientRoutes, location, menus);
   if (menus === null && location.pathname !== PageEnum.LOGIN) {
     console.log('refresh');
     history.go(0);
   }
 }
 
-// export function patchRoutes({ routes, routeComponents }) {
-//   console.log('patchRoutes', routes, routeComponents);
-// }
+export function patchRoutes({ routes, routeComponents }: any) {
+  console.log('patchRoutes', routes, routeComponents);
+}
 
-export async function patchClientRoutes({ routes }) {
-  // console.log('patchClientRoutes', routes);
+export async function patchClientRoutes({ routes }: any) {
+  console.log('patchClientRoutes', routes);
   patchRouteWithRemoteMenus(routes);
 }
 
 export function render(oldRender: () => void) {
-  // console.log('render get routers', oldRender)
+  console.log('render get routers', oldRender);
   const token = getAccessToken();
   if (!token || token?.length === 0) {
     oldRender();

react-ui/src/pages/Experiment/experimentText/LogList.tsx

@@ -1,8 +1,9 @@
-import LogGroup from './logGroup';
+import { ExperimentStatus } from '../types';
+import LogGroup, { type LogGroupProps } from './logGroup';
 
 type LogListProps = {
-  list: any[];
-  status: string;
+  list: Omit<LogGroupProps, 'status'>[];
+  status: ExperimentStatus;
 };
 
 function LogList({ list = [], status }: LogListProps) {

react-ui/src/pages/Experiment/experimentText/logGroup.tsx

@@ -3,34 +3,35 @@ import { getExperimentPodsLog } from '@/services/experiment/index.js';
 import { DoubleRightOutlined, DownOutlined, UpOutlined } from '@ant-design/icons';
 import { Button } from 'antd';
 import { useEffect, useState } from 'react';
+import { ExperimentStatus } from '../types';
 import styles from './logGroup.less';
 
-type LogGroupProps = {
-  log_type?: string;
-  pod_name?: string;
-  log_content?: string;
-  start_time?: string;
-  status: string;
+export type LogGroupProps = {
+  log_type: 'normal' | 'resource'; // 日志类型
+  pod_name?: string; // 分布式名称
+  log_content?: string; // 日志内容
+  start_time?: string; // 日志开始时间
+  status: ExperimentStatus; // 实验状态
 };
 
 type Log = {
-  start_time: string;
-  log_content: string;
+  start_time: string; // 日志开始时间
+  log_content: string; // 日志内容
 };
 
 function LogGroup({
-  log_type = '',
+  log_type = 'normal',
   pod_name = '',
   log_content = '',
   start_time = '',
-  status = '',
+  status = ExperimentStatus.Pending,
 }: LogGroupProps) {
   const [collapse, setCollapse] = useState(true);
   const [logList, setLogList, logListRef] = useStateRef<Log[]>([]);
   const [completed, setCompleted] = useState(false);
 
   useEffect(() => {
-    if (status === 'Running') {
+    if (status === ExperimentStatus.Running) {
       const timerId = setInterval(() => {
         requestExperimentPodsLog();
       }, 5000);

react-ui/src/pages/Experiment/experimentText/props.jsx

@@ -160,7 +160,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           Object.keys(stagingItem.control_strategy) &&
           Object.keys(stagingItem.control_strategy).length > 0
             ? Object.keys(stagingItem.control_strategy).map((item) => (
-                <Form.Item label={stagingItem.control_strategy[item].label} disabled name={item}>
+                <Form.Item key={item} label={stagingItem.control_strategy[item].label} disabled name={item}>
                   <Input disabled />
                 </Form.Item>
               ))
@@ -178,6 +178,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           Object.keys(stagingItem.in_parameters).length > 0
             ? Object.keys(stagingItem.in_parameters).map((item) => (
                 <Form.Item
+                  key={item}
                   label={stagingItem.in_parameters[item].label + '(' + item + ')'}
                   name={item}
                   disabled
@@ -200,6 +201,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
           Object.keys(stagingItem.out_parameters).length > 0
             ? Object.keys(stagingItem.out_parameters).map((item) => (
                 <Form.Item
+                  key={item}
                   label={stagingItem.out_parameters[item].label + '(' + item + ')'}
                   disabled
                   rules={[{ required: stagingItem.out_parameters[item].require ? true : false }]}
@@ -227,7 +229,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
         >
           {resultObj && resultObj.length > 0
             ? resultObj.map((item) => (
-                <div>
+                <div key={item.name}>
                   <div className={Styles.resultTop}>
                     <span>{item.name}</span>
                     <div style={{ display: 'flex' }}>
@@ -249,7 +251,7 @@ const Props = forwardRef(({ onParentChange }, ref) => {
                   </div>
                   {item.value && item.value.length > 0
                     ? item.value.map((ele) => (
-                        <div className={Styles.resultContent}>
+                        <div className={Styles.resultContent} key={ele.name}>
                           <span>{ele.name}</span>
                           <span>{ele.size}</span>
                         </div>

react-ui/src/pages/Experiment/status.ts

@@ -4,17 +4,6 @@ export interface StatusInfo {
   icon: string;
 }
 
-export enum ExperimentStatus {
-  Running = 'Running',
-  Succeeded = 'Succeeded',
-  Pending = 'Pending',
-  Failed = 'Failed',
-  Error = 'Error',
-  Terminated = 'Terminated',
-  Skipped = 'Skipped',
-  Omitted = 'Omitted',
-}
-
 export const experimentStatusInfo: Record<string, StatusInfo | undefined> = {
   Running: {
     label: '运行中',

react-ui/src/pages/Experiment/types.ts

@@ -0,0 +1,10 @@
+export enum ExperimentStatus {
+  Running = 'Running',
+  Succeeded = 'Succeeded',
+  Pending = 'Pending',
+  Failed = 'Failed',
+  Error = 'Error',
+  Terminated = 'Terminated',
+  Skipped = 'Skipped',
+  Omitted = 'Omitted',
+}

react-ui/src/requestConfig.ts

@@ -13,7 +13,6 @@ export const requestConfig: RequestConfig = {
   requestInterceptors: [
     (url: any, options: { headers: any }) => {
       const headers = options.headers ? options.headers : [];
-      console.log('request ====>:', url);
       const authHeader = headers['Authorization'];
       const isToken = headers['isToken'];
       if (!authHeader && isToken !== false) {
@@ -39,18 +38,17 @@ export const requestConfig: RequestConfig = {
     },
   ],
   responseInterceptors: [
-    (response: any) =>
-    {
+    (response: any) => {
       const { status, data } = response;
       if (status && status >= 200 && status < 300 && data && data.code === 200) {
-        return response
+        return response;
       } else {
         if (data && data.msg) {
           message.error(data.msg);
         } else {
-          message.error("请求失败");
+          message.error('请求失败');
         }
-        return Promise.reject(response)
+        return Promise.reject(response);
       }
     },
   ],

react-ui/src/services/session.ts

@@ -96,10 +96,6 @@ export async function refreshToken() {
   });
 }
 
-export async function getRouters(): Promise<any> {
-  return request('/api/system/menu/getRouters');
-}
-
 export function convertCompatRouters(childrens: API.RoutersMenuItem[]): any[] {
   return childrens.map((item: API.RoutersMenuItem) => {
     return {
@@ -116,8 +112,9 @@ export function convertCompatRouters(childrens: API.RoutersMenuItem[]): any[] {
   });
 }
 
+// 获取路由列表
 export async function getRoutersInfo(): Promise<MenuDataItem[]> {
-  return getRouters().then((res) => {
+  return request('/api/system/menu/getRouters').then((res: any) => {
     if (res.code === 200) {
       return convertCompatRouters(res.data);
     } else {

react-ui/tsconfig.json

@@ -7,7 +7,7 @@
     "esModuleInterop": true, // 禁用命名空间导入（import * as fs from "fs"），并启用CJS/AMD/UMD样式的导入（import fs from "fs"）
     "allowSyntheticDefaultImports": true, // 允许从没有默认导出的模块进行默认导入
     "strict": true, // 启用所有严格类型检查选项
-    "forceConsistentCasingInFileNames": true, // 不允许对同一文件的引用使用不一致的大小写
+    "forceConsistentCasingInFileNames": false, // 允许对同一文件的引用使用不一致的大小写
     "module": "esnext", // 指定模块代码生成
     "moduleResolution": "node", // 使用Node.js样式解析模块
     "isolatedModules": true, // 无条件地为未解析的文件发出导入
@@ -22,7 +22,8 @@
     "noFallthroughCasesInSwitch": true, // 报告switch语句中的fallthrough案例错误
     "baseUrl": "./",
     "paths": {
-      "@/*": ["src/*"]
+      "@/*": ["src/*"],
+      "@@/*": ["src/.umi/*"]
     }
   },
   "include": [