mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Merge pull request #16079 from grafana/fix/threshold-custom-color
Fix threshold editor color picker not working for custom colors
This commit is contained in:
commit
f69f0c2c31
@ -216,12 +216,6 @@ export class ThresholdManager {
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case 'custom': {
|
case 'custom': {
|
||||||
if (!threshold.fillColor) {
|
|
||||||
threshold.fillColor = 'rgba(255, 255, 255, 1)';
|
|
||||||
}
|
|
||||||
if (!threshold.lineColor) {
|
|
||||||
threshold.lineColor = 'rgba(255, 255, 255, 0)';
|
|
||||||
}
|
|
||||||
fillColor = threshold.fillColor;
|
fillColor = threshold.fillColor;
|
||||||
lineColor = threshold.lineColor;
|
lineColor = threshold.lineColor;
|
||||||
break;
|
break;
|
||||||
|
@ -23,7 +23,7 @@
|
|||||||
<label class="gf-form-label">Color</label>
|
<label class="gf-form-label">Color</label>
|
||||||
<div class="gf-form-select-wrapper">
|
<div class="gf-form-select-wrapper">
|
||||||
<select class="gf-form-input" ng-model="threshold.colorMode"
|
<select class="gf-form-input" ng-model="threshold.colorMode"
|
||||||
ng-options="f for f in ['custom', 'critical', 'warning', 'ok']" ng-change="ctrl.render()" ng-disabled="ctrl.disabled">
|
ng-options="f for f in ['custom', 'critical', 'warning', 'ok']" ng-change="ctrl.onThresholdTypeChange($index)" ng-disabled="ctrl.disabled">
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import coreModule from 'app/core/core_module';
|
import coreModule from 'app/core/core_module';
|
||||||
|
import config from 'app/core/config';
|
||||||
|
import tinycolor from 'tinycolor2';
|
||||||
export class ThresholdFormCtrl {
|
export class ThresholdFormCtrl {
|
||||||
panelCtrl: any;
|
panelCtrl: any;
|
||||||
panel: any;
|
panel: any;
|
||||||
@ -56,6 +57,19 @@ export class ThresholdFormCtrl {
|
|||||||
this.render();
|
this.render();
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onThresholdTypeChange(index) {
|
||||||
|
// Because of the ng-model binding, threshold's color mode is already set here
|
||||||
|
if (this.panel.thresholds[index].colorMode === 'custom') {
|
||||||
|
this.panel.thresholds[index].fillColor = tinycolor(config.theme.colors.blueBase)
|
||||||
|
.setAlpha(0.2)
|
||||||
|
.toRgbString();
|
||||||
|
this.panel.thresholds[index].lineColor = tinycolor(config.theme.colors.blueShade)
|
||||||
|
.setAlpha(0.6)
|
||||||
|
.toRgbString();
|
||||||
|
}
|
||||||
|
this.panelCtrl.render();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
coreModule.directive('graphThresholdForm', () => {
|
coreModule.directive('graphThresholdForm', () => {
|
||||||
|
Loading…
Reference in New Issue
Block a user