Skip to content

Commit 2327e83

Browse files
vishesh92vishesh92
authored
UI: Fix listing of resources for ASG belonging to a project (#13187)
1 parent 2cd8c5e commit 2327e83

5 files changed

Lines changed: 90 additions & 34 deletions

File tree

‎ui/src/utils/util.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,3 +111,12 @@ export function toCsv ({ keys = null, data = null, columnDelimiter = ',', lineDe
111111

112112
return result
113113
}
114+
115+
// Adds the projectid of a project-scoped resource to the given API params, so
116+
// that listing calls are correctly scoped to the resource's project.
117+
export function addProjectFilter (params, resource) {
118+
if (resource?.projectid) {
119+
params.projectid = resource.projectid
120+
}
121+
return params
122+
}

‎ui/src/views/compute/AutoScaleDownPolicyTab.vue‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -324,6 +324,7 @@
324324

325325
<script>
326326
import { api } from '@/api'
327+
import { addProjectFilter } from '@/utils/util'
327328
import Status from '@/components/widgets/Status'
328329
import TooltipButton from '@/components/widgets/TooltipButton'
329330
import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -425,10 +426,12 @@ export default {
425426
methods: {
426427
fetchInitData () {
427428
this.loading = true
428-
api('listAutoScaleVmGroups', {
429+
const params = {
429430
listAll: true,
430431
id: this.resource.id
431-
}).then(response => {
432+
}
433+
addProjectFilter(params, this.resource)
434+
api('listAutoScaleVmGroups', params).then(response => {
432435
const lbruleid = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.lbruleid
433436
this.policies = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.scaledownpolicies
434437
if (this.selectedPolicyId) {
@@ -437,10 +440,12 @@ export default {
437440
this.policy = this.policies?.[0]
438441
this.selectedPolicyId = this.policy.id
439442
}
440-
api('listLoadBalancerRules', {
443+
const lbParams = {
441444
listAll: true,
442445
id: lbruleid
443-
}).then(response => {
446+
}
447+
addProjectFilter(lbParams, this.resource)
448+
api('listLoadBalancerRules', lbParams).then(response => {
444449
const networkid = response.listloadbalancerrulesresponse?.loadbalancerrule?.[0]?.networkid
445450
api('listNetworks', {
446451
listAll: true,
@@ -464,10 +469,12 @@ export default {
464469
},
465470
fetchData () {
466471
this.loading = true
467-
api('listAutoScalePolicies', {
472+
const params = {
468473
listAll: true,
469474
id: this.selectedPolicyId
470-
}).then(response => {
475+
}
476+
addProjectFilter(params, this.resource)
477+
api('listAutoScalePolicies', params).then(response => {
471478
this.policy = response.listautoscalepoliciesresponse?.autoscalepolicy[0]
472479
}).finally(() => {
473480
this.loading = false

‎ui/src/views/compute/AutoScaleLoadBalancing.vue‎

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -298,6 +298,7 @@
298298
<script>
299299
import { ref, reactive, toRaw, nextTick } from 'vue'
300300
import { api } from '@/api'
301+
import { addProjectFilter } from '@/utils/util'
301302
import { mixinForm } from '@/utils/mixin'
302303
import Status from '@/components/widgets/Status'
303304
import TooltipButton from '@/components/widgets/TooltipButton'
@@ -462,12 +463,14 @@ export default {
462463
this.lbRules = []
463464
this.stickinessPolicies = []
464465
465-
api('listLoadBalancerRules', {
466+
const params = {
466467
listAll: true,
467468
id: this.resource.lbruleid,
468469
page: this.page,
469470
pageSize: this.pageSize
470-
}).then(response => {
471+
}
472+
addProjectFilter(params, this.resource)
473+
api('listLoadBalancerRules', params).then(response => {
471474
this.lbRules = response.listloadbalancerrulesresponse.loadbalancerrule || []
472475
this.totalCount = response.listloadbalancerrulesresponse.count || 0
473476
}).then(() => {
@@ -518,16 +521,19 @@ export default {
518521
},
519522
fetchAutoScaleVMgroups () {
520523
this.loading = true
521-
this.lbRules.forEach(rule => {
522-
api('listAutoScaleVmGroups', {
524+
const requests = this.lbRules.map(rule => {
525+
const params = {
523526
listAll: true,
524527
lbruleid: rule.id
525-
}).then(response => {
528+
}
529+
addProjectFilter(params, this.resource)
530+
return api('listAutoScaleVmGroups', params).then(response => {
526531
rule.autoscalevmgroup = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]
527-
}).finally(() => {
528-
this.loading = false
529532
})
530533
})
534+
Promise.all(requests).finally(() => {
535+
this.loading = false
536+
})
531537
},
532538
returnAlgorithmName (name) {
533539
switch (name) {

‎ui/src/views/compute/AutoScaleUpPolicyTab.vue‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -324,6 +324,7 @@
324324

325325
<script>
326326
import { api } from '@/api'
327+
import { addProjectFilter } from '@/utils/util'
327328
import Status from '@/components/widgets/Status'
328329
import TooltipButton from '@/components/widgets/TooltipButton'
329330
import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -425,10 +426,12 @@ export default {
425426
methods: {
426427
fetchInitData () {
427428
this.loading = true
428-
api('listAutoScaleVmGroups', {
429+
const params = {
429430
listAll: true,
430431
id: this.resource.id
431-
}).then(response => {
432+
}
433+
addProjectFilter(params, this.resource)
434+
api('listAutoScaleVmGroups', params).then(response => {
432435
const lbruleid = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.lbruleid
433436
this.policies = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.scaleuppolicies
434437
if (this.selectedPolicyId) {
@@ -437,10 +440,12 @@ export default {
437440
this.policy = this.policies?.[0]
438441
this.selectedPolicyId = this.policy.id
439442
}
440-
api('listLoadBalancerRules', {
443+
const lbParams = {
441444
listAll: true,
442445
id: lbruleid
443-
}).then(response => {
446+
}
447+
addProjectFilter(lbParams, this.resource)
448+
api('listLoadBalancerRules', lbParams).then(response => {
444449
const networkid = response.listloadbalancerrulesresponse?.loadbalancerrule?.[0]?.networkid
445450
api('listNetworks', {
446451
listAll: true,
@@ -464,10 +469,12 @@ export default {
464469
},
465470
fetchData () {
466471
this.loading = true
467-
api('listAutoScalePolicies', {
472+
const params = {
468473
listAll: true,
469474
id: this.selectedPolicyId
470-
}).then(response => {
475+
}
476+
addProjectFilter(params, this.resource)
477+
api('listAutoScalePolicies', params).then(response => {
471478
this.policy = response.listautoscalepoliciesresponse?.autoscalepolicy[0]
472479
}).finally(() => {
473480
this.loading = false

‎ui/src/views/compute/AutoScaleVmProfile.vue‎

Lines changed: 42 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@
6262
<div class="form__label">
6363
<tooltip-label :title="$t('label.templatename')" :tooltip="createAutoScaleVmProfileApiParams.templateid.description"/>
6464
</div>
65-
{{ getTemplateName(templateid) }}
65+
{{ templateName || templateid }}
6666
</div>
6767
</div>
6868
<div class="form">
@@ -199,7 +199,7 @@
199199
<a-modal
200200
:title="$t('label.edit.autoscale.vmprofile')"
201201
:visible="editProfileModalVisible"
202-
:afterClose="closeModal"
202+
:afterClose="onModalClosed"
203203
:maskClosable="false"
204204
:closable="true"
205205
:footer="null"
@@ -284,7 +284,7 @@
284284
</div>
285285
</div>
286286
<div :span="24" class="action-button">
287-
<a-button :loading="loading" @click="closeModal">{{ $t('label.cancel') }}</a-button>
287+
<a-button :loading="loading" @click="editProfileModalVisible = false">{{ $t('label.cancel') }}</a-button>
288288
<a-button :loading="loading" ref="submit" type="primary" @click="updateAutoScaleVmProfile">{{ $t('label.ok') }}</a-button>
289289
</div>
290290
</a-modal>
@@ -308,6 +308,7 @@
308308

309309
<script>
310310
import { api } from '@/api'
311+
import { addProjectFilter } from '@/utils/util'
311312
import { isAdmin, isAdminOrDomainAdmin } from '@/role'
312313
import Status from '@/components/widgets/Status'
313314
import TooltipButton from '@/components/widgets/TooltipButton'
@@ -338,6 +339,7 @@ export default {
338339
autoscaleuserid: null,
339340
expungevmgraceperiod: null,
340341
templateid: null,
342+
templateName: null,
341343
serviceofferingid: null,
342344
userdata: null,
343345
userdataid: null,
@@ -422,6 +424,7 @@ export default {
422424
domainid: this.resource.domainid,
423425
account: this.resource.account
424426
}
427+
addProjectFilter(params, this.resource)
425428
if (isAdmin()) {
426429
params.templatefilter = 'all'
427430
} else {
@@ -436,6 +439,7 @@ export default {
436439
listall: 'true',
437440
issystem: 'false'
438441
}
442+
addProjectFilter(params, this.resource)
439443
if (isAdminOrDomainAdmin()) {
440444
params.isrecursive = 'true'
441445
}
@@ -446,15 +450,18 @@ export default {
446450
},
447451
fetchData () {
448452
this.loading = true
449-
api('listAutoScaleVmProfiles', {
453+
const params = {
450454
listAll: true,
451455
id: this.resource.vmprofileid
452-
}).then(response => {
456+
}
457+
addProjectFilter(params, this.resource)
458+
api('listAutoScaleVmProfiles', params).then(response => {
453459
this.profileid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.id
454460
this.autoscaleuserid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.autoscaleuserid
455461
this.expungevmgraceperiod = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.expungevmgraceperiod
456462
this.serviceofferingid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.serviceofferingid
457463
this.templateid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.templateid
464+
this.fetchTemplate(this.templateid)
458465
this.userdata = this.decodeUserData(decodeURIComponent(response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.userdata || ''))
459466
this.userdataid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.userdataid
460467
this.userdataname = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.userdataname
@@ -468,13 +475,24 @@ export default {
468475
this.loading = false
469476
})
470477
},
471-
getTemplateName (templateid) {
472-
for (const template of this.templatesList) {
473-
if (template.id === templateid) {
474-
return template.name
475-
}
478+
fetchTemplate (templateid) {
479+
if (!templateid) {
480+
this.templateName = null
481+
return
476482
}
477-
return ''
483+
const params = {
484+
id: templateid,
485+
templatefilter: isAdmin() ? 'all' : 'executable'
486+
}
487+
addProjectFilter(params, this.resource)
488+
api('listTemplates', params).then(json => {
489+
// Ignore stale responses if templateid changed while this request was in flight.
490+
if (templateid !== this.templateid) return
491+
this.templateName = json.listtemplatesresponse?.template?.[0]?.name || templateid
492+
}).catch(() => {
493+
if (templateid !== this.templateid) return
494+
this.templateName = templateid
495+
})
478496
},
479497
getServiceOfferingName (serviceofferingid) {
480498
for (const serviceoffering of this.serviceOfferingsList) {
@@ -576,16 +594,21 @@ export default {
576594
this.$pollJob({
577595
jobId: response.updateautoscalevmprofileresponse.jobid,
578596
successMethod: (result) => {
597+
this.fetchData()
579598
},
580599
errorMessage: this.$t('message.update.autoscale.vm.profile.failed'),
581600
errorMethod: () => {
601+
this.fetchData()
582602
}
583603
})
584-
}).finally(() => {
604+
}).catch(() => {
605+
// fetchData() resets loading once the job completes; reset here only on submit failure.
585606
this.loading = false
586607
})
587608
},
588609
updateAutoScaleVmProfile () {
610+
if (this.loading) return
611+
this.loading = true
589612
const params = {
590613
id: this.profileid,
591614
expungevmgraceperiod: this.expungevmgraceperiod,
@@ -604,21 +627,25 @@ export default {
604627
this.$pollJob({
605628
jobId: response.updateautoscalevmprofileresponse.jobid,
606629
successMethod: (result) => {
630+
this.loading = false
631+
// Closing the modal triggers afterClose -> onModalClosed, which refreshes the data.
632+
this.editProfileModalVisible = false
607633
},
608634
errorMessage: this.$t('message.update.autoscale.vm.profile.failed'),
609635
errorMethod: () => {
636+
this.loading = false
610637
}
611638
})
612-
}).finally(() => {
639+
}).catch(() => {
613640
this.loading = false
614641
})
615642
},
616643
decodeUserData (userdata) {
617644
const decodedData = Buffer.from(userdata, 'base64')
618645
return decodedData.toString('utf-8')
619646
},
620-
closeModal () {
621-
this.editProfileModalVisible = false
647+
onModalClosed () {
648+
this.fetchData()
622649
}
623650
}
624651
}

0 commit comments

Comments
 (0)