You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dolphinscheduler.apache.org by li...@apache.org on 2020/02/17 11:09:18 UTC

[incubator-dolphinscheduler] branch dev updated: Fix the bug #1968. (#1969)

This is an automated email from the ASF dual-hosted git repository.

lidongdai pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-dolphinscheduler.git


The following commit(s) were added to refs/heads/dev by this push:
     new afd5c75  Fix the bug #1968. (#1969)
afd5c75 is described below

commit afd5c75cd27c9fe1a7efcafbed92bf28fc3996e5
Author: zhukai <bo...@qq.com>
AuthorDate: Mon Feb 17 19:09:10 2020 +0800

    Fix the bug #1968. (#1969)
    
    When create a new task or edit an exist task.The task details window will be open.
    Then if delete the task node or click the DataSource menu. And the task details window still open.
    
    The task details window should be close.
---
 .../src/js/conf/home/pages/dag/_source/dag.js      | 36 ++++++++++++++++------
 .../src/js/conf/home/pages/dag/_source/dag.vue     | 22 ++++++++-----
 .../home/pages/dag/_source/plugIn/jsPlumbHandle.js |  7 ++++-
 3 files changed, 48 insertions(+), 17 deletions(-)

diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js
index 8225673..240f324 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.js
@@ -49,10 +49,16 @@ Dag.prototype.setConfig = function (o) {
  * create dag
  */
 Dag.prototype.create = function () {
+  let self = this
   jsPlumb.ready(() => {
     JSP.init({
       dag: this.dag,
-      instance: this.instance
+      instance: this.instance,
+      options: {
+        onRemoveNodes ($id) {
+          self.dag.removeEventModelById($id)
+        }
+      }
     })
 
     // init event
@@ -108,7 +114,7 @@ Dag.prototype.backfill = function (arg) {
         tmp.push(locationsValue2[i])
       }
     }
-    
+
     function copy (array) {
       let newArray = []
       for(let item of array) {
@@ -117,7 +123,7 @@ Dag.prototype.backfill = function (arg) {
       return  newArray;
     }
 
-    
+
     let newArr = copy(arr)
     function getNewArr() {
       for(let i= 0; i<newArr.length; i++) {
@@ -231,7 +237,7 @@ Dag.prototype.backfill = function (arg) {
         for(let i = 0; i<listarrs.length; i++) {
           delete(listarrs[i].id)
         }
-        
+
         for(let a = 0; a<listarr.length; a++) {
           dataObject[listarr[a].id] = listarrs[a]
         }
@@ -250,9 +256,9 @@ Dag.prototype.backfill = function (arg) {
             }
           };
         }
-        
+
         lastchildren = lastchildren.sort(createComparisonFunction('x'))
-        
+
         // Coordinate value of each leaf node
         for(let a = 0; a<lastchildren.length; a++) {
           dataObject[lastchildren[a].id].y = (a+1)*120
@@ -280,12 +286,18 @@ Dag.prototype.backfill = function (arg) {
         if(countTree>1) {
           dataObject[Object.keys(locationsValue1)[0]].y = (countTree/2)*120+50
         }
-    
+
     locationsValue = dataObject
+    let self = this
     jsPlumb.ready(() => {
       JSP.init({
         dag: this.dag,
-        instance: this.instance
+        instance: this.instance,
+        options: {
+          onRemoveNodes ($id) {
+            self.dag.removeEventModelById($id)
+          }
+        }
       })
       // Backfill
       JSP.jspBackfill({
@@ -298,10 +310,16 @@ Dag.prototype.backfill = function (arg) {
       })
     })
   } else {
+    let self = this
     jsPlumb.ready(() => {
       JSP.init({
         dag: this.dag,
-        instance: this.instance
+        instance: this.instance,
+        options: {
+          onRemoveNodes ($id) {
+            self.dag.removeEventModelById($id)
+          }
+        }
       })
       // Backfill
       JSP.jspBackfill({
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue
index 40b6d85..247f473 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/dag.vue
@@ -61,7 +61,7 @@
           <span v-if="name"  class="copy-name" @click="_copyName" :data-clipboard-text="name"><em class="ans-icon-copy" data-container="body"  data-toggle="tooltip" :title="$t('Copy name')" ></em></span>
         </div>
         <div class="save-btn">
-          <div class="operation" style="vertical-align: middle;"> 
+          <div class="operation" style="vertical-align: middle;">
             <a href="javascript:"
                v-for="(item,$index) in toolOperList"
                :class="_operationClass(item)"
@@ -71,14 +71,14 @@
               <x-button type="text" data-container="body" :icon="item.icon" v-tooltip.light="item.desc"></x-button>
             </a>
           </div>
-          <x-button 
-                  type="primary" 
+          <x-button
+                  type="primary"
                   v-tooltip.light="$t('Format DAG')"
-                  icon="ans-icon-triangle-solid-right" 
-                  size="xsmall" 
+                  icon="ans-icon-triangle-solid-right"
+                  size="xsmall"
                   data-container="body"
                   v-if="type === 'instance'"
-                  style="vertical-align: middle;" 
+                  style="vertical-align: middle;"
                   @click="dagAutomaticLayout">
           </x-button>
           <x-button
@@ -169,7 +169,7 @@
       // DAG automatic layout
       dagAutomaticLayout() {
         $('#canvas').html('')
-        
+
       // Destroy round robin
         Dag.init({
         dag: this,
@@ -527,6 +527,11 @@
             }
           })
         })
+      },
+      removeEventModelById ($id) {
+        if(eventModel && this.taskId == $id){
+          eventModel.remove()
+        }
       }
     },
     watch: {
@@ -580,6 +585,9 @@
       clearInterval(this.setIntervalP)
     },
     destroyed () {
+      if (eventModel) {
+        eventModel.remove()
+      }
     },
     computed: {
       ...mapState('dag', ['tasks', 'locations', 'connects', 'isEditDag', 'name'])
diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js
index 6523a1c..454dfc7 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/plugIn/jsPlumbHandle.js
@@ -58,11 +58,13 @@ let JSP = function () {
 /**
  * dag init
  */
-JSP.prototype.init = function ({ dag, instance }) {
+JSP.prototype.init = function ({ dag, instance, options }) {
   // Get the dag component instance
   this.dag = dag
   // Get jsplumb instance
   this.JspInstance = instance
+  // Get JSP options
+  this.options = options || {}
   // Register jsplumb connection type and configuration
   this.JspInstance.registerConnectionType('basic', {
     anchor: 'Continuous',
@@ -494,6 +496,9 @@ JSP.prototype.removeNodes = function ($id) {
 
   // delete dom
   $(`#${$id}`).remove()
+
+  // callback onRemoveNodes event
+  this.options&&this.options.onRemoveNodes&&this.options.onRemoveNodes($id)
 }
 
 /**