Administrator / maps-admin

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

import { BusStopService } from '../../../services/bus-stop.service';
import { BusStop } from '../../../models/bus-stop';
import { EditorComponent } from '../../../helpers/editor.component';
import { RendererComponent } from '../../../helpers/renderer.component';
import { BusStopCreateService } from '../../../services/bus-stop-create.service';
import { BooleanSelectListService } from '../../../services/boolean-select-list.service';
import { RegionSelectList } from '../../../models/region-select-list';
import { StateCommonSelectList } from '../../../models/state-common-select-list';
import { RoadSelectList } from '../../../models/road-select-list';
import { BooleanSelectList } from '../../../models/boolean-select-list';
import { SettlementSelectList } from '../../../models/settlement-select-list';
import { SurfaceTypeSelectList } from '../../../models/surface-type-select-list';

import { routerTransition } from '../../../animations/router.animation';

// only import this if you are using the ag-Grid-Enterprise

@Component({
    // tslint:disable-next-line:component-selector
    selector: 'bus-grid',
    templateUrl: 'bus-stop.component.html',
    styleUrls: ['bus-stop.scss'],
    encapsulation: ViewEncapsulation.None,
})
export class BusStopComponent implements AfterViewInit {

    private columnDefs: any[];
    private gridOptions: GridOptions;
    public showGrid: boolean;
    public rowCount: string;
    public regions: RegionSelectList[];
    public states: StateCommonSelectList[];
    public surfaceTypes: SurfaceTypeSelectList[];
    public settlements: SettlementSelectList[];
    public roads: RoadSelectList[];
    public boolean: BooleanSelectList[];
    public isLoading: boolean = false;
    public isBootstrapping: boolean = true;
    public isSelected: boolean = false;
    public isNew: boolean = false;

    constructor(
        protected service: BusStopService,
        private dataService: BusStopCreateService,
        private booleanService: BooleanSelectListService,
        private loadingService: TdLoadingService,
    ) {
        this.gridOptions = <GridOptions>{};
        this.gridOptions.enableSorting = true;
        this.gridOptions.suppressMultiSort = true;
        this.gridOptions.enableServerSideSorting = true;
        this.showGrid = true;
        this.gridOptions.rowModelType = 'virtual';
        this.booleanService.getModels().then((models) => this.boolean = models);
        this.dataService.getModels().then((models) => {
        this.regions = models.regionSelectListDsM as RegionSelectList[];
        this.states = models.stateCommonSelectListDsM as StateCommonSelectList[];
        this.surfaceTypes = models.surfaceTypeSelectListDsM as SurfaceTypeSelectList[];
        this.settlements = models.settlementSelectListDsM as SettlementSelectList[];
        this.roads = models.roadSelectListDsM as RoadSelectList[];
      }).then(() => {
            this.createColumnDefs();
            this.isBootstrapping = false;
      });
    }

    ngAfterViewInit() {
        this.gridOptions.api.setDatasource(this.setRowData());
    }

