2021-07-09 12:11:25 +02:00
< div id = "page_content_inner" >
< h2 class = "heading_b uk-margin-bottom" > Get usage statistics report< / h2 >
<!-- TOP HELP CONTENT -->
< help-content # topHelperContent [ position ] = " ' top ' "
[ngClass]="topHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
< / help-content >
< div class = "uk-grid" >
<!-- LEFT HELP CONTENT -->
< aside-help-content # leftHelperContent [ position ] = " ' left ' "
[ngClass]="leftHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
< / aside-help-content >
<!-- MIDDLE -->
2023-09-28 15:16:59 +02:00
< 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 -->
< 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" >
2023-09-28 19:13:41 +02:00
< tr >
< ng-container * ngIf = "chosenReport === 'DSR'; else notDsrRow" >
2023-09-29 16:03:57 +02:00
< td class = "uk-width-1-3" > {{item.Dataset_Title}}< / td >
2023-09-28 19:13:41 +02:00
< td > {{item.Publisher}}< / td >
< td > {{item.YOP}}< / td >
< td > {{item.Access_Method}}< / td >
< / ng-container >
< ng-template # notDsrRow >
2023-09-28 15:16:59 +02:00
< td > {{item.Platform}}< / td >
< td * ngIf = "chosenReport === 'PR'" > {{item.Data_Type}}< / td >
< td > {{item.Access_Method}}< / td >
2023-09-28 19:13:41 +02:00
< / ng-template >
< ng-container * ngIf = "granularity === 'Totals'" >
< td * ngFor = "let instance of item.Performance[0].Instance" >
{{instance.Count}}
2023-09-28 15:16:59 +02:00
< / td >
2023-09-28 19:13:41 +02:00
< / 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 >
2023-09-28 15:16:59 +02:00
< 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 >
2023-11-01 13:58:25 +01:00
<!-- <pre>{{r5report | json}}</pre> -->
2023-09-28 15:16:59 +02:00
< / div >
< ng-template # elseBlock >
< div class = "uk-width-expand@m" >
2021-07-09 12:11:25 +02:00
< 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 = "repoResponse" 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 > {{ repoResponse.ReportDefinition['@Name'] }} Report Results
<!-- <span *ngIf="repoResponse.Report && -->
2023-03-21 16:01:45 +01:00
<!-- repoResponse.Report.Report && -->
<!-- repoResponse.Report.Report.Customer && -->
<!-- repoResponse.Report.Report.Customer.ReportItems && -->
<!-- repoResponse.Report.Report.Customer.ReportItems.length > 0">for {{ repoResponse.Report.Report.Customer.ReportItems[0].ItemPlatform }}</span> -->
2021-07-09 12:11:25 +02:00
< / 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-3-4@m uk-row-first" >
<!-- RESULTS TABLE -->
< div class = "uk-overflow-container" >
< table class = "uk-table table_check" style = "overflow-wrap: anywhere;" >
< thead >
< tr >
< th class = "uk-width-1-6" * ngIf = "chosenReport !== 'RR1'" > Title< / th >
< th class = "uk-width-1-6" * ngIf = "chosenReport !== 'RR1'" > Publisher< / th >
< th class = "uk-width-1-6" * ngIf = "chosenReport === 'RR1'" > Platform name< / th >
< th class = "uk-width-1-6" > {{ (chosenReport !== 'RR1') ? 'Item Urls' : 'Url' }}< / th >
< th class = "uk-width-1-6" > Type< / th >
< th class = "uk-width-1-6" colspan = "2" > Downloads/Views< / th >
<!-- <th class="uk - width - 2 - 10">Repository</th> -->
<!-- <th class="uk - width - 1 - 10">Validation Type</th> -->
<!-- <th class="uk - width - 1 - 10">Status</th> -->
<!-- <th class="uk - width - 1 - 10">Score</th> -->
<!-- <th class="uk - width - 1 - 10">Started</th> -->
<!-- <th class="uk - width - 2 - 10">Guidelines</th> -->
<!-- <th class="uk - width - 1 - 10">Actions</th> -->
<!-- <th class="uk - width - 1 - 10"></th> -->
< / tr >
< / thead >
< tbody >
< tr * ngIf = "infoMessage" >
< td colspan = "6" > {{ infoMessage }}< / td >
< / tr >
< ng-container * ngIf = "repoResponse?.Report?.Report?.Customer?.ReportItems" >
< ng-container * ngFor = "let item of repoResponse.Report.Report.Customer.ReportItems; let item_i = index" >
< tr >
< td * ngIf = "chosenReport !== 'RR1'" > {{ item.ItemName }}< / td >
< td * ngIf = "chosenReport !== 'RR1'" > {{ item.ItemPublisher }}< / td >
< td * ngIf = "chosenReport === 'RR1'" > {{ item.ItemPlatform }}< / td >
< td >
< div * ngFor = "let url of transformItem(item.ItemIdentifier); let i = index" class = "uk-margin-small-bottom" >
<!-- <br *ngIf="i>0"> -->
{{ url }}
< / div >
< / td >
< td > {{ item.ItemDataType }}< / td >
< td class = "uk-text-center"
*ngIf="repoResponse.ReportDefinition.Filters.ReportAttribute[0].Value === 'Monthly'" colspan="2">
< a * ngIf = "item.ItemPerformance && (item.ItemPerformance.length > 0)"
(click)="displayItemPerformance(item_i)">{{ (selectedItemIndex === item_i) ? 'Hide' : 'See' }} results< / a >
< / td >
< td class = "uk-text-center"
*ngIf="repoResponse.ReportDefinition.Filters.ReportAttribute[0].Value === 'Totals'">
{{ item.ItemPerformance[0].Instance[0].Count }}
< / td >
< td class = "uk-text-center"
*ngIf="repoResponse.ReportDefinition.Filters.ReportAttribute[0].Value === 'Totals'">
{{ item.ItemPerformance[0].Instance[1].Count }}
< / td >
< / tr >
< tr * ngIf = "(selectedItemIndex === item_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 > Downloads< / th >
< th > Views< / th >
< / tr >
< tr * ngFor = "let month of item.ItemPerformance" >
< td > {{ month.Period.Begin | date: "MMM yyyy" }}< / td >
< td > {{ month.Instance[0].Count }}< / td >
< td > {{ month.Instance[1].Count }}< / td >
< / tr >
< / table >
< / div >
< / td >
< / tr >
< / ng-container >
< / ng-container >
< / tbody >
< / table >
< / div >
<!-- BOTTOM PAGINATION LINKS -->
< ul class = "uk-pagination uk-margin-medium-top" >
< li class = "uk-pagination-previous" > < a ( click ) = " goToPreviousPage ( ) " > < i class = "uk-icon-angle-left" > < / i > < span class = "uk-margin-left" > Previous< / span > < / a > < / li >
< li class = "" > < span > page {{ (totalPages > 0) ? page+1 : 0 }} of {{ totalPages }}< / span > < / li >
< li class = "uk-pagination-next" > < a ( click ) = " goToNextPage ( ) " > < span class = "uk-margin-right" > Next< / span > < i class = "uk-icon-angle-right" > < / i > < / a > < / li >
< / ul >
< / div >
< div class = "uk-width-1-4@m" >
< div class = "uk-margin-medium-bottom" >
< p >
Number of results:
< span class = "uk-badge uk-badge-success uk-text-upper uk-margin-small-left" > {{ repoResponse.ReportDefinition.Filters.ReportAttribute[1].Value }}< / span >
< / p >
< p >
Filters:
< span * ngFor = "let filter of repoResponse.ReportDefinition.Filters.Filter; let i = index" class = "uk-badge uk-badge-outline uk-text-upper uk-margin-small-left" >
{{ filter.Name }}: {{ filter.Value }}
< / span >
< / p >
< / div >
< h2 class = "heading_c uk-margin-small-bottom" > Details< / h2 >
< ul class = "md-list md-list-addon" >
< li >
< div class = "md-list-addon-element" >
< i class = "md-list-addon-icon material-icons" > < / i >
< / div >
< div class = "md-list-content" >
< span class = "md-list-heading" > {{ repoResponse.Report.Report['@Created'] | date: "yyyy-MM-dd HH:mm:ss" }}< / span >
< span class = "uk-text-small uk-text-muted" > Date run< / span >
< / div >
< / li >
< li >
< div class = "md-list-addon-element" >
< i class = "md-list-addon-icon material-icons" > < / i >
< / div >
< div class = "md-list-content" >
< span class = "md-list-heading" > {{ coveredPeriod }}< / span >
< span class = "uk-text-small uk-text-muted" > Period covered< / span >
< / div >
< / li >
< / ul >
< / div >
< / div >
< / div >
< / div >
<!-- <div *ngIf="repoResponse" class="uk - margin - top"> -->
<!-- <h3>{{ repoResponse.ReportDefinition['@Name'] }} Report Results -->
<!-- <span *ngIf="repoResponse.Report && -->
<!-- repoResponse.Report.Report && -->
<!-- repoResponse.Report.Report.Customer && -->
<!-- repoResponse.Report.Report.Customer.ReportItems && -->
<!-- repoResponse.Report.Report.Customer.ReportItems.length > 0">for {{ repoResponse.Report.Report.Customer.ReportItems[0].ItemPlatform }}</span> -->
<!-- </h3> -->
<!-- <div class="uk - width - 1 - 2"> -->
<!-- <table class="uk - table"> -->
<!-- <tr> -->
<!-- <th>Period covered</th> -->
<!-- <td>{{ coveredPeriod }}</td> -->
<!-- </tr> -->
<!-- <tr> -->
<!-- <th>Filters</th> -->
<!-- <td> -->
<!-- <span *ngFor="let filter of repoResponse.ReportDefinition.Filters.Filter; let i = index"> -->
<!-- <br *ngIf="i>0"> -->
<!-- {{ filter.Name }}: {{ filter.Value }} -->
<!-- </span> -->
<!-- </td> -->
<!-- </tr> -->
<!-- <tr> -->
<!-- <th>Date run</th> -->
<!-- <td>{{ repoResponse.Report.Report['@Created'] | date: "yyyy - MM - dd HH:mm:ss" }}</td> -->
<!-- </tr> -->
<!-- <tr> -->
<!-- <th>Number of results</th> -->
<!-- <td>{{ repoResponse.ReportDefinition.Filters.ReportAttribute[1].Value }}</td> -->
<!-- </tr> -->
<!-- </table> -->
<!-- </div> -->
<!-- <div *ngIf="repoResponse.Report.Report.Customer && -->
<!-- repoResponse.Report.Report.Customer.ReportItems"> -->
<!-- <div> -->
<!-- <div class="show - options uk - inline" style="float: right;"> -->
<!-- <div class="filterLabel" style="display: inline;">Results per page:</div> -->
<!-- <div [formGroup]="pageSizeSelect" class="inlineBlock"> -->
<!-- <select class="form - control" 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> -->
<!-- </div> -->
<!-- </div> -->
<!-- </div><br> -->
<!-- <div class="contentAndPagerPanel"> -->
<!-- <!– TOP PAGINATION LINKS –> -->
<!-- <div> -->
<!-- <ul class="uk - pagination"> -->
<!-- <li> -->
<!-- <a class="uk - link uk - link - muted" (click)="goToPreviousPage()"> -->
<!-- <span class="uk - margin - small - right uk - pagination - previous uk - icon" uk - pagination - previous=""> -->
<!-- <svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg" -->
<!-- icon="pagination - previous" ratio="1"></svg> -->
<!-- </span> -->
<!-- Previous -->
<!-- </a> -->
<!-- </li> -->
<!-- <li class="uk - margin - auto - left"> -->
<!-- <a class="uk - link uk - link - muted" (click)="goToNextPage()"> -->
<!-- Next -->
<!-- <span class="uk - margin - small - left uk - pagination - next uk - icon" uk - pagination - next=""> -->
<!-- <svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg" -->
<!-- icon="pagination - next" ratio="1"></svg> -->
<!-- </span> -->
<!-- </a> -->
<!-- </li> -->
<!-- </ul> -->
<!-- <div class="resultsPageLabel">page {{ (totalPages > 0) ? page+1 : 0 }} of {{ totalPages }}</div> -->
<!-- </div> -->
<!-- <!– RESULTS TABLE –> -->
<!-- <div> -->
<!-- <div> -->
<!-- <div class="uk - overflow - auto uk - scrollspy - inview uk - animation - slide - top - medium uk - margin - top uk - margin - bottom"> -->
<!-- <table class="uk - table uk - table - middle uk - table - striped" style="vertical - align: top !important;"> -->
<!-- <thead> -->
<!-- <tr> -->
<!-- <th *ngIf="chosenReport !== 'RR1'">Title</th> -->
<!-- <th *ngIf="chosenReport !== 'RR1'">Publisher</th> -->
<!-- <th *ngIf="chosenReport === 'RR1'">Platform name</th> -->
<!-- <th>{{ (chosenReport !== 'RR1') ? 'Item Urls' : 'Url' }}</th> -->
<!-- <th>Type</th> -->
<!-- <th colspan="2">Downloads/Views</th> -->
<!-- </tr> -->
<!-- </thead> -->
<!-- <td colspan="6" *ngIf="infoMessage" class="uk - alert">{{ infoMessage }}</td> -->
<!-- <tbody *ngFor="let item of repoResponse.Report.Report.Customer.ReportItems; let item_i = index" -->
<!-- style="border - bottom: 1px solid whitesmoke;"> -->
<!-- <tr> -->
<!-- <td *ngIf="chosenReport !== 'RR1'">{{ item.ItemName }}</td> -->
<!-- <td *ngIf="chosenReport !== 'RR1'">{{ item.ItemPublisher }}</td> -->
<!-- <td *ngIf="chosenReport === 'RR1'">{{ item.ItemPlatform }}</td> -->
<!-- <td style="min - width: 300px;"> -->
<!-- <span *ngFor="let url of transformItem(item.ItemIdentifier); let i = index"> -->
<!-- <br *ngIf="i>0">{{ url }} -->
<!-- </span> -->
<!-- </td> -->
<!-- <td>{{ item.ItemDataType }}</td> -->
<!-- <td class="uk - text - center" -->
<!-- *ngIf="repoResponse.ReportDefinition.Filters.ReportAttribute[0].Value === 'Monthly'" colspan="2"> -->
<!-- <a *ngIf="item.ItemPerformance && (item.ItemPerformance.length > 0)" -->
<!-- (click)="displayItemPerformance(item_i)">{{ (selectedItemIndex === item_i) ? 'Hide' : 'See' }} results</a> -->
<!-- </td> -->
<!-- <td class="uk - text - center" -->
<!-- *ngIf="repoResponse.ReportDefinition.Filters.ReportAttribute[0].Value === 'Totals'"> -->
<!-- {{ item.ItemPerformance[0].Instance[0].Count }} -->
<!-- </td> -->
<!-- <td class="uk - text - center" -->
<!-- *ngIf="repoResponse.ReportDefinition.Filters.ReportAttribute[0].Value === 'Totals'"> -->
<!-- {{ item.ItemPerformance[0].Instance[1].Count }} -->
<!-- </td> -->
<!-- </tr> -->
<!-- <tr *ngIf="(selectedItemIndex === item_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"> -->
<!-- <tr> -->
<!-- <th>Month</th> -->
<!-- <th>Downloads</th> -->
<!-- <th>Views</th> -->
<!-- </tr> -->
<!-- <tr *ngFor="let month of item.ItemPerformance"> -->
<!-- <td>{{ month.Period.Begin | date: "MMM yyyy" }}</td> -->
<!-- <td>{{ month.Instance[0].Count }}</td> -->
<!-- <td>{{ month.Instance[1].Count }}</td> -->
<!-- </tr> -->
<!-- </table> -->
<!-- </div> -->
<!-- </td> -->
<!-- </tr> -->
<!-- </tbody> -->
<!-- </table> -->
<!-- </div> -->
<!-- </div> -->
<!-- </div> -->
<!-- <!– BOTTOM PAGINATION LINKS –> -->
<!-- <div> -->
<!-- <ul class="uk - pagination"> -->
<!-- <li> -->
<!-- <a class="uk - link uk - link - muted" (click)="goToPreviousPage()"> -->
<!-- <span class="uk - margin - small - right uk - pagination - previous uk - icon" uk - pagination - previous=""> -->
<!-- <svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg" -->
<!-- icon="pagination - previous" ratio="1"></svg> -->
<!-- </span> -->
<!-- Previous -->
<!-- </a> -->
<!-- </li> -->
<!-- <li class="uk - margin - auto - left"> -->
<!-- <a class="uk - link uk - link - muted" (click)="goToNextPage()"> -->
<!-- Next -->
<!-- <span class="uk - margin - small - left uk - pagination - next uk - icon" uk - pagination - next=""> -->
<!-- <svg width="7" height="12" viewBox="0 0 7 12" xmlns="http://www.w3.org/2000/svg" -->
<!-- icon="pagination - next" ratio="1"></svg> -->
<!-- </span> -->
<!-- </a> -->
<!-- </li> -->
<!-- </ul> -->
<!-- <div class="resultsPageLabel">page {{ (totalPages > 0) ? page+1 : 0 }} of {{ totalPages }}</div> -->
<!-- </div> -->
<!-- </div> -->
<!-- </div> -->
<!-- </div> -->
< / div >
2023-09-28 15:16:59 +02:00
< / ng-template >
2021-07-09 12:11:25 +02:00
<!-- RIGHT HELP CONTENT -->
< aside-help-content # rightHelperContent [ position ] = " ' right ' "
[ngClass]="rightHelperContent.isPresent()?'tm-sidebar uk-width-1-4@m uk-first-column':'clear-style'">
< / aside-help-content >
< / div >
<!-- BOTTOM HELP CONTENT -->
< help-content # bottomHelperContent [ position ] = " ' bottom ' "
[ngClass]="bottomHelperContent.isPresent()?'uk-margin-medium-top uk-margin-medium-bottom':'clear-style'">
< / help-content >
< / div >