import { Component, ViewEncapsulation, AfterViewInit, ViewChild } from '@angular/core';
import { TdLoadingService } from '@covalent/core';
import {GridOptions, IGetRowsParams, IRowModel, IFilter} from 'ag-grid/main';

import { StatementBase } from '../../../models/statement.base';
import { RoadMapComponent } from '../../../components/road-map.component';

import { RoadService } from '../../../services/road.service';
import { RoadCreateService } from '../../../services/road-create.service';
import { Road } from '../../../models/road';
import { EditorComponent } from '../../../helpers/editor.component';
import { RendererComponent } from '../../../helpers/renderer.component';
import { RoadTypeSelectList } from '../../../models/road-type-select-list';

import { routerTransition } from '../../../animations/router.animation';
import {Way} from "../../../models/way";

@Component({
    // tslint:disable-next-line:component-selector
    selector: 'road-grid',
    templateUrl: 'road.component.html',
    styleUrls: ['road.scss'],
    encapsulation: ViewEncapsulation.None,
})
export class RoadComponent extends StatementBase {
  @ViewChild(RoadMapComponent)
  protected mapComponent: RoadMapComponent;
    public roadTypes: RoadTypeSelectList[];

    constructor(
        protected service: RoadService,
        protected dataService: RoadCreateService,
        protected loadingService: TdLoadingService,
    ) {
        super();
    }

    public showOnMap(): void {
      let selectedRows: any[] = this.gridOptions.api.getSelectedRows();
        if (selectedRows.length) {
            this.mapComponent.clearWays();
            selectedRows.forEach((row) => {
                this.service.getRelation(row.id).then(x => {
                    this.mapComponent.setWays(x);
                    return x;
                });
            });
            this.gridOptions.api.deselectAll();
        }
    }

  protected createColumnDefs(): any[] {
    return [
      {
        headerName: '#',
        width: 30,
        checkboxSelection: true,
        suppressSorting: true,
        suppressMenu: true,
        pinned: true,
      },
      {
        headerName: 'ID',
        field: 'id',
      },
      {
        headerName: 'Назва дороги',
        field: 'name',
        editable: true,
      },
      {
        headerName: 'Індекс дороги',
        field: 'index',
        editable: true,
      },
      {
        headerName: 'Тип дороги',
        field: 'roadTypeId',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.roadTypes,
          valueCol: 'roadTypeId',
          labelCol: 'name',
        },
      },
    ];
  }

  protected initFunction(): void {
    this.dataService.getModels().then((models: any) => {
            this.roadTypes = models.roadTypeSelectListDsM as RoadTypeSelectList[];
      }).then(() => {
            this.bootstrapGrid();
      });
  }
}