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