const ContractClaim = {
    route : 'contract/claim/:groupId',
    templateUrl : 'js/app/views/contract/contract-claim.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 ),
            groupId = p.get( 'groupId' ),
            app = this.app,
            self = this,
            members = [],
            apps = [];

        self.contracts = [];

        this.render();

        this.app.rpc.call(
            'Contract',
            'getList',
            {
                teamId : groupId,
                filter : 'claim'
            },
            function( res )
            {
                if ( res && res.hasOwnProperty( 'data' ) && res.data.hasOwnProperty( 'contractData' ) )
                {
                    const cs = res.data.contractData;
                    self.contracts = [];
                    for( let ci = 0; ci < cs.length; ci++ )
                    {
                        self.contracts.push( this.createInstance( 'Contract', cs[ ci ] ) );
                    }
                }

                let compDt = this.createComponent(
                    'contract-data-table',
                    $container.find( '[f-id="container-contract-data-table"]' ).first().get( 0 ),
                    {
                        contracts : self.contracts,
                        groupId : groupId,
                        filter : 'claim'
                    }
                );

                compDt.addEventListener( 'singleContractMarkPayed', function( e )
                {
                    let contractId = e.data.contractId;

                    let $modalRoot = $container.find( '[data-id="modal-confirm-single-mark-payed"]' ).first();
                    $modalRoot.find( '[data-id="section-single-mark-payed-confirmation"]' ).first().show();
                    $modalRoot.find( '[data-id="section-loader"]' ).first().hide();
                    $modalRoot.on( 'shown.bs.modal', function()
                    {
                        $modalRoot.find( '[data-id="btnMarkPayed"]' ).first().off( "click" );
                        $modalRoot.find( '[data-id="btnMarkPayed"]' ).first().click( function()
                        {
                            $(this).off( "click" );

                            $modalRoot.find( '[data-id="section-single-mark-payed-confirmation"]' ).first().hide();
                            $modalRoot.find( '[data-id="section-loader"]' ).first().show();

                            app.rpc.call(
                                'Contract',
                                'batchMarkPayed',
                                {
                                    contractIds : [ contractId ]
                                },
                                function( resp )
                                {
                                    if ( resp && resp.hasOwnProperty( 'code' ) && resp.code == 200 )
                                    {
                                        app.UI.toastSuccess( 'Vertrag erfolgreich als bezahlt markiert.' );
                                        app.reload();
                                    }
                                    else
                                    {
                                        app.UI.toastError();
                                    }
                                    $modalRoot.modal( 'hide' );
                                }
                            );
                        });
                    });
                    $modalRoot.on( 'hidden.bs.modal', function()
                    {
                        $modalRoot.modal( 'dispose' );
                    });
                    $modalRoot.modal( 'show' );

                });

                $container.find( '[data-id="btnMarkAsPaid"]' ).first().click( function()
                {
                    let contractIds = compDt.getSelectedIds();
                    if ( 0 === contractIds.length )
                    {
                        app.UI.toastError( 'Bitte wählen Sie die Verträge aus, die Sie auf "bezahlt" setzen möchten.', 'Keine Verträge ausgewählt.' );
                        return false;
                    }

                    let $modalRoot = $container.find( '[data-id="modal-confirm-multiple-mark-payed"]' ).first();
                    $modalRoot.find( '[data-id="section-multiple-mark-payed-confirmation"]' ).first().show();
                    $modalRoot.find( '[data-id="section-loader"]' ).first().hide();
                    $modalRoot.on( 'shown.bs.modal', function()
                    {
                        $modalRoot.find( '[data-id="btnMarkPayed"]' ).first().off( "click" );
                        $modalRoot.find( '[data-id="btnMarkPayed"]' ).first().click( function()
                        {
                            $(this).off( "click" );

                            $modalRoot.find( '[data-id="section-multiple-mark-payed-confirmation"]' ).first().hide();
                            $modalRoot.find( '[data-id="section-loader"]' ).first().show();

                            app.rpc.call(
                                'Contract',
                                'batchMarkPayed',
                                {
                                    contractIds : contractIds
                                },
                                function( resp )
                                {
                                    if ( resp && resp.hasOwnProperty( 'code' ) && resp.code == 200 )
                                    {
                                        app.UI.toastSuccess( 'Verträge erfolgreich auf bezahlt gesetzt.' );
                                        app.reload();
                                    }
                                    else
                                    {
                                        app.UI.toastError();
                                    }
                                    $modalRoot.modal( 'hide' );
                                }
                            );
                        });
                    });
                    $modalRoot.on( 'hidden.bs.modal', function()
                    {
                        $modalRoot.modal( 'dispose' );
                    });
                    $modalRoot.modal( 'show' );
                });

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

    destroy : function()
    {

    }
};

export { ContractClaim };