Skip to content

UI: Fix listing of resources for ASG belonging to a project #13187

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
vishesh92 wants to merge 2 commits into
base: 4.20
Choose a base branch
from
Open

UI: Fix listing of resources for ASG belonging to a project #13187

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f26cbfe
Fix listing of resorces for ASG belonging to a project
vishesh92 May 19, 2026
4210b8e
Address comments
vishesh92 Jul 1, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions ui/src/utils/util.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,3 +102,12 @@ export function toCsv ({ keys = null, data = null, columnDelimiter = ',', lineDe

return result
}

// Adds the projectid of a project-scoped resource to the given API params, so
// that listing calls are correctly scoped to the resource's project.
export function addProjectFilter (params, resource) {
if (resource?.projectid) {
params.projectid = resource.projectid
}
return params
}
19 changes: 13 additions & 6 deletions ui/src/views/compute/AutoScaleDownPolicyTab.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -324,6 +324,7 @@

<script>
import { api } from '@/api'
import { addProjectFilter } from '@/utils/util'
import Status from '@/components/widgets/Status'
import TooltipButton from '@/components/widgets/TooltipButton'
import TooltipLabel from '@/components/widgets/TooltipLabel'
Expand Down Expand Up @@ -425,10 +426,12 @@ export default {
methods: {
fetchInitData () {
this.loading = true
api('listAutoScaleVmGroups', {
const params = {
listAll: true,
id: this.resource.id
}).then(response => {
}
addProjectFilter(params, this.resource)
api('listAutoScaleVmGroups', params).then(response => {
Comment on lines +429 to +434

@DaanHoogland DaanHoogland May 20, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this change happens a lot. should it be a method?

const lbruleid = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.lbruleid
this.policies = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.scaledownpolicies
if (this.selectedPolicyId) {
Expand All @@ -437,10 +440,12 @@ export default {
this.policy = this.policies?.[0]
this.selectedPolicyId = this.policy.id
}
api('listLoadBalancerRules', {
const lbParams = {
listAll: true,
id: lbruleid
}).then(response => {
}
addProjectFilter(lbParams, this.resource)
api('listLoadBalancerRules', lbParams).then(response => {
const networkid = response.listloadbalancerrulesresponse?.loadbalancerrule?.[0]?.networkid
api('listNetworks', {
listAll: true,
Expand All @@ -464,10 +469,12 @@ export default {
},
fetchData () {
this.loading = true
api('listAutoScalePolicies', {
const params = {
listAll: true,
id: this.selectedPolicyId
}).then(response => {
}
addProjectFilter(params, this.resource)
api('listAutoScalePolicies', params).then(response => {
this.policy = response.listautoscalepoliciesresponse?.autoscalepolicy[0]
}).finally(() => {
this.loading = false
Expand Down
20 changes: 13 additions & 7 deletions ui/src/views/compute/AutoScaleLoadBalancing.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -298,6 +298,7 @@
<script>
import { ref, reactive, toRaw, nextTick } from 'vue'
import { api } from '@/api'
import { addProjectFilter } from '@/utils/util'
import { mixinForm } from '@/utils/mixin'
import Status from '@/components/widgets/Status'
import TooltipButton from '@/components/widgets/TooltipButton'
Expand Down Expand Up @@ -462,12 +463,14 @@ export default {
this.lbRules = []
this.stickinessPolicies = []

api('listLoadBalancerRules', {
const params = {
listAll: true,
id: this.resource.lbruleid,
page: this.page,
pageSize: this.pageSize
}).then(response => {
}
addProjectFilter(params, this.resource)
api('listLoadBalancerRules', params).then(response => {
this.lbRules = response.listloadbalancerrulesresponse.loadbalancerrule || []
this.totalCount = response.listloadbalancerrulesresponse.count || 0
}).then(() => {
Expand Down Expand Up @@ -518,16 +521,19 @@ export default {
},
fetchAutoScaleVMgroups () {
this.loading = true
this.lbRules.forEach(rule => {
api('listAutoScaleVmGroups', {
const requests = this.lbRules.map(rule => {
const params = {
listAll: true,
lbruleid: rule.id
}).then(response => {
}
addProjectFilter(params, this.resource)
return api('listAutoScaleVmGroups', params).then(response => {
rule.autoscalevmgroup = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]
}).finally(() => {
this.loading = false
})
})
Promise.all(requests).finally(() => {
this.loading = false
})
},
returnAlgorithmName (name) {
switch (name) {
Expand Down
19 changes: 13 additions & 6 deletions ui/src/views/compute/AutoScaleUpPolicyTab.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -324,6 +324,7 @@

<script>
import { api } from '@/api'
import { addProjectFilter } from '@/utils/util'
import Status from '@/components/widgets/Status'
import TooltipButton from '@/components/widgets/TooltipButton'
import TooltipLabel from '@/components/widgets/TooltipLabel'
Expand Down Expand Up @@ -425,10 +426,12 @@ export default {
methods: {
fetchInitData () {
this.loading = true
api('listAutoScaleVmGroups', {
const params = {
listAll: true,
id: this.resource.id
}).then(response => {
}
addProjectFilter(params, this.resource)
api('listAutoScaleVmGroups', params).then(response => {
const lbruleid = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.lbruleid
this.policies = response.listautoscalevmgroupsresponse?.autoscalevmgroup?.[0]?.scaleuppolicies
if (this.selectedPolicyId) {
Expand All @@ -437,10 +440,12 @@ export default {
this.policy = this.policies?.[0]
this.selectedPolicyId = this.policy.id
}
api('listLoadBalancerRules', {
const lbParams = {
listAll: true,
id: lbruleid
}).then(response => {
}
addProjectFilter(lbParams, this.resource)
api('listLoadBalancerRules', lbParams).then(response => {
const networkid = response.listloadbalancerrulesresponse?.loadbalancerrule?.[0]?.networkid
api('listNetworks', {
listAll: true,
Expand All @@ -464,10 +469,12 @@ export default {
},
fetchData () {
this.loading = true
api('listAutoScalePolicies', {
const params = {
listAll: true,
id: this.selectedPolicyId
}).then(response => {
}
addProjectFilter(params, this.resource)
api('listAutoScalePolicies', params).then(response => {
this.policy = response.listautoscalepoliciesresponse?.autoscalepolicy[0]
}).finally(() => {
this.loading = false
Expand Down
57 changes: 42 additions & 15 deletions ui/src/views/compute/AutoScaleVmProfile.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
<div class="form__label">
<tooltip-label :title="$t('label.templatename')" :tooltip="createAutoScaleVmProfileApiParams.templateid.description"/>
</div>
{{ getTemplateName(templateid) }}
{{ templateName || templateid }}
</div>
</div>
<div class="form">
Expand Down Expand Up @@ -199,7 +199,7 @@
<a-modal
:title="$t('label.edit.autoscale.vmprofile')"
:visible="editProfileModalVisible"
:afterClose="closeModal"
:afterClose="onModalClosed"
:maskClosable="false"
:closable="true"
:footer="null"
Expand Down Expand Up @@ -284,7 +284,7 @@
</div>
</div>
<div :span="24" class="action-button">
<a-button :loading="loading" @click="closeModal">{{ $t('label.cancel') }}</a-button>
<a-button :loading="loading" @click="editProfileModalVisible = false">{{ $t('label.cancel') }}</a-button>
<a-button :loading="loading" ref="submit" type="primary" @click="updateAutoScaleVmProfile">{{ $t('label.ok') }}</a-button>
</div>
</a-modal>
Expand All @@ -308,6 +308,7 @@

<script>
import { api } from '@/api'
import { addProjectFilter } from '@/utils/util'
import { isAdmin, isAdminOrDomainAdmin } from '@/role'
import Status from '@/components/widgets/Status'
import TooltipButton from '@/components/widgets/TooltipButton'
Expand Down Expand Up @@ -338,6 +339,7 @@ export default {
autoscaleuserid: null,
expungevmgraceperiod: null,
templateid: null,
templateName: null,
serviceofferingid: null,
userdata: null,
userdataid: null,
Expand Down Expand Up @@ -422,6 +424,7 @@ export default {
domainid: this.resource.domainid,
account: this.resource.account
}
addProjectFilter(params, this.resource)
if (isAdmin()) {
params.templatefilter = 'all'
} else {
Expand All @@ -436,6 +439,7 @@ export default {
listall: 'true',
issystem: 'false'
}
addProjectFilter(params, this.resource)
if (isAdminOrDomainAdmin()) {
params.isrecursive = 'true'
}
Expand All @@ -446,15 +450,18 @@ export default {
},
fetchData () {
this.loading = true
api('listAutoScaleVmProfiles', {
const params = {
listAll: true,
id: this.resource.vmprofileid
}).then(response => {
}
addProjectFilter(params, this.resource)
api('listAutoScaleVmProfiles', params).then(response => {
this.profileid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.id
this.autoscaleuserid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.autoscaleuserid
this.expungevmgraceperiod = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.expungevmgraceperiod
this.serviceofferingid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.serviceofferingid
this.templateid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.templateid
this.fetchTemplate(this.templateid)
this.userdata = this.decodeUserData(decodeURIComponent(response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.userdata || ''))
this.userdataid = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.userdataid
this.userdataname = response.listautoscalevmprofilesresponse?.autoscalevmprofile?.[0]?.userdataname
Expand All @@ -468,13 +475,24 @@ export default {
this.loading = false
})
},
getTemplateName (templateid) {
for (const template of this.templatesList) {
if (template.id === templateid) {
return template.name
}
fetchTemplate (templateid) {
if (!templateid) {
this.templateName = null
return
}
return ''
const params = {
id: templateid,
templatefilter: isAdmin() ? 'all' : 'executable'
}
addProjectFilter(params, this.resource)
api('listTemplates', params).then(json => {
// Ignore stale responses if templateid changed while this request was in flight.
if (templateid !== this.templateid) return
this.templateName = json.listtemplatesresponse?.template?.[0]?.name || templateid
}).catch(() => {
if (templateid !== this.templateid) return
this.templateName = templateid
})
},
getServiceOfferingName (serviceofferingid) {
for (const serviceoffering of this.serviceOfferingsList) {
Expand Down Expand Up @@ -576,16 +594,21 @@ export default {
this.$pollJob({
jobId: response.updateautoscalevmprofileresponse.jobid,
successMethod: (result) => {
this.fetchData()
},
errorMessage: this.$t('message.update.autoscale.vm.profile.failed'),
errorMethod: () => {
this.fetchData()
}
})
}).finally(() => {
}).catch(() => {
// fetchData() resets loading once the job completes; reset here only on submit failure.
this.loading = false
})
},
updateAutoScaleVmProfile () {
if (this.loading) return
this.loading = true
const params = {
id: this.profileid,
expungevmgraceperiod: this.expungevmgraceperiod,
Expand All @@ -604,21 +627,25 @@ export default {
this.$pollJob({
jobId: response.updateautoscalevmprofileresponse.jobid,
successMethod: (result) => {
this.loading = false
// Closing the modal triggers afterClose -> onModalClosed, which refreshes the data.
this.editProfileModalVisible = false
},
errorMessage: this.$t('message.update.autoscale.vm.profile.failed'),
errorMethod: () => {
this.loading = false
}
})
}).finally(() => {
}).catch(() => {
this.loading = false
})
},
decodeUserData (userdata) {
const decodedData = Buffer.from(userdata, 'base64')
return decodedData.toString('utf-8')
},
closeModal () {
this.editProfileModalVisible = false
onModalClosed () {
this.fetchData()
}
}
}
Expand Down
Loading