diff --git a/src/api/userContainer.ts b/src/api/userContainer.ts index 553f9bf..46280f7 100644 --- a/src/api/userContainer.ts +++ b/src/api/userContainer.ts @@ -26,4 +26,9 @@ export function getContainer(deployEnvId) { // 获取容器限制配置 export function getContainerLimit(deployEnvId) { return axios.get(`${urlPrefix}/userContainer/${deployEnvId}/limits`); +} + +// 获取容器配置信息 +export function getContainerConfig(deployEnvId) { + return axios.get(`${urlPrefix}/userContainer/${deployEnvId}/config`); } \ No newline at end of file diff --git a/src/pages/componentDevelopment/componentEnv/containerModal.tsx b/src/pages/componentDevelopment/componentEnv/containerModal.tsx index a51cedb..43d6697 100644 --- a/src/pages/componentDevelopment/componentEnv/containerModal.tsx +++ b/src/pages/componentDevelopment/componentEnv/containerModal.tsx @@ -13,7 +13,7 @@ import { Spin } from '@arco-design/web-react'; import EditableTable from '@/components/EditableTable'; -import { containerRegister, getContainerLimit } from '@/api/userContainer'; +import { containerRegister, getContainerConfig, getContainerLimit } from '@/api/userContainer'; import { getNetworkMode } from '@/api/componentDeploy'; const FormItem = Form.Item; @@ -209,7 +209,7 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) => } }; - const getContainerConfig = async () => { + const getLimit = async () => { setConfigLoading(true); try { const res: any = await getContainerLimit(addItem.id); @@ -228,6 +228,78 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) => } }; + const getConfig = async () => { + const res: any = await getContainerConfig(addItem.id); + if (res.code === 200 && res.data) { + const data = res.data; + + // 回显表单数据 + form.setFieldsValue({ + cpuCount: data.cpuCount || 1, + memory: data.memory || 2048, + useGpu: data.deviceRequests?.length > 0, + networkMode: data.networkMode, + networkType: data.networkType, + ip: data.ipv4Address + }); + + // 回显网卡相关数据 + if (data.networkMode) { + const networkRes: any = await getNetworkMode(data.networkMode, addItem.id); + if (networkRes.code === 200) { + setNetworkTypeList(networkRes.data); + if (data.networkType) { + setCurrentNetworkCard(data.networkType); + const selectedCard = networkRes.data.find(item => item.name === data.networkType); + setSelectedNetworkType(selectedCard ? [selectedCard] : []); + } + } + } + setCurrentIp(data.ipv4Address || ''); + + // 回显端口映射数据 + if (data.ports?.length > 0) { + setPortMappingData(data.ports.map((port, index) => ({ + key: index.toString(), + hostPort: port.hostPort, + containerPort: port.containerPort, + remake: port.remake || '' + }))); + } + + // 回显目录挂载数据 + if (data.volumes?.length > 0) { + setDirectoryMountData(data.volumes.map((vol, index) => ({ + key: index.toString(), + hostPath: vol.hostPath, + containerPath: vol.containerPath, + remake: vol.remake || '' + }))); + } + + // 回显设备挂载数据 + if (data.devices?.length > 0) { + setDeviceMountData(data.devices.map((device, index) => ({ + key: index.toString(), + hostPath: device.hostPath, + containerPath: device.containerPath, + permissions: device.permissions, + remake: device.remake || '' + }))); + } + + // 如果有配置数据,标记为已加载配置 + if (data.cpuCount || data.memory) { + // 获取限制配置以设置滑块范围 + const limitRes: any = await getContainerLimit(addItem.id); + if (limitRes.code === 200) { + setContainerConfig(limitRes.data); + } + setConfigLoaded(true); + } + } + }; + // 动态生成CPU核数的marks const cpuMarks = useMemo(() => { const max = containerConfig.maxCpuCores; @@ -262,6 +334,7 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) => useEffect(() => { if (visible) { // 不再自动加载,等用户点击按钮 + getConfig() } else { // 关闭时重置表单和数据 @@ -302,7 +375,7 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>