feat: finally stage issue TencentBlueKing#3138

terlinhe · Jul 7, 2021 · 667e6a8 · 667e6a8
1 parent b5dea8b
commit 667e6a8
Showing 1 changed file with 11 additions and 2 deletions.
diff --git a/src/frontend/devops-pipeline/src/components/Stages/Stage.vue b/src/frontend/devops-pipeline/src/components/Stages/Stage.vue
@@ -42,7 +42,7 @@
             <i class="devops-icon icon-right-shape connector-angle"></i>
         </span>
         <template v-if="editable">
-            <span v-bk-clickoutside="toggleAddMenu" v-if="!isFirstStage" class="add-menu" @click.stop="toggleAddMenu(!isAddMenuShow)">
+            <span v-if="!isFirstStage" class="add-menu" @click.stop="toggleAddMenu(!isAddMenuShow)">
                 <i :class="{ [iconCls]: true, 'active': isAddMenuShow }" />
                 <template v-if="isAddMenuShow">
                     <cruve-line class="add-connector connect-line left" :width="60" :height="cruveHeight"></cruve-line>
@@ -66,7 +66,7 @@
                     </div>
                 </template>
             </span>
-            <span v-bk-clickoutside="toggleLastMenu" v-if="isLastStage && !isFinallyStage && editable" @click.stop="toggleLastMenu(!lastAddMenuShow)" class="append-stage pointer">
+            <span v-if="isLastStage && !isFinallyStage && editable" @click.stop="toggleLastMenu(!lastAddMenuShow)" class="append-stage pointer">
                 <i class="add-plus-icon" />
                 <template v-if="lastAddMenuShow">
                     <span class="insert-stage direction">
@@ -316,6 +316,10 @@
             if (this.showCheckedToatal) {
                 Vue.set(this.stage, 'runStage', !this.stageDisabled)
             }
+            document.addEventListener('click', this.hideAddStage)
+        },
+        beforeDestroyed () {
+            window.removeEventListener('click', this.hideAddStage)
         },
         updated () {
             this.updateHeight()
@@ -461,6 +465,11 @@
                 }
             },
 
+            hideAddStage () {
+                this.lastAddMenuShow = false
+                this.isAddMenuShow = false
+            },
+
             startNextStage () {
                 if (this.canTriggerStage && this.isStagePause) {
                     this.toggleReviewDialog({