Merge branch '18141-pipeline-graph' of gitlab.com:gitlab-org/gitlab-ce into 18141-pipeline-graph
# Conflicts: # app/assets/stylesheets/pages/pipelines.scss # app/views/projects/commit/_pipeline.html.haml
This commit is contained in:
commit
ae5ec7918a
3 changed files with 75 additions and 23 deletions
10
app/assets/javascripts/pipeline.js.es6
Normal file
10
app/assets/javascripts/pipeline.js.es6
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
function toggleGraph() {
|
||||||
|
$('.pipeline-graph, .toggle-pipeline-btn').toggleClass('graph-collapsed');
|
||||||
|
|
||||||
|
const $btnText = $('.toggle-pipeline-btn .btn-text');
|
||||||
|
const graphCollapsed = $('.pipeline-graph').hasClass('graph-collapsed');
|
||||||
|
|
||||||
|
graphCollapsed ? $btnText.text('Expand') : $btnText.text('Hide')
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).on('click', '.toggle-pipeline-btn', toggleGraph);
|
|
@ -232,10 +232,35 @@
|
||||||
|
|
||||||
// Pipeline visualization
|
// Pipeline visualization
|
||||||
|
|
||||||
|
.toggle-pipeline-btn {
|
||||||
|
background-color: $gray-dark;
|
||||||
|
|
||||||
|
.caret {
|
||||||
|
border-top: none;
|
||||||
|
border-bottom: 4px solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.graph-collapsed {
|
||||||
|
background-color: $white-light;
|
||||||
|
|
||||||
|
.caret {
|
||||||
|
border-bottom: none;
|
||||||
|
border-top: 4px solid;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.pipeline-graph {
|
.pipeline-graph {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
max-height: 500px;
|
||||||
|
transition: max-height 0.3s, padding 0.3s;
|
||||||
|
|
||||||
|
&.graph-collapsed {
|
||||||
|
max-height: 0;
|
||||||
|
padding: 0 16px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.pipeline-visualization {
|
.pipeline-visualization {
|
||||||
|
@ -278,6 +303,10 @@
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $layout-link-gray;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
|
@ -315,7 +344,6 @@
|
||||||
right: -20px;
|
right: -20px;
|
||||||
border-right: 2px solid $border-color;
|
border-right: 2px solid $border-color;
|
||||||
border-radius: 0 0 50px;
|
border-radius: 0 0 50px;
|
||||||
-webkit-border-radius: 0 0 50px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Left connecting curves
|
// Left connecting curves
|
||||||
|
@ -323,7 +351,6 @@
|
||||||
left: -20px;
|
left: -20px;
|
||||||
border-left: 2px solid $border-color;
|
border-left: 2px solid $border-color;
|
||||||
border-radius: 0 0 0 50px;
|
border-radius: 0 0 0 50px;
|
||||||
-webkit-border-radius: 0 0 0 50px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -333,11 +360,6 @@
|
||||||
height: 45px;
|
height: 45px;
|
||||||
top: -26px;
|
top: -26px;
|
||||||
}
|
}
|
||||||
&::after {
|
|
||||||
// border-left: 2px solid $border-color;
|
|
||||||
border-top-right-radius: -50px;
|
|
||||||
-webkit-border-top-right-radius: -50px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -369,3 +391,14 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.pipeline-actions {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toggle-pipeline-btn {
|
||||||
|
|
||||||
|
.fa {
|
||||||
|
color: $dropdown-header-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -1,20 +1,9 @@
|
||||||
.row-content-block.build-content.middle-block.pipeline-graph
|
.row-content-block.build-content.middle-block.pipeline-actions
|
||||||
.pipeline-visualization
|
|
||||||
%ul.stage-column-list
|
|
||||||
- stages = pipeline.stages_with_latest_statuses
|
|
||||||
- stages.each do |stage, statuses|
|
|
||||||
%li.stage-column
|
|
||||||
.stage-name
|
|
||||||
%a{name: stage}
|
|
||||||
- if stage
|
|
||||||
= stage.titleize
|
|
||||||
.builds-container
|
|
||||||
%ul
|
|
||||||
- statuses.each do |status|
|
|
||||||
= render "projects/#{status.to_partial_path}_pipeline", subject: status
|
|
||||||
|
|
||||||
.row-content-block.build-content.middle-block.pipeline-graph
|
|
||||||
.pull-right
|
.pull-right
|
||||||
|
.btn.btn-grouped.btn-white.toggle-pipeline-btn
|
||||||
|
%span.btn-text Hide
|
||||||
|
%span pipeline graph
|
||||||
|
%span.caret
|
||||||
- if can?(current_user, :update_pipeline, pipeline.project)
|
- if can?(current_user, :update_pipeline, pipeline.project)
|
||||||
- if pipeline.builds.latest.failed.any?(&:retryable?)
|
- if pipeline.builds.latest.failed.any?(&:retryable?)
|
||||||
= link_to "Retry failed", retry_namespace_project_pipeline_path(pipeline.project.namespace, pipeline.project, pipeline.id), class: 'btn btn-grouped btn-primary', method: :post
|
= link_to "Retry failed", retry_namespace_project_pipeline_path(pipeline.project.namespace, pipeline.project, pipeline.id), class: 'btn btn-grouped btn-primary', method: :post
|
||||||
|
@ -38,6 +27,26 @@
|
||||||
in
|
in
|
||||||
= time_interval_in_words pipeline.duration
|
= time_interval_in_words pipeline.duration
|
||||||
|
|
||||||
|
.row-content-block.build-content.middle-block.pipeline-graph
|
||||||
|
.pipeline-visualization
|
||||||
|
%ul.stage-column-list
|
||||||
|
- pipeline.statuses.stages.each do |stage|
|
||||||
|
- statuses = pipeline.statuses.where(stage: stage)
|
||||||
|
- status = statuses.latest.status
|
||||||
|
%li.stage-column
|
||||||
|
.stage-name
|
||||||
|
%a{name: stage}
|
||||||
|
- if stage
|
||||||
|
= stage.titleize
|
||||||
|
.builds-container
|
||||||
|
%ul
|
||||||
|
- statuses.each do |build|
|
||||||
|
%li.build
|
||||||
|
.build-content
|
||||||
|
%span{class: "ci-status-link ci-status-icon-#{status}"}
|
||||||
|
= ci_icon_for_status(status)
|
||||||
|
= link_to build.name, namespace_project_build_url(build.project.namespace, build.project, build)
|
||||||
|
|
||||||
- if pipeline.yaml_errors.present?
|
- if pipeline.yaml_errors.present?
|
||||||
.bs-callout.bs-callout-danger
|
.bs-callout.bs-callout-danger
|
||||||
%h4 Found errors in your .gitlab-ci.yml:
|
%h4 Found errors in your .gitlab-ci.yml:
|
||||||
|
|
Loading…
Reference in a new issue