You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by ro...@apache.org on 2020/01/15 06:51:46 UTC
[cloudstack-primate] branch master updated: image: register
template action form (#92)
This is an automated email from the ASF dual-hosted git repository.
rohit pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/cloudstack-primate.git
The following commit(s) were added to refs/heads/master by this push:
new 406aa3f image: register template action form (#92)
406aa3f is described below
commit 406aa3f2b83d2395430c83ef3ee4e059e2022b58
Author: Hoang Nguyen <ho...@unitech.vn>
AuthorDate: Wed Jan 15 13:51:36 2020 +0700
image: register template action form (#92)
This implements a customer register registration form.
Signed-off-by: Rohit Yadav <ro...@shapeblue.com>
Co-authored-by: hoangnm <ho...@gmail.com>
Co-authored-by: Rohit Yadav <ro...@apache.org>
---
src/components/view/ActionButton.vue | 4 +-
src/components/view/ListView.vue | 3 +
src/components/widgets/OsLogo.vue | 2 +-
src/config/section/image.js | 4 +-
src/locales/en.json | 12 +-
src/views/image/RegisterIso.vue | 2 +-
src/views/image/RegisterTemplate.vue | 798 +++++++++++++++++++++++++++++++++++
7 files changed, 816 insertions(+), 9 deletions(-)
diff --git a/src/components/view/ActionButton.vue b/src/components/view/ActionButton.vue
index 13bc00c..fbd842a 100644
--- a/src/components/view/ActionButton.vue
+++ b/src/components/view/ActionButton.vue
@@ -32,7 +32,7 @@
v-if="action.api in $store.getters.apis &&
action.showBadge &&
((!dataView && (action.listView || action.groupAction && selectedRowKeys.length > 0)) || (dataView && action.dataView)) &&
- ('show' in action ? action.show(resource, $store.getters.userInfo, $store.getters.apis) : true)">
+ ('show' in action ? action.show(resource, $store.getters.userInfo) : true)">
<a-button
:icon="action.icon"
:type="action.icon === 'delete' ? 'danger' : (action.icon === 'plus' ? 'primary' : 'default')"
@@ -44,7 +44,7 @@
v-if="action.api in $store.getters.apis &&
!action.showBadge &&
((!dataView && (action.listView || action.groupAction && selectedRowKeys.length > 0)) || (dataView && action.dataView)) &&
- ('show' in action ? action.show(resource, $store.getters.userInfo, $store.getters.apis) : true)"
+ ('show' in action ? action.show(resource, $store.getters.userInfo) : true)"
:icon="action.icon"
:type="action.icon === 'delete' ? 'danger' : (action.icon === 'plus' ? 'primary' : 'default')"
shape="circle"
diff --git a/src/components/view/ListView.vue b/src/components/view/ListView.vue
index 2db30a5..0d594fc 100644
--- a/src/components/view/ListView.vue
+++ b/src/components/view/ListView.vue
@@ -63,6 +63,7 @@
<span v-if="$route.path.startsWith('/project')" style="margin-right: 5px">
<a-button type="dashed" size="small" shape="circle" icon="login" @click="changeProject(record)" />
</span>
+ <os-logo v-if="record.ostypename" :osName="record.ostypename" size="1x" style="margin-right: 5px" />
<console :resource="record" size="small" />
<router-link :to="{ path: $route.path + '/' + record.id }" v-if="record.id">{{ text }}</router-link>
<router-link :to="{ path: $route.path + '/' + record.name }" v-else>{{ text }}</router-link>
@@ -154,6 +155,7 @@
<script>
import { api } from '@/api'
import Console from '@/components/widgets/Console'
+import OsLogo from '@/components/widgets/OsLogo'
import Status from '@/components/widgets/Status'
import InfoCard from '@/components/view/InfoCard'
@@ -161,6 +163,7 @@ export default {
name: 'ListView',
components: {
Console,
+ OsLogo,
Status,
InfoCard
},
diff --git a/src/components/widgets/OsLogo.vue b/src/components/widgets/OsLogo.vue
index 7cc6dbc..8739cd1 100644
--- a/src/components/widgets/OsLogo.vue
+++ b/src/components/widgets/OsLogo.vue
@@ -21,7 +21,7 @@
{{ name }}
</template>
<font-awesome-icon :icon="['fab', logo]" :size="size" style="color: #666;" v-if="logo !== 'debian'" />
- <debian-icon v-else-if="logo === 'debian'" :style="{ height: size === '4x' ? '56px' : '18px', width: size === '4x' ? '56px' : '18px', marginBottom: '-4px' }" />
+ <debian-icon v-else-if="logo === 'debian'" :style="{ height: size === '4x' ? '56px' : '16px', width: size === '4x' ? '56px' : '16px', marginBottom: '-4px' }" />
</a-tooltip>
</template>
diff --git a/src/config/section/image.js b/src/config/section/image.js
index 38bfe2a..ffa7f6b 100644
--- a/src/config/section/image.js
+++ b/src/config/section/image.js
@@ -50,7 +50,8 @@ export default {
icon: 'plus',
label: 'Create template',
listView: true,
- args: ['url', 'name', 'displaytext', 'directdownload', 'zoneids', 'hypervisor', 'format', 'ostypeid', 'checksum', 'isextractable', 'passwordenabled', 'sshkeyenabled', 'isdynamicallyscalable', 'ispublic', 'isfeatured', 'isrouting', 'requireshvm']
+ popup: true,
+ component: () => import('@/views/image/RegisterTemplate.vue')
},
{
api: 'getUploadParamsForTemplate',
@@ -138,7 +139,6 @@ export default {
label: 'Register ISO',
listView: true,
popup: true,
- show: (record, user, apis) => { return 'registerIso' in apis },
component: () => import('@/views/image/RegisterIso.vue')
},
{
diff --git a/src/locales/en.json b/src/locales/en.json
index a65f200..5a25940 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -290,7 +290,6 @@
"isCustomized": "Custom Disk Size",
"isCustomizedIops": "Custom IOPS",
"isDedicated": "Dedicate",
-"isExtractable": "Extractable",
"isFeatured": "Featured",
"isForced": "Force Delete",
"isManaged": "Managed",
@@ -303,7 +302,7 @@
"isdedicated": "Dedicated",
"isdefault": "Is Default",
"isdynamicallyscalable": "Dynamically Scalable",
-"isextractable": "extractable",
+"isextractable": "Extractable",
"isfeatured": "Featured",
"iso": "ISO",
"isolatedpvlanId": "Secondary Isolated VLAN ID",
@@ -466,7 +465,7 @@
"label.add.vpc.offering": "Add VPC Offering",
"label.add.vpn.customer.gateway": "Add VPN Customer Gateway",
"label.add.zone": "Add Zone",
-"label.all.zone": "All Zone",
+"label.all.zone": "All Zones",
"label.archive": "Archive",
"label.archive.alerts": "Archive alerts",
"label.archive.events": "Archive events",
@@ -533,6 +532,8 @@
"label.enable.vpc.offering": "Enable VPC offering",
"label.enable.vpn": "Enable Remote Access VPN",
"label.enter.token": "Enter token",
+"label.error.zone.combined": "All Zones cannot be combined with any other zone",
+"label.french.azerty.keyboard": "French AZERTY keyboard",
"label.globo.dns.configuration": "GloboDNS Configuration",
"label.gslb.assigned.lb.more": "Assign more load balancing",
"label.gslb.delete": "Delete GSLB",
@@ -541,6 +542,7 @@
"label.ha.disable": "Disable HA",
"label.ha.enable": "Enable HA",
"label.instanciate.template.associate.profile.blade": "Instanciate Template and Associate Profile to Blade",
+"label.japanese.keyboard": "Japanese keyboard",
"label.link.domain.to.ldap": "Link Domain to LDAP",
"label.make.project.owner": "Make account project owner",
"label.metrics": "Metrics",
@@ -589,9 +591,12 @@
"label.set.default.NIC": "Set default NIC",
"label.shutdown.provider": "Shutdown provider",
"label.snapshot.schedule": "Set up Recurring Snapshot",
+"label.standard.us.keyboard": "Standard (US) keyboard",
+"label.simplified.chinese.keyboard": "Simplified Chinese keyboard",
"label.start.lb.vm": "Start LB VM",
"label.stop.lb.vm": "Stop LB VM",
"label.suspend.project": "Suspend Project",
+"label.uk.keyboard": "UK keyboard",
"label.update.vmware.datacenter": "Update VMware datacenter",
"label.upgrade.router.newer.template": "Upgrade Router to Use Newer Template",
"label.upload": "Upload",
@@ -853,6 +858,7 @@
"specifyipranges": "Specify IP ranges",
"specifyvlan": "Specify VLAN",
"sshkeypair": "New SSH Key Pair",
+"sshkeyenabled": "SSH Enabled",
"startdate": "By date (start)",
"startip": "Start IP",
"startipv4": "IPv4 Start IP",
diff --git a/src/views/image/RegisterIso.vue b/src/views/image/RegisterIso.vue
index 96dd2d6..ec44460 100644
--- a/src/views/image/RegisterIso.vue
+++ b/src/views/image/RegisterIso.vue
@@ -206,7 +206,7 @@ export default {
this.$emit('refresh-data')
this.$notification.success({
message: 'Register ISO',
- description: 'Sucessfully registered ISO'
+ description: 'Sucessfully registered ISO ' + params.name
})
}).catch(error => {
this.$notification.error({
diff --git a/src/views/image/RegisterTemplate.vue b/src/views/image/RegisterTemplate.vue
new file mode 100644
index 0000000..5f5f061
--- /dev/null
+++ b/src/views/image/RegisterTemplate.vue
@@ -0,0 +1,798 @@
+// Licensed to the Apache Software Foundation (ASF) under one
+// or more contributor license agreements. See the NOTICE file
+// distributed with this work for additional information
+// regarding copyright ownership. The ASF licenses this file
+// to you under the Apache License, Version 2.0 (the
+// "License"); you may not use this file except in compliance
+// with the License. You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing,
+// software distributed under the License is distributed on an
+// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+// KIND, either express or implied. See the License for the
+// specific language governing permissions and limitations
+// under the License.
+
+<template>
+ <div class="form-layout">
+ <a-form layout="vertical" :form="form">
+ <a-row :gutter="12">
+ <a-form-item :label="$t('url')">
+ <a-input
+ v-decorator="['url', {
+ rules: [{ required: true, message: 'Please enter input' }]
+ }]"
+ :placeholder="apiParams.url.description" />
+ </a-form-item>
+ </a-row>
+ <a-row :gutter="12">
+ <a-form-item :label="$t('name')">
+ <a-input
+ v-decorator="['name', {
+ rules: [{ required: true, message: 'Please enter input' }]
+ }]"
+ :placeholder="apiParams.name.description" />
+ </a-form-item>
+ </a-row>
+ <a-row :gutter="12">
+ <a-form-item :label="$t('displaytext')">
+ <a-input
+ v-decorator="['displaytext', {
+ rules: [{ required: true, message: 'Please enter input' }]
+ }]"
+ :placeholder="apiParams.displaytext.description" />
+ </a-form-item>
+ </a-row>
+ <a-row :gutter="12">
+ <a-col :md="24" :lg="24">
+ <a-form-item
+ :label="$t('zoneids')"
+ :validate-status="zoneError"
+ :help="zoneErrorMessage">
+ <a-select
+ v-decorator="['zoneids', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option',
+ type: 'array'
+ }
+ ]
+ }]"
+ :loading="zones.loading"
+ mode="multiple"
+ :placeholder="apiParams.zoneids.description"
+ @change="handlerSelectZone">
+ <a-select-option v-for="opt in zones.opts" :key="opt.name || opt.description">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="12">
+ <a-col :md="24" :lg="12">
+ <a-form-item :label="$t('hypervisor')">
+ <a-select
+ v-decorator="['hypervisor', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :loading="hyperVisor.loading"
+ :placeholder="apiParams.hypervisor.description"
+ @change="handlerSelectHyperVisor">
+ <a-select-option v-for="(opt, optIndex) in hyperVisor.opts" :key="optIndex">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ <a-col :md="24" :lg="12">
+ <a-form-item :label="$t('format')">
+ <a-select
+ v-decorator="['format', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :placeholder="apiParams.format.description">
+ <a-select-option v-for="opt in format.opts" :key="opt.id">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="12" v-if="allowed && hyperKVMShow">
+ <a-col :md="24" :lg="12">
+ <a-form-item :label="$t('directdownload')">
+ <a-switch v-decorator="['directdownload']" @change="handleChangeDirect" />
+ </a-form-item>
+ </a-col>
+ <a-col :md="24" :lg="12" v-if="allowDirectDownload">
+ <a-form-item :label="$t('checksum')">
+ <a-input
+ v-decorator="['checksum', {
+ rules: [{ required: false, message: 'Please enter input' }]
+ }]"
+ :placeholder="apiParams.checksum.description" />
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="12" v-if="allowed && hyperXenServerShow">
+ <a-form-item v-if="hyperXenServerShow" :label="$t('xenserverToolsVersion61plus')">
+ <a-switch
+ v-decorator="['xenserverToolsVersion61plus',{
+ initialValue: xenServerProvider
+ }]"
+ :default-checked="xenServerProvider" />
+ </a-form-item>
+ </a-row>
+ <a-row :gutter="12" v-if="hyperKVMShow || hyperVMWShow">
+ <a-col :md="24" :lg="24" v-if="hyperKVMShow">
+ <a-form-item :label="$t('rootDiskControllerType')">
+ <a-select
+ v-decorator="['rootDiskControllerType', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :loading="rootDisk.loading"
+ :placeholder="$t('rootdiskcontroller')">
+ <a-select-option v-for="opt in rootDisk.opts" :key="opt.id">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ <a-col :md="24" :lg="12" v-if="hyperVMWShow">
+ <a-form-item :label="$t('rootDiskControllerType')">
+ <a-select
+ v-decorator="['rootDiskControllerType', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :loading="rootDisk.loading"
+ :placeholder="$t('rootdiskcontroller')">
+ <a-select-option v-for="opt in rootDisk.opts" :key="opt.id">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ <a-col :md="24" :lg="12" v-if="hyperVMWShow">
+ <a-form-item :label="$t('nicAdapterType')">
+ <a-select
+ v-decorator="['nicAdapterType', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :placeholder="$t('nicadaptertype')">
+ <a-select-option v-for="opt in nicAdapterType.opts" :key="opt.id">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ <a-col :md="24" :lg="24">
+ <a-form-item v-if="hyperVMWShow" :label="$t('keyboardType')">
+ <a-select
+ v-decorator="['keyboardType', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :placeholder="$t('keyboard')">
+ <a-select-option v-for="opt in keyboardType.opts" :key="opt.id">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="12">
+ <a-col :md="24" :lg="24">
+ <a-form-item :label="$t('ostypeid')">
+ <a-select
+ showSearch
+ v-decorator="['ostypeid', {
+ rules: [
+ {
+ required: false,
+ message: 'Please select option'
+ }
+ ]
+ }]"
+ :loading="osTypes.loading"
+ :placeholder="apiParams.ostypeid.description">
+ <a-select-option v-for="opt in osTypes.opts" :key="opt.name || opt.description">
+ {{ opt.name || opt.description }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+ </a-row>
+ <a-row :gutter="12">
+ <a-col :md="24" :lg="24">
+ <a-form-item>
+ <a-checkbox-group
+ v-decorator="['groupenabled', { initialValue: ['requireshvm'] }]"
+ style="width: 100%;"
+ >
+ <a-row>
+ <a-col :span="12">
+ <a-checkbox value="isextractable">
+ {{ $t('isextractable') }}
+ </a-checkbox>
+ </a-col>
+ <a-col :span="12">
+ <a-checkbox value="passwordenabled">
+ {{ $t('passwordenabled') }}
+ </a-checkbox>
+ </a-col>
+ </a-row>
+ <a-row>
+ <a-col :span="12">
+ <a-checkbox value="isdynamicallyscalable">
+ {{ $t('isdynamicallyscalable') }}
+ </a-checkbox>
+ </a-col>
+ <a-col :span="12">
+ <a-checkbox value="sshkeyenabled">
+ {{ $t('sshkeyenabled') }}
+ </a-checkbox>
+ </a-col>
+ </a-row>
+ <a-row>
+ <a-col :span="12">
+ <a-checkbox value="isrouting">
+ {{ $t('isrouting') }}
+ </a-checkbox>
+ </a-col>
+ <a-col :span="12">
+ <a-checkbox value="ispublic">
+ {{ $t('ispublic') }}
+ </a-checkbox>
+ </a-col>
+ </a-row>
+ <a-row>
+ <a-col :span="12">
+ <a-checkbox value="requireshvm">
+ {{ $t('requireshvm') }}
+ </a-checkbox>
+ </a-col>
+ <a-col :span="12">
+ <a-checkbox value="isfeatured">
+ {{ $t('isfeatured') }}
+ </a-checkbox>
+ </a-col>
+ </a-row>
+ </a-checkbox-group>
+ </a-form-item>
+ </a-col>
+ </a-row>
+
+ <div :span="24" class="action-button">
+ <a-button @click="closeAction">{{ this.$t('Cancel') }}</a-button>
+ <a-button :loading="loading" type="primary" @click="handleSubmit">{{ this.$t('OK') }}</a-button>
+ </div>
+ </a-form>
+ </div>
+</template>
+
+<script>
+import { api } from '@/api'
+import store from '@/store'
+
+export default {
+ name: 'RegisterTemplate',
+ data () {
+ return {
+ zones: {},
+ hyperVisor: {},
+ rootDisk: {},
+ nicAdapterType: {},
+ keyboardType: {},
+ format: {},
+ osTypes: {},
+ xenServerProvider: false,
+ hyperKVMShow: false,
+ hyperXenServerShow: false,
+ hyperVMWShow: false,
+ zoneError: '',
+ zoneErrorMessage: '',
+ loading: false,
+ rootAdmin: 'Admin',
+ allowed: false,
+ allowDirectDownload: false
+ }
+ },
+ beforeCreate () {
+ this.form = this.$form.createForm(this)
+ this.apiConfig = this.$store.getters.apis.registerTemplate || {}
+ this.apiParams = {}
+ this.apiConfig.params.forEach(param => {
+ this.apiParams[param.name] = param
+ })
+ },
+ created () {
+ this.$set(this.zones, 'loading', false)
+ this.$set(this.zones, 'opts', [])
+ this.$set(this.hyperVisor, 'loading', false)
+ this.$set(this.hyperVisor, 'opts', [])
+ this.$set(this.rootDisk, 'loading', false)
+ this.$set(this.rootDisk, 'opts', [])
+ this.$set(this.nicAdapterType, 'loading', false)
+ this.$set(this.nicAdapterType, 'opts', [])
+ this.$set(this.keyboardType, 'loading', false)
+ this.$set(this.keyboardType, 'opts', [])
+ this.$set(this.format, 'loading', false)
+ this.$set(this.format, 'opts', [])
+ this.$set(this.osTypes, 'loading', false)
+ this.$set(this.osTypes, 'opts', [])
+ },
+ mounted () {
+ this.fetchData()
+ },
+ methods: {
+ fetchData () {
+ this.fetchZone()
+ this.fetchOsTypes()
+ if (Object.prototype.hasOwnProperty.call(store.getters.apis, 'listConfigurations')) {
+ this.fetchXenServerProvider()
+ }
+ },
+ fetchZone () {
+ const params = {}
+ let listZones = []
+ params.listAll = true
+
+ this.allowed = false
+
+ if (store.getters.userInfo.roletype === this.rootAdmin) {
+ this.allowed = true
+ listZones.push({
+ id: this.$t('label.all.zone'),
+ name: this.$t('label.all.zone')
+ })
+ }
+
+ this.zones.loading = true
+ this.zones.opts = []
+
+ api('listZones', params).then(json => {
+ const listZonesResponse = json.listzonesresponse.zone
+ listZones = listZones.concat(listZonesResponse)
+
+ this.$set(this.zones, 'opts', listZones)
+ }).finally(() => {
+ this.zones.loading = false
+ })
+ },
+ fetchHyperVisor (params) {
+ this.hyperVisor.loading = true
+ let listhyperVisors = this.hyperVisor.opts
+
+ api('listHypervisors', params).then(json => {
+ const listResponse = json.listhypervisorsresponse.hypervisor
+ if (listResponse) {
+ listhyperVisors = listhyperVisors.concat(listResponse)
+ }
+ listhyperVisors.push({
+ name: 'Any'
+ })
+
+ this.$set(this.hyperVisor, 'opts', listhyperVisors)
+ }).finally(() => {
+ this.hyperVisor.loading = false
+ })
+ },
+ fetchOsTypes () {
+ const params = {}
+ params.listAll = true
+
+ this.osTypes.opts = []
+ this.osTypes.loading = true
+
+ api('listOsTypes', params).then(json => {
+ const listOsTypes = json.listostypesresponse.ostype
+ this.$set(this.osTypes, 'opts', listOsTypes)
+ }).finally(() => {
+ this.osTypes.loading = false
+ })
+ },
+ fetchXenServerProvider () {
+ const params = {}
+ params.name = 'xenserver.pvdriver.version'
+
+ this.xenServerProvider = true
+
+ api('listConfigurations', params).then(json => {
+ if (json.listconfigurationsresponse.configuration !== null && json.listconfigurationsresponse.configuration[0].value !== 'xenserver61') {
+ this.xenServerProvider = false
+ }
+ })
+ },
+ fetchRootDisk (hyperVisor) {
+ const controller = []
+ this.rootDisk.opts = []
+
+ if (hyperVisor === 'KVM') {
+ controller.push({
+ id: '',
+ description: ''
+ })
+ controller.push({
+ id: 'ide',
+ description: 'ide'
+ })
+ controller.push({
+ id: 'osdefault',
+ description: 'osdefault'
+ })
+ controller.push({
+ id: 'scsi',
+ description: 'scsi'
+ })
+ controller.push({
+ id: 'virtio',
+ description: 'virtio'
+ })
+ } else if (hyperVisor === 'VMware') {
+ controller.push({
+ id: '',
+ description: ''
+ })
+ controller.push({
+ id: 'scsi',
+ description: 'scsi'
+ })
+ controller.push({
+ id: 'ide',
+ description: 'ide'
+ })
+ controller.push({
+ id: 'osdefault',
+ description: 'osdefault'
+ })
+ controller.push({
+ id: 'pvscsi',
+ description: 'pvscsi'
+ })
+ controller.push({
+ id: 'lsilogic',
+ description: 'lsilogic'
+ })
+ controller.push({
+ id: 'lsisas1068',
+ description: 'lsilogicsas'
+ })
+ controller.push({
+ id: 'buslogic',
+ description: 'buslogic'
+ })
+ }
+
+ this.$set(this.rootDisk, 'opts', controller)
+ },
+ fetchNicAdapterType () {
+ const nicAdapterType = []
+ nicAdapterType.push({
+ id: '',
+ description: ''
+ })
+ nicAdapterType.push({
+ id: 'E1000',
+ description: 'E1000'
+ })
+ nicAdapterType.push({
+ id: 'PCNet32',
+ description: 'PCNet32'
+ })
+ nicAdapterType.push({
+ id: 'Vmxnet2',
+ description: 'Vmxnet2'
+ })
+ nicAdapterType.push({
+ id: 'Vmxnet3',
+ description: 'Vmxnet3'
+ })
+
+ this.$set(this.nicAdapterType, 'opts', nicAdapterType)
+ },
+ fetchKeyboardType () {
+ const keyboardType = []
+ keyboardType.push({
+ id: '',
+ description: ''
+ })
+ keyboardType.push({
+ id: 'us',
+ description: 'label.standard.us.keyboard'
+ })
+ keyboardType.push({
+ id: 'uk',
+ description: 'label.uk.keyboard'
+ })
+ keyboardType.push({
+ id: 'fr',
+ description: 'label.french.azerty.keyboard'
+ })
+ keyboardType.push({
+ id: 'jp',
+ description: 'label.japanese.keyboard'
+ })
+ keyboardType.push({
+ id: 'sc',
+ description: 'label.simplified.chinese.keyboard'
+ })
+
+ this.$set(this.keyboardType, 'opts', keyboardType)
+ },
+ fetchFormat (hyperVisor) {
+ const format = []
+
+ switch (hyperVisor) {
+ case 'Hyperv':
+ format.push({
+ id: 'VHD',
+ description: 'VHD'
+ })
+ format.push({
+ id: 'VHDX',
+ description: 'VHDX'
+ })
+ break
+ case 'KVM':
+ this.hyperKVMShow = true
+ format.push({
+ id: 'QCOW2',
+ description: 'QCOW2'
+ })
+ format.push({
+ id: 'RAW',
+ description: 'RAW'
+ })
+ format.push({
+ id: 'VHD',
+ description: 'VHD'
+ })
+ format.push({
+ id: 'VMDK',
+ description: 'VMDK'
+ })
+ break
+ case 'XenServer':
+ this.hyperXenServerShow = true
+ format.push({
+ id: 'VHD',
+ description: 'VHD'
+ })
+ break
+ case 'VMware':
+ this.hyperVMWShow = true
+ format.push({
+ id: 'OVA',
+ description: 'OVA'
+ })
+ break
+ case 'BareMetal':
+ format.push({
+ id: 'BareMetal',
+ description: 'BareMetal'
+ })
+ break
+ case 'Ovm':
+ format.push({
+ id: 'RAW',
+ description: 'RAW'
+ })
+ break
+ case 'LXC':
+ format.push({
+ id: 'TAR',
+ description: 'TAR'
+ })
+ break
+ default:
+ break
+ }
+
+ this.$set(this.format, 'opts', format)
+ },
+ handlerSelectZone (value) {
+ this.validZone(value)
+ this.hyperVisor.opts = []
+
+ if (this.zoneError !== '') {
+ return
+ }
+
+ this.resetSelect()
+
+ const params = {}
+ const allZoneExists = value.filter(zone => zone === this.$t('label.all.zone'))
+
+ if (allZoneExists.length > 0) {
+ params.listAll = true
+
+ this.fetchHyperVisor(params)
+ return
+ }
+
+ for (let i = 0; i < value.length; i++) {
+ const zoneSelected = this.zones.opts.filter(zone => zone.name === value[i])
+
+ if (zoneSelected.length > 0) {
+ params.zoneid = zoneSelected[0].id
+ this.fetchHyperVisor(params)
+ }
+ }
+ },
+ handlerSelectHyperVisor (value) {
+ const hyperVisor = this.hyperVisor.opts[value].name
+
+ this.hyperXenServerShow = false
+ this.hyperVMWShow = false
+ this.hyperKVMShow = false
+ this.allowDirectDownload = false
+
+ this.resetSelect()
+ this.fetchFormat(hyperVisor)
+ this.fetchRootDisk(hyperVisor)
+ this.fetchNicAdapterType()
+ this.fetchKeyboardType()
+ },
+ handleSubmit (e) {
+ e.preventDefault()
+
+ this.form.validateFields((err, values) => {
+ if (err || this.zoneError !== '') {
+ return
+ }
+ let params = {}
+ for (const key in values) {
+ const input = values[key]
+
+ if (input === undefined) {
+ continue
+ }
+
+ if (key === 'zoneids') {
+ if (input.length === 1 && input[0] === this.$t('label.all.zone')) {
+ params.zoneids = '-1'
+ continue
+ }
+ const zonesSelected = []
+ for (const index in input) {
+ const name = input[index]
+ const zone = this.zones.opts.filter(zone => zone.name === name)
+ if (zone && zone[0]) {
+ zonesSelected.push(zone[0].id)
+ }
+ }
+ params[key] = zonesSelected.join(',')
+ } else if (key === 'ostypeid') {
+ const osTypeSelected = this.osTypes.opts.filter(item => item.description === input)
+ if (osTypeSelected && osTypeSelected[0]) {
+ params[key] = osTypeSelected[0].id
+ }
+ } else if (key === 'hypervisor') {
+ params[key] = this.hyperVisor.opts[input].name
+ } else if (key === 'groupenabled') {
+ for (const index in input) {
+ const name = input[index]
+ params[name] = true
+ }
+ } else {
+ const formattedDetailData = {}
+ switch (key) {
+ case 'rootDiskControllerType':
+ formattedDetailData['details[0].rootDiskController'] = input
+ break
+ case 'nicAdapterType':
+ formattedDetailData['details[0].nicAdapter'] = input
+ break
+ case 'keyboardType':
+ formattedDetailData['details[0].keyboard'] = input
+ break
+ case 'xenserverToolsVersion61plus':
+ formattedDetailData['details[0].hypervisortoolsversion'] = input
+ break
+ }
+
+ if (Object.keys(formattedDetailData).length > 0) {
+ params = Object.assign({}, params, formattedDetailData)
+ } else {
+ params[key] = input
+ }
+ }
+ }
+ this.loading = true
+ api('registerTemplate', params).then(json => {
+ this.$emit('refresh-data')
+ this.$notification.success({
+ message: 'Register Template',
+ description: 'Successfully registered template ' + params.name
+ })
+ }).catch(error => {
+ this.$notification.error({
+ message: 'Request Failed',
+ description: (error.response && error.response.headers && error.response.headers['x-description']) || error.message
+ })
+ }).finally(() => {
+ this.loading = false
+ this.closeAction()
+ })
+ })
+ },
+ handleChangeDirect (checked) {
+ this.allowDirectDownload = checked
+ },
+ validZone (zones) {
+ const allZoneExists = zones.filter(zone => zone === this.$t('label.all.zone'))
+
+ this.zoneError = ''
+ this.zoneErrorMessage = ''
+
+ if (allZoneExists.length > 0 && zones.length > 1) {
+ this.zoneError = 'error'
+ this.zoneErrorMessage = this.$t('label.error.zone.combined')
+ }
+ },
+ closeAction () {
+ this.$emit('close-action')
+ },
+ resetSelect () {
+ this.form.setFieldsValue({
+ hypervisor: undefined,
+ format: undefined,
+ rootDiskControllerType: undefined,
+ nicAdapterType: undefined,
+ keyboardType: undefined
+ })
+ }
+ }
+}
+</script>
+
+<style scoped lang="less">
+ .form-layout {
+ width: 80vw;
+
+ @media (min-width: 700px) {
+ width: 550px;
+ }
+ }
+
+ .action-button {
+ text-align: right;
+
+ button {
+ margin-right: 5px;
+ }
+ }
+</style>