diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 456f43f..9661b1d 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -88,6 +88,7 @@ import {MatRadioModule} from "@angular/material/radio"; import {UsertimeGraphComponent} from "./pages/internal-components/usertime.graph.component"; import {VipGraphComponents} from "./pages/internal-components/vip.graph.components"; import {ConnectionsGraphComponent} from "./pages/internal-components/connections.graph.component"; +import {DoxingGraphComponent} from "./pages/internal-components/doxing.graph.component"; registerLocaleData(localeRu, "ru") @@ -143,7 +144,8 @@ registerLocaleData(localeRu, "ru") //graph UsertimeGraphComponent, VipGraphComponents, - ConnectionsGraphComponent + ConnectionsGraphComponent, + DoxingGraphComponent ], imports: [ BrowserModule, diff --git a/src/app/pages/internal-components/abstract.perperiod.graph.component.ts b/src/app/pages/internal-components/abstract.perperiod.graph.component.ts index 2ebc523..eead178 100644 --- a/src/app/pages/internal-components/abstract.perperiod.graph.component.ts +++ b/src/app/pages/internal-components/abstract.perperiod.graph.component.ts @@ -1,6 +1,6 @@ import {Component, OnInit} from "@angular/core"; import {Chart} from "chart.js/auto"; -import {PerPeriodStatistic} from "../../services/graph.service"; +import {CountryCityPerPeriodStatistic, PerPeriodStatistic} from "../../services/graph.service"; import {ServerService} from "../../services/server.service"; import {SearchFilter} from "../../entities/search/SearchFilter"; import {BaseUtils} from "../../utils/BaseUtils"; @@ -72,11 +72,12 @@ export abstract class AbstractPerperiodGraphComponent implements OnInit { return filter; } - public updateGraph(objs: PerPeriodStatistic[], + public updateGraph(objs: PerPeriodStatistic[]|CountryCityPerPeriodStatistic[], canvasName: string, tooltopFooter:any = null, text = "", - timeDelimiter:number = -1) { + timeDelimiter:number = -1, + sortKey: 'srv_id'|'countryAndCity' = 'srv_id') { let chartConfig = {type: 'bar', data: {}, options: { plugins: { title: { @@ -111,8 +112,8 @@ export abstract class AbstractPerperiodGraphComponent implements OnInit { * }, */ }; - let valueOnServer: {[srv_name: string]: number[]} = {} - let srvList: string[] = []; + let sortingKeyStore: {[name: string]: number[]} = {} + let sortingList: string[] = []; let maxValue = 0; ////// @@ -140,7 +141,8 @@ export abstract class AbstractPerperiodGraphComponent implements OnInit { } console.log(timeDelimiter) - const groupByDate = objs.reduce((acc: {[date: string]: PerPeriodStatistic[]}, obj) => { + // @ts-ignore + const groupByDate = objs.reduce((acc: {[date: string]: PerPeriodStatistic[]|CountryCityPerPeriodStatistic[]}, obj) => { const key = obj.date; if (!acc[key]) acc[key] = []; acc[key].push(obj) @@ -151,44 +153,76 @@ export abstract class AbstractPerperiodGraphComponent implements OnInit { chartData.labels.forEach( (date) => { + // @ts-ignore groupByDate[date].forEach((stat) => { - if (srvList.indexOf(stat.srv_id) == -1) - srvList.push(stat.srv_id) + switch (sortKey) { + case "srv_id": { + if (sortingList.indexOf(stat.srv_id) == -1) + sortingList.push(stat.srv_id) + break; + } + case "countryAndCity": { + if (sortingList.indexOf(stat.countryAndCity) == -1) + sortingList.push(stat.countryAndCity) + break; + } + } }) } ); - //console.log(srvList) - srvList.forEach((srv) => { - valueOnServer[srv] = []; + //console.log(sortingList) + sortingList.forEach((obj) => { + sortingKeyStore[obj] = []; }); chartData.labels.forEach( (date) => { let filled: string[] = []; groupByDate[date].forEach( + // @ts-ignore (obj) => { - if (timeDelimiter == -1) { - valueOnServer[obj.srv_id].push(obj.value); - } else { - valueOnServer[obj.srv_id].push(obj.value / timeDelimiter); + switch (sortKey) { + case "srv_id": { + if (timeDelimiter == -1) { + sortingKeyStore[obj.srv_id].push(obj.value); + } else { + sortingKeyStore[obj.srv_id].push(obj.value / timeDelimiter); + } + filled.push(obj.srv_id); + break; + } + case "countryAndCity": { //todo maybe get key + sortingKeyStore[obj.countryAndCity].push(1); + filled.push(obj.countryAndCity); + break; + } } - filled.push(obj.srv_id); } ) - srvList.forEach( - (srv) => { - if (filled.indexOf(srv) == -1) { - valueOnServer[srv].push(0); + sortingList.forEach( + (sortingElement) => { + if (filled.indexOf(sortingElement) == -1) { + sortingKeyStore[sortingElement].push(0); } } ) }, ) - //console.log(valueOnServer) - Object.keys(valueOnServer).forEach( + //console.log(sortingKeyStore) + Object.keys(sortingKeyStore).forEach( (key) => { - chartData.datasets.push( - {label: this.getServerName(key) + " ("+key+")", data: valueOnServer[key]} - ) + switch (sortKey) { + case "srv_id": { + chartData.datasets.push( + {label: this.getServerName(key) + " ("+key+")", data: sortingKeyStore[key]} + ); + break; + } + case "countryAndCity": { + chartData.datasets.push( + {label: key, data: sortingKeyStore[key]} + ) + } + } } ) /// diff --git a/src/app/pages/internal-components/doxing.graph.component.ts b/src/app/pages/internal-components/doxing.graph.component.ts new file mode 100644 index 0000000..2ef70e5 --- /dev/null +++ b/src/app/pages/internal-components/doxing.graph.component.ts @@ -0,0 +1,62 @@ +import {AbstractPerperiodGraphComponent} from "./abstract.perperiod.graph.component"; +import {Component, Input} from "@angular/core"; +import {ServerService} from "../../services/server.service"; +import {GraphService} from "../../services/graph.service"; +import {MatSnackBar} from "@angular/material/snack-bar"; + +@Component({ + selector: 'app-doxing-graph', + template: ` +