js/LDAPConfig.js

   1 /*global Proxmox*/
   2 Ext.define('pmg-ldap-config', {
   3     extend: 'Ext.data.Model',
   4     fields: [ 'profile', 'server1', 'server2', 'comment',
   5               'mode', 'binddn', 'bindpw', 'basedn', 'groupbasedn',
   6               'filter', 'accountattr', 'mailattr',
   7               { name: 'port',  type: 'integer' },
   8               { name: 'gcount',  type: 'integer' },
   9               { name: 'mcount',  type: 'integer' },
  10               { name: 'ucount',  type: 'integer' },
  11               { name: 'disable',  type: 'boolean' }
  12             ],
  13     proxy: {
  14         type: 'proxmox',
  15         url: "/api2/json/config/ldap"
  16     },
  17     idProperty: 'profile'
  18 });
  19
  20 Ext.define('PMG.LDAPInputPanel', {
  21     extend: 'Proxmox.panel.InputPanel',
  22     alias: 'widget.pmgLDAPInputPanel',
  23
  24     profileId: undefined,
  25
  26     onGetValues: function(values) {
  27         var me = this;
  28
  29         values.disable = values.enable ? 0 : 1;
  30         delete values.enable;
  31
  32         return values;
  33     },
  34
  35     initComponent : function() {
  36         var me = this;
  37
  38         me.column1 = [
  39             {
  40                 xtype: me.profileId ? 'displayfield' : 'textfield',
  41                 fieldLabel: gettext('Profile Name'),
  42                 value: me.profileId || '',
  43                 name: 'profile',
  44                 vtype: 'StorageId',
  45                 allowBlank: false
  46             },
  47             {
  48                 xtype: 'proxmoxKVComboBox',
  49                 name: 'mode',
  50                 comboItems: [
  51                     ['ldap', PMG.Utils.format_ldap_protocol('ldap')],
  52                     ['ldaps', PMG.Utils.format_ldap_protocol('ldaps')]
  53                 ],
  54                 value: 'ldap',
  55                 fieldLabel: gettext('Protocol')
  56             },
  57             {
  58                 xtype: 'textfield',
  59                 fieldLabel: gettext('Server'),
  60                 allowBlank: false,
  61                 vtype: 'IP64Address',
  62                 name: 'server1'
  63             },
  64             {
  65                 xtype: 'proxmoxtextfield',
  66                 fieldLabel: gettext('Server'),
  67                 allowBlank: true,
  68                 deleteEmpty: me.create ? false : true,
  69                 vtype: 'IP64Address',
  70                 name: 'server2'
  71             },
  72             {
  73                 xtype: 'proxmoxintegerfield',
  74                 name: 'port',
  75                 emptyText: gettext('Default'),
  76                 deleteEmpty: me.create ? false : true,
  77                 minValue: 1,
  78                 maxValue: 65535,
  79                 fieldLabel: gettext('Port'),
  80             },
  81             {
  82                 xtype: 'textfield',
  83                 name: 'binddn',
  84                 allowBlank: true,
  85                 fieldLabel: gettext('User name')
  86             },
  87             {
  88                 xtype: 'textfield',
  89                 inputType: 'password',
  90                 allowBlank: true,
  91                 name: 'bindpw',
  92                 fieldLabel: gettext('Password')
  93             }
  94         ];
  95
  96         me.column2 = [
  97             {
  98                 xtype: 'proxmoxcheckbox',
  99                 name: 'enable',
 100                 checked: true,
 101                 uncheckedValue: 0,
 102                 fieldLabel: gettext('Enable')
 103             },
 104             {
 105                 xtype: 'proxmoxtextfield',
 106                 allowBlank: true,
 107                 deleteEmpty: me.create ? false : true,
 108                 name: 'basedn',
 109                 fieldLabel: gettext('Base DN')
 110             },
 111             {
 112                 xtype: 'proxmoxtextfield',
 113                 allowBlank: true,
 114                 deleteEmpty: me.create ? false : true,
 115                 name: 'groupbasedn',
 116                 fieldLabel: gettext('Base DN for Groups')
 117             },
 118             {
 119                 xtype: 'proxmoxtextfield',
 120                 allowBlank: true,
 121                 deleteEmpty: me.create ? false : true,
 122                 name: 'mailattr',
 123                 fieldLabel: gettext('EMail attribute name(s)')
 124             },
 125             {
 126                 xtype: 'proxmoxtextfield',
 127                 allowBlank: true,
 128                 deleteEmpty: me.create ? false : true,
 129                 name: 'accountattr',
 130                 fieldLabel: gettext('Account attribute name')
 131             },
 132             {
 133                 xtype: 'proxmoxtextfield',
 134                 allowBlank: true,
 135                 deleteEmpty: me.create ? false : true,
 136                 name: 'filter',
 137                 fieldLabel: gettext('LDAP filter')
 138             },
 139             {
 140                 xtype: 'proxmoxtextfield',
 141                 allowBlank: true,
 142                 deleteEmpty: me.create ? false : true,
 143                 name: 'groupclass',
 144                 fieldLabel: gettext('Group objectclass')
 145             }
 146         ];
 147
 148         me.columnB = [
 149             {
 150                 xtype: 'textfield',
 151                 fieldLabel: gettext('Comment'),
 152                 allowBlank: true,
 153                 name: 'comment'
 154             }
 155         ];
 156
 157         me.callParent();
 158     }
 159 });
 160
 161 Ext.define('PMG.LDAPEdit', {
 162     extend: 'Proxmox.window.Edit',
 163     alias: 'widget.pmgLDAPEdit',
 164
 165     subject: 'LDAP Profile',
 166     isAdd: true,
 167
 168     initComponent : function() {
 169         var me = this;
 170
 171         me.create = me.profileId ? false : true;
 172
 173         if (me.create) {
 174             me.url = '/api2/extjs/config/ldap';
 175             me.method = 'POST';
 176         } else {
 177             me.url = '/api2/extjs/config/ldap/' + me.profileId + '/config';
 178             me.method = 'PUT';
 179         }
 180
 181         var ipanel = Ext.create('PMG.LDAPInputPanel', {
 182             create: me.create,
 183             profileId: me.profileId
 184         });
 185
 186         me.items = [ ipanel ];
 187
 188         me.fieldDefaults = {
 189             labelWidth: 150
 190         };
 191
 192         me.callParent();
 193
 194         if (!me.create) {
 195             me.load({
 196                 success:  function(response, options) {
 197                     var values = response.result.data;
 198
 199                     values.enable = values.disable ? 0 : 1;
 200                     ipanel.setValues(values);
 201                 }
 202             });
 203         }
 204     }
 205 });
 206
 207 Ext.define('PMG.LDAPUserGrid', {
 208     extend: 'Ext.grid.Panel',
 209     xtype: 'pmgLDAPUserGrid',
 210
 211     emptyText: gettext('No data in database'),
 212     store: {
 213         autoDestroy: true,
 214         fields: [ 'dn', 'account', 'pmail' ],
 215         proxy: { type: 'proxmox' },
 216         sorters: [ 'dn' ]
 217     },
 218     columns: [
 219         {
 220             text: 'DN',
 221             dataIndex: 'dn',
 222             flex: 1
 223         },
 224         {
 225             text: gettext('Account'),
 226             dataIndex: 'account',
 227             flex: 1
 228         },
 229         {
 230             text: gettext('Primary E-Mail'),
 231             dataIndex: 'pmail',
 232             flex: 1
 233         }
 234     ],
 235
 236     initComponent: function() {
 237         var me = this;
 238         me.callParent();
 239         if (me.url) {
 240             me.getStore().getProxy().setUrl(me.url);
 241             me.getStore().load();
 242         }
 243     }
 244 });
 245
 246 Ext.define('PMG.LDAPConfig', {
 247     extend: 'Ext.panel.Panel',
 248     xtype: 'pmgLDAPConfig',
 249
 250     controller: {
 251         xclass: 'Ext.app.ViewController',
 252
 253         openUserList: function(grid, record) {
 254             var name = this.getViewModel().get('name');
 255             Ext.create('Ext.window.Window', {
 256                 title: Ext.String.format(gettext("Users of '{0}'"), record.data.dn),
 257                 modal: true,
 258                 width: 600,
 259                 height: 400,
 260                 layout: 'fit',
 261                 items: [{
 262                     xtype: 'pmgLDAPUserGrid',
 263                     border: false,
 264                     url: '/api2/json/config/ldap/' + name + '/groups/' +  record.data.gid
 265                 }]
 266             }).show();
 267         },
 268
 269         showUsers: function(button) {
 270             var me = this;
 271             var view = me.lookup('groupgrid');
 272             var record = view.getSelection()[0];
 273             me.openUserList(view, record);
 274         },
 275
 276         openUserMails: function(grid, record) {
 277             var name = this.getViewModel().get('name');
 278             Ext.create('Ext.window.Window', {
 279                 title: Ext.String.format(gettext("E-Mail addresses of '{0}'"), record.data.dn),
 280                 modal: true,
 281                 width: 600,
 282                 height: 400,
 283                 layout: 'fit',
 284                 items: [{
 285                     xtype: 'grid',
 286                     border: false,
 287                     store: {
 288                         autoLoad: true,
 289                         field: ['email', 'primary'],
 290                         proxy: {
 291                             type: 'proxmox',
 292                             url: '/api2/json/config/ldap/' + name + '/users/' +  record.data.pmail
 293                         }
 294                     },
 295                     columns: [
 296                         { dataIndex: 'email', text: gettext('E-Mail address'), flex: 1 }
 297                     ],
 298                 }]
 299             }).show();
 300         },
 301
 302         showEmails: function(button) {
 303             var me = this;
 304             var view = me.lookup('usergrid');
 305             var record = view.getSelection()[0];
 306             me.openUserMails(view, record);
 307         },
 308
 309         reload: function(grid) {
 310             var me = this;
 311             var selection = grid.getSelection();
 312             me.showInfo(grid, selection);
 313         },
 314
 315         showInfo: function(grid, selected) {
 316             var me = this;
 317             var viewModel = me.getViewModel();
 318             var grid = me.lookup('data');
 319             if (selected[0]) {
 320                 var name = selected[0].data.profile;
 321                 viewModel.set('selected', true);
 322                 viewModel.set('name', name);
 323
 324                 // set grid stores and load them
 325                 var gstore = me.lookup('groupgrid').getStore();
 326                 var ustore = me.lookup('usergrid').getStore();
 327                 gstore.getProxy().setUrl('/api2/json/config/ldap/' + name + '/groups');
 328                 ustore.getProxy().setUrl('/api2/json/config/ldap/' + name + '/users');
 329                 gstore.load();
 330                 ustore.load();
 331             } else {
 332                 viewModel.set('selected', false);
 333             }
 334         },
 335
 336         init: function(view) {
 337             var me = this;
 338             me.lookup('grid').relayEvents(view, ['activate']);
 339             var groupgrid = me.lookup('groupgrid');
 340             var usergrid = me.lookup('usergrid');
 341
 342             Proxmox.Utils.monStoreErrors(groupgrid, groupgrid.getStore(), true);
 343             Proxmox.Utils.monStoreErrors(usergrid, usergrid.getStore(), true);
 344         },
 345
 346         control: {
 347             'grid[reference=grid]': {
 348                 selectionchange: 'showInfo',
 349                 load: 'reload'
 350             },
 351             'grid[reference=groupgrid]': {
 352                 itemdblclick: 'openUserList'
 353             },
 354             'grid[reference=usergrid]': {
 355                 itemdblclick: 'openUserMails'
 356             }
 357         }
 358     },
 359
 360     viewModel: {
 361         data: {
 362             name: '',
 363             selected: false
 364         }
 365     },
 366
 367     layout: {
 368         type: 'border',
 369     },
 370
 371     items: [
 372         {
 373             region: 'center',
 374             reference: 'grid',
 375             xtype: 'pmgLDAPConfigGrid',
 376             border: false,
 377         },
 378         {
 379             xtype: 'tabpanel',
 380             reference: 'data',
 381             hidden: true,
 382             height: '50%',
 383             border: false,
 384             split: true,
 385             region: 'south',
 386             bind: {
 387                 hidden: '{!selected}'
 388             },
 389             items: [
 390                 {
 391                     xtype: 'grid',
 392                     reference: 'groupgrid',
 393                     border: false,
 394                     emptyText: gettext('No data in database'),
 395                     tbar: [{
 396                         xtype: 'proxmoxButton',
 397                         text: gettext('Show Users'),
 398                         handler: 'showUsers',
 399                         disabled: true
 400                     }],
 401                     store: {
 402                         fields: ['dn', 'gid'],
 403                         proxy: { type: 'proxmox' },
 404                         sorters: [ 'dn' ]
 405                     },
 406                     bind: {
 407                         title: Ext.String.format(gettext("Groups of '{0}'"), '{name}')
 408                     },
 409                     columns: [
 410                         {
 411                             text: 'DN',
 412                             dataIndex: 'dn',
 413                             flex: 1
 414                         }
 415                     ]
 416                 },
 417                 {
 418                     xtype: 'pmgLDAPUserGrid',
 419                     reference: 'usergrid',
 420                     border: false,
 421                     tbar: [{
 422                         xtype: 'proxmoxButton',
 423                         text: gettext('Show E-Mail addresses'),
 424                         handler: 'showEmails',
 425                         disabled: true
 426                     }],
 427                     bind: {
 428                         title: Ext.String.format(gettext("Users of '{0}'"), '{name}')
 429                     },
 430                 }
 431             ]
 432         }
 433     ],
 434
 435 });
 436
 437 Ext.define('PMG.LDAPConfigGrid', {
 438     extend: 'Ext.grid.GridPanel',
 439     alias: 'widget.pmgLDAPConfigGrid',
 440
 441     controller: {
 442         xclass: 'Ext.app.ViewController',
 443
 444         run_editor: function() {
 445             var me = this;
 446             var view = me.getView();
 447             var rec = view.getSelection()[0];
 448             if (!rec) {
 449                 return;
 450             }
 451
 452             var win = Ext.createWidget('pmgLDAPEdit', {
 453                 profileId: rec.data.profile,
 454             });
 455             win.on('destroy', me.reload, me);
 456             win.load();
 457             win.show();
 458         },
 459
 460         new: function() {
 461             var me = this;
 462             var win = Ext.createWidget('pmgLDAPEdit', {});
 463             win.on('destroy', me.reload, me);
 464             win.show();
 465         },
 466
 467
 468         reload: function() {
 469             var me = this.getView();
 470             me.getStore().load();
 471             me.fireEvent('load', me);
 472         },
 473
 474         sync: function() {
 475             var me = this;
 476             var view = me.getView();
 477             var rec = view.getSelection()[0];
 478             Proxmox.Utils.API2Request({
 479                 url: '/config/ldap/' + rec.data.profile + '/sync',
 480                 method: 'POST',
 481                 waitMsgTarget: view,
 482                 callback: function() {
 483                     me.reload();
 484                 },
 485                 failure: function (response, opts) {
 486                     Ext.Msg.alert(gettext('Error'), response.htmlStatus);
 487                 }
 488             });
 489         },
 490
 491         init: function(view) {
 492             var me = this;
 493             Proxmox.Utils.monStoreErrors(view, view.getStore(), true);
 494         }
 495     },
 496
 497     store: {
 498         model: 'pmg-ldap-config',
 499         sorters: {
 500             property: 'profile',
 501             order: 'DESC'
 502         }
 503     },
 504
 505     tbar: [
 506         {
 507             xtype: 'proxmoxButton',
 508             text: gettext('Edit'),
 509             disabled: true,
 510             handler: 'run_editor'
 511         },
 512         {
 513             text: gettext('Create'),
 514             handler: 'new'
 515         },
 516         {
 517             xtype: 'proxmoxStdRemoveButton',
 518             baseurl: '/config/ldap',
 519             callback: 'reload',
 520         },
 521         {
 522             xtype: 'proxmoxButton',
 523             text: gettext('Synchronize'),
 524             enableFn: function(rec) {
 525                 return !rec.data.disable;
 526             },
 527             disabled: true,
 528             handler: 'sync'
 529         },
 530     ],
 531
 532     listeners: {
 533         itemdblclick: 'run_editor',
 534         activate: 'reload'
 535     },
 536
 537     columns: [
 538         {
 539             header: gettext('Profile Name'),
 540             sortable: true,
 541             width: 120,
 542             dataIndex: 'profile'
 543         },
 544         {
 545             header: gettext('Protocol'),
 546             sortable: true,
 547             dataIndex: 'mode',
 548             renderer: PMG.Utils.format_ldap_protocol
 549         },
 550         {
 551             header: gettext('Server'),
 552             sortable: true,
 553             dataIndex: 'server1',
 554             renderer: function(value, metaData, rec) {
 555                 if (rec.data.server2) {
 556                     return value + '<br>' + rec.data.server2;
 557                 }
 558                 return value;
 559             }
 560         },
 561         {
 562             header: gettext('Enabled'),
 563             width: 80,
 564             sortable: true,
 565             dataIndex: 'disable',
 566             renderer: Proxmox.Utils.format_neg_boolean
 567         },
 568         {
 569             header: gettext('Comment'),
 570             sortable: false,
 571             renderer: Ext.String.htmlEncode,
 572             dataIndex: 'comment',
 573             flex: 1
 574         },
 575         {
 576             header: gettext('Accounts'),
 577             width: 80,
 578             sortable: true,
 579             dataIndex: 'ucount'
 580         },
 581         {
 582             header: gettext('Addresses'),
 583             width: 80,
 584             sortable: true,
 585             dataIndex: 'mcount'
 586         },
 587         {
 588             header: gettext('Groups'),
 589             width: 80,
 590             sortable: true,
 591             dataIndex: 'gcount'
 592         },
 593     ],
 594
 595 });