mirror of
https://git.proxmox.com/git/pve-manager
synced 2025-05-28 19:05:42 +00:00
qemu/wizard: move to declarative syntax
Use a ViewModel directly, instead of emulating its behaviour with a ViewController. The rest consists mostly of indentation changes, moving some components directly inside their parent declaration. Signed-off-by: Thomas Lamprecht <t.lamprecht@proxmox.com>
This commit is contained in:
Thomas Lamprecht
Dominik Csapak
parent
bd2118c6ed
commit
8cdfb23faa
@ -1,191 +1,190 @@
|
||||
/*jslint confusion: true*/
|
||||
Ext.define('PVE.qemu.CreateWizard', {
|
||||
extend: 'PVE.window.Wizard',
|
||||
alias: 'widget.pveQemuCreateWizard',
|
||||
mixins: ['Proxmox.Mixin.CBind'],
|
||||
|
||||
controller: {
|
||||
|
||||
xclass: 'Ext.app.ViewController',
|
||||
|
||||
control: {
|
||||
'field[name=nodename]': {
|
||||
change: function(f, value) {
|
||||
var me = this;
|
||||
['networkpanel', 'hdpanel', 'cdpanel'].forEach(function(reference) {
|
||||
me.lookup(reference).setNodename(value);
|
||||
});
|
||||
}
|
||||
}
|
||||
viewModel: {
|
||||
data: {
|
||||
nodename: ''
|
||||
}
|
||||
},
|
||||
|
||||
initComponent: function() {
|
||||
var me = this;
|
||||
cbindData: {
|
||||
nodename: undefined
|
||||
},
|
||||
|
||||
var summarystore = Ext.create('Ext.data.Store', {
|
||||
model: 'KeyValue',
|
||||
sorters: [
|
||||
subject: gettext('Virtual Machine'),
|
||||
|
||||
items: [
|
||||
{
|
||||
xtype: 'inputpanel',
|
||||
title: gettext('General'),
|
||||
onlineHelp: 'qm_general_settings',
|
||||
column1: [
|
||||
{
|
||||
property : 'key',
|
||||
direction: 'ASC'
|
||||
xtype: 'pveNodeSelector',
|
||||
name: 'nodename',
|
||||
cbind: {
|
||||
selectCurNode: '{!nodename}',
|
||||
preferredValue: '{nodename}'
|
||||
},
|
||||
bind: {
|
||||
value: '{nodename}'
|
||||
},
|
||||
fieldLabel: gettext('Node'),
|
||||
allowBlank: false,
|
||||
onlineValidator: true
|
||||
},
|
||||
{
|
||||
xtype: 'pveGuestIDSelector',
|
||||
name: 'vmid',
|
||||
guestType: 'qemu',
|
||||
value: '',
|
||||
loadNextFreeID: true,
|
||||
validateExists: false
|
||||
},
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'name',
|
||||
vtype: 'DnsName',
|
||||
value: '',
|
||||
fieldLabel: gettext('Name'),
|
||||
allowBlank: true
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
Ext.applyIf(me, {
|
||||
subject: gettext('Virtual Machine'),
|
||||
],
|
||||
column2: [
|
||||
{
|
||||
xtype: 'pvePoolSelector',
|
||||
fieldLabel: gettext('Resource Pool'),
|
||||
name: 'pool',
|
||||
value: '',
|
||||
allowBlank: true
|
||||
}
|
||||
],
|
||||
onGetValues: function(values) {
|
||||
if (!values.name) {
|
||||
delete values.name;
|
||||
}
|
||||
if (!values.pool) {
|
||||
delete values.pool;
|
||||
}
|
||||
return values;
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'container',
|
||||
layout: 'hbox',
|
||||
defaults: {
|
||||
flex: 1,
|
||||
padding: '0 10'
|
||||
},
|
||||
title: gettext('OS'),
|
||||
items: [
|
||||
{
|
||||
xtype: 'inputpanel',
|
||||
title: gettext('General'),
|
||||
onlineHelp: 'qm_general_settings',
|
||||
column1: [
|
||||
{
|
||||
xtype: 'pveNodeSelector',
|
||||
name: 'nodename',
|
||||
selectCurNode: !me.nodename,
|
||||
preferredValue: me.nodename,
|
||||
fieldLabel: gettext('Node'),
|
||||
allowBlank: false,
|
||||
onlineValidator: true
|
||||
},
|
||||
{
|
||||
xtype: 'pveGuestIDSelector',
|
||||
name: 'vmid',
|
||||
guestType: 'qemu',
|
||||
value: '',
|
||||
loadNextFreeID: true,
|
||||
validateExists: false
|
||||
},
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'name',
|
||||
vtype: 'DnsName',
|
||||
value: '',
|
||||
fieldLabel: gettext('Name'),
|
||||
allowBlank: true
|
||||
}
|
||||
],
|
||||
column2: [
|
||||
{
|
||||
xtype: 'pvePoolSelector',
|
||||
fieldLabel: gettext('Resource Pool'),
|
||||
name: 'pool',
|
||||
value: '',
|
||||
allowBlank: true
|
||||
}
|
||||
],
|
||||
onGetValues: function(values) {
|
||||
if (!values.name) {
|
||||
delete values.name;
|
||||
}
|
||||
if (!values.pool) {
|
||||
delete values.pool;
|
||||
}
|
||||
return values;
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'container',
|
||||
layout: 'hbox',
|
||||
defaults: {
|
||||
flex: 1,
|
||||
padding: '0 10'
|
||||
xtype: 'pveQemuCDInputPanel',
|
||||
bind: {
|
||||
nodename: '{nodename}'
|
||||
},
|
||||
title: gettext('OS'),
|
||||
items: [
|
||||
{
|
||||
xtype: 'pveQemuCDInputPanel',
|
||||
reference: 'cdpanel',
|
||||
confid: 'ide2',
|
||||
insideWizard: true
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuOSTypePanel',
|
||||
insideWizard: true
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuHDInputPanel',
|
||||
reference: 'hdpanel',
|
||||
title: gettext('Hard Disk'),
|
||||
isCreate: true,
|
||||
confid: 'ide2',
|
||||
insideWizard: true
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuProcessorPanel',
|
||||
insideWizard: true,
|
||||
title: gettext('CPU')
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuMemoryPanel',
|
||||
insideWizard: true,
|
||||
title: gettext('Memory')
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuNetworkInputPanel',
|
||||
reference: 'networkpanel',
|
||||
title: gettext('Network'),
|
||||
xtype: 'pveQemuOSTypePanel',
|
||||
insideWizard: true
|
||||
},
|
||||
{
|
||||
title: gettext('Confirm'),
|
||||
layout: 'fit',
|
||||
items: [
|
||||
{
|
||||
xtype: 'grid',
|
||||
store: summarystore,
|
||||
columns: [
|
||||
{header: 'Key', width: 150, dataIndex: 'key'},
|
||||
{header: 'Value', flex: 1, dataIndex: 'value'}
|
||||
]
|
||||
}
|
||||
],
|
||||
listeners: {
|
||||
show: function(panel) {
|
||||
var kv = me.getValues();
|
||||
var data = [];
|
||||
Ext.Object.each(kv, function(key, value) {
|
||||
if (key === 'delete') { // ignore
|
||||
return;
|
||||
}
|
||||
data.push({ key: key, value: value });
|
||||
});
|
||||
summarystore.suspendEvents();
|
||||
summarystore.removeAll();
|
||||
summarystore.add(data);
|
||||
summarystore.sort();
|
||||
summarystore.resumeEvents();
|
||||
summarystore.fireEvent('refresh');
|
||||
|
||||
}
|
||||
},
|
||||
onSubmit: function() {
|
||||
var kv = me.getValues();
|
||||
delete kv['delete'];
|
||||
|
||||
var nodename = kv.nodename;
|
||||
delete kv.nodename;
|
||||
|
||||
Proxmox.Utils.API2Request({
|
||||
url: '/nodes/' + nodename + '/qemu',
|
||||
waitMsgTarget: me,
|
||||
method: 'POST',
|
||||
params: kv,
|
||||
success: function(response){
|
||||
me.close();
|
||||
},
|
||||
failure: function(response, opts) {
|
||||
Ext.Msg.alert(gettext('Error'), response.htmlStatus);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuHDInputPanel',
|
||||
bind: {
|
||||
nodename: '{nodename}'
|
||||
},
|
||||
title: gettext('Hard Disk'),
|
||||
isCreate: true,
|
||||
insideWizard: true
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuProcessorPanel',
|
||||
insideWizard: true,
|
||||
title: gettext('CPU')
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuMemoryPanel',
|
||||
insideWizard: true,
|
||||
title: gettext('Memory')
|
||||
},
|
||||
{
|
||||
xtype: 'pveQemuNetworkInputPanel',
|
||||
bind: {
|
||||
nodename: '{nodename}'
|
||||
},
|
||||
title: gettext('Network'),
|
||||
insideWizard: true
|
||||
},
|
||||
{
|
||||
title: gettext('Confirm'),
|
||||
layout: 'fit',
|
||||
items: [
|
||||
{
|
||||
xtype: 'grid',
|
||||
store: {
|
||||
model: 'KeyValue',
|
||||
sorters: [{
|
||||
property : 'key',
|
||||
direction: 'ASC'
|
||||
}]
|
||||
},
|
||||
columns: [
|
||||
{header: 'Key', width: 150, dataIndex: 'key'},
|
||||
{header: 'Value', flex: 1, dataIndex: 'value'}
|
||||
]
|
||||
}
|
||||
],
|
||||
listeners: {
|
||||
show: function(panel) {
|
||||
var kv = this.up('window').getValues();
|
||||
var data = [];
|
||||
Ext.Object.each(kv, function(key, value) {
|
||||
if (key === 'delete') { // ignore
|
||||
return;
|
||||
}
|
||||
data.push({ key: key, value: value });
|
||||
});
|
||||
|
||||
me.callParent();
|
||||
}
|
||||
var summarystore = panel.down('grid').getStore();
|
||||
summarystore.suspendEvents();
|
||||
summarystore.removeAll();
|
||||
summarystore.add(data);
|
||||
summarystore.sort();
|
||||
summarystore.resumeEvents();
|
||||
summarystore.fireEvent('refresh');
|
||||
|
||||
}
|
||||
},
|
||||
onSubmit: function() {
|
||||
var wizard = this.up('window');
|
||||
var kv = wizard.getValues();
|
||||
delete kv['delete'];
|
||||
|
||||
var nodename = kv.nodename;
|
||||
delete kv.nodename;
|
||||
|
||||
Proxmox.Utils.API2Request({
|
||||
url: '/nodes/' + nodename + '/qemu',
|
||||
waitMsgTarget: wizard,
|
||||
method: 'POST',
|
||||
params: kv,
|
||||
success: function(response){
|
||||
wizard.close();
|
||||
},
|
||||
failure: function(response, opts) {
|
||||
Ext.Msg.alert(gettext('Error'), response.htmlStatus);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user