@ -1,11 +1,10 @@
import { Component , OnInit } from '@angular/core' ;
import { GraphService } from "../../services/graph.service" ;
import { Chart } from "chart.js/auto" ;
import { GraphData } from "../../entities/graph/GraphData" ;
import { ActionService } from "../../services/action.service" ;
import { Uniq } from "../../entities/servers/Uniq" ;
import { ServerService } from "../../services/server.service" ;
import { AuthService } from "../../services/auth.service" ;
import { StatExporter } from "../../entities/servers/StatExporter" ;
import { Countries } from "../../entities/servers/Countries" ;
export interface Period {
name : string
@ -19,39 +18,18 @@ export interface Period {
} )
export class StatisticPageComponent implements OnInit {
init : boolean = true ;
loading : boolean = false ;
periods :Period [ ] = [
{ name : 'По дням' , value : 'days' } ,
{ name : 'По минутам' , value : 'minutes' }
] ;
selectedPeriod :Period = this . periods [ 0 ] ;
days :number [ ] = [ 1 , 7 , 14 , 21 , 30 , 60 , 90 , 180 ] ;
selectedDays :number = 30 ;
minutes :number [ ] = [ 1 , 5 , 10 , 15 , 30 ]
selectedMinute :number = 5 ;
serverList : { name : string , server_id : string } [ ] = [
{ name : 'Выбрать все' , server_id : '%' }
] ;
selectedServer : { name : string , server_id : string } = this . serverList [ 0 ] ;
chart ! : Chart ;
uniq ! : Uniq ;
constructor ( private graphService : GraphService ,
private actionService : ActionService ,
countries : Countries = new Countries ( ) ;
constructor ( private actionService : ActionService ,
private serverService : ServerService ,
public authService : AuthService ) {
}
ngOnInit ( ) : void {
this . getServers ( ) ;
this . getUniq ( ) ;
this . getCountries ( ) ;
}
getUniq() {
@ -60,53 +38,16 @@ export class StatisticPageComponent implements OnInit {
) ;
}
getServers() {
this . serverService . getServers ( ) . subscribe (
( res ) = > {
const keys = Object . keys ( res . data ) ;
for ( const key of keys ) {
this . serverList . push ( { name : res.data [ key ] . name , server_id : key } ) ;
}
}
getCountries() {
this . serverService . getStats ( "countries" ) . subscribe (
( res : StatExporter < any > ) = > this . countries = Countries . fromExporter ( res . export ( ) )
)
}
getGraph() {
if ( this . loading ) {
return ;
}
this . init = false ;
this . loading = true ;
console . log ( this . selectedPeriod , this . selectedMinute , this . selectedDays , this . selectedServer ) ;
switch ( this . selectedPeriod . value ) {
case 'days' : {
this . graphService . getOnlineStatsOfDays ( this . selectedDays , this . selectedServer ? this . selectedServer . server_id : '%' ) . subscribe (
( d ) = > this . processingData ( GraphData . fromStatsOfPeakOfDay ( d . reverse ( ) , "red" ) ) ,
( err ) = > this . actionService . showSnack ( 'Произошла ошибка во время загрузки данных, попробуй позже' ) ,
( ) = > this . loading = false
) ; break ;
}
case 'minutes' : {
this . graphService . getOnlineStatsOfMinutes ( this . selectedMinute , this . selectedDays , this . selectedServer ? this . selectedServer . server_id : '%' ) . subscribe (
( d ) = > this . processingData ( GraphData . fromStatsOfPeakOfPerFiveMinutes ( d . reverse ( ) , "red" ) ) ,
( err ) = > this . actionService . showSnack ( 'Произошла ошибка во время загрузки данных, попробуй позже' ) ,
( ) = > this . loading = false
) ; break ;
}
generateStyle4Country ( countryName : string ) {
return {
'background' : 'linear-gradient(to right, black, transparent), url(\'../../../assets/flags/' + countryName + '\')' ,
'background-size' : 'cover'
}
}
processingData ( data :GraphData , reversed : boolean = true ) {
if ( this . chart )
this . chart . destroy ( ) ;
this . chart = new Chart ( "MyChart" , {
type : "line" ,
data : {
labels : data.labels ,
datasets : data.data
}
} ) ;
}
}
gsd
5 months ago
