Misthios/grafana-zabbix
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

triggers panel: allow to set text color, closes #361

Browse Source
This commit is contained in:
Alexander Zobnin
2017-12-03 13:28:44 +03:00
parent 53d795d259
commit 4607da7c0d
9 changed files with 39 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
dist/panel-triggers/module.html → dist/panel-triggers/partials/module.html vendored
View File

@@ -49,23 +49,22 @@
</div> </div>
</td> </td>
<td ng-if="ctrl.panel.statusField" <td ng-if="ctrl.panel.statusField" class="zbx-field-colored"
class="zbx-field-colored" ng-style="{background: trigger.color, color: ctrl.panel.fontColor}">
style="background-color: {{trigger.color}};">
<div> <div>
{{ctrl.triggerStatusMap[trigger.value]}} {{ctrl.triggerStatusMap[trigger.value]}}
</div> </div>
</td> </td>
<td ng-if="ctrl.panel.severityField" <td ng-if="ctrl.panel.severityField" class="zbx-field-colored"
class="zbx-field-colored" ng-style="{background: trigger.color, color: ctrl.panel.fontColor}">
style="background-color: {{trigger.color}};">
<div> <div>
{{trigger.severity}} {{trigger.severity}}
</div> </div>
</td> </td>
<td class="zbx-field-colored" style="background-color: {{trigger.color}};"> <td class="zbx-field-colored"
ng-style="{background: trigger.color, color: ctrl.panel.fontColor}">
<div> <div>
{{trigger.description}} {{trigger.description}}
<a ng-if="trigger.comments" <a ng-if="trigger.comments"

13
dist/panel-triggers/partials/options_tab.html vendored
View File

@@ -104,6 +104,12 @@
ng-change="editor.panelCtrl.render()"></select> ng-change="editor.panelCtrl.render()"></select>
</div> </div>
</div> </div>
<div class="gf-form max-width-14">
<label class="gf-form-label width-8">Font color</label>
<span class="gf-form-label">
<spectrum-picker ng-model="editor.panel.fontColor" ng-change="editor.panelCtrl.refresh()"></spectrum-picker>
</span>
</div>
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-8">Page size</label> <label class="gf-form-label width-8">Page size</label>
<input class="gf-form-input width-6" <input class="gf-form-input width-6"
@@ -149,8 +155,7 @@
class="gf-form-input width-12" class="gf-form-input width-12"
empty-to-null empty-to-null
ng-model="trigger.severity" ng-model="trigger.severity"
style="color: white" ng-style="{background: trigger.color, color: editor.panel.fontColor}"
ng-style="{background: trigger.color}"
ng-model-onblur ng-model-onblur
ng-change="editor.panelCtrl.refresh()"> ng-change="editor.panelCtrl.refresh()">
<span class="gf-form-label"> <span class="gf-form-label">
@@ -169,7 +174,7 @@
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-3">&nbsp;</label> <label class="gf-form-label width-3">&nbsp;</label>
<label class="gf-form-input width-12" <label class="gf-form-input width-12"
ng-style="{background:editor.panel.ackEventColor}"> ng-style="{background:editor.panel.ackEventColor, color: editor.panel.fontColor}">
Acknowledged color Acknowledged color
</label> </label>
<span class="gf-form-label"> <span class="gf-form-label">
@@ -187,7 +192,7 @@
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-3">&nbsp;</label> <label class="gf-form-label width-3">&nbsp;</label>
<label class="gf-form-input width-12" <label class="gf-form-input width-12"
ng-style="{background:editor.panel.okEventColor}"> ng-style="{background:editor.panel.okEventColor, color: editor.panel.fontColor}">
OK event color OK event color
</label> </label>
<span class="gf-form-label"> <span class="gf-form-label">

2
dist/panel-triggers/specs/migrations.spec.js vendored
View File

@@ -60,6 +60,7 @@ describe('Triggers Panel schema migration', () => {
showEvents: { text: 'Problems', value: '1' }, showEvents: { text: 'Problems', value: '1' },
limit: 10, limit: 10,
fontSize: '100%', fontSize: '100%',
fontColor: null,
pageSize: 10, pageSize: 10,
scroll: true, scroll: true,
customLastChangeFormat: false, customLastChangeFormat: false,
@@ -95,6 +96,7 @@ describe('Triggers Panel schema migration', () => {
showEvents: { text: 'Problems', value: '1' }, showEvents: { text: 'Problems', value: '1' },
limit: 10, limit: 10,
fontSize: '100%', fontSize: '100%',
fontColor: null,
pageSize: 10, pageSize: 10,
scroll: true, scroll: true,
customLastChangeFormat: false, customLastChangeFormat: false,

3
dist/panel-triggers/triggers_panel_ctrl.js vendored
View File

@@ -118,6 +118,7 @@ System.register(['lodash', 'jquery', 'moment', '../datasource-zabbix/utils', 'ap
limit: 10, limit: 10,
// View options // View options
fontSize: '100%', fontSize: '100%',
fontColor: null,
pageSize: 10, pageSize: 10,
scroll: true, scroll: true,
customLastChangeFormat: false, customLastChangeFormat: false,
@@ -523,7 +524,7 @@ System.register(['lodash', 'jquery', 'moment', '../datasource-zabbix/utils', 'ap
_export('TriggerPanelCtrl', TriggerPanelCtrl); _export('TriggerPanelCtrl', TriggerPanelCtrl);
TriggerPanelCtrl.templateUrl = 'panel-triggers/module.html'; TriggerPanelCtrl.templateUrl = 'public/plugins/alexanderzobnin-zabbix-app/panel-triggers/partials/module.html';
} }
}; };
}); });

