0

各列がリリースを表すを作成してrallycardboardいます。カードは、それらのリリースに予定されている機能です。コンポーネントのデフォルトの仕組みは、利用可能なすべてのリリースをボード上の列としてレンダリングします。ワークスペースには何千ものリリースがあるため、特定のアプリケーションの場合、これは不合理です。

addColumnグループの少なくとも 1 つの機能が割り当てられているリリースである場合にのみ、列を含めるようにメソッドを上書きすることができました。次のステップは、現在割り当てられている作業がないリリース列をユーザーが手動で追加できるようにすることです。これを行うために、最初のステップで除外されたすべての列を保存し、それらの値を含むコンボ ボックスを作成しました。ユーザーがコンボ ボックスからリリースを選択すると、そのリリース列がボードに追加されるようにしたいと考えています。

メソッドを再構成してaddColumn、手動でオーバーライドできるようにすることができました (既存の機能のリリースと一致させようとするのではなく)。呼び出しによって列がボードの列に追加されたことを確認しましたboard.getColumns()。構成は、既存の列と追加された列の両方で同じに見えます。ただし、呼び出し時にエラー メッセージboard.renderColumns()が表示されます。これは、まだ存在しない (列がまだ作成されていない) コンテナーに書き込もうとした結果のようです。

多分私はこれについて間違った方法で行っています。コンポーネントに含める列と除外する列をより簡単に決定できる別の方法はありrallycardboardますか?

ここに画像の説明を入力

4

1 に答える 1

0

以下は、機能が予定されているリリースに基づいてボードの列が表示される例です。現在予定されている機能がないリリースの列を追加するには、マルチピッカーからリリースを選択します。

このアプリは、この github repoで入手できます。

Ext.define('CustomApp', {
    extend: 'Rally.app.App',
    componentCls: 'app',

    _releasesWithFeatures: [],
    _uniqueColumns: [],
    _additionalColumns: [],
    _updatedColumns: [],
    _cardBoard: null,

    launch: function() {
        var that = this;
        this._releasePicker = Ext.create('Rally.ui.picker.MultiObjectPicker', {
            fieldLabel: 'Choose a Release',
            modelType: 'Release'
        });
        this.add(this._releasePicker);

        this.add({
            xtype: 'rallybutton',
            id: 'getReleases',
            text: 'Add Selected Releases',
            handler: function(){
                that._getSelectedReleases();
            }
        })

        Ext.create('Rally.data.WsapiDataStore', {
            model: 'PortfolioItem/Feature',
            fetch: ['FormattedID','Name','Release'],
            pageSize: 100,
            autoLoad: true,
            filters: [
                {
                    property: 'Release',
                    operator: '!=',
                    value: null
                }
            ],
            listeners: {
                load: this._onScheduledFeaturesLoaded,
                scope: this
            }
        }); 
    },
    _onScheduledFeaturesLoaded: function(store, data){
        var that = this;
        if (data.length !==0) {
            _.each(data, function(feature){
                console.log('feature ', feature.get('FormattedID'), 'scheduled for ', feature.get('Release')._refObjectName, feature.get('Release')._ref);
                that._releasesWithFeatures.push(feature.get('Release'))
            });
            that._makeBoard();
        }
        else{
            console.log('there are no features scheduled for a release')
        }
    },
    _makeBoard: function(){
       if (this._cardBoard) {
            this._cardBoard.destroy();
        }

        var columns = [];

        _.each(this._releasesWithFeatures, function(rel){
            columns.push({value: rel._ref, columnHeaderConfig: {headerTpl: '{release}', headerData: {release: rel._refObjectName}}});
        });

        this._uniqueColumns = _.uniq(columns, 'value');

            var cardBoard = {
                xtype: 'rallycardboard',
                itemId: 'piboard',
                types: ['PortfolioItem/Feature'],
                attribute: 'Release',
                fieldToDisplay: 'Release',
                columns: this._uniqueColumns           
            };

            this._cardBoard = this.add(cardBoard);
    },

    _getSelectedReleases: function(){
        var that = this;
        var expandedColumns = [];
        var selectedReleases = this._releasePicker._getRecordValue();
        console.log(selectedReleases.length);
        if (selectedReleases.length > 0) {
            _.each(selectedReleases, function(rel) {
                var releaseName = rel.get('Name');
                var releaseRef = rel.get('_ref');
                that._additionalColumns.push({value: releaseRef, columnHeaderConfig: {headerTpl: '{release}', headerData: {release: releaseName}}});
            });
        }
        expandedColumns =  _.union(that._uniqueColumns, that._additionalColumns);
        this._updatedColumns = _.uniq(expandedColumns, 'value');
        this._updateBoard();


    },

    _updateBoard: function(){
        var that = this;

        if (this._cardBoard) {
            this._cardBoard.destroy();
        }
        var cardBoard = {
            xtype: 'rallycardboard',
            types: ['PortfolioItem/Feature'],
            attribute: 'Release',
            fieldToDisplay: 'Release',
            columns: that._updatedColumns,            
        };

        this._cardBoard = this.add(cardBoard);

    }

});
于 2014-04-29T20:43:27.817 に答える