harikrishna-patnala commented on a change in pull request #5812:
URL: https://github.com/apache/cloudstack/pull/5812#discussion_r776564333
##########
File path: ui/src/views/infra/HostAdd.vue
##########
@@ -17,139 +17,197 @@
<template>
<a-spin :spinning="loading">
- <div class="form" v-ctrl-enter="handleSubmitForm">
+ <div class="form-layout" v-ctrl-enter="handleSubmitForm">
+ <div class="form">
+ <a-form
+ :form="form"
+ layout="vertical"
+ @submit="handleSubmitForm">
+ <a-form-item>
+ <tooltip-label slot="label" :title="$t('label.zonenamelabel')"
:tooltip="placeholder.zoneid"/>
+ <a-select
+ v-decorator="['zoneid', {
+ initialValue: this.zoneId,
+ rules: [{ required: true, message: $t('message.error.select')
}]
+ }]"
+ :placeholder="placeholder.zoneid"
+ autoFocus
+ showSearch
+ optionFilterProp="children"
+ :filterOption="(input, option) => {
+ return
option.componentOptions.propsData.label.toLowerCase().indexOf(input.toLowerCase())
>= 0
+ }"
+ @change="fetchPods">
+ <a-select-option
+ v-for="zone in zonesList"
+ :value="zone.id"
+ :key="zone.id"
+ :label="zone.name">
+ <span>
+ <resource-icon v-if="zone.icon"
:image="zone.icon.base64image" size="1x" style="margin-right: 5px"/>
+ <a-icon v-else type="global" style="margin-right: 5px" />
+ {{ zone.name }}
+ </span>
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ <a-form-item>
+ <tooltip-label slot="label" :title="$t('label.podname')"
:tooltip="placeholder.podid"/>
+ <a-select
+ v-decorator="['podid', {
+ initialValue: podId,
+ rules: [{ required: true, message: $t('message.error.select')
}]
+ }]"
+ :placeholder="placeholder.podid"
+ showSearch
+ optionFilterProp="children"
+ :filterOption="(input, option) => {
+ return
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase())
>= 0
+ }"
+ @change="fetchClusters">
+ <a-select-option
+ v-for="pod in podsList"
+ :value="pod.id"
+ :key="pod.id">
+ {{ pod.name }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ <a-form-item>
+ <tooltip-label slot="label" :title="$t('label.clustername')"
:tooltip="placeholder.clusterid"/>
+ <a-select
+ v-decorator="['clusterid', {
+ initialValue: clusterId,
+ rules: [{ required: true, message: $t('message.error.select')
}]
+ }]"
+ :placeholder="placeholder.clusterid"
+ showSearch
+ optionFilterProp="children"
+ :filterOption="(input, option) => {
+ return
option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase())
>= 0
+ }"
+ @change="handleChangeCluster">
+ <a-select-option
+ v-for="cluster in clustersList"
+ :value="cluster.id"
+ :key="cluster.id">
+ {{ cluster.name }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ <a-form-item>
+ <tooltip-label
+ slot="label"
+ :title="selectedClusterHyperVisorType === 'VMware' ?
$t('label.esx.host') : $t('label.hostnamelabel')"
+ :tooltip="placeholder.url"/>
+ <a-input
+ v-decorator="['hostname', {
+ initialValue: hostname,
+ rules: [{ required: true, message:
$t('message.error.required.input') }]
+ }]"
+ :placeholder="placeholder.url"></a-input>
+ </a-form-item>
+ <a-form-item v-if="selectedClusterHyperVisorType !== 'VMware'">
+ <tooltip-label slot="label" :title="$t('label.username')"
:tooltip="placeholder.username"/>
+ <a-input
+ v-decorator="['username', {
+ initialValue: username,
+ rules: [{ required: true, message:
$t('message.error.required.input') }]
+ }]"
+ :placeholder="placeholder.username"></a-input>
+ </a-form-item>
+ <a-form-item v-if="selectedClusterHyperVisorType !== 'VMware'">
+ <tooltip-label slot="label" :title="$t('label.password')"
:tooltip="placeholder.password"/>
+ <a-input-password
+ v-decorator="['password', {
+ initialValue: password,
+ rules: [{ required: true, message:
$t('message.error.required.input') }]
+ }]"
+ :placeholder="placeholder.password"></a-input-password>
+ </a-form-item>
+ <a-form-item v-if="selectedClusterHyperVisorType === 'Ovm3'">
+ <tooltip-label slot="label" :title="$t('label.agent.username')"
:tooltip="$t('label.agent.username')"/>
+ <a-input
+ v-decorator="['agentusername', { initialValue: agentusername }]"
+ :placeholder="$t('label.agent.username')"></a-input>
+ </a-form-item>
+ <a-form-item v-if="selectedClusterHyperVisorType === 'Ovm3'">
+ <tooltip-label slot="label" :title="$t('label.agent.password')"
:tooltip="$t('label.agent.password')"/>
+ <a-input
+ v-decorator="['agentpassword', { initialValue: agentpassword }]"
+ :placeholder="$t('label.agent.password')"></a-input>
+ </a-form-item>
+ <a-form-item v-if="selectedClusterHyperVisorType === 'Ovm3'">
+ <tooltip-label slot="label" :title="$t('label.agentport')"
:tooltip="$t('label.agentport')"/>
+ <a-input
+ v-decorator="['agentport', { initialValue: agentport }]"
+ :placeholder="$t('label.agentport')"></a-input>
+ </a-form-item>
+ <a-form-item>
+ <tooltip-label slot="label" :title="$t('label.hosttags')"
:tooltip="placeholder.hosttags"/>
Review comment:
This is to keep all host related details at one place, otherwise it is
looking like this
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
