diff --git a/react-ui/mock/components.ts b/react-ui/mock/components.ts index aecad839..ab5b5f1f 100644 --- a/react-ui/mock/components.ts +++ b/react-ui/mock/components.ts @@ -133,12 +133,20 @@ export default defineMock({ condition: '', value: { id: 21, - name: '原子掺杂识别', - code_path: 'http://172.20.32.235:30202/fanshuai/material-atom-predict.git', - branch: 'optimize', - username: null, - password: null, - ssh_private_key: null, + code_repo_name: '原子掺杂识别', + code_repo_vis: 1, + is_public: true, + git_url: 'https://gitlink.org.cn/somunslotus/material-atom-predict.git', + git_branch: 'master', + verify_mode: null, + git_user_name: null, + git_password: null, + ssh_key: null, + create_by: 'admin', + create_time: '2025-03-12T16:46:08.000+08:00', + update_by: 'admin', + update_time: '2025-03-14T14:59:19.000+08:00', + state: 1, }, rulers: {}, showValue: '原子掺杂识别', diff --git a/react-ui/src/components/CodeSelect/index.tsx b/react-ui/src/components/CodeSelect/index.tsx index 12f52c07..2ea28ccb 100644 --- a/react-ui/src/components/CodeSelect/index.tsx +++ b/react-ui/src/components/CodeSelect/index.tsx @@ -4,7 +4,7 @@ * @Description: 流水线选择代码配置表单 */ -import CodeSelectorModal from '@/components/CodeSelectorModal'; +import CodeSelectorModal, { CodeConfigData } from '@/components/CodeSelectorModal'; import KFIcon from '@/components/KFIcon'; import { openAntdModal } from '@/utils/modal'; import { Button } from 'antd'; @@ -18,19 +18,9 @@ export { type ParameterInputValue, } from '../ParameterInput'; -export type CodeSelectProps = ParameterInputProps; - -// 服务的需要的代码配置数据格式 -export type ServerCodeData = { - id: number; - name: string; - code_path: string; - branch: string; - username: string; - password: string; - ssh_private_key: string; - is_public: boolean; -}; +export interface CodeSelectProps extends ParameterInputProps { + value?: CodeConfigData; +} /** 代码配置选择表单组件 */ function CodeSelect({ @@ -44,50 +34,18 @@ function CodeSelect({ }: CodeSelectProps) { // 选择代码配置 const selectResource = () => { - const codeData = value as ServerCodeData; - const defaultSelected = - value && typeof value === 'object' - ? { - id: codeData.id, - code_repo_name: codeData.name, - git_url: codeData.code_path, - git_branch: codeData.branch, - git_user_name: codeData.username, - git_password: codeData.password, - ssh_key: codeData.ssh_private_key, - is_public: codeData.is_public, - } - : undefined; + const defaultSelected: CodeConfigData | undefined = + value && typeof value === 'object' ? value : undefined; const { close } = openAntdModal(CodeSelectorModal, { defaultSelected: defaultSelected, onOk: (res) => { if (res) { - const { - id, - code_repo_name, - git_url, - git_branch, - git_user_name, - git_password, - ssh_key, - is_public, - } = res; - const jsonObj = { - id, - name: code_repo_name, - code_path: git_url, - branch: git_branch, - username: git_user_name, - password: git_password, - ssh_private_key: ssh_key, - is_public, - }; - const jsonObjStr = JSON.stringify(jsonObj); + const { code_repo_name } = res; onChange?.({ - value: jsonObjStr, + ...res, + value: code_repo_name, showValue: code_repo_name, fromSelect: true, - ...jsonObj, }); } else { onChange?.(undefined); diff --git a/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx b/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx index 27944aac..7339135d 100644 --- a/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx +++ b/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx @@ -4,6 +4,7 @@ * @Description: 开发环境列表 */ +import { CodeConfigData } from '@/components/CodeSelectorModal'; import KFIcon from '@/components/KFIcon'; import { DevEditorStatus } from '@/enums'; import { useCacheState } from '@/hooks/useCacheState'; @@ -17,12 +18,7 @@ import { } from '@/services/developmentEnvironment'; import themes from '@/styles/theme.less'; import { parseJsonText } from '@/utils'; -import { - formatCodeConfig, - formatDataset, - formatModel, - type SelectedCodeConfig, -} from '@/utils/format'; +import { formatCodeConfig, formatDataset, formatModel } from '@/utils/format'; import { openAntdModal } from '@/utils/modal'; import { to } from '@/utils/promise'; import SessionStorage from '@/utils/sessionStorage'; @@ -55,7 +51,7 @@ export type EditorData = { dataset?: string | DatasetData; model?: string | ModelData; image?: string; - code_config?: string | SelectedCodeConfig; + code_config?: string | CodeConfigData; }; function EditorList() { @@ -211,7 +207,7 @@ function EditorList() { const gotoCodeConfig = (record: EditorData, e: React.MouseEvent) => { e.stopPropagation(); - const codeConfig = record.code_config as SelectedCodeConfig; + const codeConfig = record.code_config as CodeConfigData; const url = formatCodeConfig(codeConfig)?.url; if (url) { window.open(url, '_blank'); diff --git a/react-ui/src/pages/Pipeline/components/PipelineNodeDrawer/index.tsx b/react-ui/src/pages/Pipeline/components/PipelineNodeDrawer/index.tsx index 7fac7e0b..ec039b53 100644 --- a/react-ui/src/pages/Pipeline/components/PipelineNodeDrawer/index.tsx +++ b/react-ui/src/pages/Pipeline/components/PipelineNodeDrawer/index.tsx @@ -1,5 +1,4 @@ -import { type ServerCodeData } from '@/components/CodeSelect'; -import CodeSelectorModal from '@/components/CodeSelectorModal'; +import CodeSelectorModal, { CodeConfigData } from '@/components/CodeSelectorModal'; import KFIcon from '@/components/KFIcon'; import ParameterInput, { requiredValidator } from '@/components/ParameterInput'; import ParameterSelect, { type ParameterSelectDataType } from '@/components/ParameterSelect'; @@ -16,7 +15,6 @@ import { PipelineNodeModelParameter, PipelineNodeModelSerialize, } from '@/types'; -import { parseJsonText } from '@/utils'; import { openAntdModal } from '@/utils/modal'; import { to } from '@/utils/promise'; import { removeFormListItem } from '@/utils/ui'; @@ -157,47 +155,15 @@ const PipelineNodeParameter = forwardRef(({ onFormChange }: PipelineNodeParamete formItemName: NamePath, item: PipelineNodeModelParameter | Pick, ) => { - const jsonValue = form.getFieldValue(formItemName)?.value; - const fieldValue = parseJsonText(jsonValue) as ServerCodeData; - const defaultSelected = fieldValue - ? { - id: fieldValue.id, - code_repo_name: fieldValue.name, - git_url: fieldValue.code_path, - git_branch: fieldValue.branch, - git_user_name: fieldValue.username, - git_password: fieldValue.password, - ssh_key: fieldValue.ssh_private_key, - is_public: fieldValue.is_public, - } - : undefined; + const defaultSelected = form.getFieldValue(formItemName)?.value as CodeConfigData; const { close } = openAntdModal(CodeSelectorModal, { defaultSelected, onOk: (res) => { if (res) { - const { - id, - code_repo_name, - git_url, - git_branch, - git_user_name, - git_password, - ssh_key, - is_public, - } = res; - const value = JSON.stringify({ - id, - name: code_repo_name, - code_path: git_url, - branch: git_branch, - username: git_user_name, - password: git_password, - ssh_private_key: ssh_key, - is_public, - }); + const { code_repo_name } = res; form.setFieldValue(formItemName, { ...item, - value, + value: res, showValue: code_repo_name, fromSelect: true, }); @@ -249,19 +215,12 @@ const PipelineNodeParameter = forwardRef(({ onFormChange }: PipelineNodeParamete checkedKeys: [`${image_id}-${id}`], }); } else { - const { activeTab, id, name, version, path, identifier, owner } = res; - const value = { - id, - name, - version, - path, - identifier, - owner, - }; + const { activeTab, ...rest } = res; + const { id, name, version } = rest; const showValue = `${name}:${version}`; form.setFieldValue(formItemName, { ...item, - value, + value: rest, showValue, fromSelect: true, activeTab, diff --git a/react-ui/src/utils/format.ts b/react-ui/src/utils/format.ts index 0946e7f6..03607bd0 100644 --- a/react-ui/src/utils/format.ts +++ b/react-ui/src/utils/format.ts @@ -1,4 +1,5 @@ import { BasicInfoLink } from '@/components/BasicInfo/types'; +import { CodeConfigData } from '@/components/CodeSelectorModal'; import { ResourceSelectorResponse } from '@/components/ResourceSelectorModal'; import { ResourceInfoTabKeys } from '@/pages/Dataset/components/ResourceInfo'; import { @@ -12,13 +13,6 @@ import { getGitUrl } from '@/utils'; // 格式化日期 export { formatDate } from '@/utils/date'; -export type SelectedCodeConfig = { - code_path: string; - branch: string; - showValue?: string; // 前端使用的 - show_value?: string; // 后端使用的 -}; - /** * 格式化数据集数组 * @@ -77,7 +71,7 @@ export const formatMirror = (mirror: ResourceSelectorResponse): string | undefin if (!mirror) { return undefined; } - return mirror.path; + return mirror.url; }; /** @@ -87,20 +81,20 @@ export const formatMirror = (mirror: ResourceSelectorResponse): string | undefin * @return 基本信息链接对象 */ export const formatCodeConfig = ( - project?: ProjectDependency | SelectedCodeConfig, + project?: ProjectDependency | CodeConfigData, ): BasicInfoLink | undefined => { if (!project) { return undefined; } - // 创建表单，CodeSelect 组件返回，目前有流水线、模型部署、超参数自动寻优创建时选择了代码配置 - if ('code_path' in project) { - const { showValue, show_value, code_path, branch } = project; + // 创建表单，CodeSelect 组件返回，目前有流水线、超参数自动寻优、主动学习、开发环境创建时选择了代码配置 + if ('code_repo_name' in project) { + const { code_repo_name, git_url, git_branch } = project; return { - value: showValue || show_value, - url: getGitUrl(code_path, branch), + value: code_repo_name, + url: getGitUrl(git_url, git_branch), }; } else { - // 数据集和模型的代码配置 + // 数据集和模型详情的代码配置 const { url, branch, name } = project; return { value: name,