From c98e15903eeb68a215ce6d1dcdce50473585a166 Mon Sep 17 00:00:00 2001 From: Daniel Lee Date: Wed, 13 Dec 2017 10:54:08 +0100 Subject: [PATCH] dashfolder: settings page for folder with rename and delete. Fixes #10120 --- public/app/core/routes/routes.ts | 5 ++ public/app/features/dashboard/all.ts | 2 + .../features/dashboard/folder_page_loader.ts | 20 ++++- .../dashboard/folder_settings_ctrl.ts | 83 +++++++++++++++++++ .../dashboard/partials/folder_settings.html | 24 ++++++ 5 files changed, 132 insertions(+), 2 deletions(-) create mode 100644 public/app/features/dashboard/folder_settings_ctrl.ts create mode 100644 public/app/features/dashboard/partials/folder_settings.html diff --git a/public/app/core/routes/routes.ts b/public/app/core/routes/routes.ts index 90612d4c4e2..9c975f6465a 100644 --- a/public/app/core/routes/routes.ts +++ b/public/app/core/routes/routes.ts @@ -83,6 +83,11 @@ function setupAngularRoutes($routeProvider, $locationProvider) { controller : 'FolderPermissionsCtrl', controllerAs: 'ctrl', }) + .when('/dashboards/folder/:folderId/:type/:slug/settings', { + templateUrl: 'public/app/features/dashboard/partials/folder_settings.html', + controller : 'FolderSettingsCtrl', + controllerAs: 'ctrl', + }) .when('/dashboards/folder/:folderId/:type/:slug', { templateUrl: 'public/app/features/dashboard/partials/folder_dashboards.html', controller : 'FolderDashboardsCtrl', diff --git a/public/app/features/dashboard/all.ts b/public/app/features/dashboard/all.ts index e9ca2a854be..9e8d034eb21 100644 --- a/public/app/features/dashboard/all.ts +++ b/public/app/features/dashboard/all.ts @@ -32,11 +32,13 @@ import coreModule from 'app/core/core_module'; import {DashboardListCtrl} from './dashboard_list_ctrl'; import {FolderDashboardsCtrl} from './folder_dashboards_ctrl'; import {FolderPermissionsCtrl} from './folder_permissions_ctrl'; +import {FolderSettingsCtrl} from './folder_settings_ctrl'; import {DashboardImportCtrl} from './dashboard_import_ctrl'; import {CreateFolderCtrl} from './create_folder_ctrl'; coreModule.controller('DashboardListCtrl', DashboardListCtrl); coreModule.controller('FolderDashboardsCtrl', FolderDashboardsCtrl); coreModule.controller('FolderPermissionsCtrl', FolderPermissionsCtrl); +coreModule.controller('FolderSettingsCtrl', FolderSettingsCtrl); coreModule.controller('DashboardImportCtrl', DashboardImportCtrl); coreModule.controller('CreateFolderCtrl', CreateFolderCtrl); diff --git a/public/app/features/dashboard/folder_page_loader.ts b/public/app/features/dashboard/folder_page_loader.ts index 98ab8f2b431..570265d8bff 100644 --- a/public/app/features/dashboard/folder_page_loader.ts +++ b/public/app/features/dashboard/folder_page_loader.ts @@ -29,12 +29,19 @@ export class FolderPageLoader { id: 'manage-folder-permissions', text: 'Permissions', url: '/dashboards/permissions' + }, + { + active: activeChildId === 'manage-folder-settings', + icon: 'fa fa-fw fa-cog', + id: 'manage-folder-settings', + text: 'Settings', + url: '/dashboards/settings' } ] } }; - this.backendSrv.getDashboard(this.$routeParams.type, this.$routeParams.slug).then(result => { + return this.backendSrv.getDashboard(this.$routeParams.type, this.$routeParams.slug).then(result => { const folderTitle = result.dashboard.title; ctrl.navModel.main.text = ''; ctrl.navModel.main.breadcrumbs = [ @@ -42,13 +49,22 @@ export class FolderPageLoader { { title: folderTitle } ]; - const folderUrl = `/dashboards/folder/${folderId}/${result.meta.type}/${result.meta.slug}`; + const folderUrl = this.createFolderUrl(folderId, result.meta.type, result.meta.slug); const dashTab = _.find(ctrl.navModel.main.children, { id: 'manage-folder-dashboards' }); dashTab.url = folderUrl; const permTab = _.find(ctrl.navModel.main.children, { id: 'manage-folder-permissions' }); permTab.url = folderUrl + '/permissions'; + + const settingsTab = _.find(ctrl.navModel.main.children, { id: 'manage-folder-settings' }); + settingsTab.url = folderUrl + '/settings'; + + return result; }); } + + createFolderUrl(folderId: number, type: string, slug: string) { + return `/dashboards/folder/${folderId}/${type}/${slug}`; + } } diff --git a/public/app/features/dashboard/folder_settings_ctrl.ts b/public/app/features/dashboard/folder_settings_ctrl.ts new file mode 100644 index 00000000000..7d846f8ec60 --- /dev/null +++ b/public/app/features/dashboard/folder_settings_ctrl.ts @@ -0,0 +1,83 @@ +import {FolderPageLoader} from './folder_page_loader'; +import appEvents from 'app/core/app_events'; + +export class FolderSettingsCtrl { + folderPageLoader: FolderPageLoader; + navModel: any; + folderId: number; + canSave = false; + dashboard: any; + meta: any; + + /** @ngInject */ + constructor(private backendSrv, navModelSrv, private $routeParams, private $location) { + if (this.$routeParams.folderId && this.$routeParams.type && this.$routeParams.slug) { + this.folderId = $routeParams.folderId; + + this.folderPageLoader = new FolderPageLoader(this.backendSrv, this.$routeParams); + this.folderPageLoader.load(this, this.folderId, 'manage-folder-settings') + .then(result => { + this.dashboard = result.dashboard; + this.meta = result.meta; + this.canSave = result.meta.canSave; + }); + } + } + + save() { + return this.backendSrv.saveDashboard(this.dashboard, {overwrite: false}) + .then(result => { + var folderUrl = this.folderPageLoader.createFolderUrl(this.folderId, this.meta.type, result.slug); + if (folderUrl !== this.$location.path()) { + this.$location.url(folderUrl + '/settings'); + } + + appEvents.emit('dashboard-saved'); + appEvents.emit('alert-success', ['Folder saved']); + }) + .catch(this.handleSaveFolderError); + } + + delete(evt) { + if (evt) { + evt.stopPropagation(); + evt.preventDefault(); + } + + appEvents.emit('confirm-modal', { + title: 'Delete', + text: `Do you want to delete this folder and all its dashboards?`, + icon: 'fa-trash', + yesText: 'Delete', + onConfirm: () => { + return this.backendSrv.delete(`/api/dashboards/${this.meta.type}/${this.meta.slug}`).then(() => { + appEvents.emit('alert-success', ['Folder deleted']); + this.$location.url('/dashboards'); + }); + } + }); + } + + handleSaveFolderError(err) { + if (err.data && err.data.status === 'version-mismatch') { + err.isHandled = true; + + appEvents.emit('confirm-modal', { + title: 'Conflict', + text: 'Someone else has updated this folder.', + text2: 'Would you still like to save this folder?', + yesText: 'Save & Overwrite', + icon: 'fa-warning', + onConfirm: () => { + this.backendSrv.saveDashboard(this.dashboard, {overwrite: true}); + } + }); + } + + if (err.data && err.data.status === 'name-exists') { + err.isHandled = true; + + appEvents.emit('alert-error', ['A folder or dashboard with this name exists already.']); + } + } +} diff --git a/public/app/features/dashboard/partials/folder_settings.html b/public/app/features/dashboard/partials/folder_settings.html new file mode 100644 index 00000000000..3d04b292ce0 --- /dev/null +++ b/public/app/features/dashboard/partials/folder_settings.html @@ -0,0 +1,24 @@ + + +
+ +
+

Folder Settings

+
+
+ + +
+
+ + +
+
+
+