|
116 | 116 | :placeholder="apiParams.maxiops.description"/> |
117 | 117 | </a-form-item> |
118 | 118 | </span> |
| 119 | + <a-form-item name="createOnStorage" ref="createOnStorage" v-if="showStoragePoolSelect"> |
| 120 | + <template #label> |
| 121 | + <tooltip-label :title="$t('label.create.on.storage')" :tooltip="$t('label.create.volume.on.primary.storage')" /> |
| 122 | + </template> |
| 123 | + <a-switch |
| 124 | + v-model:checked="form.createOnStorage" |
| 125 | + :checked="createOnStorage" |
| 126 | + @change="onChangeCreateOnStorage" /> |
| 127 | + </a-form-item> |
| 128 | + <span v-if="showStoragePoolSelect && createOnStorage"> |
| 129 | + <a-form-item ref="storageid" name="storageid"> |
| 130 | + <template #label> |
| 131 | + <tooltip-label :title="$t('label.storageid')" /> |
| 132 | + </template> |
| 133 | + <a-select |
| 134 | + v-model:value="form.storageid" |
| 135 | + :loading="loading" |
| 136 | + showSearch |
| 137 | + optionFilterProp="label" |
| 138 | + :filterOption="(input, option) => { |
| 139 | + return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0 |
| 140 | + }" > |
| 141 | + <a-select-option |
| 142 | + v-for="(pool, index) in storagePools" |
| 143 | + :value="pool.id" |
| 144 | + :key="index" |
| 145 | + :label="pool.name"> |
| 146 | + <span> |
| 147 | + <resource-icon v-if="pool.icon" :image="pool.icon.base64image" size="1x" style="margin-right: 5px"/> |
| 148 | + <hdd-outlined v-else style="margin-right: 5px"/> |
| 149 | + {{ pool.name }} |
| 150 | + </span> |
| 151 | + </a-select-option> |
| 152 | + </a-select> |
| 153 | + </a-form-item> |
| 154 | + </span> |
119 | 155 | <a-form-item name="attachVolume" ref="attachVolume" v-if="!createVolumeFromVM"> |
120 | 156 | <template #label> |
121 | 157 | <tooltip-label :title="$t('label.action.attach.to.instance')" :tooltip="$t('label.attach.vol.to.instance')" /> |
|
170 | 206 | import { ref, reactive, toRaw } from 'vue' |
171 | 207 | import { getAPI, postAPI } from '@/api' |
172 | 208 | import { mixinForm } from '@/utils/mixin' |
| 209 | +import { isAdmin } from '@/role' |
173 | 210 | import ResourceIcon from '@/components/view/ResourceIcon' |
174 | 211 | import TooltipLabel from '@/components/widgets/TooltipLabel' |
175 | 212 | import OwnershipSelection from '@/views/compute/wizard/OwnershipSelection.vue' |
@@ -203,11 +240,16 @@ export default { |
203 | 240 | loading: false, |
204 | 241 | isCustomizedDiskIOps: false, |
205 | 242 | virtualmachines: [], |
| 243 | + createOnStorage: false, |
| 244 | + storagePools: [], |
206 | 245 | attachVolume: false, |
207 | 246 | vmidtoattach: null |
208 | 247 | } |
209 | 248 | }, |
210 | 249 | computed: { |
| 250 | + showStoragePoolSelect () { |
| 251 | + return isAdmin() && !this.createVolumeFromSnapshot |
| 252 | + }, |
211 | 253 | createVolumeFromVM () { |
212 | 254 | return this.$route.path.startsWith('/vm/') |
213 | 255 | }, |
@@ -299,6 +341,9 @@ export default { |
299 | 341 | this.zones = json.listzonesresponse.zone || [] |
300 | 342 | this.form.zoneid = this.zones[0].id || '' |
301 | 343 | this.fetchDiskOfferings(this.form.zoneid) |
| 344 | + if (this.createOnStorage) { |
| 345 | + this.fetchStoragePools(this.form.zoneid) |
| 346 | + } |
302 | 347 | if (this.attachVolume) { |
303 | 348 | this.fetchVirtualMachines(this.form.zoneid) |
304 | 349 | } |
@@ -355,6 +400,25 @@ export default { |
355 | 400 | this.loading = false |
356 | 401 | }) |
357 | 402 | }, |
| 403 | + fetchStoragePools (zoneId) { |
| 404 | + if (!zoneId) { |
| 405 | + this.storagePools = [] |
| 406 | + return |
| 407 | + } |
| 408 | + this.loading = true |
| 409 | + getAPI('listStoragePools', { |
| 410 | + zoneid: zoneId, |
| 411 | + showicon: true |
| 412 | + }).then(json => { |
| 413 | + const pools = json.liststoragepoolsresponse.storagepool || [] |
| 414 | + this.storagePools = pools.filter(p => p.state === 'Up') |
| 415 | + }).catch(error => { |
| 416 | + this.$notifyError(error) |
| 417 | + this.storagePools = [] |
| 418 | + }).finally(() => { |
| 419 | + this.loading = false |
| 420 | + }) |
| 421 | + }, |
358 | 422 | fetchVirtualMachines (zoneId) { |
359 | 423 | var params = { |
360 | 424 | zoneid: zoneId, |
@@ -394,6 +458,7 @@ export default { |
394 | 458 | if (this.customDiskOffering) { |
395 | 459 | values.size = values.size.trim() |
396 | 460 | } |
| 461 | + delete values.createOnStorage |
397 | 462 | if (this.createVolumeFromSnapshot) { |
398 | 463 | values.snapshotid = this.resource.id |
399 | 464 | } |
@@ -467,6 +532,15 @@ export default { |
467 | 532 | this.attachVolumeApiParams = this.$getApiParams('attachVolume') |
468 | 533 | this.fetchVirtualMachines(this.form.zoneid) |
469 | 534 | } |
| 535 | + }, |
| 536 | + onChangeCreateOnStorage () { |
| 537 | + this.createOnStorage = !this.createOnStorage |
| 538 | + if (this.createOnStorage) { |
| 539 | + this.fetchStoragePools(this.form.zoneid) |
| 540 | + this.form.storageid = this.storagePools[0]?.id || undefined |
| 541 | + } else { |
| 542 | + this.form.storageid = undefined |
| 543 | + } |
470 | 544 | } |
471 | 545 | } |
472 | 546 | } |
|
0 commit comments