mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
ux(): worked more on new tabs view
This commit is contained in:
commit
7207068181
@ -64,20 +64,12 @@ func NewReverseProxy(ds *m.DataSource, proxyPath string, targetUrl *url.URL) *ht
|
||||
return &httputil.ReverseProxy{Director: director}
|
||||
}
|
||||
|
||||
var dsMap map[int64]*m.DataSource = make(map[int64]*m.DataSource)
|
||||
|
||||
func getDatasource(id int64, orgId int64) (*m.DataSource, error) {
|
||||
// ds, exists := dsMap[id]
|
||||
// if exists && ds.OrgId == orgId {
|
||||
// return ds, nil
|
||||
// }
|
||||
|
||||
query := m.GetDataSourceByIdQuery{Id: id, OrgId: orgId}
|
||||
if err := bus.Dispatch(&query); err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
dsMap[id] = &query.Result
|
||||
return &query.Result, nil
|
||||
}
|
||||
|
||||
|
@ -12,6 +12,8 @@ export class DashNavCtrl {
|
||||
$scope.init = function() {
|
||||
$scope.onAppEvent('save-dashboard', $scope.saveDashboard);
|
||||
$scope.onAppEvent('delete-dashboard', $scope.deleteDashboard);
|
||||
$scope.onAppEvent('export-dashboard', $scope.snapshot);
|
||||
$scope.onAppEvent('quick-snapshot', $scope.quickSnapshot);
|
||||
|
||||
$scope.showSettingsMenu = $scope.dashboardMeta.canEdit || $scope.contextSrv.isEditor;
|
||||
|
||||
@ -52,6 +54,10 @@ export class DashNavCtrl {
|
||||
});
|
||||
};
|
||||
|
||||
$scope.quickSnapshot = function() {
|
||||
$scope.shareDashboard(1);
|
||||
};
|
||||
|
||||
$scope.openSearch = function() {
|
||||
$scope.appEvent('show-dash-search');
|
||||
};
|
||||
|
@ -60,6 +60,14 @@ function(angular, $) {
|
||||
scope.appEvent('zoom-out', evt);
|
||||
}, { inputDisabled: true });
|
||||
|
||||
keyboardManager.bind('ctrl+e', function(evt) {
|
||||
scope.appEvent('export-dashboard', evt);
|
||||
}, { inputDisabled: true });
|
||||
|
||||
keyboardManager.bind('ctrl+i', function(evt) {
|
||||
scope.appEvent('quick-snapshot', evt);
|
||||
}, { inputDisabled: true });
|
||||
|
||||
keyboardManager.bind('esc', function() {
|
||||
var popups = $('.popover.in');
|
||||
if (popups.length > 0) {
|
||||
|
@ -1,21 +1,21 @@
|
||||
<div ng-controller="GraphiteImportCtrl" ng-init="init()">
|
||||
|
||||
<div ng-if="datasources.length > 0">
|
||||
<h2 style="margin-top: 30px;">Load dashboard from Graphite-Web</h2>
|
||||
<h2 class="page-heading">Load dashboard from Graphite-Web</h2>
|
||||
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-10">Data source</span>
|
||||
</div>
|
||||
<div class="gf-form width-30">
|
||||
<div class="gf-form">
|
||||
<div class="gf-form-select-wrapper">
|
||||
<select type="text" ng-model="options.sourceName" class="gf-form-input max-width-10" ng-options="f for f in datasources">
|
||||
<select type="text" ng-model="options.sourceName" class="gf-form-input gf-size-auto" ng-options="f for f in datasources">
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<button class="btn btn-inverse pull-right" ng-click="listAll()">List dashboards</button>
|
||||
<button class="btn btn-success pull-right" ng-click="listAll()">List dashboards</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -35,53 +35,30 @@
|
||||
|
||||
<div ng-include src="'shareLinkOptions.html'"></div>
|
||||
|
||||
<div class="gf-form">
|
||||
<div class="gf-form-row">
|
||||
<span class="gf-fluid-input">
|
||||
<textarea rows="5" data-share-panel-url class="input" ng-model='iframeHtml'></textarea>
|
||||
</span>
|
||||
<div class="gf-form-group position-center">
|
||||
<div class="gf-form width-30" >
|
||||
<textarea rows="5" data-share-panel-url class="gf-form-input width-30" ng-model='iframeHtml'></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form position-center">
|
||||
<button class="btn btn-inverse" data-clipboard-text="{{iframeHtml}}" clipboard-button><i class="fa fa-clipboard"></i> Copy</button>
|
||||
</div>
|
||||
<button class="btn btn-inverse" data-clipboard-text="{{iframeHtml}}" clipboard-button><i class="fa fa-clipboard"></i> Copy</button>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/ng-template" id="shareLinkOptions.html">
|
||||
<div class="editor-row" style="margin: 11px 20px 33px 20px">
|
||||
<div class="section">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 170px;">
|
||||
<label class="checkbox-label" for="options.forCurrent">Current time range</label>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<input class="cr1" id="options.forCurrent" type="checkbox" ng-model="options.forCurrent" ng-checked="options.forCurrent" ng-change="buildUrl()">
|
||||
<label for="options.forCurrent" class="cr1"></label>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 170px">
|
||||
<label class="checkbox-label" for="options.includeTemplateVars">Include template variables</label>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<input class="cr1" id="options.includeTemplateVars" type="checkbox" ng-model="options.includeTemplateVars" ng-checked="options.includeTemplateVars" ng-change="buildUrl()">
|
||||
<label for="options.includeTemplateVars" class="cr1"></label>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 170px">
|
||||
Theme
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-small tight-form-input last" style="width: 211px" ng-model="options.theme" ng-options="f as f for f in ['current', 'dark', 'light']" ng-change="buildUrl()"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form-group position-center">
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Current time range" model="options.forCurrent" change="updated()"></editor-checkbox>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Include template variables" model="options.includeTemplateVars" change="updated()"></editor-checkbox>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label">Theme</span>
|
||||
<div class="gf-form-select-wrapper max-width-10">
|
||||
<select class="gf-form-input" ng-model="options.theme" ng-options="f as f for f in ['current', 'dark', 'light']" ng-change="buildUrl()"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -93,14 +70,19 @@
|
||||
</div>
|
||||
|
||||
<div ng-include src="'shareLinkOptions.html'"></div>
|
||||
<div class="gf-form">
|
||||
<div class="gf-form-row">
|
||||
<button class="btn btn-inverse pull-right" data-clipboard-text="{{shareUrl}}" clipboard-button><i class="fa fa-clipboard"></i> Copy</button>
|
||||
<span class="gf-fluid-input">
|
||||
<input type="text" data-share-panel-url class="input" ng-model='shareUrl'></input>
|
||||
</span>
|
||||
<div class="gf-form-group position-center">
|
||||
<div class="gf-form-inline">
|
||||
|
||||
<div class="gf-form width-30">
|
||||
<input type="text" data-share-panel-url class="gf-form-input" ng-model="shareUrl"></input>
|
||||
</div>
|
||||
<div class="gf-form pull-right">
|
||||
<button class="btn btn-inverse pull-right" data-clipboard-text="{{shareUrl}}" clipboard-button><i class="fa fa-clipboard"></i> Copy</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="editor-row" style="margin-top: 5px;" ng-show="modeSharePanel">
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form position-center" ng-show="modeSharePanel">
|
||||
<a href="{{imageUrl}}" target="_blank"><i class="fa fa-camera"></i> Direct link rendered image</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -132,57 +114,44 @@
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="editor-row share-modal-options" style="">
|
||||
<div class="section" ng-if="step === 1">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 110px;">
|
||||
Snapshot name
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" ng-model="snapshot.name" class="input-large tight-form-input last" >
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 110px">
|
||||
Expire
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-small tight-form-input last" style="width: 211px" ng-model="snapshot.expires" ng-options="f.value as f.text for f in expireOptions"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form-group share-modal-options position-center">
|
||||
<div class="gf-form" ng-if="step === 1">
|
||||
<span class="gf-form-label width-12">Snapshot name</span>
|
||||
<input type="text" ng-model="snapshot.name" class="gf-form-input max-width-15" >
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-12">Expire</span>
|
||||
<div class="gf-form-select-wrapper max-width-15">
|
||||
<select class="gf-form-input" ng-model="snapshot.expires" ng-options="f.value as f.text for f in expireOptions"></select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="gf-form" ng-if="step === 2" style="margin-top: 40px">
|
||||
<div class="gf-form-row">
|
||||
<a href="{{snapshotUrl}}" class="large share-snapshot-link" target="_blank">
|
||||
<i class="fa fa-external-link-square"></i>
|
||||
{{snapshotUrl}}
|
||||
</a>
|
||||
<br>
|
||||
<button class="btn btn-inverse btn-large" data-clipboard-text="{{snapshotUrl}}" clipboard-button><i class="fa fa-clipboard"></i> Copy Link</button>
|
||||
<div class="gf-form" ng-if="step === 2" style="margin-top: 40px">
|
||||
<div class="gf-form-row">
|
||||
<a href="{{snapshotUrl}}" class="large share-snapshot-link" target="_blank">
|
||||
<i class="fa fa-external-link-square"></i>
|
||||
{{snapshotUrl}}
|
||||
</a>
|
||||
<br>
|
||||
<button class="btn btn-inverse btn-large" data-clipboard-text="{{snapshotUrl}}" clipboard-button><i class="fa fa-clipboard"></i> Copy Link</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="step === 1">
|
||||
<button class="btn btn-success btn-large" ng-click="createSnapshot()" ng-disabled="loading">
|
||||
<i class="fa fa-save"></i>
|
||||
Local Snapshot
|
||||
</button>
|
||||
<button class="btn btn-primary btn-large" ng-if="externalEnabled" ng-click="createSnapshot(true)" ng-disabled="loading">
|
||||
<i class="fa fa-cloud-upload"></i>
|
||||
{{sharingButtonText}}
|
||||
</button>
|
||||
</div>
|
||||
<div ng-if="step === 1" class="gf-form-buttons-row">
|
||||
<button class="btn btn-success btn-large" ng-click="createSnapshot()" ng-disabled="loading">
|
||||
<i class="fa fa-save"></i>
|
||||
Local Snapshot
|
||||
</button>
|
||||
<button class="btn btn-primary btn-large" ng-if="externalEnabled" ng-click="createSnapshot(true)" ng-disabled="loading">
|
||||
<i class="fa fa-cloud-upload"></i>
|
||||
{{sharingButtonText}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="pull-right" ng-if="step === 2" style="padding: 5px">
|
||||
Did you make a mistake? <a class="pointer" ng-click="deleteSnapshot()" target="_blank">delete snapshot.</a>
|
||||
<div class="pull-right" ng-if="step === 2" style="padding: 5px">
|
||||
Did you make a mistake? <a class="pointer" ng-click="deleteSnapshot()" target="_blank">delete snapshot.</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -1,30 +1,27 @@
|
||||
<div class="submenu-controls">
|
||||
<div class="tight-form borderless">
|
||||
<ul ng-if="ctrl.dashboard.templating.list.length > 0">
|
||||
<li ng-repeat="variable in ctrl.variables" class="submenu-item">
|
||||
<span class="submenu-item-label template-variable " ng-show="!variable.hideLabel">
|
||||
{{variable.label || variable.name}}:
|
||||
</span>
|
||||
<value-select-dropdown variable="variable" on-updated="ctrl.variableUpdated(variable)" get-values-for-tag="ctrl.getValuesForTag(variable, tagKey)"></value-select-dropdown>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="tight-form-list" ng-if="ctrl.dashboard.templating.list.length > 0">
|
||||
<li ng-repeat="variable in ctrl.variables" class="submenu-item">
|
||||
<span class="template-variable tight-form-item" ng-show="!variable.hideLabel" style="padding-right: 5px">
|
||||
{{variable.label || variable.name}}:
|
||||
</span>
|
||||
<value-select-dropdown variable="variable" on-updated="ctrl.variableUpdated(variable)" get-values-for-tag="ctrl.getValuesForTag(variable, tagKey)"></value-select-dropdown>
|
||||
</li>
|
||||
</ul>
|
||||
<ul ng-if="ctrl.dashboard.annotations.list.length > 0">
|
||||
<li ng-repeat="annotation in ctrl.dashboard.annotations.list" class="submenu-item annotation-segment" ng-class="{'annotation-disabled': !annotation.enable}">
|
||||
<a ng-click="ctrl.disableAnnotation(annotation)">
|
||||
<i class="fa fa-bolt" style="color:{{annotation.iconColor}}"></i>
|
||||
{{annotation.name}}
|
||||
<input class="cr1" id="hideYAxis" type="checkbox" ng-model="annotation.enable" ng-checked="annotation.enable">
|
||||
<label for="hideYAxis" class="cr1"></label>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="tight-form-list" ng-if="ctrl.dashboard.annotations.list.length > 0">
|
||||
<li ng-repeat="annotation in ctrl.dashboard.annotations.list" class="submenu-item annotation-segment" ng-class="{'annotation-disabled': !annotation.enable}">
|
||||
<a ng-click="ctrl.disableAnnotation(annotation)">
|
||||
<i class="fa fa-bolt" style="color:{{annotation.iconColor}}"></i>
|
||||
{{annotation.name}}
|
||||
<input class="cr1" id="hideYAxis" type="checkbox" ng-model="annotation.enable" ng-checked="annotation.enable">
|
||||
<label for="hideYAxis" class="cr1"></label>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="pull-right" ng-if="ctrl.dashboard.links.length > 0">
|
||||
<dash-links-container links="ctrl.dashboard.links"></dash-links-container>
|
||||
</ul>
|
||||
|
||||
<ul class="tight-form-list pull-right" ng-if="ctrl.dashboard.links.length > 0">
|
||||
<dash-links-container links="ctrl.dashboard.links"></dash-links-container>
|
||||
</ul>
|
||||
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
|
@ -1,37 +1,15 @@
|
||||
<div class="editor-row">
|
||||
<div class="section">
|
||||
<div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 118px">
|
||||
Auto-refresh
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-xlarge tight-form-input last" style="width: 450px" ng-model="ctrl.panel.refresh_intervals" array-join>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 118px">
|
||||
Now delay
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
now-
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-mini tight-form-input last"
|
||||
ng-model="ctrl.panel.nowDelay" placeholder="0m"
|
||||
valid-time-span
|
||||
bs-tooltip="'Enter 1m to ignore the last minute (because it can contain incomplete metrics)'"
|
||||
data-placement="right">
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-10">Auto-refresh</span>
|
||||
<input type="text" class="gf-form-input max-width-25" ng-model="ctrl.panel.refresh_intervals" array-join>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-10">Now delay now-</span>
|
||||
<input type="text" class="gf-form-input max-width-25"
|
||||
ng-model="ctrl.panel.nowDelay" placeholder="0m"
|
||||
valid-time-span
|
||||
bs-tooltip="'Enter 1m to ignore the last minute (because it can contain incomplete metrics)'"
|
||||
data-placement="right">
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,90 +1,82 @@
|
||||
<div class="editor-row">
|
||||
<h5>Links and Dash Navigation</h5>
|
||||
<h5 class="page-heading">Links and Dash Navigation</h5>
|
||||
|
||||
<div ng-repeat="link in dashboard.links" style="margin-top: 10px;">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list pull-right">
|
||||
<li class="tight-form-item">
|
||||
<i ng-click="moveLink($index, -1)" ng-hide="$first" class="pointer fa fa-arrow-up"></i>
|
||||
<i ng-click="moveLink($index, 1)" ng-hide="$last" class="pointer fa fa-fw fa-arrow-down"></i>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<i class="fa fa-remove pointer" ng-click="deleteLink($index)"></i>
|
||||
</li>
|
||||
</ul>
|
||||
<div ng-repeat="link in dashboard.links">
|
||||
<div class="gf-form-group" style="/*background: #292929; border-bottom: 2px solid #1f1d1d; padding: 10px; margin-bottom: 5px;*/">
|
||||
<div class="gf-form-inline pull-right">
|
||||
<div class="gf-form-buttons-row">
|
||||
<button class="btn btn-inverse btn-mini" ng-hide="$first"><i ng-click="moveLink($index, -1)" class="fa fa-arrow-up"></i></button>
|
||||
<button class="btn btn-inverse btn-mini" ng-hide="$last"><i ng-click="moveLink($index, 1)" class="fa fa-arrow-down"></i></button>
|
||||
<button class="btn btn-inverse btn-mini"><i class="fa fa-remove" ng-click="deleteLink($index)"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 20px">
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form width-2">
|
||||
<i class="fa fa-fw fa-unlink"></i>
|
||||
</li>
|
||||
</div>
|
||||
|
||||
<li class="tight-form-item">Type</li>
|
||||
<li>
|
||||
<select class="input-medium tight-form-input" style="width: 150px;" ng-model="link.type" ng-options="f for f in ['dashboards','link']" ng-change="updated()"></select>
|
||||
</li>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-6">Type</span>
|
||||
<div class="gf-form-select-wrapper width-10">
|
||||
<select class="gf-form-input" ng-model="link.type" ng-options="f for f in ['dashboards','link']" ng-change="updated()"></select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<li class="tight-form-item" ng-show="link.type === 'dashboards'">With tags</li>
|
||||
<li ng-show="link.type === 'dashboards'">
|
||||
<bootstrap-tagsinput ng-model="link.tags" tagclass="label label-tag" placeholder="add tags">
|
||||
</bootstrap-tagsinput>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'dashboards'">
|
||||
<div class="gf-form" ng-show="link.type === 'dashboards'">
|
||||
<span class="gf-form-label">With tags</span>
|
||||
<bootstrap-tagsinput ng-model="link.tags" tagclass="label label-tag" placeholder="add tags"></bootstrap-tagsinput>
|
||||
</div>
|
||||
|
||||
<div class="gf-form" ng-show="link.type === 'dashboards' && link.asDropdown">
|
||||
<span class="gf-form-label width-6">Title</span>
|
||||
<input type="text" ng-model="link.title" class="gf-form-input max-width-10" ng-model-onblur ng-change="updated()">
|
||||
</div>
|
||||
|
||||
<div class="gf-form" ng-show="link.type === 'dashboards'">
|
||||
<editor-checkbox text="As dropdown" model="link.asDropdown" change="updated()"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'dashboards' && link.asDropdown">
|
||||
Title
|
||||
</li>
|
||||
<li ng-show="link.type === 'dashboards' && link.asDropdown">
|
||||
<input type="text" ng-model="link.title" class="input-medium tight-form-input" ng-model-onblur ng-change="updated()">
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'link'" style="width: 51px">Url</li>
|
||||
<li ng-show="link.type === 'link'">
|
||||
<input type="text" ng-model="link.url" class="input-xlarge tight-form-input" style="width: 302px;" ng-model-onblur ng-change="updated()">
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'link'">
|
||||
</div>
|
||||
|
||||
<div class="gf-form" ng-show="link.type === 'link'">
|
||||
<li class="gf-form-label width-6">Url</li>
|
||||
<input type="text" ng-model="link.url" class="gf-form-input max-width-10" ng-model-onblur ng-change="updated()">
|
||||
<editor-checkbox text="Open in new tab " model="link.targetBlank" change="updated()"></editor-checkbox>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form" ng-if="link.type === 'link'">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 20px">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="gf-form-inline" ng-show="link.type === 'link'">
|
||||
<div class="gf-form width-2">
|
||||
<i class="fa fa-fw fa-unlink invisible"></i>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'link'" style="width: 31px">Title</li>
|
||||
<li ng-show="link.type === 'link'">
|
||||
<input type="text" ng-model="link.title" class="input-medium tight-form-input" ng-model-onblur ng-change="updated()">
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'link'" style="width: 51px">Tooltip</li>
|
||||
<li ng-show="link.type === 'link'">
|
||||
<input type="text" ng-model="link.tooltip" class="input-medium tight-form-input" style="width: 151px" placeholder="Open dashboard" ng-model-onblur ng-change="updated()">
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="link.type === 'link'">Icon</li>
|
||||
<li ng-show="link.type === 'link'">
|
||||
<select class="input-medium tight-form-input" style="width: 110px;" ng-model="link.icon" ng-options="k as k for (k, v) in iconMap" ng-change="updated()"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 20px">
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-6">Title</span>
|
||||
<input type="text" ng-model="link.title" class="gf-form-input max-width-10" ng-model-onblur ng-change="updated()">
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-6">Tooltip</span>
|
||||
<input type="text" ng-model="link.tooltip" class="gf-form-input max-width-10" placeholder="Open dashboard" ng-model-onblur ng-change="updated()">
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-6">Icon</span>
|
||||
<div class="gf-form-select-wrapper max-width-10">
|
||||
<select class="gf-form-input" ng-model="link.icon" ng-options="k as k for (k, v) in iconMap" ng-change="updated()"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form width-1">
|
||||
<i class="fa fa-fw fa-unlink invisible"></i>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Keep current time range" model="link.keepTime" change="updated()"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<editor-checkbox text="Add current variable values" model="link.includeVars" change="updated()"></editor-checkbox>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="editor-row">
|
||||
<br>
|
||||
<button class="btn btn-inverse" ng-click="addLink()"><i class="fa fa-plus"></i> Add link</button>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-inverse" ng-click="addLink()"><i class="fa fa-plus"></i> Add link</button>
|
||||
|
@ -10,23 +10,16 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="gf-box-body" style="min-height: 0px;">
|
||||
<div class="gf-box-body">
|
||||
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item">
|
||||
<strong>Key</strong>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
{{key}}
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label">Key</span>
|
||||
<span class="gf-form-label">{{key}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<div class="grafana-info-box" style="text-align: left">
|
||||
<div class="grafana-info-box" style="border: 0;">
|
||||
You will only be able to view this key here once! It is not stored in this form. So be sure to copy it now.
|
||||
<br>
|
||||
<br>
|
||||
|
@ -6,24 +6,16 @@
|
||||
|
||||
<h2 style="margin-top: 30px;">Add Organization</h2>
|
||||
|
||||
<form name="form">
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px;">
|
||||
<strong>Org. name</strong>
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" ng-model="newOrg.name" required class="input-xxlarge tight-form-input last" placeholder="organization name">
|
||||
</li>
|
||||
<li>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<form name="form" class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-10">Org. name</span>
|
||||
<input type="text" ng-model="newOrg.name" required class="gf-form-input" placeholder="organization name">
|
||||
</div>
|
||||
<br>
|
||||
<button class="btn btn-success pull-right" ng-click="createOrg()">Create</button>
|
||||
<div class="gf-form-buttons-row">
|
||||
<button class="btn btn-success pull-right" ng-click="createOrg()">Create</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -28,7 +28,7 @@ var panelTemplate = `
|
||||
</div>
|
||||
|
||||
<div class="panel-full-edit" ng-if="ctrl.editMode">
|
||||
<div class="tabbed-view">
|
||||
<div class="tabbed-view tabbed-view--panel-edit">
|
||||
<div class="tabbed-view-header">
|
||||
<h2 class="tabbed-view-title">
|
||||
<i ng-class="ctrl.icon"></i>
|
||||
@ -44,7 +44,7 @@ var panelTemplate = `
|
||||
</ul>
|
||||
|
||||
<button class="tabbed-view-close-btn" ng-click="ctrl.exitFullscreen();">
|
||||
Back to dashboard
|
||||
<i class="fa fa-remove"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
@ -1,59 +1,34 @@
|
||||
<div class="editor-row">
|
||||
<div class="section tight-form-container" style="margin-bottom: 20px">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item tight-form-item-icon">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 178px">
|
||||
<strong>Override relative time</strong>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 50px">
|
||||
Last
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-small tight-form-input last" placeholder="1h"
|
||||
empty-to-null ng-model="ctrl.panel.timeFrom" valid-time-span
|
||||
ng-change="ctrl.refresh()" ng-model-onblur>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item tight-form-item-icon">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 178px">
|
||||
<strong>Add time shift</strong>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 50px">
|
||||
Amount
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-small tight-form-input last" placeholder="1h"
|
||||
empty-to-null ng-model="ctrl.panel.timeShift" valid-time-span
|
||||
ng-change="ctrl.refresh()" ng-model-onblur>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item tight-form-item-icon">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 178px">
|
||||
<strong>Hide time override info</strong>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<input class="cr1" id="ctrl.panel.hideTimeOverride" type="checkbox"
|
||||
ng-model="ctrl.panel.hideTimeOverride" ng-checked="ctrl.panel.hideTimeOverride" ng-change="ctrl.refresh()">
|
||||
<label for="ctrl.panel.hideTimeOverride" class="cr1"></label>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</span>
|
||||
|
||||
<span class="gf-form-label width-12">Override relative time</span>
|
||||
<span class="gf-form-label width-6">Last</span>
|
||||
|
||||
<input type="text" class="gf-form-input max-width-8" placeholder="1h"
|
||||
empty-to-null ng-model="ctrl.panel.timeFrom" valid-time-span
|
||||
ng-change="ctrl.refresh()" ng-model-onblur>
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</span>
|
||||
<span class="gf-form-label width-12">Add time shift</span>
|
||||
<span class="gf-form-label width-6">Amount</span>
|
||||
<input type="text" class="gf-form-input max-width-8" placeholder="1h"
|
||||
empty-to-null ng-model="ctrl.panel.timeShift" valid-time-span
|
||||
ng-change="ctrl.refresh()" ng-model-onblur>
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</span>
|
||||
<editor-checkbox text="Hide time override info" model="ctrl.panel.hideTimeOverride" change="ctrl.refresh()"></editor-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
@ -1,84 +1,67 @@
|
||||
<div class="editor-row">
|
||||
<div class="section">
|
||||
<h5>Drilldown / detail link<tip>These links appear in the dropdown menu in the panel menu. </tip></h5>
|
||||
<h5 class="section-heading">
|
||||
Drilldown / detail link<tip>These links appear in the dropdown menu in the panel menu. </tip></h5>
|
||||
</h5>
|
||||
|
||||
<div ng-repeat="link in panel.links" style="margin-top: 20px;">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list pull-right">
|
||||
<li class="tight-form-item">
|
||||
<i ng-click="moveLink($index, -1)" ng-hide="$first" class="pointer fa fa-arrow-up"></i>
|
||||
<i ng-click="moveLink($index, 1)" ng-hide="$last" class="pointer fa fa-fw fa-arrow-down"></i>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<i class="fa fa-remove pointer" ng-click="deleteLink(link)"></i>
|
||||
</li>
|
||||
</ul>
|
||||
<div ng-repeat="link in panel.links" style="margin-top: 20px;">
|
||||
<div class="gf-form-group">
|
||||
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 20px">
|
||||
<i class="fa fa-fw fa-unlink"></i>
|
||||
</li>
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form width-2">
|
||||
<i class="fa fa-fw fa-unlink"></i>
|
||||
</div>
|
||||
|
||||
<li class="tight-form-item">Type</li>
|
||||
<li>
|
||||
<select class="input-medium tight-form-input" style="width: 150px;" ng-model="link.type" ng-options="f for f in ['dashboard','absolute']"></select>
|
||||
</li>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Type</span>
|
||||
<div class="gf-form-select-wrapper width-14">
|
||||
<select class="gf-form-input" ng-model="link.type" ng-options="f for f in ['dashboard','absolute']"></select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<li class="tight-form-item" ng-show="link.type === 'dashboard'" style="width: 73px;">Dashboard</li>
|
||||
<li ng-show="link.type === 'dashboard'">
|
||||
<input type="text" ng-model="link.dashboard" bs-typeahead="searchDashboards" class="input-large tight-form-input" ng-blur="dashboardChanged(link)">
|
||||
</li>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7" ng-show="link.type === 'dashboard'">Dashboard</span>
|
||||
<input ng-show="link.type === 'dashboard'" type="text" ng-model="link.dashboard" bs-typeahead="searchDashboards" class="gf-form-input max-width-14" ng-blur="dashboardChanged(link)">
|
||||
|
||||
<li class="tight-form-item" ng-show="link.type === 'absolute'" style="width: 73px;">Url</li>
|
||||
<li ng-show="link.type === 'absolute'">
|
||||
<input type="text" ng-model="link.url" class="input-large tight-form-input">
|
||||
</li>
|
||||
<span class="gf-form-label width-7" ng-show="link.type === 'absolute'">Url</span>
|
||||
<input ng-show="link.type === 'absolute'" type="text" ng-model="link.url" class="gf-form-input max-width-14">
|
||||
</div>
|
||||
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form">
|
||||
<button class="btn-inverse gf-form-btn btn-small" ng-click="deleteLink(link)"><i class="fa fa-trash"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 20px">
|
||||
<i class="fa fa-fw fa-unlink invisible"></i>
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 31px">Title</li>
|
||||
<li>
|
||||
<input type="text" ng-model="link.title" class="input-medium tight-form-input">
|
||||
</li>
|
||||
<li class="tight-form-item" style="width: 73px;">
|
||||
Url params
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" ng-model="link.params" class="input-large tight-form-input">
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form width-2">
|
||||
<i class="fa fa-fw fa-unlink invisible"></i>
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<div class="gf-form-label width-7">Title</div>
|
||||
<input type="text" ng-model="link.title" class="gf-form-input">
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Url params</span>
|
||||
<input type="text" ng-model="link.params" class="gf-form-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 20px">
|
||||
<i class="fa fa-fw fa-unlink invisible"></i>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<editor-checkbox text="Keep current time range" model="link.keepTime"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
<editor-checkbox text="Add current variable values" model="link.includeVars"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<editor-checkbox text="Open in new tab " model="link.targetBlank"></editor-checkbox>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form width-2">
|
||||
<i class="fa fa-fw fa-unlink invisible"></i>
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Keep current time range" model="link.keepTime"></editor-checkbox>
|
||||
<editor-checkbox text="Add current variable values" model="link.includeVars"></editor-checkbox>
|
||||
<editor-checkbox text="Open in new tab " model="link.targetBlank"></editor-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-row">
|
||||
<br>
|
||||
<button class="btn btn-inverse" ng-click="addLink()"><i class="fa fa-plus"></i> Add link</button>
|
||||
</div>
|
||||
|
@ -52,6 +52,5 @@ function (angular, _) {
|
||||
$scope.deleteLink = function(link) {
|
||||
$scope.panel.links = _.without($scope.panel.links, link);
|
||||
};
|
||||
|
||||
});
|
||||
});
|
||||
|
@ -2,39 +2,39 @@
|
||||
</navbar>
|
||||
|
||||
<div class="page-container">
|
||||
<div class="page-wide">
|
||||
|
||||
<div class="page-header">
|
||||
<h1>Available snapshots</h1>
|
||||
|
||||
<table class="filter-table" style="margin-top: 20px">
|
||||
<thead>
|
||||
<th><strong>Name</strong></th>
|
||||
<th><strong>Snapshot url</strong></th>
|
||||
<th style="width: 70px"></th>
|
||||
<th style="width: 25px"></th>
|
||||
|
||||
</thead>
|
||||
|
||||
<tr ng-repeat="snapshot in ctrl.snapshots">
|
||||
<td>
|
||||
<a href="dashboard/snapshot/{{snapshot.key}}">{{snapshot.name}}</a>
|
||||
</td>
|
||||
<td >
|
||||
<a href="dashboard/snapshot/{{snapshot.key}}">dashboard/snapshot/{{snapshot.key}}</a>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<a href="dashboard/snapshot/{{snapshot.key}}" class="btn btn-inverse btn-mini">
|
||||
<i class="fa fa-eye"></i>
|
||||
View
|
||||
</a>
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<a ng-click="ctrl.removeSnapshot(snapshot)" class="btn btn-danger btn-mini">
|
||||
<i class="fa fa-remove"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<table class="filter-table" style="margin-top: 20px">
|
||||
<thead>
|
||||
<th><strong>Name</strong></th>
|
||||
<th><strong>Snapshot url</strong></th>
|
||||
<th style="width: 70px"></th>
|
||||
<th style="width: 25px"></th>
|
||||
|
||||
</thead>
|
||||
|
||||
<tr ng-repeat="snapshot in ctrl.snapshots">
|
||||
<td>
|
||||
<a href="dashboard/snapshot/{{snapshot.key}}">{{snapshot.name}}</a>
|
||||
</td>
|
||||
<td >
|
||||
<a href="dashboard/snapshot/{{snapshot.key}}">dashboard/snapshot/{{snapshot.key}}</a>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<a href="dashboard/snapshot/{{snapshot.key}}" class="btn btn-inverse btn-mini">
|
||||
<i class="fa fa-eye"></i>
|
||||
View
|
||||
</a>
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<a ng-click="ctrl.removeSnapshot(snapshot)" class="btn btn-danger btn-mini">
|
||||
<i class="fa fa-remove"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
@ -8,15 +8,11 @@
|
||||
<div class="tabs">
|
||||
<ul class="nav nav-tabs">
|
||||
<li ng-class="{active: mode === 'list'}">
|
||||
<a ng-click="mode = 'list';">
|
||||
Variables
|
||||
</a>
|
||||
<a ng-click="mode = 'list';">Variables</a>
|
||||
</li>
|
||||
|
||||
<li ng-class="{active: mode === 'edit'}" ng-show="mode === 'edit'">
|
||||
<a>
|
||||
{{current.name}}
|
||||
</a>
|
||||
<a>{{current.name}}</a>
|
||||
</li>
|
||||
|
||||
<li ng-class="{active: mode === 'new'}">
|
||||
@ -78,249 +74,144 @@
|
||||
</div>
|
||||
|
||||
<div ng-if="mode === 'edit' || mode === 'new'">
|
||||
<div class="editor-row">
|
||||
<div class="tight-form-section">
|
||||
<h5>Variable</h5>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px">
|
||||
Name
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-large tight-form-input" placeholder="name" ng-model='current.name'></input>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
Type
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-small tight-form-input" ng-model="current.type" ng-options="f for f in ['query', 'interval', 'custom']" ng-change="typeChanged()"></select>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="current.type === 'query'">
|
||||
Data source
|
||||
</li>
|
||||
<li ng-show="current.type === 'query'">
|
||||
<select class="input input-medium tight-form-input last" ng-model="current.datasource" ng-options="f.value as f.name for f in datasources"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<h5>Variable</h5>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form-inline">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Name</span>
|
||||
<input type="text" class="gf-form-input max-width-14" placeholder="name" ng-model='current.name'></input>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Type</span>
|
||||
<div class="gf-form-select-wrapper max-width-10">
|
||||
<select class="gf-form-input max-width-10" ng-model="current.type" ng-options="f for f in ['query', 'interval', 'custom']" ng-change="typeChanged()"></select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7" ng-show="current.type === 'query'">Data source</span>
|
||||
<div class="gf-form-select-wrapper" ng-show="current.type === 'query'">
|
||||
<select class="gf-form-input max-width-14" ng-model="current.datasource" ng-options="f.value as f.name for f in datasources"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-row">
|
||||
<div class="tight-form-section">
|
||||
<h5>Value Options</h5>
|
||||
<h5>Value Options</h5>
|
||||
|
||||
<div ng-show="current.type === 'interval'">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 160px">
|
||||
Values
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" style="width: 345px" class="input-xxlarge tight-form-input last" placeholder="name" ng-model='current.query' placeholder="1m,10m,1h,6h,1d,7d" ng-model-onblur ng-change="runQuery()"></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 160px">
|
||||
<editor-checkbox text="Include auto interval" model="current.auto" change="runQuery()"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="current.auto">
|
||||
Auto interval steps <tip>How many times should the current time range be divided to calculate the value</tip>
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-mini tight-form-input last" ng-model="current.auto_count" ng-options="f for f in [3,5,10,30,50,100,200]" ng-change="runQuery()"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div ng-show="current.type === 'interval'" class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Values</span>
|
||||
<input type="text" class="gf-form-input max-width-28" placeholder="name" ng-model='current.query' placeholder="1m,10m,1h,6h,1d,7d" ng-model-onblur ng-change="runQuery()"></input>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Include auto interval" model="current.auto" change="runQuery()"></editor-checkbox>
|
||||
<span class="gf-form-label" ng-show="current.auto">
|
||||
Auto interval steps <tip>How many times should the current time range be divided to calculate the value</tip>
|
||||
</span>
|
||||
<div class="gf-form-select-wrapper max-width-10">
|
||||
<select class="gf-form-input" ng-model="current.auto_count" ng-options="f for f in [3,5,10,30,50,100,200]" ng-change="runQuery()"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="current.type === 'custom'" class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-13">Values seperated by comma</span>
|
||||
<input type="text" class="gf-form-input max-width-22" ng-model='current.query' ng-blur="runQuery()" placeholder="1, 10, 20, myvalue"></input>
|
||||
</div>
|
||||
<div class="gf-form ">
|
||||
<editor-checkbox class="width-13" text="All value" model="current.includeAll" change="runQuery()"></editor-checkbox>
|
||||
<input ng-show="current.includeAll" type="text" class="gf-form-input max-width-22" ng-model='current.options[0].value' style="margin-left: 4px;"></input>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-13" ng-show="current.includeAll">All format</span>
|
||||
<div class="gf-form-select-wrapper max-width-10" ng-show="current.includeAll">
|
||||
<select class="gf-form-input" ng-model="current.allFormat" ng-change="runQuery()" ng-options="f for f in ['glob', 'wildcard', 'regex wildcard', 'regex values', 'lucene', 'pipe']"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="current.type === 'query'" class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Query</span>
|
||||
<input type="text" class="gf-form-input" ng-model='current.query' placeholder="metric name or tags query" ng-model-onblur ng-change="runQuery()"></input>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">
|
||||
Regex
|
||||
<tip>Optional, if you want to extract part of a series name or metric node segment</tip>
|
||||
</span>
|
||||
<input type="text" class="gf-form-input" ng-model='current.regex' placeholder="/.*-(.*)-.*/" ng-model-onblur ng-change="runQuery()"></input>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<editor-checkbox class="width-13" text="All value" model="current.includeAll" change="runQuery()"></editor-checkbox>
|
||||
<input ng-show="current.includeAll" type="text" class="gf-form-input" ng-model='current.options[0].value'></input>
|
||||
<span class="gf-form-label" ng-show="current.includeAll">All format</span>
|
||||
<div class="gf-form-select-wrapper max-width-10" ng-show="current.includeAll">
|
||||
<select class="gf-form-input" ng-model="current.allFormat" ng-change="runQuery()" ng-options="f for f in ['glob', 'wildcard', 'regex wildcard', 'regex values', 'lucene', 'pipe']"></select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<editor-checkbox class="width-13" text="Refresh on load" model="current.refresh"></editor-checkbox>
|
||||
<tip>Check if you want values to be updated on dashboard load, will slow down dashboard load time</tip>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="gf-form-group">
|
||||
<h5>Display options</h5>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-8">Variable Label</span>
|
||||
<input type="text" class="gf-form-input max-width-12" ng-model='current.label' placeholder=""></input>
|
||||
<editor-checkbox class="width-13" text="Hide label" model="current.hideLabel" change="runQuery()"></editor-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6" ng-hide="current.type === 'interval'">
|
||||
<div class="gf-form-group" >
|
||||
<h5>Multi-value selection <tip>Enables multiple values to be selected at the same time</tip></h5>
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Enable" model="current.multi" change="runQuery()"></editor-checkbox>
|
||||
|
||||
<div ng-show="current.type === 'custom'">
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 180px">
|
||||
Values seperated by comma
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input tight-form-input last" style="width: 325px;" ng-model='current.query' ng-blur="runQuery()" placeholder="1, 10, 20, myvalue"></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px;">
|
||||
<editor-checkbox text="All value" model="current.includeAll" change="runQuery()"></editor-checkbox>
|
||||
</li>
|
||||
<li ng-show="current.includeAll">
|
||||
<input type="text" class="input-xlarge tight-form-input" style="width:364px" ng-model='current.options[0].value'></input>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="current.includeAll">
|
||||
All format
|
||||
</li>
|
||||
<li ng-show="current.includeAll">
|
||||
<select class="input-medium tight-form-input last" ng-model="current.allFormat" ng-change="runQuery()" ng-options="f for f in ['glob', 'wildcard', 'regex wildcard', 'regex values', 'lucene', 'pipe']"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-show="current.type === 'query'">
|
||||
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px">
|
||||
Query
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" style="width: 588px" class="input-xxlarge tight-form-input last" ng-model='current.query' placeholder="metric name or tags query" ng-model-onblur ng-change="runQuery()"></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px;">
|
||||
Regex
|
||||
<tip>Optional, if you want to extract part of a series name or metric node segment</tip>
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" style="width: 588px" class="input tight-form-input last" ng-model='current.regex' placeholder="/.*-(.*)-.*/" ng-model-onblur ng-change="runQuery()"></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px;">
|
||||
<editor-checkbox text="All value" model="current.includeAll" change="runQuery()"></editor-checkbox>
|
||||
</li>
|
||||
<li ng-show="current.includeAll">
|
||||
<input type="text" class="input-xlarge tight-form-input" style="width:364px" ng-model='current.options[0].value'></input>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="current.includeAll">
|
||||
All format
|
||||
</li>
|
||||
<li ng-show="current.includeAll">
|
||||
<select class="input-medium tight-form-input last" ng-model="current.allFormat" ng-change="runQuery()" ng-options="f for f in ['glob', 'wildcard', 'regex wildcard', 'regex values', 'lucene', 'pipe']"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item last">
|
||||
<editor-checkbox text="Refresh on load" model="current.refresh"></editor-checkbox>
|
||||
<tip>Check if you want values to be updated on dashboard load, will slow down dashboard load time</tip>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<span class="gf-form-label" ng-show="current.multi">Multi format</span>
|
||||
<div class="gf-form-select-wrapper max-width-10" ng-show="current.multi">
|
||||
<select class="gf-form-input" ng-model="current.multiFormat" ng-change="runQuery()" ng-options="f for f in ['glob', 'regex values', 'lucene', 'pipe']"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-row">
|
||||
<div class="tight-form-section" ng-hide="current.type === 'interval'">
|
||||
<h5>Multi-value selection <tip>Enables multiple values to be selected at the same time</tip></h5>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item last" style="width: 100px;">
|
||||
<editor-checkbox text="Enable" model="current.multi" change="runQuery()"></editor-checkbox>
|
||||
</li>
|
||||
<li class="tight-form-item" ng-show="current.multi">
|
||||
Multi format
|
||||
</li>
|
||||
<li ng-show="current.multi">
|
||||
<select class="input-medium tight-form-input last" ng-model="current.multiFormat" ng-change="runQuery()" ng-options="f for f in ['glob', 'regex values', 'lucene', 'pipe']"></select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="gf-form-group" ng-if="current.type === 'query'">
|
||||
<h5>Value groups/tags (Experimental feature)</h5>
|
||||
<div class="gf-form">
|
||||
<editor-checkbox text="Enable" model="current.useTags" change="runQuery()"></editor-checkbox>
|
||||
</div>
|
||||
|
||||
<div class="tight-form-section">
|
||||
<h5>Display options</h5>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 100px">
|
||||
Variable Label
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-medium tight-form-input" ng-model='current.label' placeholder=""></input>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<editor-checkbox text="Hide label" model="current.hideLabel" change="runQuery()"></editor-checkbox>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="gf-form last" ng-if="current.useTags">
|
||||
<span class="gf-form-label width-10">Tags query</span>
|
||||
<input type="text" class="gf-form-input" ng-model='current.tagsQuery' placeholder="metric name or tags query" ng-model-onblur></input>
|
||||
</div>
|
||||
<div class="gf-form" ng-if="current.useTags">
|
||||
<li class="gf-form-label width-10">Tag values query</li>
|
||||
<input type="text" class="gf-form-input" ng-model='current.tagValuesQuery' placeholder="apps.$tag.*" ng-model-onblur></input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-row" ng-if="current.type === 'query'">
|
||||
<div class="tight-form-section">
|
||||
<h5>Value groups/tags (Experimental feature)</h5>
|
||||
<div class="tight-form last" ng-if="current.useTags">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 135px">
|
||||
Tags query
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" style="width: 588px" class="input-xxlarge tight-form-input last" ng-model='current.tagsQuery' placeholder="metric name or tags query" ng-model-onblur></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form" ng-if="current.useTags">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 135px;">
|
||||
Tag values query
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" style="width: 588px" class="input tight-form-input last" ng-model='current.tagValuesQuery' placeholder="apps.$tag.*" ng-model-onblur></input>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item last">
|
||||
<editor-checkbox text="Enable" model="current.useTags" change="runQuery()"></editor-checkbox>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-row">
|
||||
<div class="tight-form-section">
|
||||
<h5>Preview of values (shows max 20)</h5>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" ng-repeat="option in current.options | limitTo: 20">
|
||||
{{option.text}}
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<h5>Preview of values (shows max 20)</h5>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label" ng-repeat="option in current.options | limitTo: 20">
|
||||
{{option.text}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-row" style="margin-top: 20px">
|
||||
<div class="gf-form-button-row" style="margin-top: 20px">
|
||||
<button type="button" class="btn btn-success" ng-show="mode === 'edit'" ng-click="update();">Update</button>
|
||||
<button type="button" class="btn btn-success" ng-show="mode === 'new'" ng-click="add();">Add</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -32,6 +32,10 @@
|
||||
<td><span class="label label-info">CTRL+S</span></td>
|
||||
<td>Save dashboard</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span class="label label-info">CTRL+E</span></td>
|
||||
<td>Export dashboard</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span class="label label-info">CTRL+H</span></td>
|
||||
<td>Hide row controls</td>
|
||||
@ -40,6 +44,10 @@
|
||||
<td><span class="label label-info">CTRL+Z</span></td>
|
||||
<td>Zoom out</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span class="label label-info">CTRL+I</span></td>
|
||||
<td>Quick snapshot</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span class="label label-info">CTRL+O</span></td>
|
||||
<td>Enable/Disable shared graph crosshair</td>
|
||||
|
@ -31,10 +31,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<panel-links-editor panel="ctrl.panel"></panel-links-editor>
|
||||
|
||||
|
||||
|
@ -1,11 +1,10 @@
|
||||
<div class="container">
|
||||
<div class="login-container container">
|
||||
|
||||
<div class="login-box">
|
||||
|
||||
<div class="login-box-logo">
|
||||
<a href="login">
|
||||
<img src="img/logo_transparent_200x75.png">
|
||||
</a>
|
||||
<img class="logo-icon" src="public/img/grafana_icon.svg"></img><br>
|
||||
<i class="icon-gf icon-gf-grafana_wordmark"></i>
|
||||
</div>
|
||||
|
||||
<div class="login-inner-box">
|
||||
@ -15,76 +14,50 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<form name="sendResetForm" class="login-form" ng-show="mode === 'send'">
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 78px">
|
||||
<strong>User</strong>
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" name="username" class="tight-form-input last" required ng-model='formModel.userOrEmail' placeholder="email or username" style="width: 253px">
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<form name="sendResetForm" class="login-form gf-form-group" ng-show="mode === 'send'">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">User</span>
|
||||
<input type="text" name="username" class="gf-form-input max-width-14" required ng-model='formModel.userOrEmail' placeholder="email or username">
|
||||
</div>
|
||||
|
||||
<div class="login-submit-button-row">
|
||||
<button type="submit" class="btn" ng-click="sendResetEmail();" ng-class="{'btn-inverse': !sendResetForm.$valid, 'btn-primary': sendResetForm.$valid}">
|
||||
<div class="gf-form-button-row">
|
||||
<button type="submit" class="btn btn-large" ng-click="sendResetEmail();" ng-class="{'btn-inverse': !sendResetForm.$valid, 'btn-primary': sendResetForm.$valid}">
|
||||
Send reset instructions
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<h5 ng-if="mode === 'email-sent'" style="text-align: center; padding: 20px;">
|
||||
<h5 style="text-align: center; padding: 20px;" ng-if="mode === 'email-sent'">
|
||||
An email with a reset link as been sent to the email address, you should receive it shortly.
|
||||
</h5>
|
||||
|
||||
<form name="resetForm" class="login-form" ng-show="mode === 'reset'">
|
||||
<div class="tight-form">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 125px">
|
||||
<strong>New Password</strong>
|
||||
</li>
|
||||
<li>
|
||||
<input type="password" name="NewPassword" class="tight-form-input last" required ng-minlength="4" ng-model='formModel.newPassword' placeholder="password" style="width: 207px" watch-change="formModel.newPassword = inputValue;">
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<form name="resetForm" class="login-form gf-form-group" ng-show="mode === 'reset'">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-10">New Password</span>
|
||||
<input type="password" name="NewPassword" class="gf-form-input max-width-14" required ng-minlength="4" ng-model='formModel.newPassword' placeholder="password" watch-change="formModel.newPassword = inputValue;">
|
||||
</div>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item" style="width: 125px">
|
||||
<strong>Confirm Password</strong>
|
||||
</li>
|
||||
<li>
|
||||
<input type="password" name="ConfirmPassword" class="tight-form-input last" required ng-minlength="4" ng-model='formModel.confirmPassword' placeholder="confirm password" style="width: 207px">
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-10">Confirm Password</span>
|
||||
<input type="password" name="ConfirmPassword" class="gf-form-input max-width-14" required ng-minlength="4" ng-model='formModel.confirmPassword' placeholder="confirm password">
|
||||
</div>
|
||||
|
||||
<div style="margin-left: 141px; width: 207px;">
|
||||
<password-strength password="formModel.newPassword"></password-strength>
|
||||
</div>
|
||||
|
||||
<div class="login-submit-button-row">
|
||||
<div class="gf-form-button-row">
|
||||
<button type="submit" class="btn" ng-click="submitReset();" ng-class="{'btn-inverse': !resetForm.$valid, 'btn-primary': resetForm.$valid}">
|
||||
Reset Password
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
|
||||
<div class="row" style="margin-top: 40px">
|
||||
<div class="row" style="margin-top: 20px">
|
||||
<div class="text-center">
|
||||
<a href="login">
|
||||
Back to login
|
||||
</a>
|
||||
<a href="login">Back to login</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -5,60 +5,45 @@
|
||||
Row settings
|
||||
</div>
|
||||
|
||||
<div ng-model="editor.index" bs-tabs style="text-transform:capitalize;">
|
||||
<div ng-repeat="tab in ['General']" data-title="{{tab}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="gf-box-header-close-btn" ng-click="dismiss();">
|
||||
<i class="fa fa-remove"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="gf-box-body">
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="page-heading">
|
||||
<h5>Row details</h5>
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form-inline">
|
||||
|
||||
<div class="editor-row">
|
||||
<div class="section">
|
||||
<h5>Row details</h5>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item">
|
||||
Title
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-xlarge tight-form-input" ng-model='row.title'></input>
|
||||
</li>
|
||||
<li class="tight-form-item">
|
||||
Height
|
||||
</li>
|
||||
<li>
|
||||
<input type="text" class="input-small tight-form-input" ng-model='row.height'></input>
|
||||
</li>
|
||||
<li class="tight-form-item last">
|
||||
<label class="checkbox-label" for="row.showTitle">Show Title</label>
|
||||
<input class="cr1" id="row.showTitle" type="checkbox" ng-model="row.showTitle" ng-checked="row.showTitle">
|
||||
<label for="row.showTitle" class="cr1"></label>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-6">Title</span>
|
||||
<input type="text" class="gf-form-input max-width-14" ng-model='row.title'></input>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-6">Height</span>
|
||||
<input type="text" class="gf-form-input max-width-8" ng-model='row.height'></input>
|
||||
<editor-checkbox text="Show Title" model="row.showTitle"></editor-checkbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h5>Templating options</h5>
|
||||
<div class="tight-form last">
|
||||
<ul class="tight-form-list">
|
||||
<li class="tight-form-item">
|
||||
Repeat Row
|
||||
</li>
|
||||
<li>
|
||||
<select class="input-small tight-form-input last" ng-model="row.repeat" ng-options="f.name as f.name for f in dashboard.templating.list">
|
||||
<div class="col-md-4">
|
||||
<div class="page-heading">
|
||||
<h5>Templating options</h5>
|
||||
</div>
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label">Repeat Row</span>
|
||||
<div class="gf-form-select-wrapper max-width-10">
|
||||
<select class="gf-form-input" ng-model="row.repeat" ng-options="f.name as f.name for f in dashboard.templating.list">
|
||||
<option value=""></option>
|
||||
</select>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
@ -1,5 +1,5 @@
|
||||
<div class="variable-link-wrapper">
|
||||
<a ng-click="vm.show()" class="variable-value-link tight-form-item">
|
||||
<a ng-click="vm.show()" class="variable-value-link">
|
||||
{{vm.linkText}}
|
||||
<span ng-repeat="tag in vm.selectedTags" bs-tooltip='tag.valuesText' data-placement="bottom">
|
||||
<span class="label-tag"tag-color-from-name="tag.text">
|
||||
@ -10,7 +10,7 @@
|
||||
<i class="fa fa-caret-down"></i>
|
||||
</a>
|
||||
|
||||
<input type="text" class="tight-form-clear-input input-small" style="display: none" ng-keydown="vm.keyDown($event)" ng-model="vm.search.query" ng-change="vm.queryChanged()" ></input>
|
||||
<input type="text" class="hidden-input input-small" style="display: none" ng-keydown="vm.keyDown($event)" ng-model="vm.search.query" ng-change="vm.queryChanged()" ></input>
|
||||
|
||||
<div class="variable-value-dropdown" ng-if="vm.dropdownVisible" ng-class="{'multi': vm.variable.multi, 'single': !vm.variable.multi}">
|
||||
<div class="variable-options-wrapper">
|
||||
|
@ -53,6 +53,10 @@ $page-bg: $dark-2;
|
||||
$body-color: $gray-4;
|
||||
$text-color: $gray-4;
|
||||
|
||||
// gradients
|
||||
$brand-gradient: linear-gradient(to right, rgba(255,213,0,0.7) 0%, rgba(255,68,0,0.7) 99%, rgba(255,68,0,0.7) 100%);
|
||||
$page-gradient: linear-gradient(60deg, transparent 70%, darken($page-bg, 4%) 98%);
|
||||
|
||||
// Links
|
||||
// -------------------------
|
||||
$link-color: darken($white,11%);
|
||||
|
@ -59,6 +59,10 @@ $page-bg: $white;
|
||||
$body-color: $gray-1;
|
||||
$text-color: $gray-1;
|
||||
|
||||
// gradients
|
||||
$brand-gradient: linear-gradient(to right, rgba(255,213,0,1.0) 0%, rgba(255,68,0,1.0) 99%, rgba(255,68,0,1.0) 100%);
|
||||
$page-gradient: linear-gradient(60deg, transparent 70%, darken($page-bg, 4%) 98%);
|
||||
|
||||
// Links
|
||||
// -------------------------
|
||||
$link-color: $gray-1;
|
||||
|
@ -218,3 +218,4 @@ $side-menu-width: 14rem;
|
||||
|
||||
// dashboard
|
||||
$dashboard-padding: $spacer / 2;
|
||||
|
||||
|
@ -271,17 +271,12 @@ div.flot-text {
|
||||
}
|
||||
|
||||
.dashboard-header {
|
||||
font-family: "grafana-icons";
|
||||
font-size: 22px;
|
||||
font-family: $headings-font-family;
|
||||
font-size: $font-size-h2;
|
||||
text-align: center;
|
||||
span {
|
||||
display: inline-block;
|
||||
border-image: linear-gradient(to right, rgba(255,213,0,1) 0%, rgba(255,68,0,1) 99%, rgba(255,68,0,1) 100%);
|
||||
border-image-slice: 1;
|
||||
border-top: 0;
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
border-bottom: 1px solid transparent;
|
||||
@include brand-bottom-border();
|
||||
padding: 1.2rem .5rem .4rem .5rem;
|
||||
}
|
||||
}
|
||||
|
@ -9,12 +9,6 @@ $gf-form-label-margin: 0.25rem;
|
||||
align-items: center;
|
||||
text-align: left;
|
||||
|
||||
.checkbox-label {
|
||||
display: inline;
|
||||
cursor: pointer;
|
||||
padding: 8px 7px 8px 4px;
|
||||
}
|
||||
|
||||
.cr1 {
|
||||
margin-left: 8px;
|
||||
}
|
||||
@ -58,6 +52,15 @@ $gf-form-label-margin: 0.25rem;
|
||||
|
||||
.gf-form-checkbox {
|
||||
flex-shrink: 0;
|
||||
padding: $input-padding-y $input-padding-x;
|
||||
line-height: $input-line-height;
|
||||
|
||||
.checkbox-label {
|
||||
display: inline;
|
||||
cursor: pointer;
|
||||
padding: $input-padding-y $input-padding-x;
|
||||
line-height: $input-line-height;
|
||||
}
|
||||
}
|
||||
|
||||
.gf-form-input {
|
||||
|
@ -118,6 +118,8 @@
|
||||
}
|
||||
|
||||
.share-modal-big-icon {
|
||||
margin-bottom: 2rem;
|
||||
|
||||
.fa, .icon-gf {
|
||||
font-size: 70px;
|
||||
}
|
||||
@ -147,3 +149,9 @@
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
.position-center {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
@ -1,5 +1,5 @@
|
||||
.submenu-controls {
|
||||
margin: 10px 5px;
|
||||
margin: 0 5px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
@ -23,6 +23,7 @@
|
||||
border: $panel-border;
|
||||
margin-right: 10px;
|
||||
display: inline-block;
|
||||
float: left;
|
||||
|
||||
.fa-caret-down {
|
||||
font-size: 75%;
|
||||
@ -37,11 +38,35 @@
|
||||
.label-tag {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
padding: 8px 7px;
|
||||
box-sizing: content-box;
|
||||
display: inline-block;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
color: $text-color;
|
||||
}
|
||||
|
||||
.submenu-item-label {
|
||||
padding: 8px 0px 8px 7px;
|
||||
box-sizing: content-box;
|
||||
display: inline-block;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.variable-link-wrapper {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
.hidden-input {
|
||||
padding: 8px 7px;
|
||||
border: none;
|
||||
margin: 0px;
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
border-right: 1px solid $tight-form-border;
|
||||
}
|
||||
}
|
||||
|
||||
.variable-value-dropdown {
|
||||
|
@ -1,19 +1,27 @@
|
||||
.tabbed-view {
|
||||
background-color: $page-bg;
|
||||
background-image: linear-gradient(60deg, transparent 70%, darken($page-bg, 4%) 98%);
|
||||
background-image: $page-gradient;
|
||||
margin: -$dashboard-padding;
|
||||
margin-bottom: $spacer*2;
|
||||
padding: $spacer*3;
|
||||
|
||||
&.tabbed-view--panel-edit {
|
||||
padding: 0;
|
||||
|
||||
.tabbed-view-header {
|
||||
padding: 0;
|
||||
background-color: $body-bg;
|
||||
padding: 1.5em 1rem 0 1rem;
|
||||
}
|
||||
.gf-tabs-link.active {
|
||||
background-color: $panel-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabbed-view-header {
|
||||
@include clearfix();
|
||||
border-image: linear-gradient(to right, rgba(255,213,0,1) 0%, rgba(255,68,0,1) 99%, rgba(255,68,0,1) 100%);
|
||||
border-image-slice: 1;
|
||||
border-top: 0;
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
border-bottom: 1px solid transparent;
|
||||
@include brand-bottom-border();
|
||||
}
|
||||
|
||||
.tabbed-view-title {
|
||||
|
@ -55,7 +55,7 @@
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: #F9952B;
|
||||
border-color: rgba(216, 131, 40, 0.77);
|
||||
color: $link-color;
|
||||
}
|
||||
|
||||
@ -63,8 +63,7 @@
|
||||
&.active:hover,
|
||||
&.active:focus {
|
||||
@include border-radius(3px);
|
||||
border: 1px solid #F9952B;
|
||||
background-color: transparent;
|
||||
border-color: rgba(216, 131, 40, 0.77);
|
||||
border-bottom: 1px solid $panel-bg;
|
||||
color: $link-color;
|
||||
}
|
||||
|
@ -25,6 +25,7 @@
|
||||
padding: 2px 6px;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
box-shadow: 0 0 1px rgba($white,.2);
|
||||
.icon-tag {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
|
@ -33,12 +33,7 @@
|
||||
justify-content: flex-end;
|
||||
align-items: flex-end;
|
||||
flex-wrap: wrap-reverse;
|
||||
border-image: linear-gradient(to right, rgba(255,213,0,1) 0%, rgba(255,68,0,1) 99%, rgba(255,68,0,1) 100%);
|
||||
border-image-slice: 1;
|
||||
border-top: 0;
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
border-bottom: 1px solid transparent;
|
||||
@include brand-bottom-border();
|
||||
|
||||
h1 {
|
||||
font-style: italic;
|
||||
|
@ -343,3 +343,12 @@
|
||||
border-bottom: 0;
|
||||
border-left: 2px solid transparent;
|
||||
}
|
||||
|
||||
@mixin brand-bottom-border() {
|
||||
border-image: $brand-gradient;
|
||||
border-image-slice: 1;
|
||||
border-top: 0;
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
border-bottom: 1px solid transparent;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user