TUniDBPivotGrid Multi top columns

[Polylog]

Hello,

I am not able to make cascade display of top columns like in sencha extjs demo.

Here is the code in the fiddle demo (https://fiddle.sencha.com/#fiddle/343g&view/editor)

Ext.define('Fiddle.model.Sale', function () {
    var regions = {
        "Belgium": 'Europe',
        "Netherlands": 'Europe',
        "United Kingdom": 'Europe',
        "Canada": 'North America',
        "United States": 'North America',
        "Australia": 'Australia'
    };

    return {
        extend: 'Ext.data.Model',

        fields: [{
            name: 'id',
            type: 'int'
        }, {
            name: 'company',
            type: 'string'
        }, {
            name: 'country',
            type: 'string'
        }, {
            name: 'person',
            type: 'string'
        }, {
            name: 'date',
            type: 'date',
            dateFormat: 'c'
        }, {
            name: 'value',
            type: 'float',
            allowNull: true
        }, {
            name: 'quantity',
            type: 'float',
            allowNull: true
        }, {
            name: 'year',
            calculate: function (data) {
                return parseInt(Ext.Date.format(data.date, "Y"), 10);
            }
        }, {
            name: 'month',
            calculate: function (data) {
                return parseInt(Ext.Date.format(data.date, "m"), 10) - 1;
            }
        }, {
            name: 'continent',
            calculate: function (data) {
                return regions[data.country];
            }
        }]
    };
});

Ext.define('Fiddle.store.pivot.Sales', {
    extend: 'Ext.data.Store',
    alias: 'store.sales',

    model: 'Fiddle.model.Sale',

    storeId: 'sale',

    proxy: {
        type: 'ajax',
        limitParam: null,
        url: 'sales.json',
        reader: {
            type: 'json'
        }
    },
    autoLoad: true
});

Ext.define('Fiddle.view.pivot.Grid', {
    extend: 'Ext.pivot.Grid',
    xtype: 'pivot-grid',
    controller: 'pivotgrid',
    title: 'Pivot Grid',
    matrix: {
        store: {
            type: 'sales'
        },
        aggregate: [{
            dataIndex: 'value',
            header: 'Total',
            aggregator: 'sum',
            id: 'agg',
        }],
        leftAxis: [{
            dataIndex: 'person',
            header: 'Person'
        }, {
            dataIndex: 'year',
            header: 'Year',
            filter: {
                type: 'label',
                operator: '=',
                value: 2016
            }
        }],
        topAxis: [{
            dataIndex: 'continent',
            header: 'Continent',
        }, {
            dataIndex: 'country',
            header: 'Country'
        }, {
            dataIndex: 'year',
            header: 'year'
        }]
    }
});

Ext.define('Fiddle.view.pivot.GridController', {
    extend: 'Ext.app.ViewController',

    alias: 'controller.pivotgrid',

});

Ext.application({
    name: 'Fiddle',
    mainView: 'Fiddle.view.pivot.Grid'
});

I put in the attached file what I mean. I was not able to modify the uniGUI demo to make it work.

Thanks already for the help.