Browse Source

Merge pull request '合并dev' (#231) from dev into dev-check

pull/235/head
cp3hnu 8 months ago
parent
commit
1f08241ca9
2 changed files with 25 additions and 25 deletions
  1. +16
    -16
      react-ui/src/pages/Workspace/components/QuickStart/index.tsx
  2. +9
    -9
      react-ui/src/pages/Workspace/index.tsx

+ 16
- 16
react-ui/src/pages/Workspace/components/QuickStart/index.tsx View File

@@ -16,13 +16,13 @@ function QuickStart() {
const changeScale = () => { const changeScale = () => {
// body 的宽度 - 菜单的宽度 - 两个 padding - 右边用户管理的宽度 - 右边用户管理的 marginLeft - 滚动条的宽度, // body 的宽度 - 菜单的宽度 - 两个 padding - 右边用户管理的宽度 - 右边用户管理的 marginLeft - 滚动条的宽度,
const width = document.body.offsetWidth - 256 - 80 - 60 - 326 - 15 - 8; const width = document.body.offsetWidth - 256 - 80 - 60 - 326 - 15 - 8;
if (width >= 1223) {
const spaceX = (width - 192 * 5 - 60) / 7;
if (width >= 1002) {
const spaceX = (width - 192 * 4 - 60) / 6;
setSpace(spaceX); setSpace(spaceX);
setCanvasWidth('100%'); setCanvasWidth('100%');
setScale(1.0); setScale(1.0);
} else { } else {
const ratio = width / 1223;
const ratio = width / 1002;
setCanvasWidth('1223px'); setCanvasWidth('1223px');
setSpace(29); setSpace(29);
setScale(ratio); setScale(ratio);
@@ -60,20 +60,20 @@ function QuickStart() {
y={309} y={309}
onClick={() => navigate('/datasetPreparation/datasetAnnotation')} onClick={() => navigate('/datasetPreparation/datasetAnnotation')}
/> />
<WorkFlow
{/* <WorkFlow
content="为开发者提供定制化编辑器,开发者可根据自己需求选择配置,保存编译器中的调试环境为镜像供训练使用" content="为开发者提供定制化编辑器,开发者可根据自己需求选择配置,保存编译器中的调试环境为镜像供训练使用"
buttonText="开发环境" buttonText="开发环境"
buttonTop={20} buttonTop={20}
x={left + 192 + space} x={left + 192 + space}
y={301} y={301}
onClick={() => navigate('/developmentEnvironment')} onClick={() => navigate('/developmentEnvironment')}
/>
/> */}
<WorkFlow <WorkFlow
content="为开发者提供定制化编辑器,开发者可根据自己需求选择配置,保存编译器中的调试环境为镜像供训练使用" content="为开发者提供定制化编辑器,开发者可根据自己需求选择配置,保存编译器中的调试环境为镜像供训练使用"
tips="可视化建模Designer" tips="可视化建模Designer"
buttonText="流水线模板" buttonText="流水线模板"
buttonTop={20} buttonTop={20}
x={left + 2 * (192 + space)}
x={left + 1 * (192 + space)}
y={276} y={276}
onClick={() => navigate('/pipeline/template')} onClick={() => navigate('/pipeline/template')}
/> />
@@ -81,7 +81,7 @@ function QuickStart() {
content="开发者可以在这里运行流水线模板,产生实验实例,对比实验训练过程与产生的实验训练数据" content="开发者可以在这里运行流水线模板,产生实验实例,对比实验训练过程与产生的实验训练数据"
buttonText="实验" buttonText="实验"
buttonTop={40} buttonTop={40}
x={left + 3 * (192 + space)}
x={left + 2 * (192 + space)}
y={295} y={295}
onClick={() => navigate('/pipeline/experiment')} onClick={() => navigate('/pipeline/experiment')}
/> />
@@ -90,20 +90,20 @@ function QuickStart() {
tips="模型在线服务" tips="模型在线服务"
buttonText="服务" buttonText="服务"
buttonTop={20} buttonTop={20}
x={left + 4 * (192 + space) + 60 + space}
x={left + 3 * (192 + space) + 60 + space}
y={263} y={263}
onClick={() => navigate('/dataset/modelDeployment')} onClick={() => navigate('/dataset/modelDeployment')}
/> />
<div <div
className={styles['quick-start__content__canvas__model']} className={styles['quick-start__content__canvas__model']}
style={{ top: '358px', left: left + 4 * (192 + space) + 'px' }}
style={{ top: '358px', left: left + 3 * (192 + space) + 'px' }}
> >
<KFIcon type="icon-moxingguanli" font={38} /> <KFIcon type="icon-moxingguanli" font={38} />
<span>模型管理</span> <span>模型管理</span>
</div> </div>
<div <div
className={styles['quick-start__content__canvas__task']} className={styles['quick-start__content__canvas__task']}
style={{ top: '110px', left: left + 2 * (192 + space) + 56 + taskLeftArrowWidth + 16 }}
style={{ top: '110px', left: left + 1 * (192 + space) + 56 + taskLeftArrowWidth + 16 }}
> >
<KFIcon type="icon-tiaoduguanli" font={13} style={{ marginRight: '5px' }} /> <KFIcon type="icon-tiaoduguanli" font={13} style={{ marginRight: '5px' }} />
<span>任务自动调度</span> <span>任务自动调度</span>
@@ -117,7 +117,7 @@ function QuickStart() {
arrorwTop={-4} arrorwTop={-4}
borderBottom={1} borderBottom={1}
/> />
<WorkArrow
{/* <WorkArrow
x={left + 2 * 192 + space + 1} x={left + 2 * 192 + space + 1}
y={378} y={378}
width={arrowWidth} width={arrowWidth}
@@ -125,9 +125,9 @@ function QuickStart() {
arrowLeft={arrowWidth} arrowLeft={arrowWidth}
arrorwTop={-4} arrorwTop={-4}
borderBottom={1} borderBottom={1}
/>
/> */}
<WorkArrow <WorkArrow
x={left + 4 * 192 + 3 * space + 1}
x={left + 3 * 192 + 2 * space + 1}
y={378} y={378}
width={arrowWidth + 10} width={arrowWidth + 10}
height={1} height={1}
@@ -136,7 +136,7 @@ function QuickStart() {
borderBottom={1} borderBottom={1}
/> />
<WorkArrow <WorkArrow
x={left + 4 * 192 + 60 + 4 * space + 1 - 10}
x={left + 3 * 192 + 60 + 3 * space + 1 - 10}
y={378} y={378}
width={arrowWidth + 10} width={arrowWidth + 10}
height={1} height={1}
@@ -145,7 +145,7 @@ function QuickStart() {
borderBottom={1} borderBottom={1}
/> />
<WorkArrow <WorkArrow
x={left + 2 * (192 + space) + 56}
x={left + 1 * (192 + space) + 56}
y={139} y={139}
width={taskLeftArrowWidth} width={taskLeftArrowWidth}
height={120} height={120}
@@ -155,7 +155,7 @@ function QuickStart() {
borderTop={1} borderTop={1}
/> />
<WorkArrow <WorkArrow
x={left + 2 * (192 + space) + 56 + taskLeftArrowWidth + 16 + 131 + 4}
x={left + 1 * (192 + space) + 56 + taskLeftArrowWidth + 16 + 131 + 4}
y={127} y={127}
width={taskRightArrowWidth} width={taskRightArrowWidth}
height={156} height={156}


+ 9
- 9
react-ui/src/pages/Workspace/index.tsx View File

@@ -1,15 +1,15 @@
import { useDraggable } from '@/hooks/useDraggable';
// import { useDraggable } from '@/hooks/useDraggable';
import { getWorkspaceOverviewReq } from '@/services/workspace'; import { getWorkspaceOverviewReq } from '@/services/workspace';
import { ExperimentInstance } from '@/types'; import { ExperimentInstance } from '@/types';
import { to } from '@/utils/promise'; import { to } from '@/utils/promise';
import { Divider, Flex } from 'antd'; import { Divider, Flex } from 'antd';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import Draggable from 'react-draggable';
// import Draggable from 'react-draggable';
import AssetsManagement from './components/AssetsManagement'; import AssetsManagement from './components/AssetsManagement';
import ExperimentChart, { type ExperimentStatistics } from './components/ExperimentChart'; import ExperimentChart, { type ExperimentStatistics } from './components/ExperimentChart';
import ExperitableTable from './components/ExperimentTable'; import ExperitableTable from './components/ExperimentTable';
import QuickStart from './components/QuickStart'; import QuickStart from './components/QuickStart';
import RobotFrame from './components/RobotFrame';
// import RobotFrame from './components/RobotFrame';
import TotalStatistics from './components/TotalStatistics'; import TotalStatistics from './components/TotalStatistics';
import UserPoints from './components/UserPoints'; import UserPoints from './components/UserPoints';
import UserSpace from './components/UserSpace'; import UserSpace from './components/UserSpace';
@@ -25,10 +25,10 @@ type OverviewData = {


function Workspace() { function Workspace() {
const [overviewData, setOverviewData] = useState<OverviewData>(); const [overviewData, setOverviewData] = useState<OverviewData>();
const [robotFrameVisible, setRobotFrameVisible] = useState(false);
const { handleStart, handleStop, handleDrag, handleClick } = useDraggable(() =>
setRobotFrameVisible((prev) => !prev),
);
// const [robotFrameVisible, setRobotFrameVisible] = useState(false);
// const { handleStart, handleStop, handleDrag, handleClick } = useDraggable(() =>
// setRobotFrameVisible((prev) => !prev),
// );
const users: number[] = new Array(8).fill(0); const users: number[] = new Array(8).fill(0);


useEffect(() => { useEffect(() => {
@@ -85,7 +85,7 @@ function Workspace() {
<AssetsManagement></AssetsManagement> <AssetsManagement></AssetsManagement>
</div> </div>
</div> </div>
<Draggable onStart={handleStart} onStop={handleStop} onDrag={handleDrag} bounds="body">
{/* <Draggable onStart={handleStart} onStop={handleStop} onDrag={handleDrag} bounds="body">
<img <img
className={styles['workspace__robot-img']} className={styles['workspace__robot-img']}
src={require('@/assets/img/robot.png')} src={require('@/assets/img/robot.png')}
@@ -98,7 +98,7 @@ function Workspace() {
<RobotFrame <RobotFrame
visible={robotFrameVisible} visible={robotFrameVisible}
onClose={() => setRobotFrameVisible(false)} onClose={() => setRobotFrameVisible(false)}
></RobotFrame>
></RobotFrame> */}
</div> </div>
); );
} }


Loading…
Cancel
Save