Browse Source

feat: 添加 valtio

pull/150/head
cp3hnu 1 year ago
parent
commit
35e8093f62
8 changed files with 48 additions and 18 deletions
  1. +1
    -0
      react-ui/config/config.ts
  2. +1
    -4
      react-ui/src/components/InfoGroup/index.less
  3. +13
    -7
      react-ui/src/components/InfoGroup/index.tsx
  4. +15
    -1
      react-ui/src/hooks/resource.ts
  5. +0
    -4
      react-ui/src/pages/AutoML/components/ExperimentResult/index.less
  6. +1
    -1
      react-ui/src/pages/AutoML/components/ExperimentResult/index.tsx
  7. +1
    -1
      react-ui/src/pages/System/User/index.tsx
  8. +16
    -0
      react-ui/src/state/computingResourceStore.ts

+ 1
- 0
react-ui/config/config.ts View File

@@ -156,4 +156,5 @@ export default defineConfig({
},
javascriptEnabled: true,
},
valtio: {},
});

+ 1
- 4
react-ui/src/components/InfoGroup/index.less View File

@@ -5,10 +5,7 @@
padding: 20px @content-padding;
background-color: white;
border: 1px solid @border-color-base;
border-top: none;
border-radius: 0 0 4px 4px;

&&--scroll {
padding: 0;
}
}
}

+ 13
- 7
react-ui/src/components/InfoGroup/index.tsx View File

@@ -4,21 +4,27 @@ import './index.less';

type InfoGroupProps = {
title: string;
contentScroll?: boolean; // 内容是否需要滚动,如果可以滚动,则取消 padding
height?: string | number; // 如果要纵向滚动,需要设置高度
width?: string | number; // 如果要横向滚动,需要设置宽度
className?: string;
style?: React.CSSProperties;
children?: React.ReactNode;
};

function InfoGroup({ title, contentScroll = false, className, style, children }: InfoGroupProps) {
function InfoGroup({ title, height, width, className, style, children }: InfoGroupProps) {
const contentStyle: React.CSSProperties = {};
if (height) {
contentStyle.height = height;
contentStyle.overflowY = 'auto';
}
if (width) {
contentStyle.width = width;
contentStyle.overflowX = 'auto';
}
return (
<div className={classNames('kf-info-group', className)} style={style}>
<InfoGroupTitle title={title} />
<div
className={classNames('kf-info-group__content', {
'kf-info-group__content--scroll': contentScroll,
})}
>
<div style={contentStyle} className={'kf-info-group__content'}>
{children}
</div>
</div>


+ 15
- 1
react-ui/src/hooks/resource.ts View File

@@ -1,15 +1,28 @@
/*
* @Author: 赵伟
* @Date: 2024-10-10 08:51:41
* @Description: 资源规格 hook
*/

import { getComputingResourceReq } from '@/services/pipeline';
import computingResourceState, { setComputingResource } from '@/state/computingResourceStore';
import { ComputingResource } from '@/types';
import { to } from '@/utils/promise';
import { type SelectProps } from 'antd';
import { useCallback, useEffect, useState } from 'react';
import { useSnapshot } from 'umi';

// 获取资源规格
export function useComputingResource() {
const [resourceStandardList, setResourceStandardList] = useState<ComputingResource[]>([]);
const computingResourceSnap = useSnapshot(computingResourceState);

useEffect(() => {
getComputingResource();
if (computingResourceSnap.computingResource.length > 0) {
setResourceStandardList(computingResourceSnap.computingResource as ComputingResource[]);
} else {
getComputingResource();
}
}, []);

// 获取资源规格列表数据
@@ -22,6 +35,7 @@ export function useComputingResource() {
const [res] = await to(getComputingResourceReq(params));
if (res && res.data && res.data.content) {
setResourceStandardList(res.data.content);
setComputingResource(res.data.content);
}
}, []);



+ 0
- 4
react-ui/src/pages/AutoML/components/ExperimentResult/index.less View File

@@ -25,10 +25,6 @@
}

&__text {
width: 100%;
height: 420px;
padding: 20px @content-padding;
overflow: auto;
white-space: pre-wrap;
}



+ 1
- 1
react-ui/src/pages/AutoML/components/ExperimentResult/index.tsx View File

@@ -37,7 +37,7 @@ function ExperimentResult({ fileUrl, imageUrl, modelPath }: ExperimentResultProp

return (
<div className={styles['experiment-result']}>
<InfoGroup title="实验结果" contentScroll>
<InfoGroup title="实验结果" height={420} width="100%">
<div className={styles['experiment-result__text']}>{result}</div>
</InfoGroup>
<InfoGroup title="可视化结果" style={{ margin: '16px 0' }}>


+ 1
- 1
react-ui/src/pages/System/User/index.tsx View File

@@ -235,7 +235,7 @@ const UserTableList: React.FC = () => {
const columns: ProColumns<API.System.User>[] = [
{
title: <FormattedMessage id="system.user.user_id" defaultMessage="用户编号" />,
dataIndex: 'deptId',
dataIndex: 'userId',
valueType: 'text',
},
{


+ 16
- 0
react-ui/src/state/computingResourceStore.ts View File

@@ -0,0 +1,16 @@
import { ComputingResource } from '@/types';
import { proxy } from 'umi';

type ComputingResourceStore = {
computingResource: ComputingResource[];
};

const state = proxy<ComputingResourceStore>({
computingResource: [],
});

export const setComputingResource = (computingResource: ComputingResource[]) => {
state.computingResource = computingResource;
};

export default state;

Loading…
Cancel
Save