const Dashboard = {
    route : 'dashboard/:groupId',
    isDefault : true,
    templateUrl : 'js/app/views/dashboard/dashboard.html',
    navigatioData : null,
    redirectUrl : 'auth/login',

    canAccess : function()
    {
        return this.app.user.isLoggedIn();
    },

    create : function( p )
    {
        this.container = this.app.UI.getContentContainer();
        const $container = $( this.container );
        this.render();

        this.app.rpc.call(
            'Stats',
            'getDashboardManager',
            {
                groupId : p.groupId ? p.groupId : this.app.user.activeGroupId
            },
            function( res )
            {
                let stats = ( res && res.hasOwnProperty( 'data' ) && res.data.hasOwnProperty( 'stats' ) ) ? res.data.stats : null;

                if ( stats )
                {
                    $container.find( '[f-id="span-stat-total-members"]' ).html( stats.count_member );
                    $container.find( '[f-id="span-stat-total-appointments"]' ).html( stats.count_appointment );
                    $container.find( '[f-id="span-stat-total-feedbacks"]' ).html( stats.count_feedback );

                    let labels = [],
                        label = '',
                        labelCount = 0,
                        attendances = [],
                        gd = stats.attendances_30;

                    for ( let si = 30; si > 0; si-- )
                    {
                        label = moment().subtract( si, 'days' ).format( 'DD.MM.' );

                        labelCount = 0;
                        for ( let gi = 0; gi < gd.length; gi++ )
                        {
                            if ( gd[ gi ].accept_date == moment().subtract( si, 'days' ).format( 'YYYY-MM-DD' ) )
                            {
                                labelCount = gd[ gi ].cnt;
                            }
                        }

                        labels.push( label );
                        attendances.push( labelCount );
                    }

                    var lineData = {
                        labels: labels,
                        datasets: [
                            {
                                label: "Zusagen",
                                backgroundColor: 'rgba(26,179,148,0.5)',
                                borderColor: "rgba(26,179,148,0.7)",
                                pointBackgroundColor: "rgba(26,179,148,1)",
                                pointBorderColor: "#fff",
                                data: attendances
                            }
                        ]
                    };

                    var lineOptions = {
                        responsive: true
                    };


                    //var ctx = document.getElementById("lineChart").getContext("2d");
                    const ctx = $container.find( '[data-id="canvas-chart-feedback-activity"]' ).first().get( 0 ).getContext( "2d" );
                    new Chart(
                        ctx,
                        {
                            type: 'line',
                            data: lineData,
                            options:lineOptions
                        }
                    );

                }




                $container.find( '.sk-loading' ).toggleClass( 'sk-loading' );
            }
        );
    },

    destroy : function()
    {

    }
};

export { Dashboard };