feat(UX): persist search criterias (#2425)
* feat(ui): persist search criteria * fix(ui): trying make templates search working correctly * fix(ui): corrected search persistance on home and templates * fix(ui): corrected javascript errorspull/2449/head
parent
1a94158f77
commit
2541f4daea
|
@ -8,7 +8,7 @@
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter"
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter"
|
||||||
placeholder="Search..." auto-focus>
|
ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table">
|
<table class="table">
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover table-filters nowrap-cells">
|
<table class="table table-hover table-filters nowrap-cells">
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -109,7 +109,7 @@
|
||||||
></containers-datatable-actions>
|
></containers-datatable-actions>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover table-filters nowrap-cells">
|
<table class="table table-hover table-filters nowrap-cells">
|
||||||
|
|
|
@ -78,6 +78,10 @@ function (PaginationService, DatatableService, EndpointProvider) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.onColumnVisibilityChange = function() {
|
this.onColumnVisibilityChange = function() {
|
||||||
DatatableService.setColumnVisibilitySettings(this.tableKey, this.columnVisibility);
|
DatatableService.setColumnVisibilitySettings(this.tableKey, this.columnVisibility);
|
||||||
};
|
};
|
||||||
|
@ -227,6 +231,11 @@ function (PaginationService, DatatableService, EndpointProvider) {
|
||||||
this.columnVisibility = storedColumnVisibility;
|
this.columnVisibility = storedColumnVisibility;
|
||||||
}
|
}
|
||||||
this.columnVisibility.state.open = false;
|
this.columnVisibility.state.open = false;
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover table-filters nowrap-cells">
|
<table class="table table-hover table-filters nowrap-cells">
|
||||||
|
|
|
@ -17,6 +17,10 @@ angular.module('portainer.docker')
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function (orderField) {
|
this.changeOrderBy = function (orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -130,6 +134,11 @@ angular.module('portainer.docker')
|
||||||
this.updateStoredFilters(storedFilters.state.values);
|
this.updateStoredFilters(storedFilters.state.values);
|
||||||
}
|
}
|
||||||
this.filters.state.open = false;
|
this.filters.state.open = false;
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -37,7 +37,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover table-filters nowrap-cells">
|
<table class="table table-hover table-filters nowrap-cells">
|
||||||
|
|
|
@ -22,6 +22,10 @@ function (PaginationService, DatatableService) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function(orderField) {
|
this.changeOrderBy = function(orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -86,6 +90,11 @@ function (PaginationService, DatatableService) {
|
||||||
this.filters = storedFilters;
|
this.filters = storedFilters;
|
||||||
}
|
}
|
||||||
this.filters.usage.open = false;
|
this.filters.usage.open = false;
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
></services-datatable-actions>
|
></services-datatable-actions>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -16,6 +16,10 @@ function (PaginationService, DatatableService, EndpointProvider) {
|
||||||
publicURL: EndpointProvider.endpointPublicURL()
|
publicURL: EndpointProvider.endpointPublicURL()
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function(orderField) {
|
this.changeOrderBy = function(orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -109,6 +113,11 @@ function (PaginationService, DatatableService, EndpointProvider) {
|
||||||
if (storedExpandedItems !== null) {
|
if (storedExpandedItems !== null) {
|
||||||
this.expandItems(storedExpandedItems);
|
this.expandItems(storedExpandedItems);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search...">
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search...">
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -14,6 +14,10 @@ function (PaginationService, DatatableService) {
|
||||||
selectedItems: []
|
selectedItems: []
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function(orderField) {
|
this.changeOrderBy = function(orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -52,6 +56,11 @@ function (PaginationService, DatatableService) {
|
||||||
this.state.reverseOrder = storedOrder.reverse;
|
this.state.reverseOrder = storedOrder.reverse;
|
||||||
this.state.orderBy = storedOrder.orderBy;
|
this.state.orderBy = storedOrder.orderBy;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover table-filters nowrap-cells">
|
<table class="table table-hover table-filters nowrap-cells">
|
||||||
|
|
|
@ -22,6 +22,10 @@ function (PaginationService, DatatableService) {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function(orderField) {
|
this.changeOrderBy = function(orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -86,6 +90,11 @@ function (PaginationService, DatatableService) {
|
||||||
this.filters = storedFilters;
|
this.filters = storedFilters;
|
||||||
}
|
}
|
||||||
this.filters.usage.open = false;
|
this.filters.usage.open = false;
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover">
|
<table class="table table-hover">
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover">
|
<table class="table table-hover">
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover">
|
<table class="table table-hover">
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<table class="table table-hover">
|
<table class="table table-hover">
|
||||||
<div class="col-sm-12">
|
<div class="col-sm-12">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search...">
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search...">
|
||||||
</div>
|
</div>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -11,6 +11,11 @@ function (PaginationService, DatatableService) {
|
||||||
selectedItems: []
|
selectedItems: []
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function(orderField) {
|
this.changeOrderBy = function(orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -49,6 +54,12 @@ function (PaginationService, DatatableService) {
|
||||||
this.state.reverseOrder = storedOrder.reverse;
|
this.state.reverseOrder = storedOrder.reverse;
|
||||||
this.state.orderBy = storedOrder.orderBy;
|
this.state.orderBy = storedOrder.orderBy;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
this.onTextFilterChange();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -17,7 +17,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -11,6 +11,10 @@ function (PaginationService, DatatableService) {
|
||||||
selectedItems: []
|
selectedItems: []
|
||||||
};
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
};
|
||||||
|
|
||||||
this.changeOrderBy = function(orderField) {
|
this.changeOrderBy = function(orderField) {
|
||||||
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
this.state.reverseOrder = this.state.orderBy === orderField ? !this.state.reverseOrder : false;
|
||||||
this.state.orderBy = orderField;
|
this.state.orderBy = orderField;
|
||||||
|
@ -49,6 +53,11 @@ function (PaginationService, DatatableService) {
|
||||||
this.state.reverseOrder = storedOrder.reverse;
|
this.state.reverseOrder = storedOrder.reverse;
|
||||||
this.state.orderBy = storedOrder.orderBy;
|
this.state.orderBy = storedOrder.orderBy;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
function setDefaults(ctrl) {
|
function setDefaults(ctrl) {
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search...">
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search...">
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search...">
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search...">
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -14,7 +14,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="searchBar">
|
<div class="searchBar">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search...">
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search...">
|
||||||
</div>
|
</div>
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
<table class="table table-hover nowrap-cells">
|
<table class="table table-hover nowrap-cells">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
angular.module('portainer.app').controller('EndpointListController', [
|
angular.module('portainer.app').controller('EndpointListController', ['DatatableService',
|
||||||
function EndpointListController() {
|
function EndpointListController(DatatableService) {
|
||||||
var ctrl = this;
|
var ctrl = this;
|
||||||
ctrl.state = {
|
ctrl.state = {
|
||||||
textFilter: '',
|
textFilter: '',
|
||||||
|
@ -7,7 +7,7 @@ angular.module('portainer.app').controller('EndpointListController', [
|
||||||
};
|
};
|
||||||
|
|
||||||
ctrl.$onChanges = $onChanges;
|
ctrl.$onChanges = $onChanges;
|
||||||
ctrl.onFilterChanged = onFilterChanged;
|
ctrl.onTextFilterChange = onTextFilterChange;
|
||||||
|
|
||||||
function $onChanges(changesObj) {
|
function $onChanges(changesObj) {
|
||||||
handleEndpointsChange(changesObj.endpoints);
|
handleEndpointsChange(changesObj.endpoints);
|
||||||
|
@ -21,15 +21,16 @@ angular.module('portainer.app').controller('EndpointListController', [
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
onFilterChanged();
|
onTextFilterChange();
|
||||||
}
|
}
|
||||||
|
|
||||||
function onFilterChanged() {
|
function onTextFilterChange() {
|
||||||
var filterValue = ctrl.state.textFilter;
|
var filterValue = ctrl.state.textFilter;
|
||||||
ctrl.state.filteredEndpoints = filterEndpoints(
|
ctrl.state.filteredEndpoints = filterEndpoints(
|
||||||
ctrl.endpoints,
|
ctrl.endpoints,
|
||||||
filterValue
|
filterValue
|
||||||
);
|
);
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, filterValue);
|
||||||
}
|
}
|
||||||
|
|
||||||
function filterEndpoints(endpoints, filterValue) {
|
function filterEndpoints(endpoints, filterValue) {
|
||||||
|
@ -57,5 +58,13 @@ angular.module('portainer.app').controller('EndpointListController', [
|
||||||
function convertStatusToString(status) {
|
function convertStatusToString(status) {
|
||||||
return status === 1 ? 'up' : 'down';
|
return status === 1 ? 'up' : 'down';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.$onInit = function() {
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
onTextFilterChange();
|
||||||
|
}
|
||||||
|
};
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
|
@ -5,6 +5,7 @@ angular.module('portainer.app').component('endpointList', {
|
||||||
titleText: '@',
|
titleText: '@',
|
||||||
titleIcon: '@',
|
titleIcon: '@',
|
||||||
endpoints: '<',
|
endpoints: '<',
|
||||||
|
tableKey: '@',
|
||||||
dashboardAction: '<',
|
dashboardAction: '<',
|
||||||
snapshotAction: '<',
|
snapshotAction: '<',
|
||||||
showSnapshotAction: '<',
|
showSnapshotAction: '<',
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
type="text"
|
type="text"
|
||||||
class="searchInput"
|
class="searchInput"
|
||||||
ng-model="$ctrl.state.textFilter"
|
ng-model="$ctrl.state.textFilter"
|
||||||
ng-change="$ctrl.onFilterChanged()"
|
ng-change="$ctrl.onTextFilterChange()"
|
||||||
placeholder="Search by name, group, tag, status, URL..." auto-focus>
|
placeholder="Search by name, group, tag, status, URL..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<table class="table table-hover">
|
<table class="table table-hover">
|
||||||
<div class="col-sm-12">
|
<div class="col-sm-12">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search...">
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search...">
|
||||||
</div>
|
</div>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
|
|
|
@ -0,0 +1,56 @@
|
||||||
|
angular.module('portainer.app').controller('TemplateListController', ['DatatableService',
|
||||||
|
function TemplateListController(DatatableService) {
|
||||||
|
var ctrl = this;
|
||||||
|
|
||||||
|
this.state = {
|
||||||
|
textFilter: '',
|
||||||
|
selectedCategory: '',
|
||||||
|
categories: [],
|
||||||
|
showContainerTemplates: true
|
||||||
|
};
|
||||||
|
|
||||||
|
this.onTextFilterChange = function() {
|
||||||
|
DatatableService.setDataTableTextFilters(this.tableKey, this.state.textFilter);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateCategories = function() {
|
||||||
|
var availableCategories = [];
|
||||||
|
|
||||||
|
for (var i = 0; i < ctrl.templates.length; i++) {
|
||||||
|
var template = ctrl.templates[i];
|
||||||
|
if ((template.Type === 1 && ctrl.state.showContainerTemplates) || (template.Type === 2 && ctrl.showSwarmStacks) || (template.Type === 3 && !ctrl.showSwarmStacks)) {
|
||||||
|
availableCategories = availableCategories.concat(template.Categories);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.state.categories = _.sortBy(_.uniq(availableCategories));
|
||||||
|
};
|
||||||
|
|
||||||
|
this.filterByCategory = function(item) {
|
||||||
|
if (!ctrl.state.selectedCategory) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
return _.includes(item.Categories, ctrl.state.selectedCategory);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.filterByType = function(item) {
|
||||||
|
if ((item.Type === 1 && ctrl.state.showContainerTemplates) || (item.Type === 2 && ctrl.showSwarmStacks) || (item.Type === 3 && !ctrl.showSwarmStacks)) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.$onInit = function() {
|
||||||
|
if (this.showSwarmStacks) {
|
||||||
|
this.state.showContainerTemplates = false;
|
||||||
|
}
|
||||||
|
this.updateCategories();
|
||||||
|
|
||||||
|
var textFilter = DatatableService.getDataTableTextFilters(this.tableKey);
|
||||||
|
if (textFilter !== null) {
|
||||||
|
this.state.textFilter = textFilter;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
]);
|
|
@ -1,54 +1,11 @@
|
||||||
angular.module('portainer.app').component('templateList', {
|
angular.module('portainer.app').component('templateList', {
|
||||||
templateUrl: 'app/portainer/components/template-list/templateList.html',
|
templateUrl: 'app/portainer/components/template-list/templateList.html',
|
||||||
controller: function() {
|
controller: 'TemplateListController',
|
||||||
var ctrl = this;
|
|
||||||
|
|
||||||
this.state = {
|
|
||||||
textFilter: '',
|
|
||||||
selectedCategory: '',
|
|
||||||
categories: [],
|
|
||||||
showContainerTemplates: true
|
|
||||||
};
|
|
||||||
|
|
||||||
this.updateCategories = function() {
|
|
||||||
var availableCategories = [];
|
|
||||||
|
|
||||||
for (var i = 0; i < ctrl.templates.length; i++) {
|
|
||||||
var template = ctrl.templates[i];
|
|
||||||
if ((template.Type === 1 && ctrl.state.showContainerTemplates) || (template.Type === 2 && ctrl.showSwarmStacks) || (template.Type === 3 && !ctrl.showSwarmStacks)) {
|
|
||||||
availableCategories = availableCategories.concat(template.Categories);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
this.state.categories = _.sortBy(_.uniq(availableCategories));
|
|
||||||
};
|
|
||||||
|
|
||||||
this.filterByCategory = function(item) {
|
|
||||||
if (!ctrl.state.selectedCategory) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
return _.includes(item.Categories, ctrl.state.selectedCategory);
|
|
||||||
};
|
|
||||||
|
|
||||||
this.filterByType = function(item) {
|
|
||||||
if ((item.Type === 1 && ctrl.state.showContainerTemplates) || (item.Type === 2 && ctrl.showSwarmStacks) || (item.Type === 3 && !ctrl.showSwarmStacks)) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
};
|
|
||||||
|
|
||||||
this.$onInit = function() {
|
|
||||||
if (this.showSwarmStacks) {
|
|
||||||
this.state.showContainerTemplates = false;
|
|
||||||
}
|
|
||||||
this.updateCategories();
|
|
||||||
};
|
|
||||||
},
|
|
||||||
bindings: {
|
bindings: {
|
||||||
titleText: '@',
|
titleText: '@',
|
||||||
titleIcon: '@',
|
titleIcon: '@',
|
||||||
templates: '<',
|
templates: '<',
|
||||||
|
tableKey: '@',
|
||||||
selectAction: '<',
|
selectAction: '<',
|
||||||
deleteAction: '<',
|
deleteAction: '<',
|
||||||
showSwarmStacks: '<',
|
showSwarmStacks: '<',
|
||||||
|
|
|
@ -37,7 +37,7 @@
|
||||||
|
|
||||||
<div class="searchBar" style="border-top: 2px solid #f6f6f6;">
|
<div class="searchBar" style="border-top: 2px solid #f6f6f6;">
|
||||||
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
<i class="fa fa-search searchIcon" aria-hidden="true"></i>
|
||||||
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" placeholder="Search..." auto-focus>
|
<input type="text" class="searchInput" ng-model="$ctrl.state.textFilter" ng-change="$ctrl.onTextFilterChange()" placeholder="Search..." auto-focus>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="blocklist">
|
<div class="blocklist">
|
||||||
|
|
|
@ -13,6 +13,14 @@ function DatatableServiceFactory(LocalStorage) {
|
||||||
return LocalStorage.getDataTableSettings(key);
|
return LocalStorage.getDataTableSettings(key);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
service.setDataTableTextFilters = function(key, filters) {
|
||||||
|
LocalStorage.storeDataTableTextFilters(key, filters);
|
||||||
|
};
|
||||||
|
|
||||||
|
service.getDataTableTextFilters = function(key) {
|
||||||
|
return LocalStorage.getDataTableTextFilters(key);
|
||||||
|
};
|
||||||
|
|
||||||
service.setDataTableFilters = function(key, filters) {
|
service.setDataTableFilters = function(key, filters) {
|
||||||
LocalStorage.storeDataTableFilters(key, filters);
|
LocalStorage.storeDataTableFilters(key, filters);
|
||||||
};
|
};
|
||||||
|
|
|
@ -65,6 +65,12 @@ angular.module('portainer.app')
|
||||||
storeDataTableOrder: function(key, data) {
|
storeDataTableOrder: function(key, data) {
|
||||||
localStorageService.set('datatable_order_' + key, data);
|
localStorageService.set('datatable_order_' + key, data);
|
||||||
},
|
},
|
||||||
|
getDataTableTextFilters: function(key) {
|
||||||
|
return localStorageService.get('datatable_text_filter_' + key);
|
||||||
|
},
|
||||||
|
storeDataTableTextFilters: function(key, data) {
|
||||||
|
localStorageService.set('datatable_text_filter_' + key, data);
|
||||||
|
},
|
||||||
getDataTableFilters: function(key) {
|
getDataTableFilters: function(key) {
|
||||||
return localStorageService.get('datatable_filters_' + key);
|
return localStorageService.get('datatable_filters_' + key);
|
||||||
},
|
},
|
||||||
|
|
|
@ -40,7 +40,7 @@
|
||||||
<div class="col-sm-12">
|
<div class="col-sm-12">
|
||||||
<endpoint-list
|
<endpoint-list
|
||||||
title-text="Endpoints" title-icon="fa-plug"
|
title-text="Endpoints" title-icon="fa-plug"
|
||||||
endpoints="endpoints"
|
endpoints="endpoints" table-key="endpoints"
|
||||||
dashboard-action="goToDashboard"
|
dashboard-action="goToDashboard"
|
||||||
show-snapshot-action="!applicationState.application.authentication || isAdmin"
|
show-snapshot-action="!applicationState.application.authentication || isAdmin"
|
||||||
snapshot-action="triggerSnapshot"
|
snapshot-action="triggerSnapshot"
|
||||||
|
|
|
@ -350,7 +350,7 @@
|
||||||
<div class="col-sm-12">
|
<div class="col-sm-12">
|
||||||
<template-list ng-if="templates"
|
<template-list ng-if="templates"
|
||||||
title-text="Templates" title-icon="fa-rocket"
|
title-text="Templates" title-icon="fa-rocket"
|
||||||
templates="templates"
|
templates="templates" table-key="templates"
|
||||||
select-action="selectTemplate"
|
select-action="selectTemplate"
|
||||||
delete-action="deleteTemplate"
|
delete-action="deleteTemplate"
|
||||||
show-add-action="state.templateManagement && isAdmin"
|
show-add-action="state.templateManagement && isAdmin"
|
||||||
|
|
Loading…
Reference in New Issue