BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Commit 178ae69b by Phil Hughes
Options

Merge branch '34371-cycle-analitcs-components-vue' into 'master'

Moves cycle analytics components into vue files See merge request gitlab-org/gitlab-ce!14464
parents ba4f7413 b524b9eb
Showing with 369 additions and 402 deletions
app/assets/javascripts/cycle_analytics/components/limit_warning_component.js → app/assets/javascripts/cycle_analytics/components/limit_warning_component.vue
export default { <script>
props: { import tooltip from '../../vue_shared/directives/tooltip';
count: {
type: Number, export default {
required: true, props: {
count: {
type: Number,
required: true,
},
}, },
}, directives: {
template: ` tooltip,
<span v-if="count === 50" class="events-info pull-right"> },
<i class="fa fa-warning has-tooltip" };
aria-hidden="true" </script>
:title="n__('Limited to showing %d event at most', 'Limited to showing %d events at most', 50)" <template>
data-placement="top"></i> <span v-if="count === 50" class="events-info pull-right">
{{ n__('Showing %d event', 'Showing %d events', 50) }} <i
</span> class="fa fa-warning"
`, v-tooltip
}; aria-hidden="true"
:title="n__('Limited to showing %d event at most', 'Limited to showing %d events at most', 50)"
data-placement="top"></i>
{{ n__('Showing %d event', 'Showing %d events', 50) }}
</span>
</template>
app/assets/javascripts/cycle_analytics/components/stage_code_component.js → app/assets/javascripts/cycle_analytics/components/stage_code_component.vue
/* eslint-disable no-param-reassign */ <script>
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
import Vue from 'vue'; export default {
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue'; props: {
items: Array,
const global = window.gl || (window.gl = {}); stage: Object,
global.cycleAnalytics = global.cycleAnalytics || {}; },
components: {
global.cycleAnalytics.StageCodeComponent = Vue.extend({ userAvatarImage,
props: { },
items: Array, };
stage: Object, </script>
}, <template>
components: { <div>
userAvatarImage, <div class="events-description">
}, {{ stage.description }}
template: ` <limit-warning :count="items.length" />
<div>
<div class="events-description">
{{ stage.description }}
<limit-warning :count="items.length" />
</div>
<ul class="stage-event-list">
<li v-for="mergeRequest in items" class="stage-event-item">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="mergeRequest.author.avatarUrl"/>
<h5 class="item-title merge-merquest-title">
<a :href="mergeRequest.url">
{{ mergeRequest.title }}
</a>
</h5>
<a :href="mergeRequest.url" class="issue-link">!{{ mergeRequest.iid }}</a>
&middot;
<span>
{{ s__('OpenedNDaysAgo|Opened') }}
<a :href="mergeRequest.url" class="issue-date">{{ mergeRequest.createdAt }}</a>
</span>
<span>
{{ s__('ByAuthor|by') }}
<a :href="mergeRequest.author.webUrl" class="issue-author-link">{{ mergeRequest.author.name }}</a>
</span>
</div>
<div class="item-time">
<total-time :time="mergeRequest.totalTime"></total-time>
</div>
</li>
</ul>
</div> </div>
`, <ul class="stage-event-list">
}); <li v-for="mergeRequest in items" class="stage-event-item">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="mergeRequest.author.avatarUrl"/>
<h5 class="item-title merge-merquest-title">
<a :href="mergeRequest.url">
{{ mergeRequest.title }}
</a>
</h5>
<a :href="mergeRequest.url" class="issue-link">!{{ mergeRequest.iid }}</a>
&middot;
<span>
{{ s__('OpenedNDaysAgo|Opened') }}
<a :href="mergeRequest.url" class="issue-date">{{ mergeRequest.createdAt }}</a>
</span>
<span>
{{ s__('ByAuthor|by') }}
<a :href="mergeRequest.author.webUrl" class="issue-author-link">{{ mergeRequest.author.name }}</a>
</span>
</div>
<div class="item-time">
<total-time :time="mergeRequest.totalTime"></total-time>
</div>
</li>
</ul>
</div>
</template>
app/assets/javascripts/cycle_analytics/components/stage_issue_component.js → app/assets/javascripts/cycle_analytics/components/stage_component.vue
/* eslint-disable no-param-reassign */ <script>
import Vue from 'vue'; import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
const global = window.gl || (window.gl = {}); export default {
global.cycleAnalytics = global.cycleAnalytics || {}; props: {
items: Array,
global.cycleAnalytics.StageIssueComponent = Vue.extend({ stage: Object,
props: { },
items: Array, components: {
stage: Object, userAvatarImage,
}, },
components: { };
userAvatarImage, </script>
}, <template>
template: ` <div>
<div> <div class="events-description">
<div class="events-description"> {{ stage.description }}
{{ stage.description }} <limit-warning :count="items.length" />
<limit-warning :count="items.length" />
</div>
<ul class="stage-event-list">
<li v-for="issue in items" class="stage-event-item">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="issue.author.avatarUrl"/>
<h5 class="item-title issue-title">
<a class="issue-title" :href="issue.url">
{{ issue.title }}
</a>
</h5>
<a :href="issue.url" class="issue-link">#{{ issue.iid }}</a>
&middot;
<span>
{{ s__('OpenedNDaysAgo|Opened') }}
<a :href="issue.url" class="issue-date">{{ issue.createdAt }}</a>
</span>
<span>
{{ s__('ByAuthor|by') }}
<a :href="issue.author.webUrl" class="issue-author-link">
{{ issue.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="issue.totalTime"></total-time>
</div>
</li>
</ul>
</div> </div>
`, <ul class="stage-event-list">
}); <li
v-for="(issue, i) in items"
:key="i"
class="stage-event-item">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="issue.author.avatarUrl"/>
<h5 class="item-title issue-title">
<a class="issue-title" :href="issue.url">
{{ issue.title }}
</a>
</h5>
<a :href="issue.url" class="issue-link">#{{ issue.iid }}</a>
&middot;
<span>
{{ s__('OpenedNDaysAgo|Opened') }}
<a :href="issue.url" class="issue-date">{{ issue.createdAt }}</a>
</span>
<span>
{{ s__('ByAuthor|by') }}
<a :href="issue.author.webUrl" class="issue-author-link">
{{ issue.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="issue.totalTime"/>
</div>
</li>
</ul>
</div>
</template>
app/assets/javascripts/cycle_analytics/components/stage_plan_component.js → app/assets/javascripts/cycle_analytics/components/stage_plan_component.vue
/* eslint-disable no-param-reassign */ <script>
import Vue from 'vue';
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue'; import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
import iconCommit from '../svg/icon_commit.svg'; import iconCommit from '../svg/icon_commit.svg';
const global = window.gl || (window.gl = {}); export default {
global.cycleAnalytics = global.cycleAnalytics || {};
global.cycleAnalytics.StagePlanComponent = Vue.extend({
props: { props: {
items: Array, items: Array,
stage: Object, stage: Object,
...@@ -14,40 +10,47 @@ global.cycleAnalytics.StagePlanComponent = Vue.extend({ ...@@ -14,40 +10,47 @@ global.cycleAnalytics.StagePlanComponent = Vue.extend({
components: { components: {
userAvatarImage, userAvatarImage,
}, },
data() { computed: {
return { iconCommit }; iconCommit() {
return iconCommit;
},
}, },
template: ` };
<div> </script>
<div class="events-description"> <template>
{{ stage.description }} <div>
<limit-warning :count="items.length" /> <div class="events-description">
</div> {{ stage.description }}
<ul class="stage-event-list"> <limit-warning :count="items.length" />
<li v-for="commit in items" class="stage-event-item">
<div class="item-details item-conmmit-component">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="commit.author.avatarUrl"/>
<h5 class="item-title commit-title">
<a :href="commit.commitUrl">
{{ commit.title }}
</a>
</h5>
<span>
{{ s__('FirstPushedBy|First') }}
<span class="commit-icon">${iconCommit}</span>
<a :href="commit.commitUrl" class="commit-hash-link commit-sha">{{ commit.shortSha }}</a>
{{ s__('FirstPushedBy|pushed by') }}
<a :href="commit.author.webUrl" class="commit-author-link">
{{ commit.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="commit.totalTime"></total-time>
</div>
</li>
</ul>
</div> </div>
`, <ul class="stage-event-list">
}); <li
v-for="(commit, i) in items"
:key="i"
class="stage-event-item">
<div class="item-details item-conmmit-component">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="commit.author.avatarUrl"/>
<h5 class="item-title commit-title">
<a :href="commit.commitUrl">
{{ commit.title }}
</a>
</h5>
<span>
{{ s__('FirstPushedBy|First') }}
<span class="commit-icon" v-html="iconCommit"></span>
<a :href="commit.commitUrl" class="commit-hash-link commit-sha">{{ commit.shortSha }}</a>
{{ s__('FirstPushedBy|pushed by') }}
<a :href="commit.author.webUrl" class="commit-author-link">
{{ commit.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="commit.totalTime" />
</div>
</li>
</ul>
</div>
</template>
app/assets/javascripts/cycle_analytics/components/stage_production_component.js deleted 100644 → 0
/* eslint-disable no-param-reassign */
import Vue from 'vue';
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
const global = window.gl || (window.gl = {});
global.cycleAnalytics = global.cycleAnalytics || {};
global.cycleAnalytics.StageProductionComponent = Vue.extend({
props: {
items: Array,
stage: Object,
},
components: {
userAvatarImage,
},
template: `
<div>
<div class="events-description">
{{ stage.description }}
<limit-warning :count="items.length" />
</div>
<ul class="stage-event-list">
<li v-for="issue in items" class="stage-event-item">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="issue.author.avatarUrl"/>
<h5 class="item-title issue-title">
<a class="issue-title" :href="issue.url">
{{ issue.title }}
</a>
</h5>
<a :href="issue.url" class="issue-link">#{{ issue.iid }}</a>
&middot;
<span>
{{ s__('OpenedNDaysAgo|Opened') }}
<a :href="issue.url" class="issue-date">{{ issue.createdAt }}</a>
</span>
<span>
{{ s__('ByAuthor|by') }}
<a :href="issue.author.webUrl" class="issue-author-link">
{{ issue.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="issue.totalTime"></total-time>
</div>
</li>
</ul>
</div>
`,
});
app/assets/javascripts/cycle_analytics/components/stage_review_component.js → app/assets/javascripts/cycle_analytics/components/stage_review_component.vue
/* eslint-disable no-param-reassign */ <script>
import Vue from 'vue'; import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
const global = window.gl || (window.gl = {}); export default {
global.cycleAnalytics = global.cycleAnalytics || {}; props: {
items: Array,
global.cycleAnalytics.StageReviewComponent = Vue.extend({ stage: Object,
props: { },
items: Array, components: {
stage: Object, userAvatarImage,
}, },
components: { };
userAvatarImage, </script>
}, <template>
template: ` <div>
<div> <div class="events-description">
<div class="events-description"> {{ stage.description }}
{{ stage.description }} <limit-warning :count="items.length" />
<limit-warning :count="items.length" /> </div>
</div> <ul class="stage-event-list">
<ul class="stage-event-list"> <li
<li v-for="mergeRequest in items" class="stage-event-item"> v-for="(mergeRequest, i) in items"
<div class="item-details"> :key="i"
<!-- FIXME: Pass an alt attribute here for accessibility --> class="stage-event-item">
<user-avatar-image :img-src="mergeRequest.author.avatarUrl"/> <div class="item-details">
<h5 class="item-title merge-merquest-title"> <!-- FIXME: Pass an alt attribute here for accessibility -->
<a :href="mergeRequest.url"> <user-avatar-image :img-src="mergeRequest.author.avatarUrl"/>
{{ mergeRequest.title }} <h5 class="item-title merge-merquest-title">
</a> <a :href="mergeRequest.url">
</h5> {{ mergeRequest.title }}
<a :href="mergeRequest.url" class="issue-link">!{{ mergeRequest.iid }}</a> </a>
&middot; </h5>
<span> <a :href="mergeRequest.url" class="issue-link">!{{ mergeRequest.iid }}</a>
{{ s__('OpenedNDaysAgo|Opened') }} &middot;
<a :href="mergeRequest.url" class="issue-date">{{ mergeRequest.createdAt }}</a> <span>
{{ s__('OpenedNDaysAgo|Opened') }}
<a :href="mergeRequest.url" class="issue-date">{{ mergeRequest.createdAt }}</a>
</span>
<span>
{{ s__('ByAuthor|by') }}
<a :href="mergeRequest.author.webUrl" class="issue-author-link">{{ mergeRequest.author.name }}</a>
</span>
<template v-if="mergeRequest.state === 'closed'">
<span class="merge-request-state">
<i class="fa fa-ban"></i>
{{ mergeRequest.state.toUpperCase() }}
</span> </span>
<span> </template>
{{ s__('ByAuthor|by') }} <template v-else>
<a :href="mergeRequest.author.webUrl" class="issue-author-link">{{ mergeRequest.author.name }}</a> <span class="merge-request-branch" v-if="mergeRequest.branch">
<i class= "fa fa-code-fork"></i>
<a :href="mergeRequest.branch.url">{{ mergeRequest.branch.name }}</a>
</span> </span>
<template v-if="mergeRequest.state === 'closed'"> </template>
<span class="merge-request-state"> </div>
<i class="fa fa-ban"></i> <div class="item-time">
{{ mergeRequest.state.toUpperCase() }} <total-time :time="mergeRequest.totalTime"/>
</span> </div>
</template> </li>
<template v-else> </ul>
<span class="merge-request-branch" v-if="mergeRequest.branch"> </div>
<i class= "fa fa-code-fork"></i> </template>
<a :href="mergeRequest.branch.url">{{ mergeRequest.branch.name }}</a>
</span>
</template>
</div>
<div class="item-time">
<total-time :time="mergeRequest.totalTime"></total-time>
</div>
</li>
</ul>
</div>
`,
});
app/assets/javascripts/cycle_analytics/components/stage_staging_component.js → app/assets/javascripts/cycle_analytics/components/stage_staging_component.vue
/* eslint-disable no-param-reassign */ <script>
import Vue from 'vue'; import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue'; import iconBranch from '../svg/icon_branch.svg';
import iconBranch from '../svg/icon_branch.svg';
const global = window.gl || (window.gl = {}); export default {
global.cycleAnalytics = global.cycleAnalytics || {}; props: {
items: Array,
global.cycleAnalytics.StageStagingComponent = Vue.extend({ stage: Object,
props: { },
items: Array, components: {
stage: Object, userAvatarImage,
}, },
data() { computed: {
return { iconBranch }; iconBranch() {
}, return iconBranch;
components: { },
userAvatarImage, },
}, };
template: ` </script>
<div> <template>
<div class="events-description"> <div>
{{ stage.description }} <div class="events-description">
<limit-warning :count="items.length" /> {{ stage.description }}
</div> <limit-warning :count="items.length" />
<ul class="stage-event-list">
<li v-for="build in items" class="stage-event-item item-build-component">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="build.author.avatarUrl"/>
<h5 class="item-title">
<a :href="build.url" class="pipeline-id">#{{ build.id }}</a>
<i class="fa fa-code-fork"></i>
<a :href="build.branch.url" class="ref-name">{{ build.branch.name }}</a>
<span class="icon-branch">${iconBranch}</span>
<a :href="build.commitUrl" class="commit-sha">{{ build.shortSha }}</a>
</h5>
<span>
<a :href="build.url" class="build-date">{{ build.date }}</a>
{{ s__('ByAuthor|by') }}
<a :href="build.author.webUrl" class="issue-author-link">
{{ build.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="build.totalTime"></total-time>
</div>
</li>
</ul>
</div> </div>
`, <ul class="stage-event-list">
}); <li
v-for="(build, i) in items"
class="stage-event-item item-build-component"
:key="i">
<div class="item-details">
<!-- FIXME: Pass an alt attribute here for accessibility -->
<user-avatar-image :img-src="build.author.avatarUrl"/>
<h5 class="item-title">
<a :href="build.url" class="pipeline-id">#{{ build.id }}</a>
<i class="fa fa-code-fork"></i>
<a :href="build.branch.url" class="ref-name">{{ build.branch.name }}</a>
<span class="icon-branch" v-html="iconBranch"></span>
<a :href="build.commitUrl" class="commit-sha">{{ build.shortSha }}</a>
</h5>
<span>
<a :href="build.url" class="build-date">{{ build.date }}</a>
{{ s__('ByAuthor|by') }}
<a :href="build.author.webUrl" class="issue-author-link">
{{ build.author.name }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="build.totalTime"/>
</div>
</li>
</ul>
</div>
</template>
app/assets/javascripts/cycle_analytics/components/stage_test_component.js → app/assets/javascripts/cycle_analytics/components/stage_test_component.vue
/* eslint-disable no-param-reassign */ <script>
import Vue from 'vue';
import iconBuildStatus from '../svg/icon_build_status.svg'; import iconBuildStatus from '../svg/icon_build_status.svg';
import iconBranch from '../svg/icon_branch.svg'; import iconBranch from '../svg/icon_branch.svg';
const global = window.gl || (window.gl = {}); export default {
global.cycleAnalytics = global.cycleAnalytics || {};
global.cycleAnalytics.StageTestComponent = Vue.extend({
props: { props: {
items: Array, items: Array,
stage: Object, stage: Object,
}, },
data() { computed: {
return { iconBuildStatus, iconBranch }; iconBuildStatus() {
return iconBuildStatus;
},
iconBranch() {
return iconBranch;
},
}, },
template: ` };
<div> </script>
<div class="events-description"> <template>
{{ stage.description }} <div>
<limit-warning :count="items.length" /> <div class="events-description">
</div> {{ stage.description }}
<ul class="stage-event-list"> <limit-warning :count="items.length" />
<li v-for="build in items" class="stage-event-item item-build-component">
<div class="item-details">
<h5 class="item-title">
<span class="icon-build-status">${iconBuildStatus}</span>
<a :href="build.url" class="item-build-name">{{ build.name }}</a>
&middot;
<a :href="build.url" class="pipeline-id">#{{ build.id }}</a>
<i class="fa fa-code-fork"></i>
<a :href="build.branch.url" class="ref-name">{{ build.branch.name }}</a>
<span class="icon-branch">${iconBranch}</span>
<a :href="build.commitUrl" class="commit-sha">{{ build.shortSha }}</a>
</h5>
<span>
<a :href="build.url" class="issue-date">
{{ build.date }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="build.totalTime"></total-time>
</div>
</li>
</ul>
</div> </div>
`, <ul class="stage-event-list">
}); <li
v-for="(build, i) in items"
:key="i"
class="stage-event-item item-build-component">
<div class="item-details">
<h5 class="item-title">
<span class="icon-build-status" v-html="iconBuildStatus"></span>
<a :href="build.url" class="item-build-name">{{ build.name }}</a>
&middot;
<a :href="build.url" class="pipeline-id">#{{ build.id }}</a>
<i class="fa fa-code-fork"></i>
<a :href="build.branch.url" class="ref-name">{{ build.branch.name }}</a>
<span class="icon-branch" v-html="iconBranch"></span>
<a :href="build.commitUrl" class="commit-sha">{{ build.shortSha }}</a>
</h5>
<span>
<a :href="build.url" class="issue-date">
{{ build.date }}
</a>
</span>
</div>
<div class="item-time">
<total-time :time="build.totalTime"/>
</div>
</li>
</ul>
</div>
</template>
app/assets/javascripts/cycle_analytics/components/total_time_component.js deleted 100644 → 0
/* eslint-disable no-param-reassign */
import Vue from 'vue';
const global = window.gl || (window.gl = {});
global.cycleAnalytics = global.cycleAnalytics || {};
global.cycleAnalytics.TotalTimeComponent = Vue.extend({
props: {
time: Object,
},
template: `
<span class="total-time">
<template v-if="Object.keys(time).length">
<template v-if="time.days">{{ time.days }} <span>{{ n__('day', 'days', time.days) }}</span></template>
<template v-if="time.hours">{{ time.hours }} <span>{{ n__('Time|hr', 'Time|hrs', time.hours) }}</span></template>
<template v-if="time.mins && !time.days">{{ time.mins }} <span>{{ n__('Time|min', 'Time|mins', time.mins) }}</span></template>
<template v-if="time.seconds && Object.keys(time).length === 1 || time.seconds === 0">{{ time.seconds }} <span>{{ s__('Time|s') }}</span></template>
</template>
<template v-else>
--
</template>
</span>
`,
});
app/assets/javascripts/cycle_analytics/components/total_time_component.vue 0 → 100644
<script>
export default {
props: {
time: {
type: Object,
required: false,
default: () => ({}),
},
},
computed: {
hasData() {
return Object.keys(this.time).length;
},
},
};
</script>
<template>
<span class="total-time">
<template v-if="hasData">
<template v-if="time.days">{{ time.days }} <span>{{ n__('day', 'days', time.days) }}</span></template>
<template v-if="time.hours">{{ time.hours }} <span>{{ n__('Time|hr', 'Time|hrs', time.hours) }}</span></template>
<template v-if="time.mins && !time.days">{{ time.mins }} <span>{{ n__('Time|min', 'Time|mins', time.mins) }}</span></template>
<template v-if="time.seconds && hasDa === 1 || time.seconds === 0">{{ time.seconds }} <span>{{ s__('Time|s') }}</span></template>
</template>
<template v-else>
--
</template>
</span>
</template>
app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js
...@@ -3,15 +3,14 @@ ...@@ -3,15 +3,14 @@
import Vue from 'vue'; import Vue from 'vue';
import Cookies from 'js-cookie'; import Cookies from 'js-cookie';
import Translate from '../vue_shared/translate'; import Translate from '../vue_shared/translate';
import LimitWarningComponent from './components/limit_warning_component'; import limitWarningComponent from './components/limit_warning_component.vue';
import './components/stage_code_component'; import stageCodeComponent from './components/stage_code_component.vue';
import './components/stage_issue_component'; import stagePlanComponent from './components/stage_plan_component.vue';
import './components/stage_plan_component'; import stageComponent from './components/stage_component.vue';
import './components/stage_production_component'; import stageReviewComponent from './components/stage_review_component.vue';
import './components/stage_review_component'; import stageStagingComponent from './components/stage_staging_component.vue';
import './components/stage_staging_component'; import stageTestComponent from './components/stage_test_component.vue';
import './components/stage_test_component'; import totalTime from './components/total_time_component.vue';
import './components/total_time_component';
import CycleAnalyticsService from './cycle_analytics_service'; import CycleAnalyticsService from './cycle_analytics_service';
import CycleAnalyticsStore from './cycle_analytics_store'; import CycleAnalyticsStore from './cycle_analytics_store';
...@@ -47,13 +46,13 @@ $(() => { ...@@ -47,13 +46,13 @@ $(() => {
}, },
}, },
components: { components: {
'stage-issue-component': gl.cycleAnalytics.StageIssueComponent, 'stage-issue-component': stageComponent,
'stage-plan-component': gl.cycleAnalytics.StagePlanComponent, 'stage-plan-component': stagePlanComponent,
'stage-code-component': gl.cycleAnalytics.StageCodeComponent, 'stage-code-component': stageCodeComponent,
'stage-test-component': gl.cycleAnalytics.StageTestComponent, 'stage-test-component': stageTestComponent,
'stage-review-component': gl.cycleAnalytics.StageReviewComponent, 'stage-review-component': stageReviewComponent,
'stage-staging-component': gl.cycleAnalytics.StageStagingComponent, 'stage-staging-component': stageStagingComponent,
'stage-production-component': gl.cycleAnalytics.StageProductionComponent, 'stage-production-component': stageComponent,
}, },
created() { created() {
this.fetchCycleAnalyticsData(); this.fetchCycleAnalyticsData();
...@@ -136,6 +135,6 @@ $(() => { ...@@ -136,6 +135,6 @@ $(() => {
}); });
// Register global components // Register global components
Vue.component('limit-warning', LimitWarningComponent); Vue.component('limit-warning', limitWarningComponent);
Vue.component('total-time', gl.cycleAnalytics.TotalTimeComponent); Vue.component('total-time', totalTime);
}); });
spec/javascripts/cycle_analytics/limit_warning_component_spec.js
import Vue from 'vue'; import Vue from 'vue';
import Translate from '~/vue_shared/translate'; import Translate from '~/vue_shared/translate';
import limitWarningComp from '~/cycle_analytics/components/limit_warning_component'; import limitWarningComp from '~/cycle_analytics/components/limit_warning_component.vue';
Vue.use(Translate); Vue.use(Translate);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment