ux: dashboard settings work progress

This commit is contained in:
Torkel Ödegaard
2017-12-11 16:28:57 +01:00
parent c4b759fe6d
commit 008b9bb3e9
9 changed files with 161 additions and 173 deletions

View File

@@ -78,3 +78,29 @@
<textarea class="gf-form-input" ng-model="ctrl.json" rows="30" spellcheck="false"></textarea>
</div>
</div>
<div class="dashboard-settings__content" ng-if="ctrl.viewId === 'save_as'">
<save-dashboard-as></save-dashboard-as>
</div>
<div class="dashboard-settings__content" ng-if="ctrl.viewId === 'delete'">
<h3 class="dashboard-settings__header">Delete dashboard</h3>
<div ng-if="ctrl.dashboard.meta.canSave">
<div class="p-b-2" ng-if="ctrl.alertCount > 1">
<h5>This dashboard contains {{ctrl.alertCount}} alerts. Deleting this dashboard will also delete those alerts</h5>
<input type="text" class="gf-form-input width-16" style="display: inline-block;" placeholder="Type DELETE to confirm"
ng-model="ctrl.confirmText" ng-change="ctrl.confirmTextChanged()">
</div>
<button class="btn btn-danger" ng-click="ctrl.deleteDashboard()" ng-disabled="ctrl.confirmValid" >
<i class="fa fa-trash"></i>
Delete
</button>
</div>
<div ng-if="!ctrl.dashboard.meta.canSave">
<h5>You cannot delete this dashboard</h5>
</div>
</div>

View File

@@ -1,4 +1,4 @@
import {coreModule} from 'app/core/core';
import {coreModule, appEvents} from 'app/core/core';
import {DashboardModel} from '../dashboard_model';
import $ from 'jquery';
import _ from 'lodash';
@@ -8,6 +8,9 @@ export class SettingsCtrl {
isOpen: boolean;
viewId: string;
json: string;
alertCount: number;
confirmValid: boolean;
confirmText: string;
sections: any[] = [
{title: 'General', id: 'settings', icon: "fa fa-fw fa-sliders"},
@@ -21,7 +24,7 @@ export class SettingsCtrl {
];
/** @ngInject */
constructor(private $scope, private $location, private $rootScope) {
constructor(private $scope, private $location, private $rootScope, private backendSrv, private dashboardSrv) {
// temp hack for annotations and variables editors
// that rely on inherited scope
$scope.dashboard = this.dashboard;
@@ -39,6 +42,10 @@ export class SettingsCtrl {
this.$rootScope.$broadcast("refresh");
});
this.alertCount = _.sumBy(this.dashboard.panels, panel => {
return panel.alert ? 1 : 0;
});
this.onRouteUpdated();
$rootScope.onAppEvent("$routeUpdate", this.onRouteUpdated.bind(this), $scope);
}
@@ -61,6 +68,26 @@ export class SettingsCtrl {
});
}
makeEditable() {
this.dashboard.editable = true;
return this.dashboardSrv.saveDashboard({makeEditable: true, overwrite: false}).then(() => {
// force refresh whole page
window.location.href = window.location.href;
});
}
confirmTextChanged() {
this.confirmValid = this.confirmText === "DELETE";
}
deleteDashboard() {
this.backendSrv.delete('/api/dashboards/db/' + this.dashboard.meta.slug).then(() => {
appEvents.emit('alert-success', ['Dashboard Deleted', this.dashboard.title + ' has been deleted']);
this.$location.url('/');
});
}
onFolderChange(folder) {
this.dashboard.folderId = folder.id;
this.dashboard.meta.folderId = folder.id;