diff options
Diffstat (limited to 'app/assets/javascripts/pipelines/pipeline_details_bundle.js')
-rw-r--r-- | app/assets/javascripts/pipelines/pipeline_details_bundle.js | 112 |
1 files changed, 59 insertions, 53 deletions
diff --git a/app/assets/javascripts/pipelines/pipeline_details_bundle.js b/app/assets/javascripts/pipelines/pipeline_details_bundle.js index 705a60b3ba2..1119a65e5be 100644 --- a/app/assets/javascripts/pipelines/pipeline_details_bundle.js +++ b/app/assets/javascripts/pipelines/pipeline_details_bundle.js @@ -9,65 +9,71 @@ import eventHub from './event_hub'; Vue.use(Translate); -document.addEventListener('DOMContentLoaded', () => { +export default () => { const dataset = document.querySelector('.js-pipeline-details-vue').dataset; const mediator = new PipelinesMediator({ endpoint: dataset.endpoint }); mediator.fetchPipeline(); - // eslint-disable-next-line - new Vue({ - el: '#js-pipeline-graph-vue', - components: { - pipelineGraph, - }, - data() { - return { - mediator, - }; - }, - render(createElement) { - return createElement('pipeline-graph', { - props: { - isLoading: this.mediator.state.isLoading, - pipeline: this.mediator.store.state.pipeline, - }, - }); - }, - }); + const pipelineGraphEl = document.querySelector('#js-pipeline-graph-vue'); + if (pipelineGraphEl) { + // eslint-disable-next-line + new Vue({ + el: pipelineGraphEl, + components: { + pipelineGraph, + }, + data() { + return { + mediator, + }; + }, + render(createElement) { + return createElement('pipeline-graph', { + props: { + isLoading: this.mediator.state.isLoading, + pipeline: this.mediator.store.state.pipeline, + }, + }); + }, + }); + } - // eslint-disable-next-line - new Vue({ - el: '#js-pipeline-header-vue', - components: { - pipelineHeader, - }, - data() { - return { - mediator, - }; - }, - created() { - eventHub.$on('headerPostAction', this.postAction); - }, - beforeDestroy() { - eventHub.$off('headerPostAction', this.postAction); - }, - methods: { - postAction(action) { - this.mediator.service.postAction(action.path) - .then(() => this.mediator.refreshPipeline()) - .catch(() => Flash(__('An error occurred while making the request.'))); + const pipelineHeaderEl = document.querySelector('#js-pipeline-header-vue'); + if (pipelineHeaderEl) { + // eslint-disable-next-line + new Vue({ + el: pipelineHeaderEl, + components: { + pipelineHeader, + }, + data() { + return { + mediator, + }; }, - }, - render(createElement) { - return createElement('pipeline-header', { - props: { - isLoading: this.mediator.state.isLoading, - pipeline: this.mediator.store.state.pipeline, + created() { + eventHub.$on('headerPostAction', this.postAction); + }, + beforeDestroy() { + eventHub.$off('headerPostAction', this.postAction); + }, + methods: { + postAction(action) { + this.mediator.service.postAction(action.path) + .then(() => this.mediator.refreshPipeline()) + .catch(() => Flash(__('An error occurred while making the request.'))); }, - }); - }, - }); -}); + }, + render(createElement) { + return createElement('pipeline-header', { + props: { + isLoading: this.mediator.state.isLoading, + pipeline: this.mediator.store.state.pipeline, + }, + }); + }, + }); + } +}; |