read initial values from URI and provide permanent link
This commit is contained in:
@@ -19,6 +19,10 @@ textarea {
|
|||||||
font-size:1.2em;
|
font-size:1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.permalink, .permalink:hover, .permalink:active, .permalink:visited {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: 'FontAwesome';
|
font-family: 'FontAwesome';
|
||||||
|
|||||||
@@ -443,6 +443,30 @@ Vue.component('search-bar', {
|
|||||||
getJson(url, request, successCallback, error);
|
getJson(url, request, successCallback, error);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
permalink: function() {
|
||||||
|
|
||||||
|
var groupBy = [];
|
||||||
|
data.searchBar.groupByKeys.forEach(function(e){ if (e.selected) {groupBy.push(e.selected);}});
|
||||||
|
|
||||||
|
var params = {
|
||||||
|
'query': data.searchBar.query,
|
||||||
|
'groupBy': groupBy,
|
||||||
|
'splitByKeys.selected': data.searchBar.splitByKeys.selected,
|
||||||
|
'limitBy.selected': data.searchBar.limitBy.selected,
|
||||||
|
'limitBy.number': data.searchBar.limitBy.number,
|
||||||
|
'dateFrom': data.searchBar.dateFrom,
|
||||||
|
'dateRange': data.searchBar.dateRange,
|
||||||
|
'axisScale': data.searchBar.axisScale,
|
||||||
|
'plotType': data.searchBar.plotType,
|
||||||
|
'showAggregate': data.searchBar.showAggregate,
|
||||||
|
'keyOutside': data.searchBar.keyOutside,
|
||||||
|
};
|
||||||
|
|
||||||
|
var link = window.location.origin+ window.location.pathname + "?" + jQuery.param( params );
|
||||||
|
return link;
|
||||||
|
}
|
||||||
|
},
|
||||||
template: `
|
template: `
|
||||||
<form id="search-bar" v-on:submit.prevent.stop>
|
<form id="search-bar" v-on:submit.prevent.stop>
|
||||||
<search-bar-query v-bind="{ 'searchBar': searchBar }"></search-bar-query>
|
<search-bar-query v-bind="{ 'searchBar': searchBar }"></search-bar-query>
|
||||||
@@ -554,6 +578,7 @@ Vue.component('search-bar', {
|
|||||||
v-on:click.prevent.stop="dashboard"
|
v-on:click.prevent.stop="dashboard"
|
||||||
><i class="fa fa-object-group" aria-hidden="true"></i> Dashboard</button>
|
><i class="fa fa-object-group" aria-hidden="true"></i> Dashboard</button>
|
||||||
-->
|
-->
|
||||||
|
<a v-bind:href="permalink" title="Permanent Link" class="permalink"><i class="fa fa-link" aria-hidden="true"></i></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>`
|
</form>`
|
||||||
@@ -572,10 +597,12 @@ var rootView = new Vue({
|
|||||||
|
|
||||||
response.forEach( (item, index) => { options.push({text: item, value: item}); } );
|
response.forEach( (item, index) => { options.push({text: item, value: item}); } );
|
||||||
|
|
||||||
|
const groupByDefaults = GetURLParameterArray('groupBy');
|
||||||
|
|
||||||
for (var i = 0; i < 3; i++){
|
for (var i = 0; i < 3; i++){
|
||||||
self.searchBar.groupByKeys.push({
|
self.searchBar.groupByKeys.push({
|
||||||
'id': i,
|
'id': i,
|
||||||
'selected': '',
|
'selected': groupByDefaults[i] ? groupByDefaults[i] : '',
|
||||||
'options': options
|
'options': options
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -596,23 +623,23 @@ initInvaders('result-image');
|
|||||||
var data = {
|
var data = {
|
||||||
|
|
||||||
searchBar: {
|
searchBar: {
|
||||||
query: 'pod=vapfinra01 and method = ViewService.findFieldViewGroup',
|
query: GetURLParameter('query', 'pod=vapfinra01 and method = ViewService.findFieldViewGroup'),
|
||||||
proposals: [],
|
proposals: [],
|
||||||
groupByKeys: [],
|
groupByKeys: [],
|
||||||
splitByKeys: {
|
splitByKeys: {
|
||||||
'selected': 'method',
|
'selected': GetURLParameter('splitByKeys.selected','method'),
|
||||||
'options': []
|
'options': []
|
||||||
},
|
},
|
||||||
limitBy: {
|
limitBy: {
|
||||||
'selected': 'NO_LIMIT',
|
'selected': GetURLParameter('limitBy.selected','NO_LIMIT'),
|
||||||
'number': 10
|
'number': GetURLParameter('limitBy.number',10)
|
||||||
},
|
},
|
||||||
dateFrom: Date.now().add({ days: -7 }).toString("yyyy-MM-dd HH:mm:ss"), // '2018-01-05 09:03:00'
|
dateFrom: GetURLParameter('dateFrom', Date.now().add({ days: -7 }).toString("yyyy-MM-dd HH:mm:ss")), // '2018-01-05 09:03:00'
|
||||||
dateRange: '1 week',
|
dateRange: GetURLParameter('dateRange','1 week'),
|
||||||
axisScale: 'LOG10',
|
axisScale: GetURLParameter('axisScale','LOG10'),
|
||||||
plotType: 'SCATTER',
|
plotType: GetURLParameter('plotType','SCATTER'),
|
||||||
showAggregate: 'NONE',
|
showAggregate: GetURLParameter('showAggregate','NONE'),
|
||||||
keyOutside: false,
|
keyOutside: GetURLParameterBoolean('keyOutside', 'false'),
|
||||||
|
|
||||||
splitBy: {
|
splitBy: {
|
||||||
field: '',
|
field: '',
|
||||||
@@ -742,5 +769,38 @@ function getJson(url, requestData, successCallback, errorCallback) {
|
|||||||
.fail(errorCallback);
|
.fail(errorCallback);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function GetURLParameter(paramName, defaultValue)
|
||||||
|
{
|
||||||
|
var pageURL = window.location.search.substring(1);
|
||||||
|
var URLVariables = pageURL.split('&');
|
||||||
|
for (var i = 0; i < URLVariables.length; i++)
|
||||||
|
{
|
||||||
|
var keyValue = URLVariables[i].split('=');
|
||||||
|
if (keyValue[0] == paramName)
|
||||||
|
{
|
||||||
|
return decodeURIComponent(keyValue[1]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return defaultValue;
|
||||||
|
}
|
||||||
|
|
||||||
|
function GetURLParameterArray(paramName)
|
||||||
|
{
|
||||||
|
var result = [];
|
||||||
|
var pageURL = window.location.search.substring(1);
|
||||||
|
var URLVariables = pageURL.split('&');
|
||||||
|
for (var i = 0; i < URLVariables.length; i++)
|
||||||
|
{
|
||||||
|
var keyValue = URLVariables[i].split('=');
|
||||||
|
if (decodeURIComponent(keyValue[0]) == paramName+"[]")
|
||||||
|
{
|
||||||
|
result.push(decodeURIComponent(keyValue[1]));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
function GetURLParameterBoolean(paramName, defaultValue){
|
||||||
|
return GetURLParameter(paramName, defaultValue) == 'true';
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user