* Click on a message template in right column - searches for it

* Show more button - to list out more/all message templates
* Get the variant style dropdown to work & display example queries
This commit is contained in:
Warren Buckley
2018-09-10 11:23:48 +01:00
parent c7bff0f9ff
commit 53bdef68f4
2 changed files with 43 additions and 13 deletions

View File

@@ -62,6 +62,7 @@
vm.logItems = {};
vm.numberOfErrors = 0;
vm.commonLogMessages = [];
vm.commonLogMessagesCount = 10;
vm.logOptions = {};
vm.logOptions.orderDirection = 'Descending';
@@ -110,6 +111,8 @@
vm.getFilterName = getFilterName;
vm.setLogLevelFilter = setLogLevelFilter;
vm.toggleOrderBy = toggleOrderBy;
vm.findMessageTemplate = findMessageTemplate;
vm.selectSearch = selectSearch;
function init() {
@@ -225,6 +228,21 @@
getLogs();
}
function findMessageTemplate(template){
//Update search box input
vm.logOptions.filterExpression = "@MessageTemplate='" + template.MessageTemplate + "'";
search();
}
function selectSearch(searchItem){
//Update search box input
vm.logOptions.filterExpression = searchItem.query;
vm.dropdownOpen = false;
search();
}
init();
}

View File

@@ -56,9 +56,29 @@
</umb-editor-sub-header>
<umb-editor-sub-header>
<umb-editor-sub-header-content-left style="width:calc(100% - 350px - 20px); position:relative;">
<!-- Search/expression filter -->
<input class="form-control search-input" type="text" ng-model="vm.logOptions.filterExpression" style="width:100%;" />
<umb-editor-sub-header-content-left style="width:calc(100% - 350px - 20px);">
<div style="position:relative; width:100%;">
<!-- Search/expression filter -->
<input class="form-control search-input" type="text" ng-model="vm.logOptions.filterExpression" style="width:100%;" />
<a class="umb-variant-switcher__toggle ng-scope" href="" ng-click="vm.dropdownOpen = !vm.dropdownOpen" style="top:0;">
<span class="ng-binding">Example Searches</span>
<ins class="umb-variant-switcher__expand icon-navigation-down" ng-class="{'icon-navigation-down': !vm.dropdownOpen, 'icon-navigation-up': vm.dropdownOpen}">&nbsp;</ins>
</a>
<!-- Common Searches Dropdown -->
<umb-dropdown ng-if="vm.dropdownOpen" style="width: 100%; max-height: 250px; overflow-y: scroll; margin-top: -10px;" on-close="vm.dropdownOpen = false" umb-keyboard-list>
<umb-dropdown-item class="umb-variant-switcher__item" ng-class="{'umb-variant-switcher_item--current': variant.active}" ng-repeat="search in vm.searches">
<a href="" class="umb-variant-switcher__name-wrapper" ng-click="vm.selectSearch(search)" prevent-default>
<span class="umb-variant-switcher__name">{{search.name}}</span>
<span>{{ search.query }}</span>
</a>
</umb-dropdown-item>
</umb-dropdown>
</div>
<!-- Search Button -->
<umb-button
button-style="button"
type="button"
@@ -66,15 +86,6 @@
label-key="general_search">
</umb-button>
<umb-dropdown ng-if="vm.something" style="width: 100%; max-height: 250px; overflow-y: scroll; margin-top: -10px;" on-close="vm.dropdownOpen = false" umb-keyboard-list>
<umb-dropdown-item class="umb-variant-switcher__item" ng-class="{'umb-variant-switcher_item--current': variant.active}" ng-repeat="search in vm.searches">
<a href="" class="umb-variant-switcher__name-wrapper" ng-click="selectVariant($event, search)" prevent-default>
<span class="umb-variant-switcher__name">{{search.name}}</span>
<span>{{ search.query }}</span>
</a>
</umb-dropdown-item>
</umb-dropdown>
</umb-editor-sub-header-content-left>
</umb-editor-sub-header>
@@ -180,7 +191,7 @@
<em>Total Unique Message types</em>: {{ vm.commonLogMessages.length }}
<table class="table table-hover">
<tbody>
<tr ng-repeat="template in vm.commonLogMessages | limitTo:10">
<tr ng-repeat="template in vm.commonLogMessages | limitTo:vm.commonLogMessagesCount" ng-click="vm.findMessageTemplate(template)" style="cursor: pointer;">
<td>
{{ template.MessageTemplate }}
</td>
@@ -190,6 +201,7 @@
</tr>
</tbody>
</table>
<a class="btn btn-primary" ng-if="vm.commonLogMessagesCount < vm.commonLogMessages.length" ng-click="vm.commonLogMessagesCount = vm.commonLogMessagesCount +10">Show More</a>
</umb-box-content>
</umb-box>
</div>