This is an automated email from the ASF dual-hosted git repository.
shwstppr pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/cloudstack.git
The following commit(s) were added to refs/heads/main by this push:
new b0a9949775b ui: include domain and account field for createTemplate
forms (#8257)
b0a9949775b is described below
commit b0a9949775b47bb589837dda40d9869aab01dff1
Author: Manoj Kumar <[email protected]>
AuthorDate: Tue Nov 28 13:32:44 2023 +0530
ui: include domain and account field for createTemplate forms (#8257)
This PR includes Domain and Account parameters in CreateTemplate form in UI
for Admin account.
It will expose optional parameters domainId and account in UI supported by
createTemplate API #8210
---
ui/src/config/section/storage.js | 9 +++-
ui/src/views/storage/CreateTemplate.vue | 92 ++++++++++++++++++++++++++++++++-
2 files changed, 99 insertions(+), 2 deletions(-)
diff --git a/ui/src/config/section/storage.js b/ui/src/config/section/storage.js
index 269c1f81788..3c2bd30db9b 100644
--- a/ui/src/config/section/storage.js
+++ b/ui/src/config/section/storage.js
@@ -253,7 +253,14 @@ export default {
((record.type === 'ROOT' && record.vmstate === 'Stopped') ||
(record.type !== 'ROOT' && !record.virtualmachineid &&
!['Allocated', 'Uploaded'].includes(record.state)))
},
- args: ['volumeid', 'name', 'displaytext', 'ostypeid', 'ispublic',
'isfeatured', 'isdynamicallyscalable', 'requireshvm', 'passwordenabled'],
+ args: (record, store) => {
+ var fields = ['volumeid', 'name', 'displaytext', 'ostypeid',
'ispublic', 'isfeatured', 'isdynamicallyscalable', 'requireshvm',
'passwordenabled']
+ if (['Admin', 'DomainAdmin'].includes(store.userInfo.roletype)) {
+ fields.push('domainid')
+ fields.push('account')
+ }
+ return fields
+ },
mapping: {
volumeid: {
value: (record) => { return record.id }
diff --git a/ui/src/views/storage/CreateTemplate.vue
b/ui/src/views/storage/CreateTemplate.vue
index 294abe330cb..13ce75777fb 100644
--- a/ui/src/views/storage/CreateTemplate.vue
+++ b/ui/src/views/storage/CreateTemplate.vue
@@ -69,6 +69,48 @@
</a-select-option>
</a-select>
</a-form-item>
+ <a-form-item name="domainid" ref="domainid" v-if="'listDomains' in
$store.getters.apis">
+ <template #label>
+ <tooltip-label :title="$t('label.domainid')"
:tooltip="apiParams.domainid.description"/>
+ </template>
+ <a-select
+ v-model:value="form.domainid"
+ showSearch
+ optionFilterProp="label"
+ :filterOption="(input, option) => {
+ return option.label.toLowerCase().indexOf(input.toLowerCase())
>= 0
+ }"
+ :loading="domainLoading"
+ :placeholder="apiParams.domainid.description"
+ @change="val => { handleDomainChange(val) }">
+ <a-select-option v-for="(opt, optIndex) in this.domains"
:key="optIndex" :label="opt.path || opt.name || opt.description"
:value="opt.id">
+ <span>
+ <resource-icon v-if="opt && opt.icon"
:image="opt.icon.base64image" size="1x" style="margin-right: 5px"/>
+ <block-outlined v-else style="margin-right: 5px" />
+ {{ opt.path || opt.name || opt.description }}
+ </span>
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ <a-form-item name="account" ref="account" v-if="domainid">
+ <template #label>
+ <tooltip-label :title="$t('label.account')"
:tooltip="apiParams.account.description"/>
+ </template>
+ <a-select
+ v-model:value="form.account"
+ showSearch
+ optionFilterProp="label"
+ :filterOption="(input, option) => {
+ return option.value.toLowerCase().indexOf(input.toLowerCase())
>= 0
+ }"
+ :placeholder="apiParams.account.description"
+ @change="val => { handleAccountChange(val) }">
+ <a-select-option v-for="(acc, index) in accounts"
:value="acc.name" :key="index">
+ {{ acc.name }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+
<a-form-item
name="ostypeid"
ref="ostypeid"
@@ -158,7 +200,12 @@ export default {
snapshotZoneIds: [],
zones: [],
osTypes: {},
- loading: false
+ loading: false,
+ domains: [],
+ accounts: [],
+ domainLoading: false,
+ domainid: null,
+ account: null
}
},
computed: {
@@ -188,6 +235,9 @@ export default {
fetchData () {
this.fetchOsTypes()
this.fetchSnapshotZones()
+ if ('listDomains' in this.$store.getters.apis) {
+ this.fetchDomains()
+ }
},
fetchOsTypes () {
this.osTypes.opts = []
@@ -237,6 +287,43 @@ export default {
}
})
},
+ fetchDomains () {
+ const params = {}
+ params.listAll = true
+ params.showicon = true
+ params.details = 'min'
+ this.domainLoading = true
+ api('listDomains', params).then(json => {
+ this.domains = json.listdomainsresponse.domain
+ }).finally(() => {
+ this.domainLoading = false
+ this.handleDomainChange(null)
+ })
+ },
+ handleDomainChange (domain) {
+ this.domainid = domain
+ this.form.account = null
+ this.account = null
+ if ('listAccounts' in this.$store.getters.apis) {
+ this.fetchAccounts()
+ }
+ },
+ fetchAccounts () {
+ api('listAccounts', {
+ domainid: this.domainid
+ }).then(response => {
+ this.accounts = response.listaccountsresponse.account || []
+ }).catch(error => {
+ this.$notifyError(error)
+ })
+ },
+ handleAccountChange (acc) {
+ if (acc) {
+ this.account = acc.name
+ } else {
+ this.account = acc
+ }
+ },
handleSubmit (e) {
if (this.loading) return
this.formRef.value.validate().then(() => {
@@ -277,6 +364,9 @@ export default {
},
closeModal () {
this.$emit('close-action')
+ },
+ isAdminOrDomainAdmin () {
+ return ['Admin',
'DomainAdmin'].includes(this.$store.getters.userInfo.roletype)
}
}
}
