IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat(export): export will add templatize constant variables

Browse Source
This commit is contained in:
Torkel Ödegaard 2016-05-28 20:27:44 +02:00
parent 53bb264375
commit c8965d0f9a
4 changed files with 102 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
public/app/features/dashboard/export/exporter.ts
View File

@ -91,6 +91,26 @@ export class DashboardExporter {
inputs.push(value); inputs.push(value);
}); });
// templatize constants
for (let variable of dash.templating.list) {
if (variable.type === 'constant') {
var refName = 'VAR_' + variable.name.replace(' ', '_').toUpperCase();
inputs.push({
name: refName,
type: 'constant',
label: variable.label || variable.name,
value: variable.current.value,
description: '',
});
// update current and option
variable.query = '${' + refName + '}';
variable.options[0] = variable.current = {
value: variable.query,
text: variable.query,
};
}
}
requires = _.map(requires, req => { requires = _.map(requires, req => {
return req; return req;
}); });

104
public/app/features/dashboard/import/dash_import.html
View File

@ -49,12 +49,13 @@
</div> </div>
</div> </div>
<div ng-if="ctrl.step === 2"> <div ng-if="ctrl.step === 2">
<h3 class="section-heading" ng-if="ctrl.dash.gnetId"> <div class="gf-form-group" ng-if="ctrl.dash.gnetId">
Importing Dashboard from <h3 class="section-heading">
<a href="https://grafana.net/dashboards/{{ctrl.dash.gnetId}}" class="external-link" target="_blank">Grafana.net</a> Importing Dashboard from
</h3> <a href="https://grafana.net/dashboards/{{ctrl.dash.gnetId}}" class="external-link" target="_blank">Grafana.net</a>
<div class="gf-form-group"> </h3>
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-15">Published by</label> <label class="gf-form-label width-15">Published by</label>
<label class="gf-form-label width-15">{{ctrl.gnetInfo.orgName}}</label> <label class="gf-form-label width-15">{{ctrl.gnetInfo.orgName}}</label>
@ -65,62 +66,65 @@
</div> </div>
</div> </div>
<h3 class="section-heading"> <h3 class="section-heading">
Options Options
</h3> </h3>
<div class="gf-form-group"> <div class="gf-form-group">
<div class="gf-form-inline"> <div class="gf-form-inline">
<div class="gf-form gf-form--grow"> <div class="gf-form gf-form--grow">
<label class="gf-form-label width-15">Name</label> <label class="gf-form-label width-15">Name</label>
<input type="text" class="gf-form-input" ng-model="ctrl.dash.title" give-focus="true" ng-change="ctrl.titleChanged()" ng-class="{'validation-error': ctrl.nameExists}"> <input type="text" class="gf-form-input" ng-model="ctrl.dash.title" give-focus="true" ng-change="ctrl.titleChanged()" ng-class="{'validation-error': ctrl.nameExists}">
<label class="gf-form-label text-success" ng-if="!ctrl.nameExists"> <label class="gf-form-label text-success" ng-if="!ctrl.nameExists">
<i class="fa fa-check"></i> <i class="fa fa-check"></i>
</label> </label>
</div> </div>
</div> </div>
<div class="gf-form-inline" ng-if="ctrl.nameExists"> <div class="gf-form-inline" ng-if="ctrl.nameExists">
<div class="gf-form offset-width-15 gf-form--grow"> <div class="gf-form offset-width-15 gf-form--grow">
<label class="gf-form-label text-warning gf-form-label--grow"> <label class="gf-form-label text-warning gf-form-label--grow">
<i class="fa fa-warning"></i> <i class="fa fa-warning"></i>
A Dashboard with the same name already exists A Dashboard with the same name already exists
</label> </label>
</div> </div>
</div> </div>
<div ng-repeat="input in ctrl.inputs"> <div ng-repeat="input in ctrl.inputs">
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-15"> <label class="gf-form-label width-15">
{{input.label}} {{input.label}}
<info-popover mode="right-normal"> <info-popover mode="right-normal">
{{input.info}} {{input.info}}
</info-popover> </info-popover>
</label> </label>
<div class="gf-form-select-wrapper" style="width: 100%"> <!-- Data source input -->
<select class="gf-form-input" ng-model="input.value" ng-options="v.value as v.text for v in input.options" ng-change="ctrl.inputValueChanged()"> <div class="gf-form-select-wrapper" style="width: 100%" ng-if="input.type === 'datasource'">
<select class="gf-form-input" ng-model="input.value" ng-options="v.value as v.text for v in input.options" ng-change="ctrl.inputValueChanged()">
<option value="" ng-hide="input.value">{{input.info}}</option> <option value="" ng-hide="input.value">{{input.info}}</option>
</select> </select>
</div> </div>
<label class="gf-form-label text-success" ng-show="input.value"> <!-- Constant input -->
<i class="fa fa-check"></i> <input ng-if="input.type === 'constant'" type="text" class="gf-form-input" ng-model="input.value" placeholder="{{input.default}}" ng-change="ctrl.inputValueChanged()">
</label> <label class="gf-form-label text-success" ng-show="input.value">
</div> <i class="fa fa-check"></i>
</div> </label>
</div> </div>
</div>
</div>
<div class="gf-form-button-row"> <div class="gf-form-button-row">
<button type="button" class="btn gf-form-btn btn-success width-10" ng-click="ctrl.saveDashboard()" ng-hide="ctrl.nameExists" ng-disabled="!ctrl.inputsValid"> <button type="button" class="btn gf-form-btn btn-success width-10" ng-click="ctrl.saveDashboard()" ng-hide="ctrl.nameExists" ng-disabled="!ctrl.inputsValid">
<i class="fa fa-save"></i> Save &amp; Open <i class="fa fa-save"></i> Save &amp; Open
</button> </button>
<button type="button" class="btn gf-form-btn btn-danger width-10" ng-click="ctrl.saveDashboard()" ng-show="ctrl.nameExists" ng-disabled="!ctrl.inputsValid"> <button type="button" class="btn gf-form-btn btn-danger width-10" ng-click="ctrl.saveDashboard()" ng-show="ctrl.nameExists" ng-disabled="!ctrl.inputsValid">
<i class="fa fa-save"></i> Overwrite &amp; Open <i class="fa fa-save"></i> Overwrite &amp; Open
</button> </button>
<a class="btn btn-link" ng-click="dismiss()">Cancel</a> <a class="btn btn-link" ng-click="dismiss()">Cancel</a>
<a class="btn btn-link" ng-click="ctrl.back()">Back</a> <a class="btn btn-link" ng-click="ctrl.back()">Back</a>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

