Query editor UI fixes.

This commit is contained in:
Alexander Zobnin
2015-05-16 19:17:36 +03:00
parent b9ee409dc4
commit 7b5f056d18
2 changed files with 68 additions and 86 deletions

View File

@@ -1,9 +1,10 @@
<div ng-include="httpConfigPartialSrc"></div>
<br>
<h5>Zabbix API details</h5>
<div class="tight-form last">
<div class="tight-form">
<ul class="tight-form-list">
<li class="tight-form-item" style="width: 80px">
User

View File

@@ -1,11 +1,12 @@
<div class="editor-row">
<div ng-repeat="target in panel.targets"
class="grafana-target"
ng-class="{'grafana-target-hidden': target.hide}"
class="tight-form-container"
ng-class="{'tight-form-disabled': target.hide}"
ng-controller="ZabbixAPIQueryCtrl"
ng-init="init()">
<div class="tight-form">
<ul class="tight-form-list pull-right">
<li class="tight-form-item">
<div class="dropdown">
@@ -15,24 +16,9 @@
<i class="fa fa-bars"></i>
</a>
<ul class="dropdown-menu pull-right" role="menu">
<li role="menuitem">
<a tabindex="1"
ng-click="duplicate()">
Duplicate
</a>
</li>
<li role="menuitem">
<a tabindex="1"
ng-click="moveMetricQuery($index, $index-1)">
Move up
</a>
</li>
<li role="menuitem">
<a tabindex="1"
ng-click="moveMetricQuery($index, $index+1)">
Move down
</a>
</li>
<li role="menuitem"><a tabindex="1" ng-click="duplicate()">Duplicate</a></li>
<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index-1)">Move up</a></li>
<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index+1)">Move down</a></li>
</ul>
</div>
</li>
@@ -44,6 +30,9 @@
</ul>
<ul class="tight-form-list">
<li class="tight-form-item" style="min-width: 15px; text-align: center">
{{targetLetters[$index]}}
</li>
<li>
<a class="tight-form-item"
ng-click="target.hide = !target.hide; get_data();"
@@ -53,28 +42,20 @@
</li>
</ul>
<!-- <ul class="grafana-segment-list">
<li class="grafana-target-segment" style="min-width: 15px; text-align: center">
{{targetLetters[$index]}}
</li>
<li>
<a class="grafana-target-segment"
ng-click="target.hide = !target.hide; targetBlur();"
role="menuitem">
<i class="icon-eye-open"></i>
</a>
</li>
</ul> -->
<ul class="tight-form-list" role="menu">
<li class="tight-form-item">
<input type="text" class="input-medium grafana-target-text-input" ng-model="target.alias"
spellcheck='false' placeholder="alias" ng-blur="targetBlur()">
<!-- Alias -->
<li>
<input type="text"
class="tight-form-input input-large"
ng-model="target.alias"
spellcheck='false'
placeholder="alias"
ng-blur="targetBlur()">
</li>
<!-- Select Host Group -->
<li class="tight-form-item">
<li>
<select style="width: 10em"
class=""
class="tight-form-input input-small"
ng-change="selectHostGroup()"
ng-model="target.hostGroup"
bs-tooltip="target.hostGroup.name.length > 25 ? target.hostGroup.name : ''"
@@ -84,13 +65,13 @@
<a bs-tooltip="target.errors.metric"
style="color: rgb(229, 189, 28)"
ng-show="target.errors.metric">
<i class="icon-warning-sign"></i>
<i class="fa fa-warning"></i>
</a>
</li>
<!-- Select Host -->
<li class="tight-form-item">
<li>
<select style="width: 15em"
class=""
class="tight-form-input input-medium"
ng-change="selectHost()"
ng-model="target.host"
bs-tooltip="target.host.name.length > 25 ? target.host.name : ''"
@@ -104,9 +85,9 @@
</a>
</li>
<!-- Select Application -->
<li class="tight-form-item">
<select style="width: 10em"
class="input-medium grafana-target-segment-input"
<li>
<select style="width: 12em"
class="tight-form-input input-medium"
ng-change="selectApplication()"
ng-model="target.application"
bs-tooltip="target.application.name.length > 15 ? target.application.name : ''"
@@ -120,9 +101,9 @@
</a>
</li>
<!-- Select Item -->
<li class="tight-form-item">
<select style="width: 20em"
class="input-medium grafana-target-segment-input"
<li>
<select style="width: 25em"
class="tight-form-input input-medium"
ng-change="selectItem()"
ng-model="target.item"
bs-tooltip="target.expandedName.length > 30 ? target.expandedName : ''"
@@ -138,6 +119,6 @@
</ul>
<div class="clearfix"></div>
</div>
</div>
</div>