Commit 546d489d by Torkel Ödegaard

dashboard_history: restored unsaved changes modal to simple cancel, discard, save

parent 88da3a99
...@@ -13,6 +13,7 @@ define([ ...@@ -13,6 +13,7 @@ define([
'./viewStateSrv', './viewStateSrv',
'./time_srv', './time_srv',
'./unsavedChangesSrv', './unsavedChangesSrv',
'./unsaved_changes_modal',
'./timepicker/timepicker', './timepicker/timepicker',
'./graphiteImportCtrl', './graphiteImportCtrl',
'./impression_store', './impression_store',
......
...@@ -134,34 +134,31 @@ function(angular, _) { ...@@ -134,34 +134,31 @@ function(angular, _) {
return currentJson !== originalJson; return currentJson !== originalJson;
}; };
p.open_modal = function() { p.discardChanges = function() {
var tracker = this; this.original = null;
var dashboard = this.current; this.gotoNext();
};
var modalScope = this.scope.$new();
var clone = dashboard.getSaveModelClone();
modalScope.clone = clone; p.open_modal = function() {
modalScope.ignore = function() { $rootScope.appEvent('show-modal', {
tracker.original = null; templateHtml: '<unsaved-changes-modal dismiss="dismiss()"></unsaved-changes-modal>',
tracker.goto_next(); modalClass: 'modal--narrow confirm-modal'
}; });
};
p.saveChanges = function() {
var self = this;
var cancel = $rootScope.$on('dashboard-saved', function() { var cancel = $rootScope.$on('dashboard-saved', function() {
cancel(); cancel();
$timeout(function() { $timeout(function() {
tracker.goto_next(); self.gotoNext();
}); });
}); });
$rootScope.appEvent('show-modal', { $rootScope.appEvent('save-dashboard');
src: 'public/app/partials/unsaved-changes.html',
scope: modalScope,
modalClass: 'modal--narrow'
});
}; };
p.goto_next = function() { p.gotoNext = function() {
var baseLen = $location.absUrl().length - $location.url().length; var baseLen = $location.absUrl().length - $location.url().length;
var nextUrl = this.next.substring(baseLen); var nextUrl = this.next.substring(baseLen);
$location.url(nextUrl); $location.url(nextUrl);
...@@ -169,7 +166,8 @@ function(angular, _) { ...@@ -169,7 +166,8 @@ function(angular, _) {
this.Tracker = Tracker; this.Tracker = Tracker;
this.init = function(dashboard, scope) { this.init = function(dashboard, scope) {
return new Tracker(dashboard, scope, 1000); this.tracker = new Tracker(dashboard, scope, 1000);
return this.tracker;
}; };
}); });
}); });
///<reference path="../../headers/common.d.ts" />
import coreModule from 'app/core/core_module';
const template = `
<div class="modal-body">
<div class="modal-header">
<h2 class="modal-header-title">
<i class="fa fa-exclamation"></i>
<span class="p-l-1">Unsaved changes</span>
</h2>
<a class="modal-header-close" ng-click="dismiss();">
<i class="fa fa-remove"></i>
</a>
</div>
<div class="modal-content text-center">
<div class="confirm-modal-text">
What do you want to do?
</div>
<div class="confirm-modal-buttons">
<button type="button" class="btn btn-inverse" ng-click="ctrl.dismiss()">Cancel</button>
<button type="button" class="btn btn-danger" ng-click="ctrl.discard()">Discard</button>
<button type="button" class="btn btn-success" ng-click="ctrl.save()">Save</button>
</div>
</div>
</div>
`;
export class UnsavedChangesModalCtrl {
clone: any;
dismiss: () => void;
/** @ngInject */
constructor(private $rootScope, private unsavedChangesSrv) {
}
discard() {
this.dismiss();
this.unsavedChangesSrv.tracker.discardChanges();
}
save() {
this.dismiss();
this.unsavedChangesSrv.tracker.saveChanges();
}
}
export function unsavedChangesModalDirective() {
return {
restrict: 'E',
template: template,
controller: UnsavedChangesModalCtrl,
bindToController: true,
controllerAs: 'ctrl',
scope: {dismiss: "&"}
};
}
coreModule.directive('unsavedChangesModal', unsavedChangesModalDirective);
<div class="modal-body" ng-controller="SaveDashboardMessageCtrl" ng-init="init();">
<div class="modal-header">
<h2 class="modal-header-title">
<i class="fa fa-exclamation"></i>
<span class="p-l-1">Unsaved changes</span>
</h2>
<a class="modal-header-close" ng-click="dismiss();">
<i class="fa fa-remove"></i>
</a>
</div>
<form name="saveMessage" ng-submit="saveVersion(saveMessage.$valid)" class="modal-content" novalidate>
<h6 class="text-center">
You're leaving without saving your changes, are you sure you want to leave? To save, add a small note to describe the changes in this version.
</h6>
<div class="p-t-2">
<div class="gf-form">
<label class="gf-form-hint">
<input
type="text"
name="message"
class="gf-form-input"
placeholder="Updates to &hellip;"
give-focus="true"
ng-model="clone.message"
ng-model-options="{allowInvalid: true}"
ng-keydown="keyDown($event)"
ng-maxlength="clone.max"
autocomplete="off"
required />
<small class="gf-form-hint-text muted" ng-cloak>
<span ng-class="{'text-error': saveMessage.message.$invalid && saveMessage.message.$dirty }">
{{clone.message.length || 0}}
</span>
/ {{clone.max}} characters
</small>
</label>
</div>
</div>
<div class="gf-form-button-row text-center">
<button type="submit" class="btn btn-success" ng-disabled="saveMessage.$invalid">
Save changes
</button>
<button type="button" class="btn btn-danger" ng-click="ignore();dismiss()">
Discard changes and leave
</button>
<button class="btn btn-inverse" ng-click="dismiss();">Cancel</button>
</div>
</form>
</div>
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