gui: improve login view (use realms)
This commit is contained in:
parent
b88f9c5b1e
commit
9abcae1b0e
126
www/LoginView.js
126
www/LoginView.js
@ -9,31 +9,89 @@ Ext.define('PBS.LoginView', {
|
|||||||
var me = this;
|
var me = this;
|
||||||
var view = me.getView();
|
var view = me.getView();
|
||||||
var loginForm = me.lookupReference('loginForm');
|
var loginForm = me.lookupReference('loginForm');
|
||||||
|
var unField = me.lookupReference('usernameField');
|
||||||
|
var saveunField = me.lookupReference('saveunField');
|
||||||
|
|
||||||
if (loginForm.isValid()) {
|
if (!loginForm.isValid()) {
|
||||||
if (loginForm.isVisible()) {
|
return;
|
||||||
loginForm.mask(gettext('Please wait...'), 'x-mask-loading');
|
|
||||||
}
|
|
||||||
loginForm.submit({
|
|
||||||
success: function(form, action) {
|
|
||||||
// save login data and create cookie
|
|
||||||
PBS.Utils.updateLoginData(action.result.data);
|
|
||||||
PBS.app.changeView('mainview');
|
|
||||||
},
|
|
||||||
failure: function(form, action) {
|
|
||||||
loginForm.unmask();
|
|
||||||
Ext.MessageBox.alert(
|
|
||||||
gettext('Error'),
|
|
||||||
gettext('Login failed. Please try again')
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let params = loginForm.getValues();
|
||||||
|
|
||||||
|
params.username = params.username + '@' + params.realm;
|
||||||
|
delete(params.realm);
|
||||||
|
|
||||||
|
if (loginForm.isVisible()) {
|
||||||
|
loginForm.mask(gettext('Please wait...'), 'x-mask-loading');
|
||||||
|
}
|
||||||
|
|
||||||
|
// set or clear username
|
||||||
|
var sp = Ext.state.Manager.getProvider();
|
||||||
|
if (saveunField.getValue() === true) {
|
||||||
|
sp.set(unField.getStateId(), unField.getValue());
|
||||||
|
} else {
|
||||||
|
sp.clear(unField.getStateId());
|
||||||
|
}
|
||||||
|
sp.set(saveunField.getStateId(), saveunField.getValue());
|
||||||
|
|
||||||
|
Proxmox.Utils.API2Request({
|
||||||
|
url: '/api2/extjs/access/ticket',
|
||||||
|
params: params,
|
||||||
|
method: 'POST',
|
||||||
|
success: function(resp, opts) {
|
||||||
|
// save login data and create cookie
|
||||||
|
PBS.Utils.updateLoginData(resp.result.data);
|
||||||
|
PBS.app.changeView('mainview');
|
||||||
|
},
|
||||||
|
failure: function(resp, opts) {
|
||||||
|
Proxmox.Utils.authClear();
|
||||||
|
loginForm.unmask();
|
||||||
|
Ext.MessageBox.alert(
|
||||||
|
gettext('Error'),
|
||||||
|
gettext('Login failed. Please try again')
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
control: {
|
control: {
|
||||||
|
'field[name=username]': {
|
||||||
|
specialkey: function(f, e) {
|
||||||
|
if (e.getKey() === e.ENTER) {
|
||||||
|
var pf = this.lookupReference('passwordField');
|
||||||
|
if (!pf.getValue()) {
|
||||||
|
pf.focus(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'field[name=lang]': {
|
||||||
|
change: function(f, value) {
|
||||||
|
var dt = Ext.Date.add(new Date(), Ext.Date.YEAR, 10);
|
||||||
|
Ext.util.Cookies.set('PBSLangCookie', value, dt);
|
||||||
|
this.getView().mask(gettext('Please wait...'), 'x-mask-loading');
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
},
|
||||||
'button[reference=loginButton]': {
|
'button[reference=loginButton]': {
|
||||||
click: 'submitForm'
|
click: 'submitForm'
|
||||||
|
},
|
||||||
|
'window[reference=loginwindow]': {
|
||||||
|
show: function() {
|
||||||
|
var sp = Ext.state.Manager.getProvider();
|
||||||
|
var checkboxField = this.lookupReference('saveunField');
|
||||||
|
var unField = this.lookupReference('usernameField');
|
||||||
|
|
||||||
|
var checked = sp.get(checkboxField.getStateId());
|
||||||
|
checkboxField.setValue(checked);
|
||||||
|
|
||||||
|
if(checked === true) {
|
||||||
|
var username = sp.get(unField.getStateId());
|
||||||
|
unField.setValue(username);
|
||||||
|
var pwField = this.lookupReference('passwordField');
|
||||||
|
pwField.focus();
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -74,11 +132,9 @@ Ext.define('PBS.LoginView', {
|
|||||||
reference: 'loginwindow',
|
reference: 'loginwindow',
|
||||||
autoShow: true,
|
autoShow: true,
|
||||||
modal: true,
|
modal: true,
|
||||||
|
width: 400,
|
||||||
|
|
||||||
//defaultFocus: 'usernameField',
|
defaultFocus: 'usernameField',
|
||||||
// TODO: use usernameField again once we have a real user-,
|
|
||||||
// permission system and root@pam isn't the default anymore
|
|
||||||
defaultFocus: 'passwordField',
|
|
||||||
|
|
||||||
layout: {
|
layout: {
|
||||||
type: 'auto'
|
type: 'auto'
|
||||||
@ -102,13 +158,17 @@ Ext.define('PBS.LoginView', {
|
|||||||
},
|
},
|
||||||
|
|
||||||
items: [
|
items: [
|
||||||
|
{
|
||||||
|
xtype: 'pbsRealmComboBox',
|
||||||
|
name: 'realm'
|
||||||
|
},
|
||||||
{
|
{
|
||||||
xtype: 'textfield',
|
xtype: 'textfield',
|
||||||
fieldLabel: gettext('User name'),
|
fieldLabel: gettext('User name'),
|
||||||
name: 'username',
|
name: 'username',
|
||||||
value: 'root@pam',
|
|
||||||
itemId: 'usernameField',
|
itemId: 'usernameField',
|
||||||
reference: 'usernameField'
|
reference: 'usernameField',
|
||||||
|
stateId: 'login-username'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
xtype: 'textfield',
|
xtype: 'textfield',
|
||||||
@ -117,9 +177,27 @@ Ext.define('PBS.LoginView', {
|
|||||||
name: 'password',
|
name: 'password',
|
||||||
itemId: 'passwordField',
|
itemId: 'passwordField',
|
||||||
reference: 'passwordField',
|
reference: 'passwordField',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xtype: 'proxmoxLanguageSelector',
|
||||||
|
fieldLabel: gettext('Language'),
|
||||||
|
value: Ext.util.Cookies.get('PBSLangCookie') || Proxmox.defaultLang || 'en',
|
||||||
|
name: 'lang',
|
||||||
|
reference: 'langField',
|
||||||
|
submitValue: false
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
buttons: [
|
buttons: [
|
||||||
|
{
|
||||||
|
xtype: 'checkbox',
|
||||||
|
fieldLabel: gettext('Save User name'),
|
||||||
|
name: 'saveusername',
|
||||||
|
reference: 'saveunField',
|
||||||
|
stateId: 'login-saveusername',
|
||||||
|
labelWidth: 250,
|
||||||
|
labelAlign: 'right',
|
||||||
|
submitValue: false
|
||||||
|
},
|
||||||
{
|
{
|
||||||
text: gettext('Login'),
|
text: gettext('Login'),
|
||||||
reference: 'loginButton',
|
reference: 'loginButton',
|
||||||
|
@ -7,6 +7,7 @@ IMAGES := \
|
|||||||
JSSRC= \
|
JSSRC= \
|
||||||
Utils.js \
|
Utils.js \
|
||||||
Logo.js \
|
Logo.js \
|
||||||
|
RealmComboBox.js \
|
||||||
LoginView.js \
|
LoginView.js \
|
||||||
VersionInfo.js \
|
VersionInfo.js \
|
||||||
SystemConfiguration.js \
|
SystemConfiguration.js \
|
||||||
|
67
www/RealmComboBox.js
Normal file
67
www/RealmComboBox.js
Normal file
@ -0,0 +1,67 @@
|
|||||||
|
Ext.define('pbs-domains', {
|
||||||
|
extend: "Ext.data.Model",
|
||||||
|
fields: [ 'realm', 'comment', 'default' ],
|
||||||
|
idProperty: 'realm',
|
||||||
|
proxy: {
|
||||||
|
type: 'proxmox',
|
||||||
|
url: "/api2/json/access/domains"
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Ext.define('PBS.form.RealmComboBox', {
|
||||||
|
extend: 'Ext.form.field.ComboBox',
|
||||||
|
alias: ['widget.pbsRealmComboBox'],
|
||||||
|
|
||||||
|
controller: {
|
||||||
|
xclass: 'Ext.app.ViewController',
|
||||||
|
|
||||||
|
init: function(view) {
|
||||||
|
view.store.on('load', this.onLoad, view);
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad: function(store, records, success) {
|
||||||
|
if (!success) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
var me = this;
|
||||||
|
var val = me.getValue();
|
||||||
|
if (!val || !me.store.findRecord('realm', val)) {
|
||||||
|
var def = 'pam';
|
||||||
|
Ext.each(records, function(rec) {
|
||||||
|
if (rec.data && rec.data['default']) {
|
||||||
|
def = rec.data.realm;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
me.setValue(def);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
fieldLabel: gettext('Realm'),
|
||||||
|
name: 'realm',
|
||||||
|
queryMode: 'local',
|
||||||
|
allowBlank: false,
|
||||||
|
editable: false,
|
||||||
|
forceSelection: true,
|
||||||
|
autoSelect: false,
|
||||||
|
triggerAction: 'all',
|
||||||
|
valueField: 'realm',
|
||||||
|
displayField: 'comment',
|
||||||
|
getState: function() {
|
||||||
|
return { value: this.getValue() };
|
||||||
|
},
|
||||||
|
applyState : function(state) {
|
||||||
|
if (state && state.value) {
|
||||||
|
this.setValue(state.value);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
stateEvents: [ 'select' ],
|
||||||
|
stateful: true, // last chosen auth realm is saved between page reloads
|
||||||
|
id: 'pbsloginrealm', // We need stable ids when using stateful, not autogenerated
|
||||||
|
stateID: 'pbsloginrealm',
|
||||||
|
|
||||||
|
store: {
|
||||||
|
model: 'pbs-domains',
|
||||||
|
autoLoad: true
|
||||||
|
}
|
||||||
|
});
|
Loading…
Reference in New Issue
Block a user