Skip to content

Commit 06f3d90

Browse files
davidjumanidavidjumani
authored
ui: Update placeholders for adding new tier (#5326)
* ui: Update placeholders for adding new tier * Fix VpcTiersTab * Removing icon style and colon
1 parent 5ed3246 commit 06f3d90

File tree

2 files changed

+57
-16
lines changed

2 files changed

+57
-16
lines changed

‎ui/public/locales/en.json‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -333,7 +333,7 @@
333333
"label.add.new.netscaler": "Add new NetScaler",
334334
"label.add.new.pa": "Add new Palo Alto",
335335
"label.add.new.srx": "Add new SRX",
336-
"label.add.new.tier": "Add new tier",
336+
"label.add.new.tier": "Add New Tier",
337337
"label.add.nfs.secondary.staging.store": "Add NFS Secondary Staging Store",
338338
"label.add.niciranvp.device": "Add Nvp Controller",
339339
"label.add.note": "Add Note",
@@ -617,8 +617,6 @@
617617
"label.create.account": "Create Account",
618618
"label.create.backup": "Start Backup",
619619
"label.create.network": "Create New Network",
620-
"label.create.network.gateway.description": "The gateway of the tier in the super CIDR range and not overlapping the CIDR of any other tier in this VPC.",
621-
"label.create.network.netmask.description": "Netmask of the tier. For example, with VPC CIDR of 10.0.0.0/16 and network tier CIDR of 10.1.1.0/24, gateway is 10.1.1.1 and netmask is 255.255.255.0",
622620
"label.create.nfs.secondary.staging.storage": "Create NFS Secondary Staging Store",
623621
"label.create.nfs.secondary.staging.store": "Create NFS secondary staging store",
624622
"label.create.project": "Create project",
@@ -628,6 +626,12 @@
628626
"label.create.snapshot.for.volume": "Created snapshot for volume",
629627
"label.create.ssh.key.pair": "Create a SSH Key Pair",
630628
"label.create.template": "Create template",
629+
"label.create.tier.aclid.description": "The ACL associated with the Tier",
630+
"label.create.tier.externalid.description": "ID of the network in an external system",
631+
"label.create.tier.gateway.description": "Gateway of the tier in the super CIDR range, not overlapping the CIDR of other tier in this VPC.",
632+
"label.create.tier.name.description": "A unique name for the tier",
633+
"label.create.tier.netmask.description": "Netmask of the tier. For example 255.255.255.0",
634+
"label.create.tier.networkofferingid.description": "The network offering for the tier",
631635
"label.create.user": "Create user",
632636
"label.create.vpn.connection": "Create VPN Connection",
633637
"label.created": "Created",
@@ -2163,7 +2167,6 @@
21632167
"label.unauthorized": "Unauthorized",
21642168
"label.unavailable": "Unavailable",
21652169
"label.unhealthy.threshold": "Unhealthy Threshold",
2166-
"label.unique.name.tier": "A unique name of the tier",
21672170
"label.unit": "Usage Unit",
21682171
"label.unknown": "Unknown",
21692172
"label.unlimited": "Unlimited",

‎ui/src/views/network/VpcTiersTab.vue‎

Lines changed: 50 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
icon="plus"
2323
style="width: 100%;margin-bottom: 20px;"
2424
:disabled="!('createNetwork' in $store.getters.apis)"
25-
@click="handleOpenModal">{{ $t('label.add.network') }}</a-button>
25+
@click="handleOpenModal">{{ $t('label.add.new.tier') }}</a-button>
2626
<a-list class="list">
2727
<a-list-item v-for="(network, idx) in networks" :key="idx" class="list__item">
2828
<div class="list__item-outer-container">
@@ -161,36 +161,74 @@
161161
@ok="handleAddNetworkSubmit">
162162
<a-spin :spinning="modalLoading">
163163
<a-form @submit.prevent="handleAddNetworkSubmit" :form="form">
164-
<a-form-item :label="$t('label.name')">
164+
<a-form-item :colon="false">
165+
<span slot="label">
166+
{{ $t('label.name') }}
167+
<a-tooltip placement="right" :title="$t('label.create.tier.name.description')">
168+
<a-icon type="info-circle" />
169+
</a-tooltip>
170+
</span>
165171
<a-input
166-
:placeholder="$t('label.unique.name.tier')"
167-
v-decorator="['name',{rules: [{ required: true, message: `${$t('label.required')}` }]}]"
168-
autoFocus></a-input>
172+
:placeholder="$t('label.create.tier.name.description')"
173+
v-decorator="['name', {rules: [{ required: true, message: `${$t('label.required')}` }]}]"
174+
autoFocus />
169175
</a-form-item>
170-
<a-form-item :label="$t('label.networkofferingid')">
176+
<a-form-item :colon="false">
177+
<span slot="label">
178+
{{ $t('label.networkofferingid') }}
179+
<a-tooltip placement="right" :title="$t('label.create.tier.networkofferingid.description')">
180+
<a-icon type="info-circle" />
181+
</a-tooltip>
182+
</span>
171183
<a-select
172184
v-decorator="['networkOffering',{rules: [{ required: true, message: `${$t('label.required')}` }]}]">
173185
<a-select-option v-for="item in networkOfferings" :key="item.id" :value="item.id">
174186
{{ item.displaytext || item.name || item.description }}
175187
</a-select-option>
176188
</a-select>
177189
</a-form-item>
178-
<a-form-item :label="$t('label.gateway')">
190+
<a-form-item :colon="false">
191+
<span slot="label">
192+
{{ $t('label.gateway') }}
193+
<a-tooltip placement="right" :title="$t('label.create.tier.gateway.description')">
194+
<a-icon type="info-circle" />
195+
</a-tooltip>
196+
</span>
179197
<a-input
180-
:placeholder="$t('label.create.network.gateway.description')"
198+
:placeholder="$t('label.create.tier.gateway.description')"
181199
v-decorator="['gateway',{rules: [{ required: true, message: `${$t('label.required')}` }]}]"></a-input>
182200
</a-form-item>
183-
<a-form-item :label="$t('label.netmask')">
201+
<a-form-item :colon="false">
202+
<span slot="label">
203+
{{ $t('label.netmask') }}
204+
<a-tooltip placement="right" :title="$t('label.create.tier.netmask.description')">
205+
<a-icon type="info-circle" />
206+
</a-tooltip>
207+
</span>
184208
<a-input
185-
:placeholder="$t('label.create.network.netmask.description')"
209+
:placeholder="$t('label.create.tier.netmask.description')"
186210
v-decorator="['netmask',{rules: [{ required: true, message: `${$t('label.required')}` }]}]"></a-input>
187211
</a-form-item>
188-
<a-form-item :label="$t('label.externalid')">
212+
<a-form-item :colon="false">
213+
<span slot="label">
214+
{{ $t('label.externalid') }}
215+
<a-tooltip placement="right" :title="$t('label.create.tier.externalid.description')">
216+
<a-icon type="info-circle" />
217+
</a-tooltip>
218+
</span>
189219
<a-input
220+
:placeholder=" $t('label.create.tier.externalid.description')"
190221
v-decorator="['externalId']"></a-input>
191222
</a-form-item>
192-
<a-form-item :label="$t('label.aclid')">
223+
<a-form-item :colon="false">
224+
<span slot="label">
225+
{{ $t('label.aclid') }}
226+
<a-tooltip placement="right" :title="$t('label.create.tier.aclid.description')">
227+
<a-icon type="info-circle" />
228+
</a-tooltip>
229+
</span>
193230
<a-select
231+
:placeholder="$t('label.create.tier.aclid.description')"
194232
v-decorator="['acl',{rules: [{ required: true, message: `${$t('label.required')}` }]}]"
195233
@change="val => { this.handleNetworkAclChange(val) }">
196234
<a-select-option v-for="item in networkAclList" :key="item.id" :value="item.id">

0 commit comments

Comments
 (0)