Ver código fonte

HUE-1408 [sqoop2] Ask confirmation when deleting

Abraham Elmahrek 12 anos atrás
pai
commit
a3f23b9

+ 28 - 2
apps/sqoop/src/sqoop/templates/app.mako

@@ -116,7 +116,7 @@ ${ commonheader(None, "sqoop", user, "40px") | n,unicode }
               </a>
             </li>
             <li data-bind="visible: $root.job().persisted">
-              <a data-placement="right" rel="tooltip" title="${_('Delete the job')}" href="#job/delete">
+              <a data-bind="click: $root.showDeleteJobModal.bind($root)" data-placement="right" rel="tooltip" title="${_('Delete the job')}" href="javascript:void(0);">
                 <i class="icon-remove"></i> ${_('Delete')}
               </a>
             </li>
@@ -223,6 +223,32 @@ ${ commonheader(None, "sqoop", user, "40px") | n,unicode }
   </div>
 </div>
 
+<div data-bind="template: {'name': modal.name(), 'if': modal.name()}" id="modal-container" class="modal hide fade"></div>
+
+
+<script type="text/html" id="delete-job-modal">
+<div class="modal-header">
+  <a href="javascript:void(0);" class="close" data-dismiss="modal">&times;</a>
+  <h3 class="message">${_("Are you sure you'd like to delete this job?") }</h3>
+</div>
+<div class="modal-body"></div>
+<div class="modal-footer" data-bind="if: $root.job">
+  <a class="btn" href="javascript:void(0);" data-dismiss="modal">${_('No')}</a>
+  <a data-bind="routie: {'url': 'job/delete/' + $root.job().id(), 'bubble': true}" data-dismiss="modal" class="btn btn-primary" href="javascript:void(0);">${_('Yes')}</a>
+</div>
+</script>
+
+<script type="text/html" id="delete-connection-modal">
+<div class="modal-header">
+  <a href="javascript:void(0);" class="close" data-dismiss="modal">&times;</a>
+  <h3 class="message">${_("Are you sure you'd like to delete this connection?") }</h3>
+</div>
+<div class="modal-body"></div>
+<div class="modal-footer" data-bind="if: $root.connection">
+  <a class="btn" href="javascript:void(0);" data-dismiss="modal">${_('No')}</a>
+  <a data-bind="routie: {'url': 'connection/delete/' + $root.connection().id(), 'bubble': true}" data-dismiss="modal" class="btn btn-primary" href="javascript:void(0);">${_('Yes')}</a>
+</div>
+</script>
 
 <script type="text/html" id="job-list-item">
 <h4 style="display: inline-block">
@@ -311,7 +337,7 @@ ${ commonheader(None, "sqoop", user, "40px") | n,unicode }
         <a data-bind="routie: 'connection/edit/' + $root.connection().id()" href="javascript:void(0);" class="subbtn" style="margin-left: 5px">
           <i class="icon-edit"></i> ${_('Edit')}
         </a>
-        <a data-bind="routie: 'connection/delete/' + $root.connection().id()" href="javascript:void(0);" class="subbtn" style="margin-left: 5px">
+        <a data-bind="click: $root.showDeleteConnectionModal.bind($root)" href="javascript:void(0);" class="subbtn" style="margin-left: 5px">
           <i class="icon-remove"></i> ${_('Delete')}
         </a>
       </div>

+ 21 - 0
apps/sqoop/static/js/sqoop.js

@@ -91,6 +91,9 @@ var viewModel = new (function() {
   self.jobs = ko.observableArray();
   self.connection = ko.observable();
   self.editConnection = ko.observable();
+  self.modal = {
+    'name': ko.observable()
+  };
   self.filter = ko.observable("");
   self.shownSection = ko.observable("");
   self.isDirty = ko.observable(false);
@@ -354,6 +357,24 @@ var viewModel = new (function() {
       }
     }
     return null;
+  };
+
+  self.showModal = function(name) {
+    var self = this;
+    self.modal.name(name);
+    $('#modal-container').modal();
+  };
+
+  self.showDeleteJobModal = function() {
+    var self = this;
+    var name = 'delete-job-modal';
+    self.showModal(name);
+  };
+
+  self.showDeleteConnectionModal = function() {
+    var self = this;
+    var name = 'delete-connection-modal';
+    self.showModal(name);
   }
 })();
 

+ 10 - 2
apps/sqoop/static/js/sqoop.utils.js

@@ -42,9 +42,17 @@ function fetcher_success(name, Node, options) {
 ko.bindingHandlers.routie = {
   init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
     $(element).click(function() {
-      var url = ko.utils.unwrapObservable(valueAccessor());
+      var obj = ko.utils.unwrapObservable(valueAccessor());
+      var url = null;
+      var bubble = false;
+      if ($.isPlainObject(obj)) {
+        url = obj.url;
+        bubble = !!obj.bubble;
+      } else {
+        url = obj;
+      }
       routie(url);
-      return false;
+      return bubble;
     });
   }
 };