    setRowData(): any {
      // tslint:disable-next-line:typedef
      let dataSource = {
          rowCount: null, // behave as infinite scroll
          getRows: (params: IGetRowsParams) => {
              let sort = null;
              if (params.sortModel.length) {
                  sort = this.parseSort(params.sortModel[0]);
              }
              this.service.getData(params.startRow, params.endRow, sort).then((data) => {
                  if (!data.length) {
                      data = [new BusStop()];
                  }
                  let lastRow = -1;
                  if (data.length <= params.endRow) {
                      lastRow = data.length;
                  }
                  params.successCallback(data, lastRow);
              });
          },
      };
      return dataSource;
  }
  enableLoader(): void {
      if (!this.isLoading) {
        this.isLoading = true;
        this.loadingService.register('loading');
      }
  }
  disableLoader(): void {
      if (this.isLoading) {
        this.isLoading = false;
        this.loadingService.resolve('loading');
      }
  }
  onDeleteConfirm(event): void {
    if (window.confirm('Вы уверены что хотите удалить??')) {
      event.confirm.resolve();
    } else {
      event.confirm.reject();
    }
  }
  public addNewRow(): void {
      if (this.getFirstRowID()) {
          this.gridOptions.api.insertItemsAtIndex(0, [new BusStop()]);
          this.isNew = true;
      }
  }
  private parseSort(sort: any): string {
      if (sort.colId && sort.sort) {
          let result = sort.colId;
          if (sort.sort === 'desc') {
              result = '-' + result;
          }
          return result;
      }
      return null;
  }
  private getFirstRowID(): number {
      let model = this.gridOptions.api.getModel().getRow(0);
      let id: number = model.data.busStopId;
      if (id) {
          return id;
      } else {
          return null;
      }
  }
  private createColumnDefs() {
    this.columnDefs = [
      {
        headerName: '#',
        width: 30,
        checkboxSelection: true,
        suppressSorting: true,
        suppressMenu: true,
        pinned: true,
      },
      {
        headerName: 'ID',
        field: 'busStopId',
      },
      {
        headerName: 'Назва дороги',
        field: 'roadId',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.roads,
          valueCol: 'roadId',
          labelCol: 'name',
        },
      },
      {
        headerName: 'Область',
        field: 'regionId',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.regions,
          valueCol: 'regionId',
          labelCol: 'name',
        },
      },
      {
        headerName: 'Місцезнаходження, км+ справа',
        field: 'locationRight',
        editable: true,
      },
      {
        headerName: 'Місцезнаходження, км+ зліва',
        field: 'locationLeft',
        editable: true,
      },
      {
        headerName: 'Тип покриття',
        field: 'surfaceTypeId',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.surfaceTypes,
          valueCol: 'surfaceTypeId',
          labelCol: 'name',
        },
      },
      {
        headerName: 'Технічний стан',
        field: 'stateCommonId',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.states,
          valueCol: 'stateCommonId',
          labelCol: 'value',
        },
      },
      ,
      {
        headerName: 'Наявність елементів зупин. майдан',
        field: 'areaStopAvailability',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.boolean,
          valueCol: 'value',
          labelCol: 'label',
        },
      },
      {
        headerName: 'Наявність елементів посад. майдан',
        field: 'areaLandAvailability',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.boolean,
          valueCol: 'value',
          labelCol: 'label',
        },
      },
      {
        headerName: 'Наявність елементів заїзна кишеня',
        field: 'pocketAvailability',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.boolean,
          valueCol: 'value',
          labelCol: 'label',
        },
      },
      {
        headerName: 'Наявність туалету',
        field: 'toiletAvailability',
        editable: true,
        cellEditorFramework: EditorComponent,
        cellRendererFramework: RendererComponent,
        cellEditorParams: {
          data: this.boolean,
          valueCol: 'value',
          labelCol: 'label',
        },
      },
      {
        headerName: 'Рік будівництва',
        field: 'yearBuild',
        editable: true,
      },
      {
        headerName: 'Рік ремонту',
        field: 'yearRepair',
        editable: true,
      },
    ];
  }

    private onCellClicked($event) {
        console.log('onCellClicked: ' + $event.rowIndex + ' ' + $event.colDef.field);
    }

    private onCellValueChanged($event) {
        if ($event.oldValue !== $event.newValue) {
            let data = JSON.stringify($event.data);
            let id = $event.data.busStopId;
            let result = null;
            if (id) {
                this.enableLoader();
                result = this.service.update(id, data).then(() => this.disableLoader());
            } else {
                // Protection of posting new row being already sent.
                if (this.isLoading) {
                    return ;
                }
                this.enableLoader();
                result = this.service.create(data).then((busStop) => {
                    this.gridOptions.api.setDatasource(this.setRowData());
                    this.gridOptions.api.refreshVirtualPageCache();
                    this.disableLoader();
                    this.isNew = false;
                });
            }
        }
    }

    private deleteRows() {
        let rows = this.gridOptions.api.getSelectedNodes();
        if (!rows.length) {
            this.isSelected = false;
            return ;
        }
        rows.forEach((element, index, array) => {
            let id = element.data.busStopId;
            if (id) {
                this.enableLoader();
                this.service.delete(id).then(() => {
                    if (index === (array.length - 1)) {
                        this.disableLoader();
                        this.gridOptions.api.setDatasource(this.setRowData());
                        this.gridOptions.api.refreshVirtualPageCache();
                        this.gridOptions.api.deselectAll();
                        this.isNew = false;
                    }
                });
            }
        });
    }

    private onCellDoubleClicked($event) {
        console.log('onCellDoubleClicked: ' + $event.rowIndex + ' ' + $event.colDef.field);
    }

    private onCellContextMenu($event) {
        console.log('onCellContextMenu: ' + $event.rowIndex + ' ' + $event.colDef.field);
    }

    private onCellFocused($event) {
        console.log('onCellFocused: (' + $event.rowIndex + ',' + $event.colIndex + ')');
    }

    private onRowSelected($event) {
        // taking out, as when we 'select all', it prints to much to the console!!
        // console.log('onRowSelected: ' + $event.node.data.name);
    }

    private onSelectionChanged() {
        let selection = this.gridOptions.api.getSelectedNodes();
        if (selection.length) {
            if (selection.length === 1) {
                this.gridOptions.api.refreshVirtualPageCache();
                this.isNew = false;
            }
            this.isSelected = true;
        } else {
            this.isSelected = false;
        }
    }

    private onBeforeFilterChanged() {
        console.log('beforeFilterChanged');
    }

    private onAfterFilterChanged() {
        console.log('afterFilterChanged');
    }

    private onFilterModified() {
        console.log('onFilterModified');
    }

    private onBeforeSortChanged(event) {
        console.log('onBeforeSortChanged');
    }

    private onAfterSortChanged($event) {
        console.log('onAfterSortChanged');
    }

    private onVirtualRowRemoved($event) {
        // because this event gets fired LOTS of times, we don't print it to the
        // console. if you want to see it, just uncomment out this line
        // console.log('onVirtualRowRemoved: ' + $event.rowIndex);
    }

    private onRowClicked($event) {
        console.log('onRowClicked: ' + $event.node.data.name);
    }

    public onQuickFilterChanged($event) {
        this.gridOptions.api.setQuickFilter($event.target.value);
    }

    // here we use one generic event to handle all the column type events.
    // the method just prints the event name
    private onColumnEvent($event) {
        console.log('onColumnEvent: ' + $event);
    }
}