Add initPipelineDetails to pipelines build path

This commit is contained in:
Clement Ho 2018-02-27 16:17:19 -06:00
parent eb08e1d112
commit e658ca9665
4 changed files with 69 additions and 125 deletions

View File

@ -14,10 +14,10 @@ import CycleAnalyticsStore from './cycle_analytics_store';
Vue.use(Translate);
document.addEventListener('DOMContentLoaded', () => {
$(() => {
const OVERVIEW_DIALOG_COOKIE = 'cycle_analytics_help_dismissed';
const cycleAnalyticsApp = new Vue({
gl.cycleAnalyticsApp = new Vue({
el: '#cycle-analytics',
name: 'CycleAnalytics',
components: {

View File

@ -1,3 +1,7 @@
import initPipelineDetails from '~/pipelines/pipeline_details_bundle';
import initPipelines from '../init_pipelines';
document.addEventListener('DOMContentLoaded', initPipelines);
document.addEventListener('DOMContentLoaded', () => {
initPipelines();
initPipelineDetails();
});

View File

@ -1,73 +1,7 @@
import Vue from 'vue';
import { __ } from '~/locale';
import Flash from '~/flash';
import PipelinesMediator from '~/pipelines/pipeline_details_mediator';
import pipelineGraph from '~/pipelines/components/graph/graph_component.vue';
import pipelineHeader from '~/pipelines/components/header_component.vue';
import eventHub from '~/pipelines/event_hub';
import initPipelineDetails from '~/pipelines/pipeline_details_bundle';
import initPipelines from '../init_pipelines';
document.addEventListener('DOMContentLoaded', () => {
const dataset = document.querySelector('.js-pipeline-details-vue').dataset;
const mediator = new PipelinesMediator({ endpoint: dataset.endpoint });
mediator.fetchPipeline();
initPipelines();
// 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,
},
});
},
});
// 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(() => new 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,
},
});
},
});
initPipelineDetails();
});

View File

@ -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,
},
});
},
});
// 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 pipelineGraphEl = document.querySelector('#js-pipeline-graph-vue');
if (pipelineGraphEl) {
// eslint-disable-next-line
new Vue({
el: pipelineGraphEl,
components: {
pipelineGraph,
},
},
render(createElement) {
return createElement('pipeline-header', {
props: {
isLoading: this.mediator.state.isLoading,
pipeline: this.mediator.store.state.pipeline,
data() {
return {
mediator,
};
},
render(createElement) {
return createElement('pipeline-graph', {
props: {
isLoading: this.mediator.state.isLoading,
pipeline: this.mediator.store.state.pipeline,
},
});
},
});
}
const pipelineHeaderEl = document.querySelector('#js-pipeline-header-vue');
if (pipelineHeaderEl) {
// eslint-disable-next-line
new Vue({
el: pipelineHeaderEl,
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.')));
},
});
},
});
});
},
render(createElement) {
return createElement('pipeline-header', {
props: {
isLoading: this.mediator.state.isLoading,
pipeline: this.mediator.store.state.pipeline,
},
});
},
});
}
};