diff --git a/react-ui/src/components/ParameterInput/index.tsx b/react-ui/src/components/ParameterInput/index.tsx index 94fdddde..aa0c7492 100644 --- a/react-ui/src/components/ParameterInput/index.tsx +++ b/react-ui/src/components/ParameterInput/index.tsx @@ -1,21 +1,22 @@ /* * @Author: 赵伟 * @Date: 2024-04-16 08:42:57 - * @Description: 参数输入组件 + * @Description: 参数输入组件,支持手动输入,选择全局参数,选择数据集/模型/镜像 */ +import { CommonTabKeys } from '@/enums'; import { CloseOutlined } from '@ant-design/icons'; import { Form, Input } from 'antd'; import { RuleObject } from 'antd/es/form'; import classNames from 'classnames'; import './index.less'; -// 对象 +// 如果值是对象时的类型 export type ParameterInputObject = { value?: any; // 值 showValue?: any; // 显示值 fromSelect?: boolean; // 是否来自选择 - activeTab?: string; // 选择镜像、数据集、模型时,保存当前激活的tab + activeTab?: CommonTabKeys; // 选择镜像、数据集、模型时,保存当前激活的tab expandedKeys?: string[]; // 选择镜像、数据集、模型时,保存展开的keys checkedKeys?: string[]; // 选择镜像、数据集、模型时,保存选中的keys [key: string]: any; diff --git a/react-ui/src/components/ParameterSelect/index.tsx b/react-ui/src/components/ParameterSelect/index.tsx index ffaf8415..2c9f862f 100644 --- a/react-ui/src/components/ParameterSelect/index.tsx +++ b/react-ui/src/components/ParameterSelect/index.tsx @@ -1,7 +1,7 @@ /* * @Author: 赵伟 * @Date: 2024-04-16 08:42:57 - * @Description: 参数选择组件 + * @Description: 参数下拉选择组件,支持资源规格、数据集、模型、服务 */ import { PipelineNodeModelParameter } from '@/types'; diff --git a/react-ui/src/components/ResourceSelect/index.tsx b/react-ui/src/components/ResourceSelect/index.tsx index 5f2142d8..e818df85 100644 --- a/react-ui/src/components/ResourceSelect/index.tsx +++ b/react-ui/src/components/ResourceSelect/index.tsx @@ -12,7 +12,8 @@ import ResourceSelectorModal, { } from '@/pages/Pipeline/components/ResourceSelectorModal'; import { openAntdModal } from '@/utils/modal'; import { Button } from 'antd'; -import { useState } from 'react'; +import { pick } from 'lodash'; +import { useEffect, useState } from 'react'; import ParameterInput, { type ParameterInputProps } from '../ParameterInput'; import './index.less'; @@ -33,6 +34,31 @@ function ResourceSelect({ type, value, onChange, disabled, ...rest }: ResourceSe undefined, ); + useEffect(() => { + if ( + value && + typeof value === 'object' && + value.activeTab && + value.id && + value.name && + value.version && + value.path && + (type === ResourceSelectorType.Mirror || value.identifier) && + (type === ResourceSelectorType.Mirror || value.owner) + ) { + const originResource = pick(value, [ + 'activeTab', + 'id', + 'identifier', + 'name', + 'owner', + 'version', + 'path', + ]) as ResourceSelectorResponse; + setSelectedResource(originResource); + } + }, [value]); + const selectResource = () => { const resource = selectedResource; const { close } = openAntdModal(ResourceSelectorModal, { @@ -50,8 +76,10 @@ function ResourceSelect({ type, value, onChange, disabled, ...rest }: ResourceSe showValue: path, fromSelect: true, activeTab, - expandedKeys: [`${id}`], - checkedKeys: [`${id}-${version}`], + id, + name, + version, + path, }); } else { const jsonObj = { @@ -69,8 +97,6 @@ function ResourceSelect({ type, value, onChange, disabled, ...rest }: ResourceSe showValue, fromSelect: true, activeTab, - expandedKeys: [`${id}`], - checkedKeys: [`${id}-${version}`], ...jsonObj, }); } @@ -80,8 +106,6 @@ function ResourceSelect({ type, value, onChange, disabled, ...rest }: ResourceSe showValue: undefined, fromSelect: false, activeTab: undefined, - expandedKeys: [], - checkedKeys: [], }); } close(); diff --git a/react-ui/src/pages/Dataset/components/VersionCompareModal/index.less b/react-ui/src/pages/Dataset/components/VersionCompareModal/index.less index 70de3494..f1935eb2 100644 --- a/react-ui/src/pages/Dataset/components/VersionCompareModal/index.less +++ b/react-ui/src/pages/Dataset/components/VersionCompareModal/index.less @@ -3,6 +3,7 @@ .title(@color, @background) { width: 100%; margin-bottom: 20px; + padding: 0 15px; color: @color; font-weight: 500; font-size: @font-size; diff --git a/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.less b/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.less index 70de3494..f1935eb2 100644 --- a/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.less +++ b/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.less @@ -3,6 +3,7 @@ .title(@color, @background) { width: 100%; margin-bottom: 20px; + padding: 0 15px; color: @color; font-weight: 500; font-size: @font-size; diff --git a/react-ui/src/pages/Pipeline/components/ResourceSelectorModal/index.tsx b/react-ui/src/pages/Pipeline/components/ResourceSelectorModal/index.tsx index ed6ed80e..06fdc242 100644 --- a/react-ui/src/pages/Pipeline/components/ResourceSelectorModal/index.tsx +++ b/react-ui/src/pages/Pipeline/components/ResourceSelectorModal/index.tsx @@ -18,13 +18,13 @@ export { ResourceSelectorType, selectorTypeConfig }; // 选择数据集\模型\镜像的返回类型 export type ResourceSelectorResponse = { + activeTab: CommonTabKeys; // 是我的还是公开的 id: string; // 数据集\模型\镜像 id name: string; // 数据集\模型\镜像 name version: string; // 数据集\模型\镜像版本 path: string; // 数据集\模型\镜像版本路径 - identifier: string; // 数据集\模型 identifier - owner: string; // 数据集\模型 owner - activeTab: CommonTabKeys; // 是我的还是公开的 + identifier: string; // 数据集\模型 identifier,镜像没有这个字段 + owner: string; // 数据集\模型 owner,镜像没有这个字段 }; export interface ResourceSelectorModalProps extends Omit { @@ -69,7 +69,7 @@ function ResourceSelectorModal({ onOk, ...rest }: ResourceSelectorModalProps) { - const [activeTab, setActiveTab] = useState(defaultActiveTab); + const [activeTab, setActiveTab] = useState(defaultActiveTab); const [expandedKeys, setExpandedKeys] = useState([]); const [checkedKeys, setCheckedKeys] = useState([]); const [loadedKeys, setLoadedKeys] = useState([]); @@ -234,7 +234,7 @@ function ResourceSelectorModal({ version, identifier, owner, - activeTab: activeTab as CommonTabKeys, + activeTab: activeTab, }; onOk?.(res); } else { @@ -255,7 +255,7 @@ function ResourceSelectorModal({ setActiveTab(e as CommonTabKeys)} className={styles['model-tabs']} />