[UI] Add option to select owner of volume when creating it

ui/src/views/storage/CreateVolume.vue

@@ -17,6 +17,9 @@
 
 <template>
   <a-spin :spinning="loading">
+    <div v-if="!isNormalUserOrProject">
+      <ownership-selection @fetch-owner="fetchOwnerOptions" />
+    </div>
     <a-form
       class="form"
       layout="vertical"
@@ -127,11 +130,14 @@ import { api } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
+import OwnershipSelection from '@/views/compute/wizard/OwnershipSelection.vue'
+import store from '@/store'
 
 export default {
   name: 'CreateVolume',
   mixins: [mixinForm],
   components: {
+    OwnershipSelection,
     ResourceIcon,
     TooltipLabel
   },
@@ -143,6 +149,11 @@ export default {
   },
   data () {
     return {
+      owner: {
+        projectid: store.getters.project?.id,
+        domainid: store.getters.project?.id ? null : store.getters.userInfo.domainid,
+        account: store.getters.project?.id ? null : store.getters.userInfo.account
+      },
       snapshotZoneIds: [],
       zones: [],
       offerings: [],
@@ -155,6 +166,9 @@ export default {
     createVolumeFromVM () {
       return this.$route.path.startsWith('/vm/')
     },
+    isNormalUserOrProject () {
+      return ['User'].includes(this.$store.getters.userInfo.roletype) || store.getters.project?.id
+    },
     createVolumeFromSnapshot () {
       return this.$route.path.startsWith('/snapshot')
     }
@@ -195,6 +209,22 @@ export default {
         this.rules.diskofferingid = [{ required: true, message: this.$t('message.error.select') }]
       }
     },
+    fetchOwnerOptions (OwnerOptions) {
+      this.owner = {}
+      if (OwnerOptions.selectedAccountType === this.$t('label.account')) {
+        if (!OwnerOptions.selectedAccount) {
+          return
+        }
+        this.owner.account = OwnerOptions.selectedAccount
+        this.owner.domainid = OwnerOptions.selectedDomain
+      } else if (OwnerOptions.selectedAccountType === this.$t('label.project')) {
+        if (!OwnerOptions.selectedProject) {
+          return
+        }
+        this.owner.projectid = OwnerOptions.selectedProject
+      }
+      this.fetchData()
+    },
     fetchData () {
       if (this.createVolumeFromSnapshot) {
         this.fetchSnapshotZones()
@@ -246,11 +276,17 @@ export default {
       this.loading = true
       var params = {
         zoneid: zoneId,
-        listall: true
+        listall: true,
+        domainid: this.owner.domainid
       }
       if (this.createVolumeFromVM) {
         params.virtualmachineid = this.resource.id
       }
+      if (this.owner.projectid) {
+        params.projectid = this.owner.projectid
+      } else {
+        params.account = this.owner.account
+      }
       api('listDiskOfferings', params).then(json => {
         this.offerings = json.listdiskofferingsresponse.diskoffering || []
         if (this.createVolumeFromVM) {
@@ -279,6 +315,12 @@ export default {
         if (this.createVolumeFromSnapshot) {
           values.snapshotid = this.resource.id
         }
+        values.domainid = this.owner.domainid
+        if (this.owner.projectid) {
+          values.projectid = this.owner.projectid
+        } else {
+          values.account = this.owner.account
+        }
         this.loading = true
         api('createVolume', values).then(response => {
           this.$pollJob({