mirror of
https://git.proxmox.com/git/pmg-gui
synced 2025-07-24 16:45:31 +00:00
js/UserEdit.js: rewrite, use a view model
This commit is contained in:
Dietmar Maurer
parent
4d904e0acc
commit
b7e43bc4f3
329
js/UserEdit.js
329
js/UserEdit.js
@ -1,139 +1,11 @@
|
||||
Ext.define('PMG.UserInputPanel', {
|
||||
extend: 'Proxmox.panel.InputPanel',
|
||||
alias: 'widget.pmgUserInputPanel',
|
||||
Ext.define('PMG.UserViewModel', {
|
||||
extend: 'Ext.app.ViewModel',
|
||||
alias: 'viewmodel.pmgUserViewModel',
|
||||
|
||||
onGetValues: function(values) {
|
||||
var me = this;
|
||||
|
||||
// hack: ExtJS datefield does not submit 0, so we need to set that
|
||||
if (!values.expire) {
|
||||
values.expire = 0;
|
||||
}
|
||||
|
||||
if (me.create) {
|
||||
values.userid = values.userid + '@pmg';
|
||||
}
|
||||
|
||||
if (!values.password) {
|
||||
delete values.password;
|
||||
}
|
||||
|
||||
return values;
|
||||
},
|
||||
|
||||
initComponent : function() {
|
||||
var me = this;
|
||||
|
||||
me.create = !me.userid;
|
||||
|
||||
var verifypw;
|
||||
var pwfield;
|
||||
|
||||
var validate_pw = function() {
|
||||
if (verifypw.getValue() !== pwfield.getValue()) {
|
||||
return gettext("Passwords does not match");
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
verifypw = Ext.createWidget('textfield', {
|
||||
inputType: 'password',
|
||||
fieldLabel: gettext('Confirm password'),
|
||||
name: 'verifypassword',
|
||||
submitValue: false,
|
||||
validator: validate_pw
|
||||
});
|
||||
|
||||
pwfield = Ext.createWidget('textfield', {
|
||||
inputType: 'password',
|
||||
fieldLabel: gettext('Password'),
|
||||
minLength: 5,
|
||||
name: 'password',
|
||||
validator: validate_pw
|
||||
});
|
||||
|
||||
me.column1 = [
|
||||
{
|
||||
xtype: me.create ? 'textfield' : 'displayfield',
|
||||
name: 'userid',
|
||||
fieldLabel: gettext('User name'),
|
||||
value: me.userid,
|
||||
allowBlank: false,
|
||||
submitValue: me.create ? true : false
|
||||
}
|
||||
];
|
||||
|
||||
if (me.create) {
|
||||
me.column1.push(pwfield, verifypw);
|
||||
}
|
||||
|
||||
me.column1.push(
|
||||
{
|
||||
xtype: 'pmgRoleSelector',
|
||||
name: 'role',
|
||||
disabled: me.userid === 'root@pam',
|
||||
allowBlank: false,
|
||||
fieldLabel: gettext('Role')
|
||||
},
|
||||
{
|
||||
xtype: 'datefield',
|
||||
name: 'expire',
|
||||
emptyText: Proxmox.Utils.neverText,
|
||||
format: 'Y-m-d',
|
||||
disabled: me.userid === 'root@pam',
|
||||
submitFormat: 'U',
|
||||
fieldLabel: gettext('Expire')
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxcheckbox',
|
||||
fieldLabel: gettext('Enabled'),
|
||||
name: 'enable',
|
||||
disabled: me.userid === 'root@pam',
|
||||
uncheckedValue: 0,
|
||||
defaultValue: 1,
|
||||
checked: true
|
||||
}
|
||||
);
|
||||
|
||||
me.column2 = [
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
deleteEmpty: me.create ? false : true,
|
||||
name: 'firstname',
|
||||
fieldLabel: gettext('First Name')
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
deleteEmpty: me.create ? false : true,
|
||||
name: 'lastname',
|
||||
fieldLabel: gettext('Last Name')
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'email',
|
||||
deleteEmpty: me.create ? false : true,
|
||||
fieldLabel: gettext('E-Mail'),
|
||||
vtype: 'proxmoxMail'
|
||||
}
|
||||
];
|
||||
|
||||
me.columnB = [
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'comment',
|
||||
deleteEmpty: me.create ? false : true,
|
||||
disabled: me.userid === 'root@pam',
|
||||
fieldLabel: gettext('Comment')
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
deleteEmpty: me.create ? false : true,
|
||||
name: 'keys',
|
||||
fieldLabel: gettext('Key IDs')
|
||||
}
|
||||
];
|
||||
|
||||
me.callParent();
|
||||
data: {
|
||||
userid: undefined,
|
||||
isCreate: true,
|
||||
isSuperUser: false,
|
||||
}
|
||||
});
|
||||
|
||||
@ -141,35 +13,197 @@ Ext.define('PMG.UserEdit', {
|
||||
extend: 'Proxmox.window.Edit',
|
||||
alias: ['widget.pmgUserEdit'],
|
||||
|
||||
viewModel: { type: 'pmgUserViewModel' },
|
||||
|
||||
isAdd: true,
|
||||
|
||||
subject: gettext('User'),
|
||||
|
||||
fieldDefaults: {
|
||||
labelWidth: 120
|
||||
fieldDefaults: { labelWidth: 120 },
|
||||
|
||||
items: {
|
||||
xtype: 'inputpanel',
|
||||
onGetValues: function(values) {
|
||||
var me = this;
|
||||
|
||||
// hack: ExtJS datefield does not submit 0, so we need to set that
|
||||
if (!values.expire) {
|
||||
values.expire = 0;
|
||||
}
|
||||
|
||||
if (me.create) {
|
||||
values.userid = values.userid + '@pmg';
|
||||
}
|
||||
|
||||
if (!values.password) {
|
||||
delete values.password;
|
||||
}
|
||||
|
||||
return values;
|
||||
},
|
||||
|
||||
column1: [
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'userid',
|
||||
fieldLabel: gettext('User name'),
|
||||
allowBlank: false,
|
||||
bind: {
|
||||
value: '{userid}',
|
||||
submitValue: '{isCreate}',
|
||||
editable: '{isCreate}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'textfield',
|
||||
inputType: 'password',
|
||||
fieldLabel: gettext('Password'),
|
||||
minLength: 5,
|
||||
name: 'password',
|
||||
listeners: {
|
||||
change: function(field){
|
||||
field.next().validate();
|
||||
},
|
||||
blur: function(field){
|
||||
field.next().validate();
|
||||
}
|
||||
},
|
||||
bind: {
|
||||
hidden: '{!isCreate}',
|
||||
disabled: '{!isCreate}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'textfield',
|
||||
inputType: 'password',
|
||||
fieldLabel: gettext('Confirm password'),
|
||||
name: 'verifypassword',
|
||||
vtype: 'password',
|
||||
initialPassField: 'password',
|
||||
submitValue: false,
|
||||
bind: {
|
||||
hidden: '{!isCreate}',
|
||||
disabled: '{!isCreate}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'pmgRoleSelector',
|
||||
name: 'role',
|
||||
allowBlank: false,
|
||||
fieldLabel: gettext('Role'),
|
||||
bind: {
|
||||
disabled: '{isSuperUser}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'datefield',
|
||||
name: 'expire',
|
||||
emptyText: Proxmox.Utils.neverText,
|
||||
format: 'Y-m-d',
|
||||
submitFormat: 'U',
|
||||
fieldLabel: gettext('Expire'),
|
||||
bind: {
|
||||
disabled: '{isSuperUser}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxcheckbox',
|
||||
fieldLabel: gettext('Enabled'),
|
||||
name: 'enable',
|
||||
uncheckedValue: 0,
|
||||
defaultValue: 1,
|
||||
checked: true,
|
||||
bind: {
|
||||
disabled: '{isSuperUser}'
|
||||
}
|
||||
}
|
||||
],
|
||||
|
||||
column2: [
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'firstname',
|
||||
fieldLabel: gettext('First Name'),
|
||||
bind: {
|
||||
deleteEmpty: '{!isCreate}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'lastname',
|
||||
fieldLabel: gettext('Last Name'),
|
||||
bind: {
|
||||
deleteEmpty: '{!isCreate}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'email',
|
||||
fieldLabel: gettext('E-Mail'),
|
||||
vtype: 'proxmoxMail',
|
||||
bind: {
|
||||
deleteEmpty: '{!isCreate}'
|
||||
}
|
||||
}
|
||||
],
|
||||
|
||||
columnB: [
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'comment',
|
||||
fieldLabel: gettext('Comment'),
|
||||
bind: {
|
||||
disabled: '{isSuperUser}',
|
||||
deleteEmpty: '{!isCreate}'
|
||||
}
|
||||
},
|
||||
{
|
||||
xtype: 'proxmoxtextfield',
|
||||
name: 'keys',
|
||||
fieldLabel: gettext('Key IDs'),
|
||||
bind: {
|
||||
deleteEmpty: '{!isCreate}'
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
controller: {
|
||||
|
||||
xclass: 'Ext.app.ViewController',
|
||||
|
||||
init: function(view) {
|
||||
var userid = view.userid;
|
||||
var viewModel = view.getViewModel();
|
||||
|
||||
view.getViewModel().set('isCreate', !view.userid);
|
||||
|
||||
if (userid) {
|
||||
viewModel.set('userid', userid);
|
||||
if (userid === 'root@pam') {
|
||||
viewModel.set('isSuperUser', true);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
initComponent : function() {
|
||||
var me = this;
|
||||
|
||||
me.create = !me.userid;
|
||||
var userid = me.userid;
|
||||
me.create = !userid; // fixme
|
||||
|
||||
if (me.create) {
|
||||
if (!userid) {
|
||||
me.url = '/api2/extjs/access/users';
|
||||
me.method = 'POST';
|
||||
} else {
|
||||
me.url = '/api2/extjs/access/users/' + me.userid;
|
||||
me.url = '/api2/extjs/access/users/' + userid;
|
||||
me.method = 'PUT';
|
||||
}
|
||||
|
||||
me.items = {
|
||||
xtype: 'pmgUserInputPanel',
|
||||
userid: me.userid
|
||||
};
|
||||
me.callParent();
|
||||
|
||||
me.callParent();
|
||||
|
||||
if (!me.create) {
|
||||
if (userid) {
|
||||
me.load({
|
||||
success: function(response, options) {
|
||||
var data = response.result.data;
|
||||
@ -181,6 +215,7 @@ Ext.define('PMG.UserEdit', {
|
||||
data.expire = null;
|
||||
}
|
||||
}
|
||||
|
||||
me.setValues(data);
|
||||
}
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user