mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
feat(plugins): minor progress on dashboard imports
This commit is contained in:
Torkel Ödegaard
@@ -63,6 +63,7 @@ function setupAngularRoutes($routeProvider, $locationProvider) {
|
||||
.when('/datasources/new', {
|
||||
templateUrl: 'public/app/features/datasources/partials/edit.html',
|
||||
controller : 'DataSourceEditCtrl',
|
||||
controllerAs: 'ctrl',
|
||||
resolve: loadOrgBundle,
|
||||
})
|
||||
.when('/org', {
|
||||
|
||||
@@ -31,14 +31,21 @@ export class DashImportListCtrl {
|
||||
|
||||
var template = `
|
||||
<div class="gf-form-group" ng-if="ctrl.dashboards.length">
|
||||
<h3 class="page-heading">Dashboards</h3>
|
||||
<div class="gf-form" ng-repeat="dash in ctrl.dashboards">
|
||||
<label class="gf-form-label">
|
||||
<i class="icon-gf icon-gf-dashboard"></i>
|
||||
</label>
|
||||
<label class="gf-form-label width-20">{{dash.name}}</label>
|
||||
<button class="btn btn-inverse gf-form-btn" ng-click="ctrl.import(dash)">Import</button>
|
||||
</div>
|
||||
<table class="filter-table">
|
||||
<tbody>
|
||||
<tr ng-repeat="dash in ctrl.dashboards">
|
||||
<td class="width-1">
|
||||
<i class="icon-gf icon-gf-dashboard"></i>
|
||||
</td>
|
||||
<td>
|
||||
{{dash.name}}</span>
|
||||
</td>
|
||||
<td class="width-2">
|
||||
<button class="btn btn-primary btn-small">Install</button>
|
||||
</td
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
`;
|
||||
|
||||
|
||||
@@ -22,6 +22,8 @@ export class DataSourceEditCtrl {
|
||||
types: any;
|
||||
testing: any;
|
||||
datasourceMeta: any;
|
||||
tabIndex: number;
|
||||
hasDashboards: boolean;
|
||||
|
||||
/** @ngInject */
|
||||
constructor(
|
||||
@@ -34,6 +36,7 @@ export class DataSourceEditCtrl {
|
||||
|
||||
this.isNew = true;
|
||||
this.datasources = [];
|
||||
this.tabIndex = 0;
|
||||
|
||||
this.loadDatasourceTypes().then(() => {
|
||||
if (this.$routeParams.id) {
|
||||
@@ -66,8 +69,10 @@ export class DataSourceEditCtrl {
|
||||
}
|
||||
|
||||
typeChanged() {
|
||||
this.hasDashboards = false;
|
||||
return this.backendSrv.get('/api/org/plugins/' + this.current.type + '/settings').then(pluginInfo => {
|
||||
this.datasourceMeta = pluginInfo;
|
||||
this.hasDashboards = _.findWhere(pluginInfo.includes, {type: 'dashboard'});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -11,12 +11,12 @@
|
||||
|
||||
<ul class="gf-tabs">
|
||||
<li class="gf-tabs-item">
|
||||
<a class="gf-tabs-link" ng-click="ctrl.editor.index = 0" ng-class="{active: ctrl.editor.index === 0}">
|
||||
<a class="gf-tabs-link" ng-click="ctrl.tabIndex = 0" ng-class="{active: ctrl.tabIndex === 0}">
|
||||
Config
|
||||
</a>
|
||||
</li>
|
||||
<li class="gf-tabs-item" ng-show="ctrl.hasDashboards" ng-cloak>
|
||||
<a class="gf-tabs-link" ng-click="ctrl.editor.index = 1" ng-class="{active: ctrl.editor.index === 1}">
|
||||
<a class="gf-tabs-link" ng-click="ctrl.tabIndex = 1" ng-class="{active: ctrl.tabIndex === 1}">
|
||||
Dashboards
|
||||
</a>
|
||||
</li>
|
||||
@@ -24,55 +24,60 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="ctrl.tabIndex === 0" class="tab-content">
|
||||
|
||||
<form name="editForm">
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Name</span>
|
||||
<input class="gf-form-input max-width-21" type="text" ng-model="ctrl.current.name" placeholder="My data source name" required>
|
||||
<info-popover offset="0px -95px">
|
||||
The name is used when you select the data source in panels.
|
||||
The <code>Default</code> data source is preselected in new
|
||||
panels.
|
||||
</info-popover>
|
||||
<form name="editForm">
|
||||
<div class="gf-form-group">
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Name</span>
|
||||
<input class="gf-form-input max-width-21" type="text" ng-model="ctrl.current.name" placeholder="My data source name" required>
|
||||
<info-popover offset="0px -95px">
|
||||
The name is used when you select the data source in panels.
|
||||
The <code>Default</code> data source is preselected in new
|
||||
panels.
|
||||
</info-popover>
|
||||
|
||||
<editor-checkbox text="Default" model="ctrl.current.isDefault"></editor-checkbox>
|
||||
</div>
|
||||
<editor-checkbox text="Default" model="ctrl.current.isDefault"></editor-checkbox>
|
||||
</div>
|
||||
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Type</span>
|
||||
<div class="gf-form-select-wrapper">
|
||||
<select class="gf-form-input gf-size-auto" ng-model="ctrl.current.type" ng-options="v.id as v.name for v in ctrl.types" ng-change="ctrl.typeChanged()"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form">
|
||||
<span class="gf-form-label width-7">Type</span>
|
||||
<div class="gf-form-select-wrapper">
|
||||
<select class="gf-form-input gf-size-auto" ng-model="ctrl.current.type" ng-options="v.id as v.name for v in ctrl.types" ng-change="ctrl.typeChanged()"></select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<rebuild-on-change property="ctrl.datasourceMeta.id">
|
||||
<plugin-component type="datasource-config-ctrl">
|
||||
</plugin-component>
|
||||
<rebuild-on-change property="ctrl.datasourceMeta.id">
|
||||
<plugin-component type="datasource-config-ctrl">
|
||||
</plugin-component>
|
||||
</rebuild-on-change>
|
||||
|
||||
<dashboard-import-list plugin="ctrl.datasourceMeta"></dashboard-import-list>
|
||||
</rebuild-on-change>
|
||||
<div ng-if="testing" style="margin-top: 25px">
|
||||
<h5 ng-show="!testing.done">Testing.... <i class="fa fa-spiner fa-spin"></i></h5>
|
||||
<h5 ng-show="testing.done">Test results</h5>
|
||||
<div class="alert-{{testing.status}} alert">
|
||||
<div class="alert-title">{{testing.title}}</div>
|
||||
<div ng-bind='testing.message'></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="testing" style="margin-top: 25px">
|
||||
<h5 ng-show="!testing.done">Testing.... <i class="fa fa-spiner fa-spin"></i></h5>
|
||||
<h5 ng-show="testing.done">Test results</h5>
|
||||
<div class="alert-{{testing.status}} alert">
|
||||
<div class="alert-title">{{testing.title}}</div>
|
||||
<div ng-bind='testing.message'></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gf-form-button-row">
|
||||
<button type="submit" class="btn btn-success" ng-show="ctrl.isNew" ng-click="ctrl.saveChanges()">Add</button>
|
||||
<button type="submit" class="btn btn-success" ng-show="!ctrl.isNew" ng-click="ctrl.saveChanges()">Save</button>
|
||||
<button type="submit" class="btn btn-secondary" ng-show="!ctrl.isNew" ng-click="ctrl.saveChanges(true)">
|
||||
Test Connection
|
||||
</button>
|
||||
<a class="btn btn-link" href="datasources">Cancel</a>
|
||||
</div>
|
||||
|
||||
<div class="gf-form-button-row">
|
||||
<button type="submit" class="btn btn-success" ng-show="ctrl.isNew" ng-click="ctrl.saveChanges()">Add</button>
|
||||
<button type="submit" class="btn btn-success" ng-show="!ctrl.isNew" ng-click="ctrl.saveChanges()">Save</button>
|
||||
<button type="submit" class="btn btn-secondary" ng-show="!ctrl.isNew" ng-click="ctrl.saveChanges(true)">
|
||||
Test Connection
|
||||
</button>
|
||||
<a class="btn btn-link" href="datasources">Cancel</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div ng-if="ctrl.tabIndex === 1" class="tab-content">
|
||||
<dashboard-import-list plugin="ctrl.datasourceMeta"></dashboard-import-list>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -4,7 +4,8 @@
|
||||
"id": "graphite",
|
||||
|
||||
"includes": [
|
||||
{"type": "dashboard", "name": "Carbon Stats", "path": "dashboards/carbon_stats.json"}
|
||||
{"type": "dashboard", "name": "Carbon Overview", "path": "dashboards/carbon_stats.json"},
|
||||
{"type": "dashboard", "name": "Carbon Agent Details", "path": "dashboards/carbon_stats.json"}
|
||||
],
|
||||
|
||||
"metrics": true,
|
||||
|
||||
Reference in New Issue
Block a user