Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
1
Merge Requests
1
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
nexedi
gitlab-ce
Commits
b524b9eb
Commit
b524b9eb
authored
Sep 26, 2017
by
Filipa Lacerda
Committed by
Phil Hughes
Sep 26, 2017
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Moves cycle analytics components into vue files
parent
ba4f7413
Changes
19
Hide whitespace changes
Inline
Side-by-side
Showing
19 changed files
with
400 additions
and
433 deletions
+400
-433
app/assets/javascripts/cycle_analytics/components/limit_warning_component.js
...pts/cycle_analytics/components/limit_warning_component.js
+0
-17
app/assets/javascripts/cycle_analytics/components/limit_warning_component.vue
...ts/cycle_analytics/components/limit_warning_component.vue
+26
-0
app/assets/javascripts/cycle_analytics/components/stage_code_component.js
...cripts/cycle_analytics/components/stage_code_component.js
+0
-51
app/assets/javascripts/cycle_analytics/components/stage_code_component.vue
...ripts/cycle_analytics/components/stage_code_component.vue
+47
-0
app/assets/javascripts/cycle_analytics/components/stage_component.vue
...avascripts/cycle_analytics/components/stage_component.vue
+53
-0
app/assets/javascripts/cycle_analytics/components/stage_issue_component.js
...ripts/cycle_analytics/components/stage_issue_component.js
+0
-52
app/assets/javascripts/cycle_analytics/components/stage_plan_component.js
...cripts/cycle_analytics/components/stage_plan_component.js
+0
-53
app/assets/javascripts/cycle_analytics/components/stage_plan_component.vue
...ripts/cycle_analytics/components/stage_plan_component.vue
+56
-0
app/assets/javascripts/cycle_analytics/components/stage_production_component.js
.../cycle_analytics/components/stage_production_component.js
+0
-52
app/assets/javascripts/cycle_analytics/components/stage_review_component.js
...ipts/cycle_analytics/components/stage_review_component.js
+0
-62
app/assets/javascripts/cycle_analytics/components/stage_review_component.vue
...pts/cycle_analytics/components/stage_review_component.vue
+62
-0
app/assets/javascripts/cycle_analytics/components/stage_staging_component.js
...pts/cycle_analytics/components/stage_staging_component.js
+0
-53
app/assets/javascripts/cycle_analytics/components/stage_staging_component.vue
...ts/cycle_analytics/components/stage_staging_component.vue
+55
-0
app/assets/javascripts/cycle_analytics/components/stage_test_component.js
...cripts/cycle_analytics/components/stage_test_component.js
+0
-49
app/assets/javascripts/cycle_analytics/components/stage_test_component.vue
...ripts/cycle_analytics/components/stage_test_component.vue
+54
-0
app/assets/javascripts/cycle_analytics/components/total_time_component.js
...cripts/cycle_analytics/components/total_time_component.js
+0
-25
app/assets/javascripts/cycle_analytics/components/total_time_component.vue
...ripts/cycle_analytics/components/total_time_component.vue
+29
-0
app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js
...ets/javascripts/cycle_analytics/cycle_analytics_bundle.js
+17
-18
spec/javascripts/cycle_analytics/limit_warning_component_spec.js
...vascripts/cycle_analytics/limit_warning_component_spec.js
+1
-1
No files found.
app/assets/javascripts/cycle_analytics/components/limit_warning_component.js
deleted
100644 → 0
View file @
ba4f7413
export
default
{
props
:
{
count
:
{
type
:
Number
,
required
:
true
,
},
},
template
:
`
<span v-if="count === 50" class="events-info pull-right">
<i class="fa fa-warning has-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>
`
,
};
app/assets/javascripts/cycle_analytics/components/limit_warning_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
tooltip
from
'
../../vue_shared/directives/tooltip
'
;
export
default
{
props
:
{
count
:
{
type
:
Number
,
required
:
true
,
},
},
directives
:
{
tooltip
,
},
};
</
script
>
<
template
>
<span
v-if=
"count === 50"
class=
"events-info pull-right"
>
<i
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
deleted
100644 → 0
View file @
ba4f7413
/* 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
.
StageCodeComponent
=
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="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>
·
<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>
`
,
});
app/assets/javascripts/cycle_analytics/components/stage_code_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
export
default
{
props
:
{
items
:
Array
,
stage
:
Object
,
},
components
:
{
userAvatarImage
,
},
};
</
script
>
<
template
>
<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>
·
<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_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
export
default
{
props
:
{
items
:
Array
,
stage
:
Object
,
},
components
:
{
userAvatarImage
,
},
};
</
script
>
<
template
>
<div>
<div
class=
"events-description"
>
{{
stage
.
description
}}
<limit-warning
:count=
"items.length"
/>
</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>
·
<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_issue_component.js
deleted
100644 → 0
View file @
ba4f7413
/* 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
.
StageIssueComponent
=
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>
·
<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_plan_component.js
deleted
100644 → 0
View file @
ba4f7413
/* eslint-disable no-param-reassign */
import
Vue
from
'
vue
'
;
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
import
iconCommit
from
'
../svg/icon_commit.svg
'
;
const
global
=
window
.
gl
||
(
window
.
gl
=
{});
global
.
cycleAnalytics
=
global
.
cycleAnalytics
||
{};
global
.
cycleAnalytics
.
StagePlanComponent
=
Vue
.
extend
({
props
:
{
items
:
Array
,
stage
:
Object
,
},
components
:
{
userAvatarImage
,
},
data
()
{
return
{
iconCommit
};
},
template
:
`
<div>
<div class="events-description">
{{ stage.description }}
<limit-warning :count="items.length" />
</div>
<ul class="stage-event-list">
<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>
`
,
});
app/assets/javascripts/cycle_analytics/components/stage_plan_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
import
iconCommit
from
'
../svg/icon_commit.svg
'
;
export
default
{
props
:
{
items
:
Array
,
stage
:
Object
,
},
components
:
{
userAvatarImage
,
},
computed
:
{
iconCommit
()
{
return
iconCommit
;
},
},
};
</
script
>
<
template
>
<div>
<div
class=
"events-description"
>
{{
stage
.
description
}}
<limit-warning
:count=
"items.length"
/>
</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
View file @
ba4f7413
/* 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>
·
<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
deleted
100644 → 0
View file @
ba4f7413
/* 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
.
StageReviewComponent
=
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="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>
·
<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>
</template>
<template v-else>
<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>
</template>
</div>
<div class="item-time">
<total-time :time="mergeRequest.totalTime"></total-time>
</div>
</li>
</ul>
</div>
`
,
});
app/assets/javascripts/cycle_analytics/components/stage_review_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
export
default
{
props
:
{
items
:
Array
,
stage
:
Object
,
},
components
:
{
userAvatarImage
,
},
};
</
script
>
<
template
>
<div>
<div
class=
"events-description"
>
{{
stage
.
description
}}
<limit-warning
:count=
"items.length"
/>
</div>
<ul
class=
"stage-event-list"
>
<li
v-for=
"(mergeRequest, 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=
"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>
·
<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>
</
template
>
<
template
v-else
>
<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>
</
template
>
</div>
<div
class=
"item-time"
>
<total-time
:time=
"mergeRequest.totalTime"
/>
</div>
</li>
</ul>
</div>
</template>
app/assets/javascripts/cycle_analytics/components/stage_staging_component.js
deleted
100644 → 0
View file @
ba4f7413
/* eslint-disable no-param-reassign */
import
Vue
from
'
vue
'
;
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
import
iconBranch
from
'
../svg/icon_branch.svg
'
;
const
global
=
window
.
gl
||
(
window
.
gl
=
{});
global
.
cycleAnalytics
=
global
.
cycleAnalytics
||
{};
global
.
cycleAnalytics
.
StageStagingComponent
=
Vue
.
extend
({
props
:
{
items
:
Array
,
stage
:
Object
,
},
data
()
{
return
{
iconBranch
};
},
components
:
{
userAvatarImage
,
},
template
:
`
<div>
<div class="events-description">
{{ stage.description }}
<limit-warning :count="items.length" />
</div>
<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>
`
,
});
app/assets/javascripts/cycle_analytics/components/stage_staging_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
userAvatarImage
from
'
../../vue_shared/components/user_avatar/user_avatar_image.vue
'
;
import
iconBranch
from
'
../svg/icon_branch.svg
'
;
export
default
{
props
:
{
items
:
Array
,
stage
:
Object
,
},
components
:
{
userAvatarImage
,
},
computed
:
{
iconBranch
()
{
return
iconBranch
;
},
},
};
</
script
>
<
template
>
<div>
<div
class=
"events-description"
>
{{
stage
.
description
}}
<limit-warning
:count=
"items.length"
/>
</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
deleted
100644 → 0
View file @
ba4f7413
/* eslint-disable no-param-reassign */
import
Vue
from
'
vue
'
;
import
iconBuildStatus
from
'
../svg/icon_build_status.svg
'
;
import
iconBranch
from
'
../svg/icon_branch.svg
'
;
const
global
=
window
.
gl
||
(
window
.
gl
=
{});
global
.
cycleAnalytics
=
global
.
cycleAnalytics
||
{};
global
.
cycleAnalytics
.
StageTestComponent
=
Vue
.
extend
({
props
:
{
items
:
Array
,
stage
:
Object
,
},
data
()
{
return
{
iconBuildStatus
,
iconBranch
};
},
template
:
`
<div>
<div class="events-description">
{{ stage.description }}
<limit-warning :count="items.length" />
</div>
<ul class="stage-event-list">
<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>
·
<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>
`
,
});
app/assets/javascripts/cycle_analytics/components/stage_test_component.vue
0 → 100644
View file @
b524b9eb
<
script
>
import
iconBuildStatus
from
'
../svg/icon_build_status.svg
'
;
import
iconBranch
from
'
../svg/icon_branch.svg
'
;
export
default
{
props
:
{
items
:
Array
,
stage
:
Object
,
},
computed
:
{
iconBuildStatus
()
{
return
iconBuildStatus
;
},
iconBranch
()
{
return
iconBranch
;
},
},
};
</
script
>
<
template
>
<div>
<div
class=
"events-description"
>
{{
stage
.
description
}}
<limit-warning
:count=
"items.length"
/>
</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>
·
<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
View file @
ba4f7413
/* 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
View file @
b524b9eb
<
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
View file @
b524b9eb
...
@@ -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
.
StageIssu
eComponent
,
'
stage-issue-component
'
:
stag
eComponent
,
'
stage-plan-component
'
:
gl
.
cycleAnalytics
.
S
tagePlanComponent
,
'
stage-plan-component
'
:
s
tagePlanComponent
,
'
stage-code-component
'
:
gl
.
cycleAnalytics
.
S
tageCodeComponent
,
'
stage-code-component
'
:
s
tageCodeComponent
,
'
stage-test-component
'
:
gl
.
cycleAnalytics
.
S
tageTestComponent
,
'
stage-test-component
'
:
s
tageTestComponent
,
'
stage-review-component
'
:
gl
.
cycleAnalytics
.
S
tageReviewComponent
,
'
stage-review-component
'
:
s
tageReviewComponent
,
'
stage-staging-component
'
:
gl
.
cycleAnalytics
.
S
tageStagingComponent
,
'
stage-staging-component
'
:
s
tageStagingComponent
,
'
stage-production-component
'
:
gl
.
cycleAnalytics
.
StageProduction
Component
,
'
stage-production-component
'
:
stage
Component
,
},
},
created
()
{
created
()
{
this
.
fetchCycleAnalyticsData
();
this
.
fetchCycleAnalyticsData
();
...
@@ -136,6 +135,6 @@ $(() => {
...
@@ -136,6 +135,6 @@ $(() => {
});
});
// Register global components
// Register global components
Vue
.
component
(
'
limit-warning
'
,
L
imitWarningComponent
);
Vue
.
component
(
'
limit-warning
'
,
l
imitWarningComponent
);
Vue
.
component
(
'
total-time
'
,
gl
.
cycleAnalytics
.
TotalTimeComponent
);
Vue
.
component
(
'
total-time
'
,
totalTime
);
});
});
spec/javascripts/cycle_analytics/limit_warning_component_spec.js
View file @
b524b9eb
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
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment