etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Address comments

This commit is contained in:
vishesh92 2025-11-07 14:00:32 +05:30
parent 10b60c27a0
commit c7d282cd2e
No known key found for this signature in database
GPG Key ID: 4E395186CBFA790B
9 changed files with 69 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
ui/src/components/widgets/InfiniteScrollSelect.vue
View File

@ -41,8 +41,10 @@
- optionValueKey (String, optional): Property to use as the value for options (e.g., 'name'). Default is 'id'
- optionLabelKey (String, optional): Property to use as the label for options (e.g., 'name'). Default is 'name'
- defaultOption (Object, optional): Preselected object to include initially
- allowClear (Boolean, optional): Whether to allow clearing the selection. Default is false
- showIcon (Boolean, optional): Whether to show icon for the options. Default is true
- defaultIcon (String, optional): Icon to be shown when there is no resource icon for the option. Default is 'cloud-outlined'
- selectFirstOption (Boolean, optional): Whether to automatically select the first option when options are loaded. Default is false
Events:
- @change-option-value (Function): Emits the selected option value(s) when value(s) changes. Do not use @change as it will give warnings and may not work
@ -58,7 +60,7 @@
:filter-option="false"
:loading="loading"
show-search
allowClear
:allowClear="allowClear"
placeholder="Select"
@search="onSearchTimed"
@popupScroll="onScroll"
@ -78,7 +80,7 @@
</template>
<a-select-option v-for="option in options" :key="option.id" :value="option[optionValueKey]">
<span>
<span v-if="showIcon">
<span v-if="showIcon && option.id !== null && option.id !== undefined">
<resource-icon v-if="option.icon && option.icon.base64image" :image="option.icon.base64image" size="1x" style="margin-right: 5px"/>
<render-icon v-else :icon="defaultIcon" style="margin-right: 5px" />
</span>
@ -125,6 +127,10 @@ export default {
type: Object,
default: null
},
allowClear: {
type: Boolean,
default: false
},
showIcon: {
type: Boolean,
default: true
@ -136,6 +142,10 @@ export default {
pageSize: {
type: Number,
default: null
},
selectFirstOption: {
type: Boolean,
default: false
}
},
data () {
@ -148,7 +158,8 @@ export default {
searchTimer: null,
scrollHandlerAttached: false,
preselectedOptionValue: null,
successiveFetches: 0
successiveFetches: 0,
hasAutoSelectedFirst: false
}
},
created () {
@ -211,6 +222,7 @@ export default {
}).finally(() => {
if (this.successiveFetches === 0) {
this.loading = false
this.autoSelectFirstOptionIfNeeded()
}
})
},
@ -247,6 +259,36 @@ export default {
this.preselectedOptionValue = null
this.successiveFetches = 0
},
autoSelectFirstOptionIfNeeded () {
if (!this.selectFirstOption || this.hasAutoSelectedFirst) {
return
}
// Don't auto-select if there's a preselected value being fetched
if (this.preselectedOptionValue) {
return
}
const currentValue = this.$attrs.value
if (currentValue !== undefined && currentValue !== null && currentValue !== '') {
return
}
if (this.options.length === 0) {
return
}
if (this.searchQuery && this.searchQuery.length > 0) {
return
}
// Only auto-select after initial load is complete (no more successive fetches)
if (this.successiveFetches > 0) {
return
}
const firstOption = this.options[0]
if (firstOption) {
const firstValue = firstOption[this.optionValueKey]
this.hasAutoSelectedFirst = true
this.$emit('change-option-value', firstValue)
this.$emit('change-option', firstOption)
}
},
onSearchTimed (value) {
clearTimeout(this.searchTimer)
this.searchTimer = setTimeout(() => {

16
ui/src/views/compute/wizard/OwnershipSelection.vue
View File

@ -166,32 +166,16 @@ export default {
this.emitChangeEvent()
},
handleDomainOptionChange (option) {
this.selectedDomainOption = option
// Note: Override filtering is not implemented in InfiniteScrollSelect migration
// If override.domains filtering is needed, it should be handled at a higher level
// or by using a custom filtering mechanism
},
handleAccountChange (accountName) {
this.selectedAccount = accountName
this.selectedProject = null
this.emitChangeEvent()
},
handleAccountOptionChange (option) {
this.selectedAccountOption = option
// Note: Override filtering is not implemented in InfiniteScrollSelect migration
// If override.accounts filtering is needed, it should be handled at a higher level
},
handleProjectChange (projectId) {
this.selectedProject = projectId
this.selectedAccount = null
this.emitChangeEvent()
},
handleProjectOptionChange (option) {
this.selectedProjectOption = option
// Note: Override filtering is not implemented in InfiniteScrollSelect migration
// If override.projects filtering is needed, it should be handled at a higher level
},
emitChangeEvent () {
this.$emit('fetch-owner', this)
}

9
ui/src/views/iam/AddUser.vue
View File

@ -98,6 +98,7 @@
optionValueKey="id"
optionLabelKey="path"
defaultIcon="block-outlined"
:selectFirstOption="true"
:placeholder="apiParams.domainid.description"
@change-option-value="handleDomainChange" />
</a-form-item>
@ -209,15 +210,9 @@ export default {
}
},
accountsApiParams () {
if (!this.form.domainid) {
return {
showicon: true,
listall: true
}
}
return {
showicon: true,
domainid: this.form.domainid
domainid: this.form?.domainid || null
}
}
},

5
ui/src/views/infra/UsageRecords.vue
View File

@ -130,6 +130,8 @@
optionLabelKey="path"
defaultIcon="block-outlined"
:placeholder="$t('label.domain')"
:defaultOption="{ id: null, path: ''}"
:allowClear="true"
style="width: 100%;"
@change-option-value="handleDomainChange"
@change-option="handleDomainOptionChange" />
@ -163,6 +165,8 @@
defaultIcon="team-outlined"
:placeholder="$t('label.account')"
:disabled="form.isRecursive"
:defaultOption="{ id: null, name: ''}"
allowClear="true"
@change-option-value="selectAccount"
@change-option="selectAccountOption" />
</a-form-item>
@ -455,7 +459,6 @@ export default {
}
}
return {
listall: true,
domainid: this.form.domain
}
}

