Add the widget HistoryGridFilter.

models/ui_history.py

@@ -84,7 +84,17 @@ gridModifier.append_filter(('id_object_categories', '==', T('is equal to')))
 gridModifier.append_filter(('start_date', '>=', T('greater or equal to')))
 gridModifier.append_filter(('end_date', '<=', T('less or equal to')))
 
-gridModifier.configure_filters(plugins=['pFormToolTip'], width=300)
+gridModifier.append_filter(
+    ('data', 'like', 'key(s) is(are) equal to value(s). The jocker is %'),
+    fieldLabel=T('Data'),
+    header=["key", "value"],
+    numColumns=2,
+    numRows=3,
+    xtype='xtablefield')
+
+gridModifier.configure_filters(plugins=['pFormToolTip'],
+                               width=300,
+                               xtype='xhistorygridfilter')
 
 #-------------------------------------------------------------------------------
 #

static/CHANGELOG

@@ -5,6 +5,7 @@ HEAD
   - New syntax for grid column configuration property: renderer and
     summaryRenderer.
   - Redesing the JavaScript class UserDataMultiDefault.
+  - Add the widget HistoryGridFilter.
 
 0.6.0 (Oct 2016)
   - Require plugin_dbui 0.9.0 or higher.

static/app.js

@@ -27,6 +27,7 @@ Ext.require('Ext.tip.QuickTipManager');
 Ext.require('TrackEvents.form.field.UserData');
 Ext.require('TrackEvents.form.field.UserDataMultiDefault');
 Ext.require('TrackEvents.form.plugin.UserDataConsistency');
+Ext.require('TrackEvents.grid.HistoryFilter');
 
 Ext.onReady(function(){
 

static/track_events/src/grid/HistoryFilter.js

+/**
+ * The filter dedicated to the history grid.
+ *
+ * Custom layout based on accordeon
+ * Handle the data filter based on the Table widget
+ *
+ *
+ */
+Ext.define('TrackEvents.grid.HistoryFilter', {
+
+    extend: 'Dbui.grid.Filter',
+    alias: 'widget.xhistorygridfilter',
+
+    // jshint strict: false
+
+    // private method requests by the component model of ExtJS
+    // Apply a accordeon layout
+
+    initComponent: function () {
+
+        var me = this,
+            eventdata = [],
+            funding = [],
+            metadata = [],
+            object = [],
+            period = [],
+            people = [];
+
+        // the arcordeon layout
+        me.layout = {
+            type: 'accordion',
+            titleCollapse: true
+        };
+
+        me.defaults = {
+            frame: true
+        };
+
+        // collect fields for each sub-panel
+        // metadata, people, object, eventdata, period, funding
+        me.items.forEach(function (field) {
+
+            switch (field.name) {
+                case "[history.id_events]":
+                case "[history.id_domains]":
+                case "[history.id_teams]":
+                case "[history.id_projects]":
+                    metadata.push(field);
+                    break;
+
+                case "[people.last_name]":
+                case "[history.id_people_categories]":
+                    people.push(field);
+                    break;
+
+                case "[objects.reference]":
+                case "[history.id_object_categories]":
+                    object.push(field);
+                    break;
+
+                case "[history.data]":
+                    eventdata.push(field);
+                    break;
+
+                case "[history.start_date]":
+                case "[history.end_date]":
+                    period.push(field);
+                    break;
+
+                case "[history.id_fundings]":
+                    funding.push(field);
+                    break;
+            }
+        });
+
+        // create the new item structure by adding sub-panel
+        me.items = [{
+           title: "Metadata",
+           items: metadata
+        }, {
+            title: "People",
+            items: people
+        }, {
+            title: "Object",
+            items: object
+        }, {
+            title: "Event data",
+            items: eventdata
+        }, {
+            title: "Period",
+            items: period
+        }, {
+            title: "Funding",
+            items: funding
+        }];
+
+        // initialise the base class
+        me.callParent(arguments);
+    },
+
+    /**
+     * Build the value to be used by the filter.
+     * Superseede the method of the base class to handle the data filter
+     * which is based on the Dbui.form.field.Table widget.
+     *
+     * @param {Ext.form.Field} field
+     */
+    getFilterValue: function (field) {
+
+        var me = this,
+            toJSON = Dbui.grid.Filter.valueToJSON,
+            table, value;
+
+        // standard case
+        if (field.xtype !== 'xtablefield') {
+            return me.callParent(arguments);
+        }
+
+        // table case
+        // Value is like [[key1, value2], [key2], [key3, value3]]
+        table = field.getValue();
+
+        value = "";
+        table.forEach(function (row) {
+
+            var s;
+
+            if (row.lentgh === 1) {
+                s = '"' + row[0] +'"';
+            } else {
+                s = '"' + row[0] +'": ' + toJSON(row[1]);
+            }
+
+            value += (value.length > 0 ? '%' + s : s);
+        });
+
+        // the database is filtered by the LIKE operator, add joker %
+        value = (value[0] === "%" ? value : "%" + value);
+        value = (value[value.length-1] === "%" ? value : value + "%");
+
+        return value;
+    }
+
+    // jshint strict: true
+
+});
\ No newline at end of file