SafeDestroy.js: use modern ExtJS features
We now use the class config system, a View Model and a View Controller.
This commit is contained in:
parent
b11db5ebcb
commit
1509fb3477
www/manager6
@ -89,8 +89,8 @@ Ext.define('PVE.lxc.Config', {
|
|||||||
disabled: !caps.vms['VM.Allocate'],
|
disabled: !caps.vms['VM.Allocate'],
|
||||||
handler: function() {
|
handler: function() {
|
||||||
Ext.create('PVE.window.SafeDestroy', {
|
Ext.create('PVE.window.SafeDestroy', {
|
||||||
vmid: vmid,
|
url: base_url,
|
||||||
base_url: base_url
|
item: { type: 'CT', id: vmid }
|
||||||
}).show();
|
}).show();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -100,8 +100,8 @@ Ext.define('PVE.qemu.Config', {
|
|||||||
disabled: !caps.vms['VM.Allocate'],
|
disabled: !caps.vms['VM.Allocate'],
|
||||||
handler: function() {
|
handler: function() {
|
||||||
Ext.create('PVE.window.SafeDestroy', {
|
Ext.create('PVE.window.SafeDestroy', {
|
||||||
vmid: vmid,
|
url: base_url,
|
||||||
base_url: base_url
|
item: { type: 'VM', id: vmid }
|
||||||
}).show();
|
}).show();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -5,83 +5,118 @@
|
|||||||
Ext.define('PVE.window.SafeDestroy', {
|
Ext.define('PVE.window.SafeDestroy', {
|
||||||
extend: 'Ext.window.Window',
|
extend: 'Ext.window.Window',
|
||||||
alias: 'widget.pveSafeDestroy',
|
alias: 'widget.pveSafeDestroy',
|
||||||
|
|
||||||
title: gettext('Are you sure?'),
|
title: gettext('Are you sure?'),
|
||||||
modal: true,
|
modal: true,
|
||||||
buttonAlign: 'center',
|
buttonAlign: 'center',
|
||||||
|
bodyPadding: 10,
|
||||||
|
width: 450,
|
||||||
|
layout: 'hbox',
|
||||||
|
|
||||||
|
viewModel: { type: 'default' },
|
||||||
|
|
||||||
|
config: {
|
||||||
|
item: {
|
||||||
|
id: undefined,
|
||||||
|
type: undefined
|
||||||
|
},
|
||||||
|
url: undefined
|
||||||
|
},
|
||||||
|
|
||||||
|
applyItem: function(item) {
|
||||||
|
var me = this;
|
||||||
|
|
||||||
|
if (!Ext.isDefined(item.id)) {
|
||||||
|
throw "no ID specified";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!Ext.isDefined(item.type)) {
|
||||||
|
throw "no VM type specified";
|
||||||
|
}
|
||||||
|
|
||||||
|
me.getViewModel().set('item', item);
|
||||||
|
|
||||||
|
return item;
|
||||||
|
},
|
||||||
|
|
||||||
|
controller: {
|
||||||
|
|
||||||
|
xclass: 'Ext.app.ViewController',
|
||||||
|
|
||||||
|
control: {
|
||||||
|
'field[name=confirm]': {
|
||||||
|
change: function(f, value) {
|
||||||
|
var view = this.getView();
|
||||||
|
var removeButton = this.lookupReference('removeButton');
|
||||||
|
if (value === view.getItem().id) {
|
||||||
|
removeButton.enable();
|
||||||
|
} else {
|
||||||
|
removeButton.disable();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'button[reference=cancelButton]': {
|
||||||
|
click: function() {
|
||||||
|
this.getView().close();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'button[reference=removeButton]': {
|
||||||
|
click: function() {
|
||||||
|
var view = this.getView();
|
||||||
|
PVE.Utils.API2Request({
|
||||||
|
url: view.getUrl(),
|
||||||
|
method: 'DELETE',
|
||||||
|
waitMsgTarget: view,
|
||||||
|
failure: function(response, opts) {
|
||||||
|
Ext.Msg.alert('Error', response.htmlStatus);
|
||||||
|
},
|
||||||
|
callback: function() {
|
||||||
|
view.close();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
itemId: 'safepanel',
|
xtype: 'component',
|
||||||
|
cls: [ Ext.baseCSSPrefix + 'message-box-icon',
|
||||||
|
Ext.baseCSSPrefix + 'message-box-warning',
|
||||||
|
Ext.baseCSSPrefix + 'dlg-icon'],
|
||||||
|
},
|
||||||
|
{
|
||||||
xtype: 'container',
|
xtype: 'container',
|
||||||
padding: 10,
|
flex: 1,
|
||||||
width: 450,
|
|
||||||
layout: {
|
layout: {
|
||||||
type: 'vbox',
|
type: 'vbox',
|
||||||
align: 'stretch'
|
align: 'stretch'
|
||||||
},
|
},
|
||||||
items: [
|
items: [
|
||||||
{
|
{
|
||||||
itemId: 'message',
|
xtype: 'component',
|
||||||
xtype: 'textarea',
|
bind: gettext('Are you sure you want to remove {item.type} {item.id}? This will permanently erase all data.')
|
||||||
editable: false,
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
itemId: 'input',
|
reference: 'confirmField',
|
||||||
xtype: 'numberfield',
|
xtype: 'numberfield',
|
||||||
name: 'VM id',
|
name: 'confirm',
|
||||||
fieldLabel: gettext('Please enter the VM ID to confirm'),
|
labelWidth: 300,
|
||||||
hideTrigger:true,
|
bind: {
|
||||||
allowBlank: false,
|
fieldLabel: gettext('Please enter the {item.type} ID to confirm'),
|
||||||
listeners: {
|
},
|
||||||
change: function(f, value) {
|
hideTrigger: true,
|
||||||
if (value === this.vmid) {
|
allowBlank: false
|
||||||
this.submitBtn.enable();
|
|
||||||
} else {
|
|
||||||
this.submitBtn.disable();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
]
|
],
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
id: 'removeButton',
|
reference: 'removeButton',
|
||||||
text: gettext('Remove'),
|
text: gettext('Remove'),
|
||||||
disabled: true,
|
disabled: true
|
||||||
handler: function () {
|
|
||||||
var me = this;
|
|
||||||
PVE.Utils.API2Request({
|
|
||||||
url: me.base_url,
|
|
||||||
method: 'DELETE',
|
|
||||||
waitMsgTarget: me,
|
|
||||||
failure: function(response, opts) {
|
|
||||||
Ext.Msg.alert('Error', response.htmlStatus);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
me.up('window').close();
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
text: gettext('Cancel'),
|
|
||||||
handler: function() {
|
|
||||||
this.up('window').close();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
],
|
]
|
||||||
|
|
||||||
initComponent: function() {
|
|
||||||
var me = this;
|
|
||||||
me.callParent();
|
|
||||||
|
|
||||||
var msg = Ext.String.format(gettext('Are you sure you want to remove VM {0}? This will permanently erase all VM data.'), me.vmid);
|
|
||||||
|
|
||||||
var submitBtn = me.down('toolbar').getComponent('removeButton');
|
|
||||||
submitBtn.base_url= me.base_url;
|
|
||||||
|
|
||||||
var safepanel = me.getComponent('safepanel');
|
|
||||||
safepanel.getComponent('message').setValue(msg);
|
|
||||||
safepanel.getComponent('input').vmid = me.vmid;
|
|
||||||
safepanel.getComponent('input').submitBtn = submitBtn;
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
Loading…
x
Reference in New Issue
Block a user