www/manager6/dc/SecurityGroups.js

   1 Ext.define('pve-security-groups', {
   2     extend: 'Ext.data.Model',
   3
   4     fields: ['group', 'comment', 'digest'],
   5     idProperty: 'group',
   6 });
   7
   8 Ext.define('PVE.SecurityGroupEdit', {
   9     extend: 'Proxmox.window.Edit',
  10
  11     base_url: "/cluster/firewall/groups",
  12
  13     allow_iface: false,
  14
  15     initComponent: function() {
  16         var me = this;
  17
  18         me.isCreate = me.group_name === undefined;
  19
  20         var subject;
  21
  22         me.url = '/api2/extjs' + me.base_url;
  23         me.method = 'POST';
  24
  25         var items = [
  26             {
  27                 xtype: 'textfield',
  28                 name: 'group',
  29                 value: me.group_name || '',
  30                 fieldLabel: gettext('Name'),
  31                 allowBlank: false,
  32             },
  33             {
  34                 xtype: 'textfield',
  35                 name: 'comment',
  36                 value: me.group_comment || '',
  37                 fieldLabel: gettext('Comment'),
  38             },
  39         ];
  40
  41         if (me.isCreate) {
  42             subject = gettext('Security Group');
  43         } else {
  44             subject = gettext('Security Group') + " '" + me.group_name + "'";
  45             items.push({
  46                 xtype: 'hiddenfield',
  47                 name: 'rename',
  48                 value: me.group_name,
  49             });
  50         }
  51
  52         var ipanel = Ext.create('Proxmox.panel.InputPanel', {
  53         // InputPanel does not have a 'create' property, does it need a 'isCreate'
  54             isCreate: me.isCreate,
  55             items: items,
  56         });
  57
  58
  59         Ext.apply(me, {
  60             subject: subject,
  61             items: [ipanel],
  62         });
  63
  64         me.callParent();
  65     },
  66 });
  67
  68 Ext.define('PVE.SecurityGroupList', {
  69     extend: 'Ext.grid.Panel',
  70     alias: 'widget.pveSecurityGroupList',
  71
  72     stateful: true,
  73     stateId: 'grid-securitygroups',
  74
  75     rulePanel: undefined,
  76
  77     addBtn: undefined,
  78     removeBtn: undefined,
  79     editBtn: undefined,
  80
  81     base_url: "/cluster/firewall/groups",
  82
  83     initComponent: function() {
  84         let me = this;
  85         if (!me.base_url) {
  86             throw "no base_url specified";
  87         }
  88
  89         let store = new Ext.data.Store({
  90             model: 'pve-security-groups',
  91             proxy: {
  92                 type: 'proxmox',
  93                 url: '/api2/json' + me.base_url,
  94             },
  95             sorters: {
  96                 property: 'group',
  97                 direction: 'ASC',
  98             },
  99         });
 100
 101         let sm = Ext.create('Ext.selection.RowModel', {});
 102
 103         let caps = Ext.state.Manager.get('GuiCap');
 104         let canEdit = !!caps.dc['Sys.Modify'];
 105
 106         let reload = function() {
 107             let oldrec = sm.getSelection()[0];
 108             store.load((records, operation, success) => {
 109                 if (oldrec) {
 110                     let rec = store.findRecord('group', oldrec.data.group, 0, false, true, true);
 111                     if (rec) {
 112                         sm.select(rec);
 113                     }
 114                 }
 115             });
 116         };
 117
 118         let run_editor = function() {
 119             let rec = sm.getSelection()[0];
 120             if (!rec || !canEdit) {
 121                 return;
 122             }
 123             Ext.create('PVE.SecurityGroupEdit', {
 124                 digest: rec.data.digest,
 125                 group_name: rec.data.group,
 126                 group_comment: rec.data.comment,
 127                 listeners: {
 128                     destroy: () => reload(),
 129                 },
 130                 autoShow: true,
 131             });
 132         };
 133
 134         me.editBtn = new Proxmox.button.Button({
 135             text: gettext('Edit'),
 136             enableFn: rec => canEdit,
 137             disabled: true,
 138             selModel: sm,
 139             handler: run_editor,
 140         });
 141         me.addBtn = new Proxmox.button.Button({
 142             text: gettext('Create'),
 143             disabled: !canEdit,
 144             handler: function() {
 145                 sm.deselectAll();
 146                 var win = Ext.create('PVE.SecurityGroupEdit', {});
 147                 win.show();
 148                 win.on('destroy', reload);
 149             },
 150         });
 151
 152         me.removeBtn = Ext.create('Proxmox.button.StdRemoveButton', {
 153             selModel: sm,
 154             baseurl: me.base_url + '/',
 155             enableFn: (rec) => canEdit && rec && me.base_url,
 156             callback: () => reload(),
 157         });
 158
 159         Ext.apply(me, {
 160             store: store,
 161             tbar: ['<b>' + gettext('Group') + ':</b>', me.addBtn, me.removeBtn, me.editBtn],
 162             selModel: sm,
 163             columns: [
 164                 {
 165                     header: gettext('Group'),
 166                     dataIndex: 'group',
 167                     width: '100',
 168                 },
 169                 {
 170                     header: gettext('Comment'),
 171                     dataIndex: 'comment',
 172                     renderer: Ext.String.htmlEncode,
 173                     flex: 1,
 174                 },
 175             ],
 176             listeners: {
 177                 itemdblclick: run_editor,
 178                 select: function(_sm, rec) {
 179                     if (!me.rulePanel) {
 180                         me.rulePanel = me.up('panel').down('pveFirewallRules');
 181                     }
 182                     me.rulePanel.setBaseUrl(`/cluster/firewall/groups/${rec.data.group}`);
 183                 },
 184                 deselect: function() {
 185                     if (!me.rulePanel) {
 186                         me.rulePanel = me.up('panel').down('pveFirewallRules');
 187                     }
 188                     me.rulePanel.setBaseUrl(undefined);
 189                 },
 190                 show: reload,
 191             },
 192         });
 193
 194         me.callParent();
 195
 196         store.load();
 197     },
 198 });
 199
 200 Ext.define('PVE.SecurityGroups', {
 201     extend: 'Ext.panel.Panel',
 202     alias: 'widget.pveSecurityGroups',
 203
 204     title: 'Security Groups',
 205     onlineHelp: 'pve_firewall_security_groups',
 206
 207     layout: 'border',
 208
 209     items: [
 210         {
 211             xtype: 'pveFirewallRules',
 212             region: 'center',
 213             allow_groups: false,
 214             list_refs_url: '/cluster/firewall/refs',
 215             tbar_prefix: '<b>' + gettext('Rules') + ':</b>',
 216             border: false,
 217         },
 218         {
 219             xtype: 'pveSecurityGroupList',
 220             region: 'west',
 221             width: '25%',
 222             border: false,
 223             split: true,
 224         },
 225     ],
 226     listeners: {
 227         show: function() {
 228             let sglist = this.down('pveSecurityGroupList');
 229             sglist.fireEvent('show', sglist);
 230         },
 231     },
 232 });