creating tables for counter R5 repots
This commit is contained in:
parent
e8f69c38bb
commit
ae3b932a9f
|
@ -14,7 +14,139 @@
|
|||
</aside-help-content>
|
||||
|
||||
<!-- MIDDLE -->
|
||||
<div class=" uk-width-expand@m">
|
||||
<div *ngIf="release === '5'; else elseBlock" class="uk-width-expand@m">
|
||||
<div *ngIf="errorMessage" class="uk-alert uk-alert-warning">{{errorMessage}}</div>
|
||||
<div *ngIf="loadingMessage" class="loading-big">
|
||||
<div class="loader-big" style="text-align: center; padding-top: 170px; color: rgb(47, 64, 80); font-weight: bold;">
|
||||
{{ loadingMessage }}
|
||||
</div>
|
||||
<div class="transparentFilm"></div>
|
||||
</div>
|
||||
<div *ngIf="compressed; else notCompressed" class="uk-margin-top">
|
||||
<a [href]=r5report?.Data target="_blank">Download report here</a>
|
||||
</div>
|
||||
<ng-template #notCompressed>
|
||||
<div *ngIf="r5report?.[reportItems]?.length === 0" class="uk-alert uk-alert-warning">
|
||||
Service did not find any data
|
||||
</div>
|
||||
<div *ngIf="r5report?.[reportItems]?.length > 0" class="md-card">
|
||||
<div class="md-card-content large-padding">
|
||||
|
||||
<div class="uk-margin-bottom" data-uk-margin="">
|
||||
|
||||
<div class="uk-grid">
|
||||
<div class="uk-width-4-5@m">
|
||||
<h3>{{ r5report?.Report_Header?.Report_Name }} Report Results</h3>
|
||||
</div>
|
||||
<!-- <div class="uk-width-1-5@m">-->
|
||||
<!-- <div [formGroup]="pageSizeSelect" class="md-input-wrapper md-input-filled">-->
|
||||
<!-- <label class="">Results per page</label>-->
|
||||
<!-- <select class="md-input" formControlName="selectPageSize" (change)="getPageSize()">-->
|
||||
<!-- <option value="10" selected>10</option>-->
|
||||
<!-- <option value="25">25</option>-->
|
||||
<!-- <option value="50">50</option>-->
|
||||
<!-- <option value="100">100</option>-->
|
||||
<!-- </select>-->
|
||||
<!-- <span class="md-input-bar"></span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<hr>
|
||||
|
||||
<div class="uk-grid uk-grid-divider" data-uk-grid-margin="">
|
||||
|
||||
<div class="uk-width-1-1@m uk-row-first">
|
||||
|
||||
<!-- RESULTS TABLE -->
|
||||
{{chosenReport}}
|
||||
<div class="uk-overflow-container">
|
||||
<table class="uk-table table_check" style="overflow-wrap: anywhere;">
|
||||
<thead>
|
||||
<tr>
|
||||
<ng-container *ngIf="chosenReport === 'DSR'; else notDSR">
|
||||
<th>Dataset Title</th>
|
||||
<th>Publisher</th>
|
||||
<th>YOP</th>
|
||||
<th>Access Method</th>
|
||||
</ng-container>
|
||||
|
||||
<ng-template #notDSR>
|
||||
<th>Platform</th>
|
||||
<th *ngIf="chosenReport === 'PR'">Data type</th>
|
||||
<th>Access method</th>
|
||||
</ng-template>
|
||||
|
||||
<th *ngIf="granularity === 'Monthly'">Count</th>
|
||||
<ng-container *ngIf="granularity === 'Totals'">
|
||||
<th *ngFor="let Instance of r5report[reportItems][0].Performance[0].Instance">
|
||||
{{Instance.MetricType}}
|
||||
</th>
|
||||
</ng-container>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<ng-container *ngFor="let item of r5report[reportItems]; let i=index">
|
||||
<tr *ngIf="chosenReport === 'DSR'; else notDsrRow">
|
||||
<td>{{item.Dataset_Title}}</td>
|
||||
<td>{{item.YOP}}</td>
|
||||
<td>{{item.Publisher}}</td>
|
||||
<td>{{item.Access_Method}}</td>
|
||||
</tr>
|
||||
<ng-template #notDsrRow>
|
||||
<tr>
|
||||
<td>{{item.Platform}}</td>
|
||||
<td *ngIf="chosenReport === 'PR'">{{item.Data_Type}}</td>
|
||||
<td>{{item.Access_Method}}</td>
|
||||
<ng-container *ngIf="granularity === 'Totals'">
|
||||
<td *ngFor="let instance of item.Performance[0].Instance">
|
||||
{{instance.Count}}
|
||||
</td>
|
||||
</ng-container>
|
||||
<td class="uk-text-center" *ngIf="granularity === 'Monthly'">
|
||||
<a *ngIf="item?.Performance?.length > 0" (click)="displayItemPerformance(i)">
|
||||
{{ (selectedItemIndex === i) ? 'Hide' : 'See' }} results
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</ng-template>
|
||||
<tr *ngIf="(selectedItemIndex === i)">
|
||||
<td colspan="6">
|
||||
<div class="uk-animation-slide-top-medium uk-margin-small-top">
|
||||
<table class="uk-table uk-table-middle uk-table-striped innerTable uk-margin-small-top uk-margin-small-bottom">
|
||||
<tr>
|
||||
<th>Month</th>
|
||||
<th *ngFor="let instance of item.Performance[0].Instance">{{instance.MetricType}}</th>
|
||||
</tr>
|
||||
<tr *ngFor="let month of item.Performance">
|
||||
<td>{{ month.Period.Begin_Date | date: "MMM yyyy" }}</td>
|
||||
<td *ngFor="let instance of month.Instance">{{ instance.Count }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</ng-container>
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</ng-template>
|
||||
|
||||
<pre>{{r5report | json}}</pre>
|
||||
</div>
|
||||
<ng-template #elseBlock>
|
||||
<div class="uk-width-expand@m">
|
||||
|
||||
<div *ngIf="errorMessage" class="uk-alert uk-alert-warning">{{errorMessage}}</div>
|
||||
<div *ngIf="loadingMessage" class="loading-big">
|
||||
|
@ -364,6 +496,7 @@
|
|||
<!--</div>-->
|
||||
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
<!-- RIGHT HELP CONTENT -->
|
||||
<aside-help-content #rightHelperContent [position]="'right'"
|
||||
|
|
|
@ -4,6 +4,7 @@ import { AuthenticationService } from '../../../services/authentication.service'
|
|||
import { UsagestatsService } from '../../../services/usagestats.service';
|
||||
import { ReportResponse } from '../../../domain/usageStatsClasses';
|
||||
import { FormBuilder, FormGroup } from '@angular/forms';
|
||||
import {COUNTER_Dataset_Report, COUNTER_Item_Report, SUSHI_Error_Model} from '../../../domain/sushilite';
|
||||
|
||||
@Component({
|
||||
selector: 'metrics-usagestats-report-results',
|
||||
|
@ -15,6 +16,11 @@ export class MetricsUsagestatsReportResultsComponent implements OnInit {
|
|||
loadingMessage: string;
|
||||
errorMessage: string;
|
||||
infoMessage: string;
|
||||
release: string;
|
||||
granularity: string;
|
||||
r5report: COUNTER_Dataset_Report | COUNTER_Item_Report | SUSHI_Error_Model = null;
|
||||
reportItems: string;
|
||||
compressed: boolean = null;
|
||||
|
||||
repoResponse: ReportResponse;
|
||||
coveredPeriod: string;
|
||||
|
@ -50,19 +56,32 @@ export class MetricsUsagestatsReportResultsComponent implements OnInit {
|
|||
this.route.queryParams.subscribe( qparams => {
|
||||
this.params.append('Report', qparams['report']);
|
||||
this.params.append('Release', qparams['release']);
|
||||
this.release = qparams['release'];
|
||||
this.params.append('RequestorID', this.authService.getUserEmail());
|
||||
this.params.append('BeginDate', qparams['beginDate']);
|
||||
this.params.append('EndDate', qparams['endDate']);
|
||||
if (qparams['beginDate'])
|
||||
this.params.append('BeginDate', qparams['beginDate']);
|
||||
if (qparams['endDate'])
|
||||
this.params.append('EndDate', qparams['endDate']);
|
||||
this.params.append('RepositoryIdentifier', qparams['repoId']);
|
||||
this.params.append('ItemIdentifier', qparams['itemIdentifier']);
|
||||
this.params.append('DatasetIdentifier', qparams['datasetIdentifier']);
|
||||
this.params.append('ItemDataType', qparams['itemIdentifier']);
|
||||
if (qparams['itemIdentifier'])
|
||||
this.params.append('ItemIdentifier', qparams['itemIdentifier']);
|
||||
if (qparams['datasetIdentifier'])
|
||||
this.params.append('DatasetIdentifier', qparams['datasetIdentifier']);
|
||||
if (qparams['dataType'])
|
||||
this.params.append('DataType', qparams['dataType']);
|
||||
this.params.append('Granularity', qparams['granularity']);
|
||||
this.granularity = qparams['granularity'];
|
||||
// this.params.append('MetricType', qparams['metricTypes']);
|
||||
this.params.append('MetricType', qparams['totalItemRequests']);
|
||||
this.params.append('MetricType', qparams['totalItemInvestigations']);
|
||||
this.params.append('MetricType', qparams['uniqueItemRequests']);
|
||||
this.params.append('MetricType', qparams['uniqueItemInvestigations']);
|
||||
if (qparams['report'] !== 'PR_1') {
|
||||
if (qparams['totalItemRequests'])
|
||||
this.params.append('MetricType', qparams['totalItemRequests']);
|
||||
if (qparams['totalItemInvestigations'])
|
||||
this.params.append('MetricType', qparams['totalItemInvestigations']);
|
||||
if (qparams['uniqueItemRequests'])
|
||||
this.params.append('MetricType', qparams['uniqueItemRequests']);
|
||||
if (qparams['uniqueItemInvestigations'])
|
||||
this.params.append('MetricType', qparams['uniqueItemInvestigations']);
|
||||
}
|
||||
});
|
||||
|
||||
this.chosenReport = this.params.get('Report');
|
||||
|
@ -76,48 +95,70 @@ export class MetricsUsagestatsReportResultsComponent implements OnInit {
|
|||
this.selectedItemIndex = null;
|
||||
this.repoResponse = null;
|
||||
|
||||
this.usageService.getReportResponse(this.page.toString(), this.pageSize.toString(), this.params).subscribe(
|
||||
responseWrapper => {
|
||||
this.repoResponse = responseWrapper.ReportResponse;
|
||||
},
|
||||
error => {
|
||||
this.errorMessage = 'Failed to load the report results!';
|
||||
this.loadingMessage = '';
|
||||
},
|
||||
() => {
|
||||
this.errorMessage = '';
|
||||
this.loadingMessage = '';
|
||||
|
||||
this.pageSizeSelect.get('selectPageSize').setValue(this.pageSize);
|
||||
this.pageSizeSelect.get('selectPageSize').updateValueAndValidity();
|
||||
|
||||
this.totalPages = Math.ceil(
|
||||
+this.repoResponse.ReportDefinition.Filters
|
||||
.ReportAttribute.filter(x => x['Name'] === 'ReportItemCount')[0].Value / this.pageSize);
|
||||
if ( this.totalPages === 0 ) {
|
||||
this.infoMessage = 'No results were found';
|
||||
if (this.release === '5') {
|
||||
this.usageService.getR5Response(this.params).subscribe(
|
||||
res => {
|
||||
this.r5report = res;
|
||||
this.reportItems = 'Report_Items';
|
||||
if (this.chosenReport === 'DSR') {
|
||||
this.reportItems = 'Report_Datasets';
|
||||
}
|
||||
if (this.r5report?.['Code'] === '100000') {
|
||||
this.compressed = true;
|
||||
}
|
||||
}, error => {
|
||||
this.errorMessage = 'Failed to load the report results!';
|
||||
this.loadingMessage = '';
|
||||
},
|
||||
() => {
|
||||
this.errorMessage = '';
|
||||
this.loadingMessage = '';
|
||||
}
|
||||
);
|
||||
} else {
|
||||
this.usageService.getReportResponse(this.page.toString(), this.pageSize.toString(), this.params).subscribe(
|
||||
responseWrapper => {
|
||||
this.repoResponse = responseWrapper.ReportResponse;
|
||||
},
|
||||
error => {
|
||||
this.errorMessage = 'Failed to load the report results!';
|
||||
this.loadingMessage = '';
|
||||
},
|
||||
() => {
|
||||
this.errorMessage = '';
|
||||
this.loadingMessage = '';
|
||||
|
||||
if (this.repoResponse.ReportDefinition && this.repoResponse.ReportDefinition.Filters &&
|
||||
this.repoResponse.ReportDefinition.Filters.ReportAttribute) {
|
||||
this.pageSizeSelect.get('selectPageSize').setValue(this.pageSize);
|
||||
this.pageSizeSelect.get('selectPageSize').updateValueAndValidity();
|
||||
|
||||
if (this.repoResponse.Report && this.repoResponse.ReportDefinition.Filters.UsageDateRange &&
|
||||
this.repoResponse.ReportDefinition.Filters.UsageDateRange.Begin &&
|
||||
this.repoResponse.ReportDefinition.Filters.UsageDateRange.End) {
|
||||
this.coveredPeriod = this.repoResponse.ReportDefinition.Filters.UsageDateRange.Begin + ' to ';
|
||||
this.coveredPeriod = this.coveredPeriod + this.repoResponse.ReportDefinition.Filters.UsageDateRange.End;
|
||||
} else {
|
||||
const defaultDatePeriod = this.repoResponse.Exception.filter(x => x['Message'] === 'Unspecified Date Arguments');
|
||||
|
||||
this.coveredPeriod = defaultDatePeriod[0].Data.split(':')[1].trim() + ' to ';
|
||||
this.coveredPeriod = this.coveredPeriod + defaultDatePeriod[1].Data.split(':')[1].trim() + ' (default)';
|
||||
this.totalPages = Math.ceil(
|
||||
+this.repoResponse.ReportDefinition.Filters
|
||||
.ReportAttribute.filter(x => x['Name'] === 'ReportItemCount')[0].Value / this.pageSize);
|
||||
if ( this.totalPages === 0 ) {
|
||||
this.infoMessage = 'No results were found';
|
||||
}
|
||||
|
||||
} else {
|
||||
this.repoResponse = null;
|
||||
if (this.repoResponse.ReportDefinition && this.repoResponse.ReportDefinition.Filters &&
|
||||
this.repoResponse.ReportDefinition.Filters.ReportAttribute) {
|
||||
|
||||
if (this.repoResponse.Report && this.repoResponse.ReportDefinition.Filters.UsageDateRange &&
|
||||
this.repoResponse.ReportDefinition.Filters.UsageDateRange.Begin &&
|
||||
this.repoResponse.ReportDefinition.Filters.UsageDateRange.End) {
|
||||
this.coveredPeriod = this.repoResponse.ReportDefinition.Filters.UsageDateRange.Begin + ' to ';
|
||||
this.coveredPeriod = this.coveredPeriod + this.repoResponse.ReportDefinition.Filters.UsageDateRange.End;
|
||||
} else {
|
||||
const defaultDatePeriod = this.repoResponse.Exception.filter(x => x['Message'] === 'Unspecified Date Arguments');
|
||||
|
||||
this.coveredPeriod = defaultDatePeriod[0].Data.split(':')[1].trim() + ' to ';
|
||||
this.coveredPeriod = this.coveredPeriod + defaultDatePeriod[1].Data.split(':')[1].trim() + ' (default)';
|
||||
}
|
||||
|
||||
} else {
|
||||
this.repoResponse = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -31,11 +31,11 @@ export class MetricsUsagestatsReportComponent implements OnInit {
|
|||
endDate = '';
|
||||
itemIdentifier = '';
|
||||
datasetIdentifier = '';
|
||||
totalItemRequests = 'Total_Item_Requests';
|
||||
totalItemInvestigations = 'Total_Item_Investigations';
|
||||
uniqueItemRequests = 'Unique_Item_Requests';
|
||||
uniqueItemInvestigations = 'Unique_Item_Investigations';
|
||||
itemDataType = '';
|
||||
totalItemRequests = '';
|
||||
totalItemInvestigations = '';
|
||||
uniqueItemRequests = '';
|
||||
uniqueItemInvestigations = '';
|
||||
dataType = '';
|
||||
granularity = 'Monthly';
|
||||
|
||||
constructor(private repoService: RepositoryService,
|
||||
|
@ -80,6 +80,12 @@ export class MetricsUsagestatsReportComponent implements OnInit {
|
|||
getParams() {
|
||||
// this.repoId = this.route.snapshot.paramMap.get('id');
|
||||
this.release = this.route.snapshot.paramMap.get('reportType').slice(1, 2);
|
||||
if (this.release === '5') {
|
||||
this.totalItemRequests = 'Total_Item_Requests';
|
||||
this.totalItemInvestigations = 'Total_Item_Investigations';
|
||||
this.uniqueItemRequests = 'Unique_Item_Requests';
|
||||
this.uniqueItemInvestigations = 'Unique_Item_Investigations';
|
||||
}
|
||||
this.chosen_report = this.route.snapshot.paramMap.get('reportID');
|
||||
this.shownRepoId = this.convertToDisplayedFormat(this.repo.id);
|
||||
console.log(`shownRepoId is ${this.repo.id}`);
|
||||
|
@ -129,7 +135,7 @@ export class MetricsUsagestatsReportComponent implements OnInit {
|
|||
}
|
||||
|
||||
updateItemDataType(event: any) {
|
||||
this.itemDataType = event.target.value;
|
||||
this.dataType = event.target.value;
|
||||
}
|
||||
|
||||
updateItemIdentifier(event: any) {
|
||||
|
@ -203,7 +209,7 @@ export class MetricsUsagestatsReportComponent implements OnInit {
|
|||
beginDate: this.beginDate,
|
||||
endDate: this.endDate,
|
||||
repoId: this.shownRepoId,
|
||||
itemDataType: this.itemDataType,
|
||||
dataType: this.dataType,
|
||||
itemIdentifier: this.itemIdentifier,
|
||||
datasetIdentifier: this.datasetIdentifier,
|
||||
granularity: this.granularity,
|
||||
|
|
|
@ -6,6 +6,7 @@ import { Injectable } from '@angular/core';
|
|||
import { Observable } from 'rxjs';
|
||||
import { ReportResponseWrapper } from '../domain/usageStatsClasses';
|
||||
import { environment } from '../../environments/environment';
|
||||
import {COUNTER_Dataset_Report, COUNTER_Item_Report} from '../domain/sushilite';
|
||||
|
||||
const headerOptions = {
|
||||
headers : new HttpHeaders().set('Content-Type', 'application/json')
|
||||
|
@ -15,17 +16,24 @@ const headerOptions = {
|
|||
|
||||
@Injectable ()
|
||||
export class UsagestatsService {
|
||||
private apiUrl = environment.API_ENDPOINT + '/sushilite/';
|
||||
private apiUrl = environment.API_ENDPOINT + '';
|
||||
|
||||
constructor(private httpClient: HttpClient) { }
|
||||
|
||||
|
||||
getReportResponse(page: String, pageSize: String, params: URLSearchParams): Observable<ReportResponseWrapper> {
|
||||
const url = `${this.apiUrl}getReportResults/${page}/${pageSize}?${params}`;
|
||||
const url = `${this.apiUrl}/sushilite/getReportResults/${page}/${pageSize}?${params}`;
|
||||
console.log(`knocking on: ${url}`);
|
||||
|
||||
return this.httpClient.get<ReportResponseWrapper>(url, headerOptions);
|
||||
}
|
||||
|
||||
getR5Response(params: URLSearchParams) {
|
||||
const url = `${this.apiUrl}/sushiliteR5/getReportResults/?${params}`;
|
||||
console.log(`knocking on: ${url}`);
|
||||
|
||||
return this.httpClient.get<COUNTER_Dataset_Report | COUNTER_Item_Report>(url, headerOptions);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue