0

私は年の月を示すアコーディオンを持っています。ここで、アコーディオン タイトルの右側に、その年のすべての記録を印刷するアクション列として pdf アイコンを追加したいと考えています。しかし、私はそれを行うことができません。誰でもこれについて私を助けてくれませんか。以下は私のコードです：

Ext.define('Ext4Example.view.attendence.Timeperiod', {
    extend: 'Ext.form.Panel',
    alias: 'widget.timeperiod',
    id: 'timeperiod',
    region: 'west',
    border: true,
    width: 150,
    height: 396,
    split: true,
    layout: {
        // layout-specific configs go here
        type: 'accordion',
        titleCollapse: true,
        animate: true,
        activeOnTop: true,
        hideCollapseTool: true
    },
    initComponent: function () {
        var me = this;
        me.items = me.maccord();
        me.callParent(arguments);
    },
    mstore: function (year) {
        var data = [
            [1, year, 'January'],
            [2, year, 'February'],
            [3, year, 'March'],
            [4, year, 'April'],
            [5, year, 'May'],
            [6, year, 'June'],
            [7, year, 'July'],
            [8, year, 'August'],
            [9, year, 'September'],
            [10, year, 'October'],
            [11, year, 'November'],
            [12, year, 'December']
        ];
        var store = Ext.create('Ext.data.ArrayStore', {
            storeId: 'mstore',
            fields: [{
                name: 'id',
                type: 'int'
            }, {
                name: 'year',
                type: 'int'
            }, {
                name: 'month',
                type: 'string'
            }],
            data: data
        });
        return store;
    },
    mpanel: function (year) {
        var me = this,
            mpanel = new Ext.grid.Panel({
                border: false,
                viewConfig: {
                    stripeRows: true
                },
                hideHeaders: true,
                columns: [{
                    text: 'month',
                    dataIndex: 'month',
                    flex: 1]
                }],
            store: me.mstore(year),
            width: 150
            });
    return mpanel;
},
maccord: function () {
    var year = $ {
        (new Date()).format('yyyy')
    },
    limit = year - 5,
        me = this,
        maccord = [];
    for (year; year > limit; year--) {
        maccord.push({
            title: 'Year ' + year + {
                menuDisabled: true,
                sortable: false,
                xtype: 'actioncolumn',
                align: 'right',
                flex: 1,
                width: 22,
                items: [{
                    icon: "${resource(dir: 'images', file: 'PDF01001.png')}",
                    hide: true,
                    tooltip: 'Print Report of this Month?',
                    handler: function (grid, rowIndex, colIndex) {
                        alert('Printing');
                    }
                }]
            },
            ident: 'accordion-panel',
            items: me.mpanel(year)
        });
    }
    return maccord;
}
});
4

1 に答える 1

3

何をしようとしてもうまくいかないのは確かです。私が見る限り、グリッドをタイトルに連結して、ヘッドセットに追加しようとしています。できることは、headerアコーディオン項目ごとに構成を提供することです。そのヘッダーにコンポーネントを配置できますが、それらはタイトルの前に表示されます。もう 1 つの方法は、afterrenderイベントを処理してからヘッダーに何かを追加することです。

例: http://jsfiddle.net/HTBMy/2/

于 2012-12-05T09:10:03.497 に答える