|
|
|
@ -7,17 +7,6 @@ import { getNetworkMode } from '@/api/componentDeploy';
|
|
|
|
const FormItem = Form.Item;
|
|
|
|
const FormItem = Form.Item;
|
|
|
|
const Option = Select.Option;
|
|
|
|
const Option = Select.Option;
|
|
|
|
|
|
|
|
|
|
|
|
const runTypes = [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
label: '本地运行',
|
|
|
|
|
|
|
|
value: 'local'
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
label: '线上运行',
|
|
|
|
|
|
|
|
value: 'online'
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const netType = [
|
|
|
|
const netType = [
|
|
|
|
{
|
|
|
|
{
|
|
|
|
label: '桥接模式',
|
|
|
|
label: '桥接模式',
|
|
|
|
@ -102,7 +91,19 @@ const deviceColumns = [
|
|
|
|
{
|
|
|
|
{
|
|
|
|
title: '权限',
|
|
|
|
title: '权限',
|
|
|
|
dataIndex: 'permissions',
|
|
|
|
dataIndex: 'permissions',
|
|
|
|
editable: true
|
|
|
|
editable: true,
|
|
|
|
|
|
|
|
renderEdit: ({ value, onChange }) => (
|
|
|
|
|
|
|
|
<Select
|
|
|
|
|
|
|
|
value={value}
|
|
|
|
|
|
|
|
onChange={onChange}
|
|
|
|
|
|
|
|
placeholder="请选择权限"
|
|
|
|
|
|
|
|
style={{ width: '100%' }}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<Option value="rwm">rwm (读写+mknod)</Option>
|
|
|
|
|
|
|
|
<Option value="rw">rw (读写)</Option>
|
|
|
|
|
|
|
|
<Option value="r">r (只读)</Option>
|
|
|
|
|
|
|
|
</Select>
|
|
|
|
|
|
|
|
)
|
|
|
|
},
|
|
|
|
},
|
|
|
|
{
|
|
|
|
{
|
|
|
|
title: '备注',
|
|
|
|
title: '备注',
|
|
|
|
@ -113,7 +114,6 @@ const deviceColumns = [
|
|
|
|
|
|
|
|
|
|
|
|
const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) => {
|
|
|
|
const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) => {
|
|
|
|
const [form] = Form.useForm();
|
|
|
|
const [form] = Form.useForm();
|
|
|
|
const [currentRunType, setCurrentRunType] = useState('local');
|
|
|
|
|
|
|
|
const [envTypeOptions, setEnvTypeOptions] = useState([]);
|
|
|
|
const [envTypeOptions, setEnvTypeOptions] = useState([]);
|
|
|
|
const [portMappingData, setPortMappingData] = useState([]); // 端口映射数据
|
|
|
|
const [portMappingData, setPortMappingData] = useState([]); // 端口映射数据
|
|
|
|
const [directoryMountData, setDirectoryMountData] = useState([]); // 目录挂载数据
|
|
|
|
const [directoryMountData, setDirectoryMountData] = useState([]); // 目录挂载数据
|
|
|
|
@ -128,7 +128,6 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>
|
|
|
|
// 处理取消
|
|
|
|
// 处理取消
|
|
|
|
const handleCancel = () => {
|
|
|
|
const handleCancel = () => {
|
|
|
|
form.resetFields();
|
|
|
|
form.resetFields();
|
|
|
|
setCurrentRunType('local');
|
|
|
|
|
|
|
|
setPortMappingData([]);
|
|
|
|
setPortMappingData([]);
|
|
|
|
setDirectoryMountData([]);
|
|
|
|
setDirectoryMountData([]);
|
|
|
|
setDeviceMountData([]);
|
|
|
|
setDeviceMountData([]);
|
|
|
|
@ -164,9 +163,9 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>
|
|
|
|
const submitData = {
|
|
|
|
const submitData = {
|
|
|
|
...values,
|
|
|
|
...values,
|
|
|
|
deployEnvId: addItem.id,
|
|
|
|
deployEnvId: addItem.id,
|
|
|
|
portMapping: portMappingData, // 端口映射
|
|
|
|
ports: portMappingData, // 端口映射
|
|
|
|
directoryMount: directoryMountData, // 目录挂载
|
|
|
|
volumes: directoryMountData, // 目录挂载
|
|
|
|
deviceMount: deviceMountData, // 设备挂载
|
|
|
|
devices: deviceMountData, // 设备挂载
|
|
|
|
// 下面是暂时写死的数据,
|
|
|
|
// 下面是暂时写死的数据,
|
|
|
|
'restartPolicy': 'always',
|
|
|
|
'restartPolicy': 'always',
|
|
|
|
'env': [
|
|
|
|
'env': [
|
|
|
|
@ -174,7 +173,7 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>
|
|
|
|
'GIT_USER_EMAIL=componentl@component.com',
|
|
|
|
'GIT_USER_EMAIL=componentl@component.com',
|
|
|
|
'GIT_USERNAME=component',
|
|
|
|
'GIT_USERNAME=component',
|
|
|
|
'GIT_PASSWORD=component',
|
|
|
|
'GIT_PASSWORD=component',
|
|
|
|
'GIT_URL=192.168.5.119:30000'
|
|
|
|
'GIT_URL=192.168.5.158:30000'
|
|
|
|
]
|
|
|
|
]
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
@ -213,7 +212,6 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>
|
|
|
|
else {
|
|
|
|
else {
|
|
|
|
// 关闭时重置表单和数据
|
|
|
|
// 关闭时重置表单和数据
|
|
|
|
form.resetFields();
|
|
|
|
form.resetFields();
|
|
|
|
setCurrentRunType('local');
|
|
|
|
|
|
|
|
setPortMappingData([]);
|
|
|
|
setPortMappingData([]);
|
|
|
|
setDirectoryMountData([]);
|
|
|
|
setDirectoryMountData([]);
|
|
|
|
setDeviceMountData([]);
|
|
|
|
setDeviceMountData([]);
|
|
|
|
@ -224,10 +222,6 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}, [visible]);
|
|
|
|
}, [visible]);
|
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
|
|
|
console.log('selectedNetworkType:', selectedNetworkType);
|
|
|
|
|
|
|
|
}, [selectedNetworkType]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Modal
|
|
|
|
<Modal
|
|
|
|
title="容器配置"
|
|
|
|
title="容器配置"
|
|
|
|
@ -260,34 +254,6 @@ const ContainerModal = ({ addItem, visible, envType, setVisible, onSuccess }) =>
|
|
|
|
</Select>
|
|
|
|
</Select>
|
|
|
|
</FormItem>
|
|
|
|
</FormItem>
|
|
|
|
</Grid.Col>
|
|
|
|
</Grid.Col>
|
|
|
|
{/*<Grid.Col span={12}>*/}
|
|
|
|
|
|
|
|
{/* <FormItem*/}
|
|
|
|
|
|
|
|
{/* label="主机:"*/}
|
|
|
|
|
|
|
|
{/* field="deployEnvId"*/}
|
|
|
|
|
|
|
|
{/* rules={[{ required: true, message: '请选择主机' }]}*/}
|
|
|
|
|
|
|
|
{/* >*/}
|
|
|
|
|
|
|
|
{/* <Select*/}
|
|
|
|
|
|
|
|
{/* placeholder="请选择主机"*/}
|
|
|
|
|
|
|
|
{/* style={{ width: '90%' }}*/}
|
|
|
|
|
|
|
|
{/* onChange={(value) => {*/}
|
|
|
|
|
|
|
|
{/* // 选择主机后自动设置网络模式为第一个选项(桥接模式)*/}
|
|
|
|
|
|
|
|
{/* if (value && netType.length > 0) {*/}
|
|
|
|
|
|
|
|
{/* form.setFieldValue('networkMode', netType[0].value);*/}
|
|
|
|
|
|
|
|
{/* fetchNetworkMode(netType[0].value, value);*/}
|
|
|
|
|
|
|
|
{/* }*/}
|
|
|
|
|
|
|
|
{/* }}*/}
|
|
|
|
|
|
|
|
{/* >*/}
|
|
|
|
|
|
|
|
{/* {hostOptions.map((option, index) => (*/}
|
|
|
|
|
|
|
|
{/* <Option key={option.ip} value={option.id}>*/}
|
|
|
|
|
|
|
|
{/* <div style={{ display: 'flex', justifyContent: 'space-between' }}>*/}
|
|
|
|
|
|
|
|
{/* <span>{option.name}</span>*/}
|
|
|
|
|
|
|
|
{/* <span style={{ color: '#999', fontSize: 12 }}>{option.ip}</span>*/}
|
|
|
|
|
|
|
|
{/* </div>*/}
|
|
|
|
|
|
|
|
{/* </Option>*/}
|
|
|
|
|
|
|
|
{/* ))}*/}
|
|
|
|
|
|
|
|
{/* </Select>*/}
|
|
|
|
|
|
|
|
{/* </FormItem>*/}
|
|
|
|
|
|
|
|
{/*</Grid.Col>*/}
|
|
|
|
|
|
|
|
</Grid.Row>
|
|
|
|
</Grid.Row>
|
|
|
|
<Grid.Row gutter={8}>
|
|
|
|
<Grid.Row gutter={8}>
|
|
|
|
<Grid.Col span={12}>
|
|
|
|
<Grid.Col span={12}>
|
|
|
|
|