This repository has been archived by the owner on Nov 22, 2019. It is now read-only.
/
dataservices.component.html
118 lines (108 loc) · 5.88 KB
/
dataservices.component.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<div style="margin-left: 150px">
<div id="dataservices-breadcrumb-bar">
<app-breadcrumbs>
<li i18n="@@dataservices.dataservices" app-breadcrumb label="Dataservices" icon="table" class="active"></li>
</app-breadcrumbs>
</div>
<app-page-error [error]="pageError" *ngIf="pageError"></app-page-error>
<div class="container-fluid dataservice-list-dataservices" *ngIf="!pageError">
<div class="col-sm-12">
<h2 i18n="@@dataservices.dataservices">Dataservices</h2>
</div>
<div class="row toolbar-pf">
<div class="col-sm-12">
<form class="toolbar-pf-actions" #filterForm="ngForm">
<div class="form-group toolbar-pf-filter">
<label i18n="@@dataservices.name" class="sr-only" for="filter">Name</label>
<div class="input-group" style="width: 100%">
<input name="name-filter" [(ngModel)]="nameFilter" type="text" class="form-control name-filter" id="filter" placeholder="Filter by name...">
</div>
</div>
<div class="form-group">
<button class="btn btn-link" type="button" (click)="toggleSortDirection()">
<span *ngIf="isSortAscending" class="fa fa-sort-alpha-asc"></span>
<span *ngIf="isSortDescending" class="fa fa-sort-alpha-desc"></span>
</button>
</div>
<div class="form-group">
<a i18n="@@dataservices.addDataservice" class="btn btn-primary" [routerLink]="[addDataserviceLink]">Add Dataservice</a>
</div>
<div class="form-group toolbar-pf-view-selector">
<ul class="list-inline">
<li *ngIf="isListLayout"><a (click)="setCardLayout()"><i class="fa fa-th"></i></a></li>
<li *ngIf="isCardLayout"><a (click)="setListLayout()"><i class="fa fa-th-list"></i></a></li>
</ul>
</div>
</form>
<div class="row toolbar-pf-results">
<div class="col-sm-12">
<h5 i18n="@@dataservices.dataservicesFound" >{{ filteredDataservices.length }} Dataservices found
<a *ngIf="allDataservices.length != filteredDataservices.length"
class="clear-filters" (click)="clearFilters()">(out of {{
allDataservices.length }} total)</a></h5>
</div>
</div>
</div>
</div>
<!-- List of Dataservices -->
<div class="row dataservice-list-items">
<div class="col-md-12 empty-state" *ngIf="isLoaded('dataservices') && allDataservices.length === 0">
<div class="blank-slate-pf">
<div class="blank-slate-pf-icon">
<span class="pficon pficon pficon-add-circle-o"></span>
</div>
<h1 i18n="@@dataservices.noDataservicesFound">No Dataservices Found</h1>
<p i18n="@@dataservices.noDataservicesFoundPleaseClick">
No Dataservices were found - please click below to create a new Dataservice!
</p>
<div class="blank-slate-pf-main-action">
<div class="btn-group">
<a i18n="@@dataservices.addDataservice" class="btn btn-primary btn-lg" [routerLink]="[ addDataserviceLink ]">Add Dataservice</a>
</div>
</div>
</div>
</div>
<div class="col-md-8 none-matched-state" *ngIf="filteredDataservices.length === 0 && isFiltered()">
<div class="alert alert-info">
<span class="pficon pficon-info"></span>
<strong i18n="@@dataservices.noDataservicesMatchedFilter">No Dataservices matched the filter! Please try changing your filter criteria... </strong>
</div>
</div>
<!-- The 'loading Dataservices' card -->
<div class="col-md-12" *ngIf="!isLoaded('dataservices')">
<div class="container-fluid container-cards-pf">
<div class="row row-cards-pf">
<div class="card-pf card-pf-accented">
<div class="card-pf-heading">
<h1 class="card-pf-title">
<span i18n="@@dataservices.loadingDataservices" class="spinner spinner-xs spinner-inline"></span> Loading Dataservices...
</h1>
</div>
</div>
</div>
</div>
</div>
<!-- The list or card view -->
<div class="col-md-12" *ngIf="isLoaded('dataservices')">
<!-- Notification for Dataservice Export -->
<pfng-inline-notification [header]="exportNotificationHeader"
[message]="exportNotificationMessage"
[dismissable]="true"
[type]="exportNotificationType"
[hidden]="exportNotificationHidden">
</pfng-inline-notification>
<app-dataservices-list *ngIf="isListLayout" [dataservices]="filteredDataservices" [selectedDataservices]="selectedDataservices"
(activateDataservice)="onActivate($event)" (testDataservice)="onTest($event)"
(publishDataservice)="onPublish($event)" (deleteDataservice)="onDelete($event)"
(dataserviceSelected)="onSelected($event)" (dataserviceDeselected)="onDeselected($event)"></app-dataservices-list>
<app-dataservices-cards *ngIf="isCardLayout" [dataservices]="filteredDataservices" [selectedDataservices]="selectedDataservices"
(activateDataservice)="onActivate($event)" (testDataservice)="onTest($event)"
(publishDataservice)="onPublish($event)" (deleteDataservice)="onDelete($event)"
(dataserviceSelected)="onSelected($event)" (dataserviceDeselected)="onDeselected($event)"></app-dataservices-cards>
</div>
</div>
</div>
</div>
<app-confirm-delete (deleteSelected)="onDeleteDataservice()">
<p i18n="@@dataservices.doYouReallyWantToDeleteSelectedDataservice" >Do you really want to delete the selected Dataservice?</p>
</app-confirm-delete>