diff --git a/public/app/plugins/panel/dashlist/module.html b/public/app/plugins/panel/dashlist/module.html
index 79952d0032c..b5c59862e5d 100644
--- a/public/app/plugins/panel/dashlist/module.html
+++ b/public/app/plugins/panel/dashlist/module.html
@@ -1,12 +1,17 @@
-
-
+
diff --git a/public/app/plugins/panel/dashlist/module.js b/public/app/plugins/panel/dashlist/module.js
new file mode 100644
index 00000000000..5bc42c505fd
--- /dev/null
+++ b/public/app/plugins/panel/dashlist/module.js
@@ -0,0 +1,91 @@
+///
+"use strict";
+var __extends = (this && this.__extends) || function (d, b) {
+ for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+ function __() { this.constructor = d; }
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var lodash_1 = require('lodash');
+var sdk_1 = require('app/plugins/sdk');
+var impression_store_1 = require('app/features/dashboard/impression_store');
+// Set and populate defaults
+var panelDefaults = {
+ mode: 'starred',
+ query: '',
+ limit: 10,
+ tags: [],
+ recent: false,
+ search: false,
+ starred: true
+};
+var DashListCtrl = (function (_super) {
+ __extends(DashListCtrl, _super);
+ /** @ngInject */
+ function DashListCtrl($scope, $injector, backendSrv) {
+ _super.call(this, $scope, $injector);
+ this.backendSrv = backendSrv;
+ lodash_1["default"].defaults(this.panel, panelDefaults);
+ if (this.panel.tag) {
+ this.panel.tags = [this.panel.tag];
+ delete this.panel.tag;
+ }
+ this.events.on('refresh', this.onRefresh.bind(this));
+ this.events.on('init-edit-mode', this.onInitEditMode.bind(this));
+ }
+ DashListCtrl.prototype.onInitEditMode = function () {
+ this.editorTabIndex = 1;
+ this.modes = ['starred', 'search', 'recently viewed'];
+ this.addEditorTab('Options', 'public/app/plugins/panel/dashlist/editor.html');
+ };
+ DashListCtrl.prototype.onRefresh = function () {
+ var promises = [];
+ if (this.panel.recent) {
+ promises.push(this.getRecentDashboards());
+ }
+ if (this.panel.starred) {
+ promises.push(this.getStarred());
+ }
+ if (this.panel.search) {
+ promises.push(this.getSearch());
+ }
+ return Promise.all(promises)
+ .then(this.renderingCompleted.bind(this));
+ };
+ DashListCtrl.prototype.getSearch = function () {
+ var _this = this;
+ var params = {
+ limit: this.panel.limit,
+ query: this.panel.query,
+ tag: this.panel.tags
+ };
+ return this.backendSrv.search(params).then(function (result) {
+ _this.dashList = result;
+ _this.renderingCompleted();
+ });
+ };
+ DashListCtrl.prototype.getStarred = function () {
+ var _this = this;
+ var params = { limit: this.panel.limit, starred: "true" };
+ return this.backendSrv.search(params).then(function (result) {
+ _this.dashList = result;
+ _this.renderingCompleted();
+ });
+ };
+ DashListCtrl.prototype.getRecentDashboards = function () {
+ var _this = this;
+ var dashIds = lodash_1["default"].first(impression_store_1.impressions.getDashboardOpened(), this.panel.limit);
+ return this.backendSrv.search({ dashboardIds: dashIds, limit: this.panel.limit }).then(function (result) {
+ _this.dashList = dashIds.map(function (orderId) {
+ return lodash_1["default"].find(result, function (dashboard) {
+ return dashboard.id === orderId;
+ });
+ }).filter(function (el) {
+ return el !== undefined;
+ });
+ });
+ };
+ DashListCtrl.templateUrl = 'module.html';
+ return DashListCtrl;
+}(sdk_1.PanelCtrl));
+exports.DashListCtrl = DashListCtrl;
+exports.PanelCtrl = DashListCtrl;
diff --git a/public/app/plugins/panel/dashlist/module.ts b/public/app/plugins/panel/dashlist/module.ts
index b619b7ea7d7..77029bd7ceb 100644
--- a/public/app/plugins/panel/dashlist/module.ts
+++ b/public/app/plugins/panel/dashlist/module.ts
@@ -7,16 +7,19 @@ import {impressions} from 'app/features/dashboard/impression_store';
// Set and populate defaults
var panelDefaults = {
- mode: 'starred',
query: '',
limit: 10,
- tags: []
+ tags: [],
+ recent: false,
+ search: false,
+ starred: true,
+ headings: true,
};
class DashListCtrl extends PanelCtrl {
static templateUrl = 'module.html';
- dashList: any[];
+ groups: any[];
modes: any[];
/** @ngInject */
@@ -31,6 +34,31 @@ class DashListCtrl extends PanelCtrl {
this.events.on('refresh', this.onRefresh.bind(this));
this.events.on('init-edit-mode', this.onInitEditMode.bind(this));
+
+ this.groups = [
+ {list: [], show: false, header: "Starred dashboards",},
+ {list: [], show: false, header: "Recently viewed dashboards"},
+ {list: [], show: false, header: "Search"},
+ ];
+
+ // update capability
+ if (this.panel.mode) {
+ if (this.panel.mode === 'starred') {
+ this.panel.starred = true;
+ this.panel.headings = false;
+ }
+ if (this.panel.mode === 'recently viewed') {
+ this.panel.recent = true;
+ this.panel.starred = false;
+ this.panel.headings = false;
+ }
+ if (this.panel.mode === 'search') {
+ this.panel.search = true;
+ this.panel.starred = false;
+ this.panel.headings = false;
+ }
+ delete this.panel.mode;
+ }
}
onInitEditMode() {
@@ -40,34 +68,60 @@ class DashListCtrl extends PanelCtrl {
}
onRefresh() {
- var params: any = {limit: this.panel.limit};
+ var promises = [];
- if (this.panel.mode === 'recently viewed') {
- var dashIds = _.first(impressions.getDashboardOpened(), this.panel.limit);
+ promises.push(this.getRecentDashboards());
+ promises.push(this.getStarred());
+ promises.push(this.getSearch());
- return this.backendSrv.search({dashboardIds: dashIds, limit: this.panel.limit}).then(result => {
- this.dashList = dashIds.map(orderId => {
- return _.find(result, dashboard => {
- return dashboard.id === orderId;
- });
- }).filter(el => {
- return el !== undefined;
- });
+ return Promise.all(promises)
+ .then(this.renderingCompleted.bind(this));
+ }
- this.renderingCompleted();
- });
+ getSearch() {
+ this.groups[2].show = this.panel.search;
+ if (!this.panel.search) {
+ return Promise.resolve();
}
- if (this.panel.mode === 'starred') {
- params.starred = "true";
- } else {
- params.query = this.panel.query;
- params.tag = this.panel.tags;
- }
+ var params = {
+ limit: this.panel.limit,
+ query: this.panel.query,
+ tag: this.panel.tags,
+ };
return this.backendSrv.search(params).then(result => {
- this.dashList = result;
- this.renderingCompleted();
+ this.groups[2].list = result;
+ });
+ }
+
+ getStarred() {
+ this.groups[0].show = this.panel.starred;
+ if (!this.panel.starred) {
+ return Promise.resolve();
+ }
+
+ var params = {limit: this.panel.limit, starred: "true"};
+ return this.backendSrv.search(params).then(result => {
+ this.groups[0].list = result;
+ });
+ }
+
+ getRecentDashboards() {
+ this.groups[1].show = this.panel.recent;
+ if (!this.panel.recent) {
+ return Promise.resolve();
+ }
+
+ var dashIds = _.first(impressions.getDashboardOpened(), this.panel.limit);
+ return this.backendSrv.search({dashboardIds: dashIds, limit: this.panel.limit}).then(result => {
+ this.groups[1].list = dashIds.map(orderId => {
+ return _.find(result, dashboard => {
+ return dashboard.id === orderId;
+ });
+ }).filter(el => {
+ return el !== undefined;
+ });
});
}
}
diff --git a/public/dashboards/home.json b/public/dashboards/home.json
index 5825f849375..c3ed1017bad 100644
--- a/public/dashboards/home.json
+++ b/public/dashboards/home.json
@@ -9,65 +9,61 @@
"hideControls": true,
"sharedCrosshair": false,
"rows": [
- {
+ {
"collapse": false,
"editable": true,
- "height": "90px",
+ "height": "25px",
"panels": [
{
"content": "
\n Home Dashboard\n
",
"editable": true,
"id": 1,
+ "links": [],
"mode": "html",
"span": 12,
"style": {},
"title": "",
"transparent": true,
- "type": "text",
- "links": []
+ "type": "text"
}
],
"title": "New row"
- },
- {
+ },
+ {
"collapse": false,
"editable": true,
"height": "510px",
"panels": [
- {
- "id": 2,
- "limit": 10,
- "mode": "starred",
- "query": "",
- "span": 3.75,
- "tags": [],
- "title": "Starred dashboards",
- "type": "dashlist"
- },
{
"id": 3,
- "limit": 10,
- "mode": "recently viewed",
+ "limit": 4,
+ "links": [],
"query": "",
- "span": 3.75,
+ "span": 7,
"tags": [],
- "title": "Recently viewed dashboards",
- "type": "dashlist"
+ "title": "",
+ "transparent": false,
+ "type": "dashlist",
+ "recent": true,
+ "search": false,
+ "starred": true,
+ "headings": true
},
{
- "title": "",
- "error": false,
- "span": 4.5,
"editable": true,
- "type": "pluginlist",
- "isNew": true,
+ "error": false,
"id": 4,
- "links": []
+ "isNew": true,
+ "links": [],
+ "span": 5,
+ "title": "",
+ "transparent": false,
+ "type": "pluginlist"
}
],
"title": "Row"
- }
- ],
+ }
+ ],
"time": {
"from": "now-6h",
"to": "now"
@@ -105,7 +101,7 @@
"annotations": {
"list": []
},
- "schemaVersion": 9,
- "version": 5,
+ "schemaVersion": 12,
+ "version": 2,
"links": []
}
diff --git a/public/sass/components/_panel_dashlist.scss b/public/sass/components/_panel_dashlist.scss
index a69d1654e04..4256c80ac82 100644
--- a/public/sass/components/_panel_dashlist.scss
+++ b/public/sass/components/_panel_dashlist.scss
@@ -1,5 +1,11 @@
-.dashlist-item {
+.dashlist-section-header {
+ margin-bottom: $spacer;
+ color: $text-color-weak;
+}
+
+.dashlist-section {
+ margin-bottom: $spacer;
}
.dashlist-link {
diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss
index 2b04f0e9b29..9249af41077 100644
--- a/public/sass/pages/_dashboard.scss
+++ b/public/sass/pages/_dashboard.scss
@@ -278,11 +278,11 @@ div.flot-text {
.dashboard-header {
font-family: $headings-font-family;
- font-size: $font-size-h2;
+ font-size: $font-size-h3;
text-align: center;
span {
display: inline-block;
@include brand-bottom-border();
- padding: 1.2rem .5rem .4rem .5rem;
+ padding: 0.5rem .5rem .2rem .5rem;
}
}
diff --git a/tsconfig.json b/tsconfig.json
index 43a3888f711..0afaa053449 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,33 +6,13 @@
"noImplicitAny": false,
"target": "es5",
"rootDir": "public/",
+ "sourceRoot": "public/",
"module": "system",
"noEmitOnError": true,
- "emitDecoratorMetadata": true
+ "emitDecoratorMetadata": true,
+ "experimentalDecorators": true
},
"files": [
- "public/app/app.ts",
- "public/app/core/controllers/grafana_ctrl.ts",
- "public/app/core/controllers/signup_ctrl.ts",
- "public/app/core/core.ts",
- "public/app/core/core_module.ts",
- "public/app/core/directives/array_join.ts",
- "public/app/core/directives/give_focus.ts",
- "public/app/core/filters/filters.ts",
- "public/app/core/routes/bundle_loader.ts",
- "public/app/core/table_model.ts",
- "public/app/core/time_series.ts",
- "public/app/core/utils/datemath.ts",
- "public/app/core/utils/flatten.ts",
- "public/app/core/utils/rangeutil.ts",
- "public/app/features/dashboard/timepicker/timepicker.ts",
- "public/app/features/panel/panel_meta.ts",
- "public/app/plugins/datasource/influxdb/influx_query.ts",
- "public/app/plugins/datasource/influxdb/query_part.ts",
- "public/app/plugins/panels/table/controller.ts",
- "public/app/plugins/panels/table/editor.ts",
- "public/app/plugins/panels/table/module.ts",
- "public/app/plugins/panels/table/renderer.ts",
- "public/app/plugins/panels/table/transformers.ts"
+ "public/app/**/*.ts"
]
-}
\ No newline at end of file
+}