PartnerBids = function(  options ) {

    this.partnerId = options.partnerId;
    this.partnerType = options.partnerType;

    this.toolbar = null;
    this.dataGrid = null;
    this.rootElement = null;

}

PartnerBids.prototype.constructor = PartnerBids;

PartnerBids.prototype.element = function() {

    let instance = this;

    // create devex components that replicate existing bid tab functionality thta is contained within operator portfolio, anything that leaves operator portofolio
    // and goes to apps/BID/index.cfm, should still do that    

    // add any necessary javascrip to /mstrcfmod/OPR/apps/portfolio.cfm

    if( instance.rootElement ) {
        return instance.rootElement;
    }

    instance.toolbar = $("<div>").dxToolbar( {

        items : [
            { widget: "dxButton", location: "after", options : {
                type : "normal",
                icon :"refresh",
                hint : "Refresh",
                onClick : function( e ) {
                        instance.dataGrid.refresh();
                    }
                }
            }, 
            { widget: "dxButton", location: "after", options : {
                type : "normal",
                icon :"help",
                hint : "View Help",
                onClick : function( e ) {
                        Fse.Portal.showQuickHelp( "PartnerBids" );
                    }
                }
            },       
        ]
    }).addClass( "fx-toolbar" ).dxToolbar( "instance" );
    
    const appDataURL = $( '#appDataURL' ).attr( 'href' );
    const bidHandlerURL = $( '#bidHandlerLink' ).attr( 'href' );

    const bidDataSource = Fse.Data.createDataSource( {
        //select: [ 'bidStatus', 'bidId', 'bidNumber', 'bidName', 'releaseDate', 'bidOpeningDateTime' ],
        customStore: {
            dataURL: appDataURL,
            object: 'BID.bids2',
            objectParams: { partnerId: this.partnerId, partnerType: this.partnerType },
        },
    });

    instance.dataGrid = $("<div>").dxDataGrid( {
        //columnAutoWidth: true,
        showBorders : true,
        filterRow : { visible : true },
        selection: {
            mode: 'single',
        },
        dataSource: bidDataSource,
        height: '800',
        scrolling : { mode : "virtual" },
        remoteOperations : {
            filtering : true,
            paging : true,
            sorting : true
        },
        columns : [
            { width: '60', dataField: 'bidStatus', caption: 'Status', allowSorting: true, alignment: 'center',
                cellTemplate: function( container, options ) {
                    let statusColor = '';
                    switch( options.value ) {
                        case 'NL':
                            statusColor = '#FFBF7C';
                            break;  
                        case 'NP':
                            statusColor = '#FFDBAE';
                            break;  
                        case 'RD':
                            statusColor = '#BDE096'; 
                            break; 
                        case 'ND':
                            statusColor = '#DBD2E9';
                            break;  
                        case 'WM':
                            statusColor = '#D4EBF3';
                            break;  
                        case 'WA':
                            statusColor = '#FFFAAE';
                            break;  
                        case 'ZZ':
                            statusColor = '#C0C0C0';
                            break;  
                        default:
                            statusColor = '#FFFFFF';
                            break;
                    }
                    
                    container.css( 'background-color', statusColor ).text( options.value );
                },
            },
            { width: '300', dataField: 'bidNumber', caption: 'Bid #', allowSorting: true,
                cellTemplate: function( container, options ) {
                    bidHandlerLink = bidHandlerURL + '?bidView=bid&bidId=' + options.data.bidId;
                    $( '<a>' ).append( options.data.bidNumber ).attr( 'href', bidHandlerLink ).attr( 'target', '_blank' ).appendTo( container );
                }, 
            },
            { xwidth: '500', dataField: 'bidName', caption: 'Bid Name', allowSorting: true,
                cellTemplate: function( container, options ) {
                    bidHandlerLink = bidHandlerURL + '?bidView=bid&bidId=' + options.data.bidId;
                    $( '<a>' ).append( options.data.bidName ).attr( 'href', bidHandlerLink ).attr( 'target', '_blank' ).appendTo( container );
                },
            },
            { width: '125', dataField: 'releaseDate', dataType : "date", caption: 'Release', allowSorting: true, alignment: 'center' },
            { width: '125', dataField: 'bidOpeningDateTime', dataType : "date", caption: 'Opening', allowSorting: true, alignment: 'center' },
            { width: '30', name: 'bidActions',
                type: 'buttons',
                buttons: [{
                    template: function( data ) {
                        let button = $( '<div>' ).addClass( 'dx-icon-overflow' ).css( { 'display' : 'inline-block', 'cursor' : 'pointer' } );
                        return button;
                    }
                }],
            },
        ],
        showRowLines: false,
        rowAlternationEnabled: true,
        filterRow : { visible : true },
        headerFilter : { visible : false },
        onCellClick: function( cce ) {
            const data = cce.data;

            if( cce.column.name === 'bidActions' && data.bidId > 0 ) {

                let items = [ { text: 'View Bid Item Report', actionCode: 'viewBidItemReport' } ];

                $( '<div>' ).dxContextMenu( {
                    items: items,
                    hideOnOutsideClick: true,
                    onHidden: function( cme ) {
                        cme.component.element().remove();
                        cme.component.dispose();
                    },
                    onItemClick: function( cme ) {
                        if( cme.itemData.actionCode ) {
                            switch( cme.itemData.actionCode ) {
                                case 'viewBidItemReport':
                                    $.ajax({
                                        method: 'GET',
                                        url: bidHandlerURL,
                                        data: { 
                                            mode: 'direct',
                                            ajax: 'buildReportURL',
                                            bidAgencyId: data.bidAgencyId,
                                            bidId: data.bidId,
                                        },
                                        success: function( data, textStatus, request ) {
                                            Fse.Portal.showReportCenter( data, 'Bid Management Report Center' );
                                        },
                                    })
                                break;
                            }
                        }

                        cme.component.hide();
                    },
                    target: cce.cellElement,
                }).appendTo( 'body' ).dxContextMenu( 'show' );
            }
        },
        sortByGroupSummaryInfo: [{
            summaryItem: 'count',
        }],
        summary: {
            totalItems: [{
                column: 'bidNumber',
                summaryType: 'count',
                displayFormat: 'Total: {0}',
            }]
        }
    }).dxDataGrid( "instance" );

    instance.rootElement = $("<div>")
        .addClass( "PartnerBids" )
        .append( this.toolbar.element().css( { "margin" : "5px", "padding-right" : "10px"} ) )
        .append( instance.toolbar.element() )
        .append( instance.dataGrid.element() )

    return instance.rootElement;
}