www/manager6/panel/IPSet.js

   1 Ext.define('pve-fw-ipsets', {
   2     extend: 'Ext.data.Model',
   3     fields: ['name', 'comment', 'digest'],
   4     idProperty: 'name',
   5 });
   6
   7 Ext.define('PVE.IPSetList', {
   8     extend: 'Ext.grid.Panel',
   9     alias: 'widget.pveIPSetList',
  10
  11     stateful: true,
  12     stateId: 'grid-firewall-ipsetlist',
  13
  14     ipset_panel: undefined,
  15
  16     base_url: undefined,
  17
  18     addBtn: undefined,
  19     removeBtn: undefined,
  20     editBtn: undefined,
  21
  22     initComponent: function() {
  23         var me = this;
  24
  25         if (typeof me.ipset_panel === 'undefined') {
  26             throw "no rule panel specified";
  27         }
  28
  29         if (typeof me.ipset_panel === 'undefined') {
  30             throw "no base_url specified";
  31         }
  32
  33         var store = new Ext.data.Store({
  34             model: 'pve-fw-ipsets',
  35             proxy: {
  36                 type: 'proxmox',
  37                 url: "/api2/json" + me.base_url,
  38             },
  39             sorters: {
  40                 property: 'name',
  41                 direction: 'ASC',
  42             },
  43         });
  44
  45         var caps = Ext.state.Manager.get('GuiCap');
  46
  47         var sm = Ext.create('Ext.selection.RowModel', {});
  48
  49         var reload = function() {
  50             var oldrec = sm.getSelection()[0];
  51             store.load(function(records, operation, success) {
  52                 if (oldrec) {
  53                     var rec = store.findRecord('name', oldrec.data.name, 0, false, true, true);
  54                     if (rec) {
  55                         sm.select(rec);
  56                     }
  57                 }
  58             });
  59         };
  60
  61         var run_editor = function() {
  62             var rec = sm.getSelection()[0];
  63             if (!rec) {
  64                 return;
  65             }
  66             var win = Ext.create('Proxmox.window.Edit', {
  67                 subject: "IPSet '" + rec.data.name + "'",
  68                 url: me.base_url,
  69                 method: 'POST',
  70                 digest: rec.data.digest,
  71                 items: [
  72                     {
  73                         xtype: 'hiddenfield',
  74                         name: 'rename',
  75                         value: rec.data.name,
  76                     },
  77                     {
  78                         xtype: 'textfield',
  79                         name: 'name',
  80                         value: rec.data.name,
  81                         fieldLabel: gettext('Name'),
  82                         allowBlank: false,
  83                     },
  84                     {
  85                         xtype: 'textfield',
  86                         name: 'comment',
  87                         value: rec.data.comment,
  88                         fieldLabel: gettext('Comment'),
  89                     },
  90                 ],
  91             });
  92             win.show();
  93             win.on('destroy', reload);
  94         };
  95
  96         me.editBtn = new Proxmox.button.Button({
  97             text: gettext('Edit'),
  98             disabled: true,
  99             enableFn: rec => !!caps.vms['VM.Config.Network'] || !!caps.dc['Sys.Modify'] || !!caps.nodes['Sys.Modify'],
 100             selModel: sm,
 101             handler: run_editor,
 102         });
 103
 104         me.addBtn = new Proxmox.button.Button({
 105             text: gettext('Create'),
 106             handler: function() {
 107                 sm.deselectAll();
 108                 var win = Ext.create('Proxmox.window.Edit', {
 109                     subject: 'IPSet',
 110                     url: me.base_url,
 111                     method: 'POST',
 112                     items: [
 113                         {
 114                             xtype: 'textfield',
 115                             name: 'name',
 116                             value: '',
 117                             fieldLabel: gettext('Name'),
 118                             allowBlank: false,
 119                         },
 120                         {
 121                             xtype: 'textfield',
 122                             name: 'comment',
 123                             value: '',
 124                             fieldLabel: gettext('Comment'),
 125                         },
 126                     ],
 127                 });
 128                 win.show();
 129                 win.on('destroy', reload);
 130             },
 131         });
 132
 133         me.removeBtn = Ext.create('Proxmox.button.StdRemoveButton', {
 134             enableFn: rec => !!caps.vms['VM.Config.Network'] || !!caps.dc['Sys.Modify'] || !!caps.nodes['Sys.Modify'],
 135             selModel: sm,
 136             baseurl: me.base_url + '/',
 137             callback: reload,
 138         });
 139
 140         Ext.apply(me, {
 141             store: store,
 142             tbar: ['<b>IPSet:</b>', me.addBtn, me.removeBtn, me.editBtn],
 143             selModel: sm,
 144             columns: [
 145                 { header: 'IPSet', dataIndex: 'name', width: '100' },
 146                 { header: gettext('Comment'), dataIndex: 'comment', renderer: Ext.String.htmlEncode, flex: 1 },
 147             ],
 148             listeners: {
 149                 itemdblclick: run_editor,
 150                 select: function(_, rec) {
 151                     var url = me.base_url + '/' + rec.data.name;
 152                     me.ipset_panel.setBaseUrl(url);
 153                 },
 154                 deselect: function() {
 155                     me.ipset_panel.setBaseUrl(undefined);
 156                 },
 157                 show: reload,
 158             },
 159         });
 160
 161         if (!caps.vms['VM.Config.Network'] && !caps.dc['Sys.Modify'] && !caps.nodes['Sys.Modify']) {
 162             me.addBtn.setDisabled(true);
 163         }
 164
 165         me.callParent();
 166
 167         store.load();
 168     },
 169 });
 170
 171 Ext.define('PVE.IPSetCidrEdit', {
 172     extend: 'Proxmox.window.Edit',
 173
 174     cidr: undefined,
 175
 176     initComponent: function() {
 177         var me = this;
 178
 179         me.isCreate = me.cidr === undefined;
 180
 181
 182         if (me.isCreate) {
 183             me.url = '/api2/extjs' + me.base_url;
 184             me.method = 'POST';
 185         } else {
 186             me.url = '/api2/extjs' + me.base_url + '/' + me.cidr;
 187             me.method = 'PUT';
 188         }
 189
 190         var column1 = [];
 191
 192         if (me.isCreate) {
 193             if (!me.list_refs_url) {
 194                 throw "no alias_base_url specified";
 195             }
 196
 197             column1.push({
 198                 xtype: 'pveIPRefSelector',
 199                 name: 'cidr',
 200                 ref_type: 'alias',
 201                 autoSelect: false,
 202                 editable: true,
 203                 base_url: me.list_refs_url,
 204                 value: '',
 205                 fieldLabel: gettext('IP/CIDR'),
 206             });
 207         } else {
 208             column1.push({
 209                 xtype: 'displayfield',
 210                 name: 'cidr',
 211                 value: '',
 212                 fieldLabel: gettext('IP/CIDR'),
 213             });
 214         }
 215
 216         var ipanel = Ext.create('Proxmox.panel.InputPanel', {
 217             isCreate: me.isCreate,
 218             column1: column1,
 219             column2: [
 220                 {
 221                     xtype: 'proxmoxcheckbox',
 222                     name: 'nomatch',
 223                     checked: false,
 224                     uncheckedValue: 0,
 225                     fieldLabel: 'nomatch',
 226                 },
 227             ],
 228             columnB: [
 229                 {
 230                     xtype: 'textfield',
 231                     name: 'comment',
 232                     value: '',
 233                     fieldLabel: gettext('Comment'),
 234                 },
 235             ],
 236         });
 237
 238         Ext.apply(me, {
 239             subject: gettext('IP/CIDR'),
 240             items: [ipanel],
 241         });
 242
 243         me.callParent();
 244
 245         if (!me.isCreate) {
 246             me.load({
 247                 success: function(response, options) {
 248                     var values = response.result.data;
 249                     ipanel.setValues(values);
 250                 },
 251             });
 252         }
 253     },
 254 });
 255
 256 Ext.define('PVE.IPSetGrid', {
 257     extend: 'Ext.grid.Panel',
 258     alias: 'widget.pveIPSetGrid',
 259
 260     stateful: true,
 261     stateId: 'grid-firewall-ipsets',
 262
 263     base_url: undefined,
 264     list_refs_url: undefined,
 265
 266     addBtn: undefined,
 267     removeBtn: undefined,
 268     editBtn: undefined,
 269
 270     setBaseUrl: function(url) {
 271         var me = this;
 272
 273         me.base_url = url;
 274
 275         if (url === undefined) {
 276             me.addBtn.setDisabled(true);
 277             me.store.removeAll();
 278         } else {
 279             if (me.caps.vms['VM.Config.Network'] || me.caps.dc['Sys.Modify'] || me.caps.nodes['Sys.Modify']) {
 280                 me.addBtn.setDisabled(false);
 281             }
 282             me.removeBtn.baseurl = url + '/';
 283             me.store.setProxy({
 284                 type: 'proxmox',
 285                 url: '/api2/json' + url,
 286             });
 287
 288             me.store.load();
 289         }
 290     },
 291
 292     initComponent: function() {
 293         var me = this;
 294
 295         if (!me.list_refs_url) {
 296             throw "no1 list_refs_url specified";
 297         }
 298
 299         var store = new Ext.data.Store({
 300             model: 'pve-ipset',
 301         });
 302
 303         var reload = function() {
 304             store.load();
 305         };
 306
 307         var sm = Ext.create('Ext.selection.RowModel', {});
 308
 309         me.caps = Ext.state.Manager.get('GuiCap');
 310
 311         var run_editor = function() {
 312             var rec = sm.getSelection()[0];
 313             if (!rec) {
 314                 return;
 315             }
 316             var win = Ext.create('PVE.IPSetCidrEdit', {
 317                 base_url: me.base_url,
 318                 cidr: rec.data.cidr,
 319             });
 320             win.show();
 321             win.on('destroy', reload);
 322         };
 323
 324         me.editBtn = new Proxmox.button.Button({
 325             text: gettext('Edit'),
 326             disabled: true,
 327             enableFn: rec => !!me.caps.vms['VM.Config.Network'] || !!me.caps.dc['Sys.Modify'] || !!me.caps.nodes['Sys.Modify'],
 328             selModel: sm,
 329             handler: run_editor,
 330         });
 331
 332         me.addBtn = new Proxmox.button.Button({
 333             text: gettext('Add'),
 334             disabled: true,
 335             enableFn: rec => !!me.caps.vms['VM.Config.Network'] || !!me.caps.dc['Sys.Modify'] || !!me.caps.nodes['Sys.Modify'],
 336             handler: function() {
 337                 if (!me.base_url) {
 338                     return;
 339                 }
 340                 var win = Ext.create('PVE.IPSetCidrEdit', {
 341                     base_url: me.base_url,
 342                     list_refs_url: me.list_refs_url,
 343                 });
 344                 win.show();
 345                 win.on('destroy', reload);
 346             },
 347         });
 348
 349         me.removeBtn = Ext.create('Proxmox.button.StdRemoveButton', {
 350             disabled: true,
 351             enableFn: rec => !!me.caps.vms['VM.Config.Network'] || !!me.caps.dc['Sys.Modify'] || !!me.caps.nodes['Sys.Modify'],
 352             selModel: sm,
 353             baseurl: me.base_url + '/',
 354             callback: reload,
 355         });
 356
 357         var render_errors = function(value, metaData, record) {
 358             var errors = record.data.errors;
 359             if (errors) {
 360                 var msg = errors.cidr || errors.nomatch;
 361                 if (msg) {
 362                     metaData.tdCls = 'proxmox-invalid-row';
 363                     var html = '<p>' + Ext.htmlEncode(msg) + '</p>';
 364                     metaData.tdAttr = 'data-qwidth=600 data-qtitle="ERROR" data-qtip="' +
 365                         html.replace(/"/g, '&quot;') + '"';
 366                 }
 367             }
 368             return value;
 369         };
 370
 371         Ext.apply(me, {
 372             tbar: ['<b>IP/CIDR:</b>', me.addBtn, me.removeBtn, me.editBtn],
 373             store: store,
 374             selModel: sm,
 375             listeners: {
 376                 itemdblclick: run_editor,
 377             },
 378             columns: [
 379                 {
 380                     xtype: 'rownumberer',
 381                 },
 382                 {
 383                     header: gettext('IP/CIDR'),
 384                     dataIndex: 'cidr',
 385                     width: 150,
 386                     renderer: function(value, metaData, record) {
 387                         value = render_errors(value, metaData, record);
 388                         if (record.data.nomatch) {
 389                             return '<b>! </b>' + value;
 390                         }
 391                         return value;
 392                     },
 393                 },
 394                 {
 395                     header: gettext('Comment'),
 396                     dataIndex: 'comment',
 397                     flex: 1,
 398                     renderer: function(value) {
 399                         return Ext.util.Format.htmlEncode(value);
 400                     },
 401                 },
 402             ],
 403         });
 404
 405         me.callParent();
 406
 407         if (me.base_url) {
 408             me.setBaseUrl(me.base_url); // load
 409         }
 410     },
 411 }, function() {
 412     Ext.define('pve-ipset', {
 413         extend: 'Ext.data.Model',
 414         fields: [{ name: 'nomatch', type: 'boolean' },
 415                   'cidr', 'comment', 'errors'],
 416         idProperty: 'cidr',
 417     });
 418 });
 419
 420 Ext.define('PVE.IPSet', {
 421     extend: 'Ext.panel.Panel',
 422     alias: 'widget.pveIPSet',
 423
 424     title: 'IPSet',
 425
 426     onlineHelp: 'pve_firewall_ip_sets',
 427
 428     list_refs_url: undefined,
 429
 430     initComponent: function() {
 431         var me = this;
 432
 433         if (!me.list_refs_url) {
 434             throw "no list_refs_url specified";
 435         }
 436
 437         var ipset_panel = Ext.createWidget('pveIPSetGrid', {
 438             region: 'center',
 439             list_refs_url: me.list_refs_url,
 440             border: false,
 441         });
 442
 443         var ipset_list = Ext.createWidget('pveIPSetList', {
 444             region: 'west',
 445             ipset_panel: ipset_panel,
 446             base_url: me.base_url,
 447             width: '50%',
 448             border: false,
 449             split: true,
 450         });
 451
 452         Ext.apply(me, {
 453             layout: 'border',
 454             items: [ipset_list, ipset_panel],
 455             listeners: {
 456                 show: function() {
 457                     ipset_list.fireEvent('show', ipset_list);
 458                 },
 459             },
 460         });
 461
 462         me.callParent();
 463     },
 464 });