js/QuarantineView.js

   1 Ext.define('PMG.QuarantineNavigationTree', {
   2     extend: 'Ext.list.Tree',
   3     xtype: 'quarantinenavigationtree',
   4
   5     select: function(path) {
   6         var me = this;
   7         var item = me.getStore().findRecord('path', path, 0, false, true, true);
   8         me.setSelection(item);
   9     },
  10
  11     store: {
  12         xcalss: 'Ext.data.TreeStore',
  13         root: {
  14             expanded: true,
  15             children: [
  16                 {
  17                     text: gettext('Spam Quarantine'),
  18                     iconCls: 'fa fa-cubes',
  19                     path: 'pmgSpamQuarantine',
  20                     expanded: true,
  21                     children: [
  22                         {
  23                             text: gettext('Whitelist'),
  24                             //iconCls: 'fa fa-cubes',
  25                             path: 'pmgUserWhitelist',
  26                             leaf: true,
  27                         },
  28                         {
  29                             text: gettext('Blacklist'),
  30                             //iconCls: 'fa fa-cubes',
  31                             path: 'pmgUserBlacklist',
  32                             leaf: true,
  33                         }
  34                     ]
  35                 }
  36             ]
  37         }
  38     },
  39
  40     animation: false,
  41     expanderOnly: true,
  42     expanderFirst: false,
  43     ui: 'nav'
  44 });
  45
  46 Ext.define('PMG.QuarantineView', {
  47     extend: 'Ext.container.Container',
  48     xtype: 'quarantineview',
  49
  50     title: 'Proxmox Mail Gateway Quarantine',
  51
  52     controller: {
  53         xclass: 'Ext.app.ViewController',
  54         routes: {
  55             ':path:subpath': {
  56                 action: 'changePath',
  57                 before: 'beforeChangePath',
  58                 conditions : {
  59                     ':path'    : '(?:([%a-zA-Z0-9\-\_\s,]+))',
  60                     ':subpath' : '(?:(?::)([%a-zA-Z0-9\-\_\s,]+))?'
  61                 }
  62             }
  63         },
  64
  65         beforeChangePath: function(path, subpath, action) {
  66             var me = this;
  67
  68             if (!Ext.ClassManager.getByAlias('widget.'+ path)) {
  69                 console.warn('xtype "'+path+'" not found');
  70                 action.stop();
  71                 return;
  72             }
  73
  74             var lastpanel = me.lookupReference('contentpanel').getLayout().getActiveItem();
  75             if (lastpanel && lastpanel.xtype === path) {
  76                 // we have the right component already,
  77                 // we just need to select the correct tab
  78                 // default to the first
  79                 subpath = subpath || 0;
  80                 if (lastpanel.getActiveTab) {
  81                     // we assume lastpanel is a tabpanel
  82                     if (lastpanel.getActiveTab().getItemId() === subpath) {
  83                         // we are already there
  84                     } else {
  85                         // set the active tab
  86                         lastpanel.setActiveTab(subpath);
  87                     }
  88                 }
  89                 action.stop();
  90                 return;
  91             }
  92
  93             action.resume();
  94         },
  95
  96         changePath: function(path,subpath) {
  97             var me = this;
  98             var contentpanel = me.lookupReference('contentpanel');
  99             var lastpanel = contentpanel.getLayout().getActiveItem();
 100
 101             var obj = contentpanel.add({ xtype: path, cselect: subpath });
 102             var treelist = me.lookupReference('navtree');
 103
 104             treelist.suspendEvents();
 105             treelist.select(path);
 106             treelist.resumeEvents();
 107
 108             if (Ext.isFunction(obj.setActiveTab)) {
 109                 obj.setActiveTab(subpath || 0);
 110                 obj.addListener('tabchange', function(tabpanel, newc, oldc) {
 111                     var newpath = path;
 112
 113                     // only add the subpath part for the
 114                     // non-default tabs
 115                     if (tabpanel.items.findIndex('id', newc.id) !== 0) {
 116                         newpath += ":" + newc.getItemId();
 117                     }
 118
 119                     me.redirectTo(newpath);
 120                 });
 121             }
 122
 123             contentpanel.setActiveItem(obj);
 124
 125             if (lastpanel) {
 126                 contentpanel.remove(lastpanel, { destroy: true });
 127             }
 128         },
 129
 130         logout: function() {
 131             PMG.app.logout();
 132         },
 133
 134         navigate: function(treelist, item) {
 135             this.redirectTo(item.get('path'));
 136         },
 137
 138         execQuarantineAction: function(qa) {
 139             Proxmox.Utils.API2Request({
 140                 url: '/api2/extjs/quarantine/content',
 141                 params: {
 142                     id: qa.cselect,
 143                     action: qa.action
 144                 },
 145                 method: 'POST',
 146                 success: function(response) {
 147                     Ext.Msg.alert(gettext('Info'), "Action " + qa.action + ' ' +
 148                                   qa.cselect + ' successful');
 149                 },
 150                 failure: function(response, opts) {
 151                     Ext.Msg.alert(gettext('Error'), response.htmlStatus);
 152                 }
 153             });
 154         },
 155
 156         control: {
 157             'button[reference=logoutButton]': {
 158                 click: 'logout'
 159             }
 160         },
 161
 162         init: function(view) {
 163             var me = this;
 164
 165             // load username
 166             me.lookupReference('usernameinfo').update({username:Proxmox.UserName});
 167
 168             // show login on requestexception
 169             // fixme: what about other errors
 170             Ext.Ajax.on('requestexception', function(conn, response, options) {
 171                 if (response.status == 401) { // auth failure
 172                     me.logout();
 173                 }
 174             });
 175
 176             var qa = PMG.Utils.extractQuarantineAction();
 177             if (qa) {
 178                 var token = 'pmgSpamQuarantine';
 179                 if (qa.action === 'blacklist') { token = 'pmgUserBlacklist'; }
 180                 if (qa.action === 'whitelist') { token = 'pmgUserWhitelist'; }
 181                 if (qa.cselect) {
 182                     token += ':' + qa.cselect;
 183                 }
 184                 this.redirectTo(token, true);
 185                 if (qa.action) {
 186                     me.execQuarantineAction(qa);
 187                 }
 188             } else {
 189                 // select treeitem and load page from url fragment
 190
 191                 var token = Ext.util.History.getToken() || 'pmgSpamQuarantine';
 192                 this.redirectTo(token, true);
 193             }
 194         }
 195     },
 196
 197     plugins: 'viewport',
 198
 199     layout: 'border',
 200
 201     items: [
 202         {
 203             region: 'north',
 204             xtype: 'container',
 205             layout: {
 206                 type: 'hbox',
 207                 align: 'middle'
 208             },
 209             margin: '2 5 2 5',
 210             height: 38,
 211             items: [
 212                 {
 213                     xtype: 'proxmoxlogo'
 214                 },
 215                 {
 216                     xtype: 'versioninfo'
 217                 },
 218                 {
 219                     flex: 1
 220                 },
 221                 {
 222                     baseCls: 'x-plain',
 223                     reference: 'usernameinfo',
 224                     padding: '0 5',
 225                     tpl: Ext.String.format(gettext("You are logged in as '{0}'"), '{username}')
 226                 },
 227                 {
 228                     reference: 'logoutButton',
 229                     xtype: 'button',
 230                     iconCls: 'fa fa-sign-out',
 231                     text: gettext('Logout')
 232                 }
 233             ]
 234         },
 235         {
 236             xtype: 'quarantinenavigationtree',
 237             reference: 'navtree',
 238             minWidth: 177,
 239             border: false,
 240             region: 'west',
 241             // we have to define it here until extjs 6.2
 242             // because of a bug where a viewcontroller does not detect
 243             // the selectionchange event of a treelist
 244             listeners: {
 245                 selectionchange: 'navigate'
 246             }
 247         },
 248         {
 249             xtype: 'panel',
 250             layout: 'card',
 251             region: 'center',
 252             border: false,
 253             reference: 'contentpanel',
 254         }
 255     ]
 256 });