mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Merge pull request #11892 from ApsOps/colorize-singlestat-prefix-postfix-option
Make colorization of prefix and postfix optional in singlestat
This commit is contained in:
commit
8537f10285
@ -29,7 +29,7 @@
|
||||
<input type="text" class="gf-form-input width-12" ng-model="ctrl.panel.prefix" ng-change="ctrl.render()" ng-model-onblur>
|
||||
<label class="gf-form-label width-6">Font size</label>
|
||||
<div class="gf-form-select-wrapper">
|
||||
<select class="gf-form-input" ng-model="ctrl.panel.prefixFontSize" ng-options="f for f in ctrl.fontSizes" ng-change="ctrl.render()" ng-disabled="ctrl.canChangeFontSize()"></select>
|
||||
<select class="gf-form-input" ng-model="ctrl.panel.prefixFontSize" ng-options="f for f in ctrl.fontSizes" ng-change="ctrl.render()" ng-disabled="!ctrl.canModifyText()"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -39,7 +39,7 @@
|
||||
<input type="text" class="gf-form-input width-12" ng-model="ctrl.panel.postfix" ng-change="ctrl.render()" ng-model-onblur>
|
||||
<label class="gf-form-label width-6">Font size</label>
|
||||
<div class="gf-form-select-wrapper">
|
||||
<select class="input-small gf-form-input" ng-model="ctrl.panel.postfixFontSize" ng-options="f for f in ctrl.fontSizes" ng-change="ctrl.render()" ng-disabled="ctrl.canChangeFontSize()"></select>
|
||||
<select class="input-small gf-form-input" ng-model="ctrl.panel.postfixFontSize" ng-options="f for f in ctrl.fontSizes" ng-change="ctrl.render()" ng-disabled="!ctrl.canModifyText()"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
@ -58,6 +58,10 @@
|
||||
<gf-form-switch class="gf-form" label-class="width-8" label="Background" checked="ctrl.panel.colorBackground" on-change="ctrl.render()"></gf-form-switch>
|
||||
<gf-form-switch class="gf-form" label-class="width-4" label="Value" checked="ctrl.panel.colorValue" on-change="ctrl.render()"></gf-form-switch>
|
||||
</div>
|
||||
<div class="gf-form-inline">
|
||||
<gf-form-switch class="gf-form" label-class="width-6" label="Prefix" checked="ctrl.panel.colorPrefix" on-change="ctrl.render()" ng-disabled="!ctrl.canModifyText()"></gf-form-switch>
|
||||
<gf-form-switch class="gf-form" label-class="width-6" label="Postfix" checked="ctrl.panel.colorPostfix" on-change="ctrl.render()" ng-disabled="!ctrl.canModifyText()"></gf-form-switch>
|
||||
</div>
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form max-width-21">
|
||||
<label class="gf-form-label width-8">Thresholds
|
||||
|
@ -198,8 +198,8 @@ class SingleStatCtrl extends MetricsPanelCtrl {
|
||||
this.setValueMapping(data);
|
||||
}
|
||||
|
||||
canChangeFontSize() {
|
||||
return this.panel.gauge.show;
|
||||
canModifyText() {
|
||||
return !this.panel.gauge.show;
|
||||
}
|
||||
|
||||
setColoring(options) {
|
||||
@ -405,10 +405,6 @@ class SingleStatCtrl extends MetricsPanelCtrl {
|
||||
elem = elem.find('.singlestat-panel');
|
||||
|
||||
function applyColoringThresholds(value, valueString) {
|
||||
if (!panel.colorValue) {
|
||||
return valueString;
|
||||
}
|
||||
|
||||
var color = getColorForValue(data, value);
|
||||
if (color) {
|
||||
return '<span style="color:' + color + '">' + valueString + '</span>';
|
||||
@ -426,15 +422,24 @@ class SingleStatCtrl extends MetricsPanelCtrl {
|
||||
var body = '<div class="singlestat-panel-value-container">';
|
||||
|
||||
if (panel.prefix) {
|
||||
var prefix = applyColoringThresholds(data.value, panel.prefix);
|
||||
var prefix = panel.prefix;
|
||||
if (panel.colorPrefix) {
|
||||
prefix = applyColoringThresholds(data.value, panel.prefix);
|
||||
}
|
||||
body += getSpan('singlestat-panel-prefix', panel.prefixFontSize, prefix);
|
||||
}
|
||||
|
||||
var value = applyColoringThresholds(data.value, data.valueFormatted);
|
||||
var value = data.valueFormatted;
|
||||
if (panel.colorValue) {
|
||||
value = applyColoringThresholds(data.value, value);
|
||||
}
|
||||
body += getSpan('singlestat-panel-value', panel.valueFontSize, value);
|
||||
|
||||
if (panel.postfix) {
|
||||
var postfix = applyColoringThresholds(data.value, panel.postfix);
|
||||
var postfix = panel.postfix;
|
||||
if (panel.colorPostfix) {
|
||||
postfix = applyColoringThresholds(data.value, panel.postfix);
|
||||
}
|
||||
body += getSpan('singlestat-panel-postfix', panel.postfixFontSize, postfix);
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user