2
dist/panel-triggers/triggers_panel_ctrl.js.map vendored
View File

File diff suppressed because one or more lines are too long

13
src/panel-triggers/module.html → src/panel-triggers/partials/module.html
View File

@@ -49,23 +49,22 @@
</div> </div>
</td> </td>
<td ng-if="ctrl.panel.statusField" <td ng-if="ctrl.panel.statusField" class="zbx-field-colored"
class="zbx-field-colored" ng-style="{background: trigger.color, color: ctrl.panel.fontColor}">
style="background-color: {{trigger.color}};">
<div> <div>
{{ctrl.triggerStatusMap[trigger.value]}} {{ctrl.triggerStatusMap[trigger.value]}}
</div> </div>
</td> </td>
<td ng-if="ctrl.panel.severityField" <td ng-if="ctrl.panel.severityField" class="zbx-field-colored"
class="zbx-field-colored" ng-style="{background: trigger.color, color: ctrl.panel.fontColor}">
style="background-color: {{trigger.color}};">
<div> <div>
{{trigger.severity}} {{trigger.severity}}
</div> </div>
</td> </td>
<td class="zbx-field-colored" style="background-color: {{trigger.color}};"> <td class="zbx-field-colored"
ng-style="{background: trigger.color, color: ctrl.panel.fontColor}">
<div> <div>
{{trigger.description}} {{trigger.description}}
<a ng-if="trigger.comments" <a ng-if="trigger.comments"

13
src/panel-triggers/partials/options_tab.html
View File

@@ -104,6 +104,12 @@
ng-change="editor.panelCtrl.render()"></select> ng-change="editor.panelCtrl.render()"></select>
</div> </div>
</div> </div>
<div class="gf-form max-width-14">
<label class="gf-form-label width-8">Font color</label>
<span class="gf-form-label">
<spectrum-picker ng-model="editor.panel.fontColor" ng-change="editor.panelCtrl.refresh()"></spectrum-picker>
</span>
</div>
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-8">Page size</label> <label class="gf-form-label width-8">Page size</label>
<input class="gf-form-input width-6" <input class="gf-form-input width-6"
@@ -149,8 +155,7 @@
class="gf-form-input width-12" class="gf-form-input width-12"
empty-to-null empty-to-null
ng-model="trigger.severity" ng-model="trigger.severity"
style="color: white" ng-style="{background: trigger.color, color: editor.panel.fontColor}"
ng-style="{background: trigger.color}"
ng-model-onblur ng-model-onblur
ng-change="editor.panelCtrl.refresh()"> ng-change="editor.panelCtrl.refresh()">
<span class="gf-form-label"> <span class="gf-form-label">
@@ -169,7 +174,7 @@
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-3">&nbsp;</label> <label class="gf-form-label width-3">&nbsp;</label>
<label class="gf-form-input width-12" <label class="gf-form-input width-12"
ng-style="{background:editor.panel.ackEventColor}"> ng-style="{background:editor.panel.ackEventColor, color: editor.panel.fontColor}">
Acknowledged color Acknowledged color
</label> </label>
<span class="gf-form-label"> <span class="gf-form-label">
@@ -187,7 +192,7 @@
<div class="gf-form"> <div class="gf-form">
<label class="gf-form-label width-3">&nbsp;</label> <label class="gf-form-label width-3">&nbsp;</label>
<label class="gf-form-input width-12" <label class="gf-form-input width-12"
ng-style="{background:editor.panel.okEventColor}"> ng-style="{background:editor.panel.okEventColor, color: editor.panel.fontColor}">
OK event color OK event color
</label> </label>
<span class="gf-form-label"> <span class="gf-form-label">

2
src/panel-triggers/specs/migrations.spec.js
View File

@@ -60,6 +60,7 @@ describe('Triggers Panel schema migration', () => {
showEvents: { text: 'Problems', value: '1' }, showEvents: { text: 'Problems', value: '1' },
limit: 10, limit: 10,
fontSize: '100%', fontSize: '100%',
fontColor: null,
pageSize: 10, pageSize: 10,
scroll: true, scroll: true,
customLastChangeFormat: false, customLastChangeFormat: false,
@@ -95,6 +96,7 @@ describe('Triggers Panel schema migration', () => {
showEvents: { text: 'Problems', value: '1' }, showEvents: { text: 'Problems', value: '1' },
limit: 10, limit: 10,
fontSize: '100%', fontSize: '100%',
fontColor: null,
pageSize: 10, pageSize: 10,
scroll: true, scroll: true,
customLastChangeFormat: false, customLastChangeFormat: false,

3
src/panel-triggers/triggers_panel_ctrl.js
View File

@@ -46,6 +46,7 @@ const panelDefaults = {
limit: 10, limit: 10,
// View options // View options
fontSize: '100%', fontSize: '100%',
fontColor: null,
pageSize: 10, pageSize: 10,
scroll: true, scroll: true,
customLastChangeFormat: false, customLastChangeFormat: false,
@@ -422,7 +423,7 @@ export class TriggerPanelCtrl extends PanelCtrl {
} }
} }
TriggerPanelCtrl.templateUrl = 'panel-triggers/module.html'; TriggerPanelCtrl.templateUrl = 'public/plugins/alexanderzobnin-zabbix-app/panel-triggers/partials/module.html';
function filterTriggers(triggers, triggerFilter) { function filterTriggers(triggers, triggerFilter) {
if (utils.isRegex(triggerFilter)) { if (utils.isRegex(triggerFilter)) {