7
public/app/features/dashboard/import/dash_import.ts
View File

@ -41,7 +41,8 @@ export class DashImportCtrl {
var inputModel = { var inputModel = {
name: input.name, name: input.name,
label: input.label, label: input.label,
description: input.description, info: input.description,
value: input.value,
type: input.type, type: input.type,
pluginId: input.pluginId, pluginId: input.pluginId,
options: [] options: []
@ -49,6 +50,8 @@ export class DashImportCtrl {
if (input.type === 'datasource') { if (input.type === 'datasource') {
this.setDatasourceOptions(input, inputModel); this.setDatasourceOptions(input, inputModel);
} else if (!inputModel.info) {
inputModel.info = 'Specify a string constant';
} }
this.inputs.push(inputModel); this.inputs.push(inputModel);
@ -65,7 +68,7 @@ export class DashImportCtrl {
}); });
if (sources.length === 0) { if (sources.length === 0) {
inputModel.error = "No data sources of type " + input.pluginName + " found"; inputModel.info = "No data sources of type " + input.pluginName + " found";
} else if (inputModel.description) { } else if (inputModel.description) {
inputModel.info = inputModel.description; inputModel.info = inputModel.description;
} else { } else {

23
public/app/features/dashboard/specs/exporter_specs.ts
View File

@ -26,6 +26,13 @@ describe('given dashboard with repeated panels', function() {
options: [{value: 'Asd', text: 'Asd'}] options: [{value: 'Asd', text: 'Asd'}]
}); });
dash.templating.list.push({
name: 'prefix',
type: 'constant',
current: {value: 'collectd', text: 'collectd'},
options: []
});
dash.annotations.list.push({ dash.annotations.list.push({
name: 'logs', name: 'logs',
datasource: 'gfdb', datasource: 'gfdb',
@ -115,5 +122,21 @@ describe('given dashboard with repeated panels', function() {
expect(require.version).to.be("3.0.2"); expect(require.version).to.be("3.0.2");
}); });
it('should add constant template variables as inputs', function() {
var input = _.findWhere(exported.__inputs, {name: 'VAR_PREFIX'});
expect(input.type).to.be("constant");
expect(input.label).to.be("prefix");
expect(input.value).to.be("collectd");
});
it('should templatize constant variables', function() {
var variable = _.findWhere(exported.templating.list, {name: 'prefix'});
expect(variable.query).to.be("${VAR_PREFIX}");
expect(variable.current.text).to.be("${VAR_PREFIX}");
expect(variable.current.value).to.be("${VAR_PREFIX}");
expect(variable.options[0].text).to.be("${VAR_PREFIX}");
expect(variable.options[0].value).to.be("${VAR_PREFIX}");
});
}); });