2
ui/src/views/storage/CreateTemplate.vue
View File

@ -81,6 +81,7 @@
optionValueKey="id"
optionLabelKey="path"
defaultIcon="block-outlined"
allowClear="true"
:placeholder="apiParams.domainid.description"
@change-option-value="handleDomainChange" />
</a-form-item>
@ -96,6 +97,7 @@
optionValueKey="name"
optionLabelKey="name"
defaultIcon="team-outlined"
allowClear="true"
:placeholder="apiParams.account.description" />
</a-form-item>

5
ui/src/views/storage/UploadLocalVolume.vue
View File

@ -65,6 +65,7 @@
optionValueKey="id"
optionLabelKey="name"
defaultIcon="global-outlined"
selectFirstOption="true"
@change-option-value="handleZoneChange" />
</a-form-item>
<a-form-item name="diskofferingid" ref="diskofferingid">
@ -79,6 +80,8 @@
optionValueKey="id"
optionLabelKey="displaytext"
defaultIcon="hdd-outlined"
:defaultOption="{ id: null, displaytext: ''}"
allowClear="true"
:placeholder="apiParams.diskofferingid.description"
@change-option="onChangeDiskOffering" />
</a-form-item>
@ -120,6 +123,7 @@
optionLabelKey="path"
defaultIcon="block-outlined"
:placeholder="$t('label.domainid')"
allowClear="true"
@change-option-value="handleDomainChange" />
</a-form-item>
<a-form-item name="account" ref="account" v-if="'listDomains' in $store.getters.apis">
@ -134,6 +138,7 @@
optionValueKey="name"
optionLabelKey="name"
defaultIcon="team-outlined"
allowClear="true"
:placeholder="$t('label.account')"
@change-option-value="handleAccountChange" />
</a-form-item>

13
ui/src/views/storage/UploadVolume.vue
View File

@ -55,6 +55,7 @@
optionValueKey="id"
optionLabelKey="name"
defaultIcon="global-outlined"
selectFirstOption="true"
@change-option-value="handleZoneChange" />
</a-form-item>
<a-form-item name="format" ref="format">
@ -85,6 +86,8 @@
optionValueKey="id"
optionLabelKey="displaytext"
defaultIcon="hdd-outlined"
:defaultOption="{ id: null, displaytext: ''}"
allowClear="true"
@change-option="onChangeDiskOffering" />
</a-form-item>
<a-form-item name="checksum" ref="checksum">
@ -108,6 +111,7 @@
optionValueKey="id"
optionLabelKey="path"
defaultIcon="block-outlined"
allowClear="true"
:placeholder="$t('label.domainid')"
@change-option-value="handleDomainChange" />
</a-form-item>
@ -124,6 +128,7 @@
optionLabelKey="name"
defaultIcon="team-outlined"
:placeholder="$t('label.account')"
allowClear="true"
@change-option-value="handleAccountChange" />
</a-form-item>
<div :span="24" class="action-button">
@ -190,14 +195,8 @@ export default {
}
},
accountsApiParams () {
if (!this.form.domainid) {
return {
listall: true,
showicon: true
}
}
return {
domainid: this.form.domainid,
domainid: this.form?.domainid || null,
showicon: true
}
}

2
ui/src/views/tools/CreateWebhook.vue
View File

@ -76,6 +76,8 @@
optionValueKey="id"
optionLabelKey="path"
defaultIcon="block-outlined"
:defaultOption="{ id: null, path: ''}"
allowClear="true"
:placeholder="apiParams.domainid.description"
@change-option-value="handleDomainChanged" />
</a-form-item>

3
ui/src/views/tools/ManageVolumes.vue
View File

@ -380,6 +380,7 @@
optionValueKey="id"
optionLabelKey="path"
defaultIcon="block-outlined"
allowClear="true"
@change-option-value="changeDomain" />
</a-form-item>
@ -396,6 +397,7 @@
optionValueKey="name"
optionLabelKey="name"
defaultIcon="team-outlined"
allowClear="true"
@change-option-value="changeAccount" />
<span v-if="importForm.accountError" class="required">{{ $t('label.required') }}</span>
</a-form-item>
@ -413,6 +415,7 @@
optionValueKey="id"
optionLabelKey="name"
defaultIcon="project-outlined"
allowClear="true"
@change-option-value="changeProject" />
<span v-if="importForm.projectError" class="required">{{ $t('label.required') }}</span>
</a-form-item>