ng2-smart-table寻呼机无法正常工作

时间:2018-04-04 09:08:18

标签: angular typescript ng2-smart-table

我正在尝试使用自定义服务器数据源实现ng2-smart-table。除了寻呼机,它可以工作。即使我在设置中设置了所有属性,寻呼机也不会显示。你们知道我错过了什么吗?

  mySettings = { 
hideSubHeader: false,
        filter: true,
        sort: true,
        hideHeader: false,
        actions: {
            edit: false,
            add: false,
            delete: false,
            position: false,
        },
        pager: {
            display: true,
            perPage: 10,
        },
        columns: {},
    };

settings: any = {};

// private fieldsToSearch: Map<string, string> = new Map<string, string>();

constructor( private activatedRoute: ActivatedRoute,
             private statisticService: StatisticService,
             private datePipe: DatePipe,
             private httpClient: HttpClient ) {
}

ngOnInit() {
    // this.blockUI.start();

    this.macroCatId = RouteUtils.extractParamFromAncestor( this.activatedRoute.pathFromRoot, 'macroCatId' );
    this.executionId = RouteUtils.extractParamFromAncestor( this.activatedRoute.pathFromRoot, 'executionId' );
    this.bankId = RouteUtils.extractParamFromAncestor( this.activatedRoute.pathFromRoot, 'bankId' );
    this.statisticId = RouteUtils.extractParamFromAncestor( this.activatedRoute.pathFromRoot, 'statisticId' );

    this.source = new BrizoServerDataSource( this.executionId,
        this.macroCatId,
        this.bankId,
        this.statisticId,
        this.httpClient,
        this.datePipe );

    this.source.generateColumnsFromProduct()
        .finally( () => {
            this.settings = Object.assign( {}, this.mySettings );
            // this.source.setPaging( 0, 3 );
            console.log( this.settings )
        } )
        .subscribe( ( settingsReceived ) => {
            this.mySettings.columns = settingsReceived
        } );
}

这里我的服务器数据源我正在使用Http客户端而不是普通的http来提高性能

export class BrizoServerDataSource extends LocalDataSource {

params: any = {};
lastRequestCount: number = 0;

constructor( private executionId,
             private macroCatId,
             private bankId,
             private statisticId,
             protected httpClient: HttpClient,
             protected datePipe: DatePipe ) {
    super();
}

count(): number {
    return this.lastRequestCount;
}

callTheProductsFromBackEnd( params: any ): Observable<StatisticResponse> {
    return this.httpClient.get<StatisticResponse>(
        environment.brizoUrl
            .concat( '/' )
            .concat( this.executionId )
            .concat( '/products/' )
            .concat( this.macroCatId )
            .concat( '/' )
            .concat( this.statisticId )
            .concat( '/products' ),
        {
            headers: {'XXX-organization': this.bankId},
            params: params,
        } )
}

generateColumnsFromProduct(): Observable<any> {
    return this.callTheProductsFromBackEnd( {} )
        .map( res => {
            // console.log( res )
            const columns: any = {};
            if ( res.detailObject.products && res.detailObject.products.length > 0 ) {
                res.detailObject.products[0].fields.forEach( field => {
                    const column = {};
                    column['title'] = field.name;
                    column['type'] = 'custom';
                    column['renderComponent'] = CellStatisticTableComponent;
                    columns[field.name] = column;
                } );
            }
            return columns;
        } );
}

getElements(): Promise<any> {

    if ( this.sortConf ) {
        this.sortConf.forEach( ( fieldConf ) => {
            this.params['sortField'] = fieldConf.field;
            this.params['sortOrder'] = fieldConf.direction.toUpperCase();
        } );
    }

    if ( this.pagingConf && this.pagingConf['page'] && this.pagingConf['perPage'] ) {
        // console.log( this.pagingConf );

        this.params['page'] = this.pagingConf['page'] - 1;
        this.params['pageSize'] = this.pagingConf['perPage'];
        // url += `_page=${this.pagingConf['page']}&_limit=${this.pagingConf['perPage']}&`;
    }

    if ( this.filterConf.filters ) {
        // console.log( this.filterConf )
        this.filterConf.filters.forEach( ( fieldConf ) => {
            const sanitizedValue = !isNullOrUndefined( fieldConf['search'] ) ?
                fieldConf['search'].replace( /^\s+|\s+$/g, '' ) : '';
            if ( !''.match( sanitizedValue ) ) {
                this.params['F_'.concat( fieldConf.field )] = fieldConf['search'];
            } else {
                delete this.params['F_'.concat( fieldConf.field )];
            }
        } );
    }

    return this.callTheProductsFromBackEnd( this.params )
        .map( ( products ) => {
            const dataSetToBeDisplayed = [];
            products.detailObject.products.forEach( ( product ) => {
                const tempSourceField = {};
                product.fields.forEach( field => {
                    field.value = field.type === 'date' ? this.datePipe.transform( field.value, 'dd MMM yyyy' ) : field.value;
                    tempSourceField['fieldType'] = field.type;
                    tempSourceField[field.name] = field.value;
                } );
                dataSetToBeDisplayed.push( tempSourceField );
            } );
            return dataSetToBeDisplayed;
        } ).toPromise();
}

}

0 个答案:

没有答案