import { AfterViewInit , ChangeDetectionStrategy , Component , Input , ViewChild } from '@angular/core' ; import { MatDialog } from '@angular/material/dialog' ; import { MatSort } from '@angular/material/sort' ; import { MatTableDataSource } from '@angular/material/table' ; import { DownloadDialogComponent } from '@shared/download-dialog/download-dialog.component' ; /**
 * Display Magnitude Station Details on the Magnitude tab
 * inside the Origin Module
 */ @ Component ( { changeDetection : ChangeDetectionStrategy . OnPush , selector : 'origin-magnitude-detail' , styleUrls : [ './magnitude-detail.component.scss' ] , templateUrl : './magnitude-detail.component.html' } ) export class MagnitudeDetailComponent implements AfterViewInit { columnsToDisplay = [ 'channel' , 'type' , 'amplitude' , 'period' , 'status' , 'magnitude' , 'weight' ] ; columnTitles = { amplitude : 'Amplitude' , channel : 'Channel' , magnitude : 'Magnitude' , period : 'Period' , status : 'Status' , type : 'Type' , weight : 'Weight' } ; dataSource : MatTableDataSource < any > = new MatTableDataSource < any > ( ) ; @ ViewChild ( MatSort , { static : true } ) sort : MatSort ; constructor ( public dialog ) { this . dataSource . sortingDataAccessor = this . sortBy ; } ngAfterViewInit ( ) { this . dataSource . sort = this . sort ; } /**
     * Map contributions input to dataSource.data (which is observable).
     */ @ Input ( ) set contributions ( contributions ) { this . dataSource . data = contributions ; } get contributions ( ) { return this . dataSource . data ; } /**
     * Called when download button is clicked.
     *
     * Show a download dialog with tab-separated value content.
     */ onDownload ( ) { const header = this . columnsToDisplay . map ( c => { return this . columnTitles [ c ] ; } ) . join ( '\t' ) ; const contributions = this . dataSource . connect ( ) . value ; const lines = contributions . map ( contribution => { return this . columnsToDisplay . map ( c => { return contribution [ c ] ; } ) . join ( '\t' ) ; } ) ; this . dialog . open ( DownloadDialogComponent , { data : { content : header + '\n' + lines . join ( '\n' ) , message : 'Copy then paste into a spreadsheet application' , title : 'Download Station Data' } } ) ; } param data param header return sortBy ( data , header ) { switch ( header ) { case 'amplitude' : case 'period' : case 'magnitude' : case 'weight' : return + ( data [ header ] || '' ) . split ( ' ' ) [ 0 ] ; default : return data [ header ] ; } } }