Skip to content

Commit b41acf2

Browse files
Pearl1594Pearl1594
authored
UI: Show Host OOBM parameter in form if configured (#10484)
* UI: Show Host OOBM parameter in form if configured * remove password display * address comments
1 parent a89607d commit b41acf2

File tree

3 files changed

+175
-10
lines changed

3 files changed

+175
-10
lines changed

‎ui/public/locales/en.json

+1
Original file line numberDiff line numberDiff line change
@@ -3071,6 +3071,7 @@
30713071
"message.no.description": "No description entered.",
30723072
"message.offering.internet.protocol.warning": "WARNING: IPv6 supported Networks use static routing and will require upstream routes to be configured manually.",
30733073
"message.offering.ipv6.warning": "Please refer documentation for creating IPv6 enabled Network/VPC offering <a href='http://docs.cloudstack.apache.org/en/latest/plugins/ipv6.html#isolated-network-and-vpc-tier'>IPv6 support in CloudStack - Isolated Networks and VPC Network Tiers</a>",
3074+
"message.oobm.configured": "Successfully configured out-of-band management for host",
30743075
"message.ovf.configurations": "OVF configurations available for the selected appliance. Please select the desired value. Incompatible compute offerings will get disabled.",
30753076
"message.path.description": "NFS: exported path from the server. VMFS: /datacenter name/datastore name. SharedMountPoint: path where primary storage is mounted, such as /mnt/primary.",
30763077
"message.please.confirm.remove.ssh.key.pair": "Please confirm that you want to remove this SSH key pair.",

‎ui/src/config/section/infra/hosts.js

+2-10
Original file line numberDiff line numberDiff line change
@@ -150,16 +150,8 @@ export default {
150150
message: 'label.outofbandmanagement.configure',
151151
docHelp: 'adminguide/hosts.html#out-of-band-management',
152152
dataView: true,
153-
post: true,
154-
args: ['hostid', 'address', 'port', 'username', 'password', 'driver'],
155-
mapping: {
156-
hostid: {
157-
value: (record) => { return record.id }
158-
},
159-
driver: {
160-
options: ['ipmitool', 'nestedcloudstack', 'redfish']
161-
}
162-
}
153+
popup: true,
154+
component: shallowRef(defineAsyncComponent(() => import('@/views/infra/ConfigureHostOOBM')))
163155
},
164156
{
165157
api: 'enableOutOfBandManagementForHost',

‎ui/src/views/infra/ConfigureHostOOBM.vue

+172
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
// Licensed to the Apache Software Foundation (ASF) under one
2+
// or more contributor license agreements. See the NOTICE file
3+
// distributed with this work for additional information
4+
// regarding copyright ownership. The ASF licenses this file
5+
// to you under the Apache License, Version 2.0 (the
6+
// "License"); you may not use this file except in compliance
7+
// with the License. You may obtain a copy of the License at
8+
//
9+
// http://www.apache.org/licenses/LICENSE-2.0
10+
//
11+
// Unless required by applicable law or agreed to in writing,
12+
// software distributed under the License is distributed on an
13+
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
14+
// KIND, either express or implied. See the License for the
15+
// specific language governing permissions and limitations
16+
// under the License.
17+
18+
<template>
19+
<div class="form-layout">
20+
<a-form
21+
:ref="formRef"
22+
:model="form"
23+
:rules="rules"
24+
@finish="handleSubmit"
25+
v-ctrl-enter="handleSubmit"
26+
class="form"
27+
layout="vertical"
28+
>
29+
<a-alert type="warning">
30+
<template #message>
31+
<span v-html="$t('label.outofbandmanagement.configure')" />
32+
</template>
33+
</a-alert>
34+
<div style="margin-top: 10px;">
35+
<a-form-item name="address" ref="address">
36+
<template #label>
37+
<tooltip-label :title="$t('label.address')" :tooltip="apiParams.address.description"/>
38+
</template>
39+
<a-input
40+
v-model:value="form.address"
41+
v-focus="true" />
42+
</a-form-item>
43+
<a-form-item name="port" ref="port">
44+
<template #label>
45+
<tooltip-label :title="$t('label.port')" :tooltip="apiParams.port.description"/>
46+
</template>
47+
<a-input
48+
v-model:value="form.port" />
49+
</a-form-item>
50+
<a-form-item name="username" ref="username">
51+
<template #label>
52+
<tooltip-label :title="$t('label.username')" :tooltip="apiParams.username.description"/>
53+
</template>
54+
<a-input
55+
v-model:value="form.username" />
56+
</a-form-item>
57+
<a-form-item name="password" ref="password">
58+
<template #label>
59+
<tooltip-label :title="$t('label.password')" :tooltip="apiParams.password.description"/>
60+
</template>
61+
<a-input-password
62+
v-model:value="form.password"
63+
:placeholder="apiParams.password.description"/>
64+
</a-form-item>
65+
<a-form-item name="driver" ref="driver">
66+
<template #label>
67+
<tooltip-label :title="$t('label.driver')" :tooltip="apiParams.driver.description"/>
68+
</template>
69+
<a-select
70+
v-model:value="form.driver"
71+
style="width: 100%;"
72+
optionFilterProp="value"
73+
:filterOption="(input, option) => {
74+
return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0
75+
}" >
76+
<a-select-option key="" label="">{{ }}</a-select-option>
77+
<a-select-option value="ipmitool">ipmitool</a-select-option>
78+
<a-select-option value="nestedcloudstack">nestedcloudstack</a-select-option>
79+
<a-select-option value="redfish">redfish</a-select-option>
80+
</a-select>
81+
</a-form-item>
82+
</div>
83+
<div :span="24" class="action-button">
84+
<a-button @click="onCloseAction">{{ $t('label.cancel') }}</a-button>
85+
<a-button type="primary" @click="handleSubmit" ref="submit">{{ $t('label.ok') }}</a-button>
86+
</div>
87+
</a-form>
88+
</div>
89+
</template>
90+
91+
<script>
92+
import TooltipLabel from '@/components/widgets/TooltipLabel'
93+
import { ref, reactive, toRaw } from 'vue'
94+
import { api } from '@/api'
95+
96+
export default {
97+
name: 'ConfigureHostOOBM',
98+
components: {
99+
TooltipLabel
100+
},
101+
props: {
102+
resource: {
103+
type: Object,
104+
required: true
105+
}
106+
},
107+
data () {
108+
return {
109+
}
110+
},
111+
beforeCreate () {
112+
this.apiParams = this.$getApiParams('configureOutOfBandManagement')
113+
},
114+
created () {
115+
this.initForm()
116+
},
117+
methods: {
118+
initForm () {
119+
this.formRef = ref()
120+
this.form = reactive({
121+
address: this.resource.outofbandmanagement.address || '',
122+
port: this.resource.outofbandmanagement.port || '',
123+
username: this.resource.outofbandmanagement.username || '',
124+
password: '',
125+
driver: this.resource.outofbandmanagement.driver || ''
126+
})
127+
this.rules = reactive({
128+
address: [{ required: true, message: this.$t('message.error.required.input') }],
129+
port: [{ required: true, message: this.$t('message.error.required.input') }],
130+
username: [{ required: true, message: this.$t('message.error.required.input') }],
131+
password: [{ required: true, message: this.$t('message.error.required.input') }],
132+
driver: [{ required: true, message: this.$t('message.error.required.input') }]
133+
})
134+
},
135+
handleSubmit (e) {
136+
e.preventDefault()
137+
this.formRef.value.validate().then(() => {
138+
const values = toRaw(this.form)
139+
const params = {
140+
hostid: this.resource.id,
141+
address: values.address,
142+
port: values.port,
143+
username: values.username,
144+
password: values.password,
145+
driver: values.driver
146+
}
147+
148+
api('configureOutOfBandManagement', {}, 'POST', params).then(_ => {
149+
this.$message.success(this.$t('message.oobm.configured'))
150+
this.$emit('refresh-data')
151+
this.onCloseAction()
152+
}).catch(error => {
153+
this.$notifyError(error)
154+
})
155+
})
156+
},
157+
onCloseAction () {
158+
this.$emit('close-action')
159+
}
160+
}
161+
}
162+
</script>
163+
164+
<style scoped>
165+
.form-layout {
166+
width: 30vw;
167+
168+
@media (min-width: 500px) {
169+
width: 450px;
170+
}
171+
}
172+
</style>

0 commit comments

Comments
 (0)