Skip to content

N
nexpie-grafana-theme
Commit 78b9c300 by Torkel Ödegaard
Options

feat(plugins): minor progress on dashboard imports

parent 1951f385
Showing with 73 additions and 54 deletions
public/app/core/routes/routes.ts
...@@ -63,6 +63,7 @@ function setupAngularRoutes($routeProvider, $locationProvider) { ...@@ -63,6 +63,7 @@ function setupAngularRoutes($routeProvider, $locationProvider) {
.when('/datasources/new', { .when('/datasources/new', {
templateUrl: 'public/app/features/datasources/partials/edit.html', templateUrl: 'public/app/features/datasources/partials/edit.html',
controller : 'DataSourceEditCtrl', controller : 'DataSourceEditCtrl',
controllerAs: 'ctrl',
resolve: loadOrgBundle, resolve: loadOrgBundle,
}) })
.when('/org', { .when('/org', {
......
public/app/features/dashboard/import_list/import_list.ts
...@@ -31,14 +31,21 @@ export class DashImportListCtrl { ...@@ -31,14 +31,21 @@ export class DashImportListCtrl {
var template = ` var template = `
<div class="gf-form-group" ng-if="ctrl.dashboards.length"> <div class="gf-form-group" ng-if="ctrl.dashboards.length">
<h3 class="page-heading">Dashboards</h3> <table class="filter-table">
<div class="gf-form" ng-repeat="dash in ctrl.dashboards"> <tbody>
<label class="gf-form-label"> <tr ng-repeat="dash in ctrl.dashboards">
<i class="icon-gf icon-gf-dashboard"></i> <td class="width-1">
</label> <i class="icon-gf icon-gf-dashboard"></i>
<label class="gf-form-label width-20">{{dash.name}}</label> </td>
<button class="btn btn-inverse gf-form-btn" ng-click="ctrl.import(dash)">Import</button> <td>
</div> {{dash.name}}</span>
</td>
<td class="width-2">
<button class="btn btn-primary btn-small">Install</button>
</td
</tr>
</tbody>
</table>
</div> </div>
`; `;
......
public/app/features/datasources/edit_ctrl.ts
...@@ -22,6 +22,8 @@ export class DataSourceEditCtrl { ...@@ -22,6 +22,8 @@ export class DataSourceEditCtrl {
types: any; types: any;
testing: any; testing: any;
datasourceMeta: any; datasourceMeta: any;
tabIndex: number;
hasDashboards: boolean;
/** @ngInject */ /** @ngInject */
constructor( constructor(
...@@ -34,6 +36,7 @@ export class DataSourceEditCtrl { ...@@ -34,6 +36,7 @@ export class DataSourceEditCtrl {
this.isNew = true; this.isNew = true;
this.datasources = []; this.datasources = [];
this.tabIndex = 0;
this.loadDatasourceTypes().then(() => { this.loadDatasourceTypes().then(() => {
if (this.$routeParams.id) { if (this.$routeParams.id) {
...@@ -66,8 +69,10 @@ export class DataSourceEditCtrl { ...@@ -66,8 +69,10 @@ export class DataSourceEditCtrl {
} }
typeChanged() { typeChanged() {
this.hasDashboards = false;
return this.backendSrv.get('/api/org/plugins/' + this.current.type + '/settings').then(pluginInfo => { return this.backendSrv.get('/api/org/plugins/' + this.current.type + '/settings').then(pluginInfo => {
this.datasourceMeta = pluginInfo; this.datasourceMeta = pluginInfo;
this.hasDashboards = _.findWhere(pluginInfo.includes, {type: 'dashboard'});
}); });
} }
......
public/app/features/datasources/partials/edit.html
...@@ -11,12 +11,12 @@ ...@@ -11,12 +11,12 @@
<ul class="gf-tabs"> <ul class="gf-tabs">
<li class="gf-tabs-item"> <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 Config
</a> </a>
</li> </li>
<li class="gf-tabs-item" ng-show="ctrl.hasDashboards" ng-cloak> <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 Dashboards
</a> </a>
</li> </li>
...@@ -24,55 +24,60 @@ ...@@ -24,55 +24,60 @@
</div> </div>
</div> </div>
<div ng-if="ctrl.tabIndex === 0" class="tab-content">
<form name="editForm"> <form name="editForm">
<div class="gf-form-group"> <div class="gf-form-group">
<div class="gf-form"> <div class="gf-form">
<span class="gf-form-label width-7">Name</span> <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> <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"> <info-popover offset="0px -95px">
The name is used when you select the data source in panels. The name is used when you select the data source in panels.
The <code>Default</code> data source is preselected in new The <code>Default</code> data source is preselected in new
panels. panels.
</info-popover> </info-popover>
<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>
<editor-checkbox text="Default" model="ctrl.current.isDefault"></editor-checkbox>
</div>
<rebuild-on-change property="ctrl.datasourceMeta.id"> <div class="gf-form">
<plugin-component type="datasource-config-ctrl"> <span class="gf-form-label width-7">Type</span>
</plugin-component> <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>
<dashboard-import-list plugin="ctrl.datasourceMeta"></dashboard-import-list>
</rebuild-on-change>
<div ng-if="testing" style="margin-top: 25px"> <rebuild-on-change property="ctrl.datasourceMeta.id">
<h5 ng-show="!testing.done">Testing.... <i class="fa fa-spiner fa-spin"></i></h5> <plugin-component type="datasource-config-ctrl">
<h5 ng-show="testing.done">Test results</h5> </plugin-component>
<div class="alert-{{testing.status}} alert"> </rebuild-on-change>
<div class="alert-title">{{testing.title}}</div>
<div ng-bind='testing.message'></div>
</div>
</div>
<div class="gf-form-button-row"> <div ng-if="testing" style="margin-top: 25px">
<button type="submit" class="btn btn-success" ng-show="ctrl.isNew" ng-click="ctrl.saveChanges()">Add</button> <h5 ng-show="!testing.done">Testing.... <i class="fa fa-spiner fa-spin"></i></h5>
<button type="submit" class="btn btn-success" ng-show="!ctrl.isNew" ng-click="ctrl.saveChanges()">Save</button> <h5 ng-show="testing.done">Test results</h5>
<button type="submit" class="btn btn-secondary" ng-show="!ctrl.isNew" ng-click="ctrl.saveChanges(true)"> <div class="alert-{{testing.status}} alert">
Test Connection <div class="alert-title">{{testing.title}}</div>
</button> <div ng-bind='testing.message'></div>
<a class="btn btn-link" href="datasources">Cancel</a> </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>
</form>
</div>
<div ng-if="ctrl.tabIndex === 1" class="tab-content">
<dashboard-import-list plugin="ctrl.datasourceMeta"></dashboard-import-list>
</div>
</form>
</div> </div>
public/app/plugins/datasource/graphite/plugin.json
...@@ -4,7 +4,8 @@ ...@@ -4,7 +4,8 @@
"id": "graphite", "id": "graphite",
"includes": [ "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, "metrics": true,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment