| @@ -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} | ||||