mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
100 lines
3.5 KiB
HTML
100 lines
3.5 KiB
HTML
<div ng-controller="AnnotationsEditorCtrl">
|
|
<div class="tabbed-view-header">
|
|
<h2 class="tabbed-view-title">
|
|
Annotations
|
|
</h2>
|
|
|
|
<ul class="gf-tabs">
|
|
<li class="gf-tabs-item" >
|
|
<a class="gf-tabs-link" ng-click="ctrl.mode = 'list';" ng-class="{active: ctrl.mode === 'list'}">
|
|
List
|
|
</a>
|
|
</li>
|
|
<li class="gf-tabs-item" ng-show="ctrl.mode === 'edit'">
|
|
<a class="gf-tabs-link" ng-class="{active: ctrl.mode === 'edit'}">
|
|
{{currentAnnotation.name}}
|
|
</a>
|
|
</li>
|
|
<li class="gf-tabs-item" ng-show="ctrl.mode === 'new'">
|
|
<span class="active gf-tabs-link">New</span>
|
|
</li>
|
|
</ul>
|
|
|
|
<button class="tabbed-view-close-btn" ng-click="dismiss();">
|
|
<i class="fa fa-remove"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="tabbed-view-body">
|
|
<div class="editor-row row" ng-if="ctrl.mode === 'list'">
|
|
<div ng-if="ctrl.annotations.length === 0">
|
|
<em>No annotations defined</em>
|
|
</div>
|
|
<table class="grafana-options-table">
|
|
<tr ng-repeat="annotation in ctrl.annotations">
|
|
<td style="width:90%">
|
|
<i class="fa fa-bolt" style="color:{{annotation.iconColor}}"></i>
|
|
{{annotation.name}}
|
|
</td>
|
|
<td style="width: 1%"><i ng-click="_.move(ctrl.annotations,$index,$index-1)" ng-hide="$first" class="pointer fa fa-arrow-up"></i></td>
|
|
<td style="width: 1%"><i ng-click="_.move(ctrl.annotations,$index,$index+1)" ng-hide="$last" class="pointer fa fa-arrow-down"></i></td>
|
|
|
|
<td style="width: 1%">
|
|
<a ng-click="edit(annotation)" class="btn btn-inverse btn-mini">
|
|
<i class="fa fa-edit"></i>
|
|
Edit
|
|
</a>
|
|
</td>
|
|
<td style="width: 1%">
|
|
<a ng-click="ctrl.removeAnnotation(annotation)" class="btn btn-danger btn-mini">
|
|
<i class="fa fa-remove"></i>
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="gf-form" ng-show="ctrl.mode === 'list'">
|
|
<div class="gf-form-button-row">
|
|
<a type="button" class="btn gf-form-button btn-success" ng-click="ctrl.mode = 'new';"><i class="fa fa-plus" ></i> New</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="annotations-basic-settings" ng-if="ctrl.mode === 'edit' || ctrl.mode === 'new'">
|
|
<div class="gf-form-group">
|
|
<div class="gf-form-inline">
|
|
<div class="gf-form gf-size-max-xxl">
|
|
<span class="gf-form-label">Name</span>
|
|
<input type="text" class="gf-form-input" ng-model='ctrl.currentAnnotation.name' placeholder="name"></input>
|
|
</div>
|
|
<div class="gf-form">
|
|
<span class="gf-form-label max-width-10">Datasource</span>
|
|
<div class="gf-form-select-wrapper">
|
|
<select class="gf-form-input gf-size-auto" ng-model="ctrl.currentAnnotation.datasource" ng-options="f.name as f.name for f in ctrl.datasources" ng-change="ctrl.datasourceChanged()"></select>
|
|
</div>
|
|
</div>
|
|
<div class="gf-form">
|
|
<label class="gf-form-label">
|
|
<span>Color</span>
|
|
</label>
|
|
<spectrum-picker class="gf-form-input" ng-model="ctrl.currentAnnotation.iconColor"></spectrum-picker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<rebuild-on-change property="ctrl.currentDatasource">
|
|
<plugin-component type="annotations-query-ctrl">
|
|
</plugin-component>
|
|
</rebuild-on-change>
|
|
|
|
<div class="gf-form">
|
|
<div class="gf-form-button-row p-y-0">
|
|
<button ng-show="ctrl.mode === 'new'" type="button" class="btn gf-form-button btn-success" ng-click="ctrl.add()">Add</button>
|
|
<button ng-show="ctrl.mode === 'edit'" type="button" class="btn btn-success pull-left" ng-click="ctrl.update()">Update</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|