diff options
Diffstat (limited to 'app/assets/javascripts/pipelines')
6 files changed, 53 insertions, 23 deletions
diff --git a/app/assets/javascripts/pipelines/components/graph/action_component.vue b/app/assets/javascripts/pipelines/components/graph/action_component.vue index 6a8eee1b48d..29ee73a2a6f 100644 --- a/app/assets/javascripts/pipelines/components/graph/action_component.vue +++ b/app/assets/javascripts/pipelines/components/graph/action_component.vue @@ -31,6 +31,12 @@ export default { type: String, required: true, }, + + requestFinishedFor: { + type: String, + required: false, + default: '', + }, }, data() { return { @@ -45,11 +51,12 @@ export default { return `${actionIconDash} js-icon-${actionIconDash}`; }, }, - created() { - eventHub.$on('graphActionFinished', this.updateDisabled); - }, - beforeDestroy() { - eventHub.$off('graphActionFinished', this.updateDisabled); + watch: { + requestFinishedFor() { + if (this.requestFinishedFor === this.linkRequested) { + this.isDisabled = false; + } + }, }, methods: { onClickAction() { @@ -58,11 +65,6 @@ export default { this.linkRequested = this.link; this.isDisabled = true; }, - updateDisabled(actionUrl) { - if (actionUrl === this.linkRequested) { - this.isDisabled = false; - } - }, }, }; </script> @@ -72,8 +74,8 @@ export default { @click="onClickAction" v-tooltip :title="tooltipText" - class="js-ci-action btn btn-blank btn-transparent -ci-action-icon-container ci-action-icon-wrapper" + class="js-ci-action btn btn-blank +btn-transparent ci-action-icon-container ci-action-icon-wrapper" :class="cssClass" data-container="body" :disabled="isDisabled" diff --git a/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue b/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue index a467b8c7a67..4027d26098f 100644 --- a/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue +++ b/app/assets/javascripts/pipelines/components/graph/dropdown_job_component.vue @@ -42,6 +42,11 @@ export default { type: Object, required: true, }, + requestFinishedFor: { + type: String, + required: false, + default: '', + }, }, computed: { @@ -56,9 +61,9 @@ export default { methods: { /** - * When the user right clicks or cmd/ctrl + click in the job name - * the dropdown should not be closed and the link should open in another tab, - * so we stop propagation of the click event inside the dropdown. + * When the user right clicks or cmd/ctrl + click in the job name or the action icon + * the dropdown should not be closed so we stop propagation + * of the click event inside the dropdown. * * Since this component is rendered multiple times per page we need to guarantee we only * target the click event of this component. @@ -105,6 +110,7 @@ export default { <job-component :job="item" css-class-job-name="mini-pipeline-graph-dropdown-item" + :request-finished-for="requestFinishedFor" /> </li> </ul> diff --git a/app/assets/javascripts/pipelines/components/graph/graph_component.vue b/app/assets/javascripts/pipelines/components/graph/graph_component.vue index 260b9c949d7..7b8a5edcbff 100644 --- a/app/assets/javascripts/pipelines/components/graph/graph_component.vue +++ b/app/assets/javascripts/pipelines/components/graph/graph_component.vue @@ -7,7 +7,6 @@ export default { StageColumnComponent, LoadingIcon, }, - props: { isLoading: { type: Boolean, @@ -17,6 +16,11 @@ export default { type: Object, required: true, }, + requestFinishedFor: { + type: String, + required: false, + default: '', + }, }, computed: { @@ -70,6 +74,7 @@ export default { :key="stage.name" :stage-connector-class="stageConnectorClass(index, stage)" :is-first-column="isFirstColumn(index)" + :request-finished-for="requestFinishedFor" /> </ul> </div> diff --git a/app/assets/javascripts/pipelines/components/graph/job_component.vue b/app/assets/javascripts/pipelines/components/graph/job_component.vue index f08143d7a95..4fcd4b79f4a 100644 --- a/app/assets/javascripts/pipelines/components/graph/job_component.vue +++ b/app/assets/javascripts/pipelines/components/graph/job_component.vue @@ -33,7 +33,6 @@ export default { ActionComponent, JobNameComponent, }, - directives: { tooltip, }, @@ -42,14 +41,17 @@ export default { type: Object, required: true, }, - cssClassJobName: { type: String, required: false, default: '', }, + requestFinishedFor: { + type: String, + required: false, + default: '', + }, }, - computed: { status() { return this.job && this.job.status ? this.job.status : {}; @@ -124,7 +126,7 @@ export default { :tooltip-text="status.action.title" :link="status.action.path" :action-icon="status.action.icon" + :request-finished-for="requestFinishedFor" /> - </div> </template> diff --git a/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue b/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue index c22ec75e5ec..5461fdbbadd 100644 --- a/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue +++ b/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue @@ -29,6 +29,12 @@ export default { required: false, default: '', }, + + requestFinishedFor: { + type: String, + required: false, + default: '', + }, }, methods: { @@ -74,6 +80,7 @@ export default { <dropdown-job-component v-if="job.size > 1" :job="job" + :request-finished-for="requestFinishedFor" /> </li> diff --git a/app/assets/javascripts/pipelines/pipeline_details_bundle.js b/app/assets/javascripts/pipelines/pipeline_details_bundle.js index a61bfbe25f3..b743364ff43 100644 --- a/app/assets/javascripts/pipelines/pipeline_details_bundle.js +++ b/app/assets/javascripts/pipelines/pipeline_details_bundle.js @@ -25,6 +25,7 @@ export default () => { data() { return { mediator, + requestFinishedFor: null, }; }, created() { @@ -35,12 +36,17 @@ export default () => { }, methods: { postAction(action) { - this.mediator.service.postAction(action) + // Click was made, reset this variable + this.requestFinishedFor = null; + + this.mediator.service + .postAction(action) .then(() => { this.mediator.refreshPipeline(); - eventHub.$emit('graphActionFinished', action); + this.requestFinishedFor = action; }) .catch(() => { + this.requestFinishedFor = action; Flash(__('An error occurred while making the request.')); eventHub.$emit('graphActionFinished', action); }); @@ -51,6 +57,7 @@ export default () => { props: { isLoading: this.mediator.state.isLoading, pipeline: this.mediator.store.state.pipeline, + requestFinishedFor: this.requestFinishedFor, }, }); }, @@ -75,7 +82,8 @@ export default () => { }, methods: { postAction(action) { - this.mediator.service.postAction(action.path) + this.mediator.service + .postAction(action.path) .then(() => this.mediator.refreshPipeline()) .catch(() => Flash(__('An error occurred while making the request.'))); }, |