spam detector: custom rules: consitent add/edit/remove button & modernization

[pmg-gui.git] / js / ObjectGroupList.js

diff --git a/js/ObjectGroupList.js b/js/ObjectGroupList.js
index 9e24c6b9ea248c40c7af824e3b84b5292896e27b..ab66e92c36b1f6fa4ae62d8c4bfeeb3751b5ff9a 100644 (file)
--- a/js/ObjectGroupList.js
+++ b/js/ObjectGroupList.js
@@ -1,7 +1,7 @@
 Ext.define('pmg-object-group', {
     extend: 'Ext.data.Model',
-    fields: [ 'id', 'name', 'info' ],
-    idProperty: 'cidr'
+    fields: ['id', 'name', 'info'],
+    idProperty: 'id',
 });
 
 Ext.define('pmg-object-list', {
@@ -9,9 +9,9 @@ Ext.define('pmg-object-list', {
     fields: [
        'id', 'descr',
        { name: 'otype', type: 'integer' },
-       { name: 'receivertest', type: 'boolean' }
+       { name: 'receivertest', type: 'boolean' },
     ],
-    idProperty: 'id'
+    idProperty: 'id',
 });
 
 
@@ -23,149 +23,142 @@ Ext.define('PMG.ObjectGroupList', {
 
     subject: 'Object Group List', // please overwrite
 
-    initComponent : function() {
+    baseurl: undefined,
+
+    enableButtons: true,
+
+    inputItems: [
+       {
+           xtype: 'textfield',
+           name: 'name',
+           allowBlank: false,
+           fieldLabel: gettext('Name'),
+       },
+       {
+           xtype: 'textareafield',
+           name: 'info',
+           fieldLabel: gettext("Description"),
+       },
+    ],
+
+    reload: function() {
+       var me = this;
+
+        me.store.load();
+    },
+
+    run_editor: function() {
+       var me = this;
+
+       var rec = me.selModel.getSelection()[0];
+       if (!rec) {
+           return;
+       }
+
+       var config = {
+           url: "/api2/extjs" + me.baseurl +'/' + rec.data.id + '/config',
+           onlineHelp: 'chapter_mailfilter',
+           method: 'PUT',
+           subject: me.subject,
+           width: 400,
+           items: me.inputItems,
+       };
+
+       var win = Ext.createWidget('proxmoxWindowEdit', config);
+
+       win.load();
+       win.on('destroy', me.reload, me);
+       win.show();
+    },
+
+    initComponent: function() {
        var me = this;
 
        if (!me.ogclass) {
            throw "ogclass not initialized";
        }
 
-       var baseurl = "/config/ruledb/" + me.ogclass;
-       
-       var store = new Ext.data.Store({
+       me.baseurl = "/config/ruledb/" + me.ogclass;
+
+       me.store = new Ext.data.Store({
            model: 'pmg-object-group',
            proxy: {
                type: 'proxmox',
-               url: "/api2/json" + baseurl,
+               url: "/api2/json" + me.baseurl,
            },
            sorters: {
                property: 'name',
-               order: 'DESC'
-           }
-       });
-
-        var reload = function() {
-           var rec = me.selModel.getSelection()[0];
-            store.load(function() {
-               if (rec) {
-                   // try to selectprevious selection
-                   var nrec = store.findRecord('id', rec.data.id);
-                   me.selModel.select(nrec);
-               }
-           });
-        };
-
-       me.selModel = Ext.create('Ext.selection.RowModel', {});
-
-       var remove_btn = Ext.createWidget('proxmoxButton', {
-           text: gettext('Remove'),
-           disabled: true,
-           selModel: me.selModel,
-           confirmMsg: function (rec) {
-               return Ext.String.format(
-                   gettext('Are you sure you want to remove entry {0}'),
-                   "'" + rec.data.name + "'");
+               direction: 'ASC',
            },
-           handler: function(btn, event, rec) {
-               Proxmox.Utils.API2Request({
-                   url: baseurl + '/' + rec.data.id,
-                   method: 'DELETE',
-                   waitMsgTarget: me,
-                   callback: function() {
-                       reload();
-                   },
-                   failure: function (response, opts) {
-                       Ext.Msg.alert(gettext('Error'), response.htmlStatus);
-                   }
-               });
-           }
        });
 
-       var inputItems = [
-           {
-               xtype: 'textfield',
-               name: 'name',
-               fieldLabel: gettext('Name')
-           },
-           {
-               xtype: 'textareafield',
-               name: 'info',
-               fieldLabel: gettext("Description")
-           }
-       ];
-
-       var run_editor = function() {
-           var rec = me.selModel.getSelection()[0];
-           if (!rec) {
-               return;
-           }
-
-           var config = {
-               url: "/api2/extjs" + baseurl +'/' + rec.data.id + '/config',
-               method: 'PUT',
-               subject: me.subject,
-               width: 400,
-               items: inputItems
-           };
-
-           var win = Ext.createWidget('proxmoxWindowEdit', config);
-
-           win.load();
-           win.on('destroy', reload);
-           win.show();
-       };
+       me.selModel = Ext.create('Ext.selection.RowModel', {});
 
        var tbar = [
-            {
-               xtype: 'proxmoxButton',
-               text: gettext('Edit'),
-               disabled: true,
-               selModel: me.selModel,
-               handler: run_editor
-            },
             {
                text: gettext('Create'),
                handler: function() {
-                   var config = {
+                   Ext.createWidget('proxmoxWindowEdit', {
                        method: 'POST',
-                       url: "/api2/extjs" + baseurl,
-                       create: true,
+                       url: `/api2/extjs${me.baseurl}`,
+                       onlineHelp: 'chapter_mailfilter',
+                       isCreate: true,
                        width: 400,
                        subject: me.subject,
-                       items: inputItems
-                   };
-
-                   var win = Ext.createWidget('proxmoxWindowEdit', config);
-
-                   win.on('destroy', reload);
-                   win.show();
-               }
+                       items: me.inputItems,
+                       autoShow: true,
+                       listeners: {
+                           destroy: () => me.reload(),
+                       },
+                   });
+               },
             },
-           remove_btn
+           '-',
+            {
+               xtype: 'proxmoxButton',
+               text: gettext('Edit'),
+               disabled: true,
+               selModel: me.selModel,
+               handler: () => me.run_editor(),
+            },
+           {
+               xtype: 'proxmoxStdRemoveButton',
+               selModel: me.selModel,
+               baseurl: me.baseurl,
+               callback: () => me.reload(),
+               getRecordName: rec => rec.data.name,
+               waitMsgTarget: me,
+           },
         ];
 
-       Proxmox.Utils.monStoreErrors(me, store);
+       Proxmox.Utils.monStoreErrors(me, me.store, true);
+
+       if (me.enableButtons) {
+           me.tbar = tbar;
+       }
 
        Ext.apply(me, {
-           store: store,
-           tbar: tbar,
            columns: [
                {
                    header: gettext('Name'),
                    sortable: true,
                    flex: 1,
                    dataIndex: 'name',
-                   renderer: Ext.String.htmlEncode
-               }
+                   renderer: Ext.String.htmlEncode,
+               },
            ],
            listeners: {
-               itemdblclick: run_editor,
-               activate: reload
-           }
+               itemdblclick: function() {
+                   if (me.enableButtons) {
+                       me.run_editor();
+                   }
+               },
+               activate: function() { me.reload(); },
+           },
        });
 
        me.callParent();
 
-       reload(); // initial load
-    }
+       me.reload(); // initial load
+    },
 });