Skip to content

G
gitlab-ce
Commit 7dc2d5eb authored by GitLab Bot's avatar GitLab Bot
Browse files
Options

Automatic merge of gitlab-org/gitlab-ce master

parents 3b0f27eb d8f1cb39
Hide whitespace changes
Inline Side-by-side
Showing with 149 additions and 104 deletions
app/assets/javascripts/monitoring/components/dashboard.vue
View file @ 7dc2d5eb
......@@ -3,6 +3,7 @@ import {
GlButton,
GlDropdown,
GlDropdownItem,
GlFormGroup,
GlModal,
GlModalDirective,
GlTooltipDirective,
......@@ -34,6 +35,7 @@ export default {
GlButton,
GlDropdown,
GlDropdownItem,
GlFormGroup,
GlModal,
},
directives: {
......@@ -278,107 +280,136 @@ export default {
<template>
<div class="prometheus-graphs">
<div class="gl-p-3 border-bottom bg-gray-light d-flex justify-content-between">
<div
v-if="environmentsEndpoint"
class="dropdowns d-flex align-items-center justify-content-between"
>
<div v-if="multipleDashboardsEnabled" class="d-flex align-items-center">
<label class="mb-0">{{ __('Dashboard') }}</label>
<gl-dropdown
class="ml-2 mr-3 js-dashboards-dropdown"
toggle-class="dropdown-menu-toggle"
:text="selectedDashboardText"
<div class="gl-p-3 pb-0 border-bottom bg-gray-light">
<div class="row">
<template v-if="environmentsEndpoint">
<gl-form-group
v-if="multipleDashboardsEnabled"
:label="__('Dashboard')"
label-size="sm"
label-for="monitor-dashboards-dropdown"
class="col-sm-12 col-md-4 col-lg-2"
>
<gl-dropdown-item
v-for="dashboard in allDashboards"
:key="dashboard.path"
:active="dashboard.path === currentDashboard"
active-class="is-active"
:href="`?dashboard=${dashboard.path}`"
<gl-dropdown
id="monitor-dashboards-dropdown"
class="mb-0 d-flex js-dashboards-dropdown"
toggle-class="dropdown-menu-toggle"
:text="selectedDashboardText"
>
{{ dashboard.display_name || dashboard.path }}
</gl-dropdown-item>
</gl-dropdown>
</div>
<div class="d-flex align-items-center">
<strong>{{ s__('Metrics|Environment') }}</strong>
<gl-dropdown
class="prepend-left-10 js-environments-dropdown"
toggle-class="dropdown-menu-toggle"
:text="currentEnvironmentName"
:disabled="environments.length === 0"
<gl-dropdown-item
v-for="dashboard in allDashboards"
:key="dashboard.path"
:active="dashboard.path === currentDashboard"
active-class="is-active"
:href="`?dashboard=${dashboard.path}`"
>{{ dashboard.display_name || dashboard.path }}</gl-dropdown-item
>
</gl-dropdown>
</gl-form-group>
<gl-form-group
:label="s__('Metrics|Environment')"
label-size="sm"
label-for="monitor-environments-dropdown"
class="col-sm-6 col-md-4 col-lg-2"
>
<gl-dropdown-item
v-for="environment in environments"
:key="environment.id"
:active="environment.name === currentEnvironmentName"
active-class="is-active"
:href="environment.metrics_path"
>{{ environment.name }}</gl-dropdown-item
<gl-dropdown
id="monitor-environments-dropdown"
class="mb-0 d-flex js-environments-dropdown"
toggle-class="dropdown-menu-toggle"
:text="currentEnvironmentName"
:disabled="environments.length === 0"
>
</gl-dropdown>
</div>
<div v-if="!showEmptyState" class="d-flex align-items-center prepend-left-8">
<strong>{{ s__('Metrics|Show last') }}</strong>
<gl-dropdown
class="prepend-left-10 js-time-window-dropdown"
toggle-class="dropdown-menu-toggle"
:text="selectedTimeWindow"
<gl-dropdown-item
v-for="environment in environments"
:key="environment.id"
:active="environment.name === currentEnvironmentName"
active-class="is-active"
:href="environment.metrics_path"
>{{ environment.name }}</gl-dropdown-item
>
</gl-dropdown>
</gl-form-group>
<gl-form-group
v-if="!showEmptyState"
:label="s__('Metrics|Show last')"
label-size="sm"
label-for="monitor-time-window-dropdown"
class="col-sm-6 col-md-4 col-lg-2"
>
<gl-dropdown-item
v-for="(value, key) in timeWindows"
:key="key"
:active="activeTimeWindow(key)"
:href="setTimeWindowParameter(key)"
active-class="active"
>{{ value }}</gl-dropdown-item
<gl-dropdown
id="monitor-time-window-dropdown"
class="mb-0 d-flex js-time-window-dropdown"
toggle-class="dropdown-menu-toggle"
:text="selectedTimeWindow"
>
</gl-dropdown>
</div>
</div>
<div class="d-flex">
<div v-if="addingMetricsAvailable">
<gl-button
v-gl-modal="$options.addMetric.modalId"
class="js-add-metric-button text-success border-success"
>{{ $options.addMetric.title }}</gl-button
>
<gl-modal
ref="addMetricModal"
:modal-id="$options.addMetric.modalId"
:title="$options.addMetric.title"
>
<form ref="customMetricsForm" :action="customMetricsPath" method="post">
<custom-metrics-form-fields
:validate-query-path="validateQueryPath"
form-operation="post"
@formValidation="setFormValidity"
/>
</form>
<div slot="modal-footer">
<gl-button @click="hideAddMetricModal">{{ __('Cancel') }}</gl-button>
<gl-button
:disabled="!formIsValid"
variant="success"
@click="submitCustomMetricsForm"
>{{ __('Save changes') }}</gl-button
<gl-dropdown-item
v-for="(value, key) in timeWindows"
:key="key"
:active="activeTimeWindow(key)"
:href="setTimeWindowParameter(key)"
active-class="active"
>{{ value }}</gl-dropdown-item
>
</div>
</gl-modal>
</div>
<gl-button
v-if="externalDashboardUrl.length"
class="js-external-dashboard-link prepend-left-8"
variant="primary"
:href="externalDashboardUrl"
target="_blank"
</gl-dropdown>
</gl-form-group>
</template>
<gl-form-group
v-if="addingMetricsAvailable || externalDashboardUrl.length"
label-for="prometheus-graphs-dropdown-buttons"
class="dropdown-buttons col-lg d-lg-flex align-items-end"
>
{{ __('View full dashboard') }}
<icon name="external-link" />
</gl-button>
<div id="prometheus-graphs-dropdown-buttons">
<gl-button
v-if="addingMetricsAvailable"
v-gl-modal="$options.addMetric.modalId"
class="mr-2 mt-1 js-add-metric-button text-success border-success"
>
{{ $options.addMetric.title }}
</gl-button>
<gl-modal
v-if="addingMetricsAvailable"
ref="addMetricModal"
:modal-id="$options.addMetric.modalId"
:title="$options.addMetric.title"
>
<form ref="customMetricsForm" :action="customMetricsPath" method="post">
<custom-metrics-form-fields
:validate-query-path="validateQueryPath"
form-operation="post"
@formValidation="setFormValidity"
/>
</form>
<div slot="modal-footer">
<gl-button @click="hideAddMetricModal">{{ __('Cancel') }}</gl-button>
<gl-button
:disabled="!formIsValid"
variant="success"
@click="submitCustomMetricsForm"
>
{{ __('Save changes') }}
</gl-button>
</div>
</gl-modal>
<gl-button
v-if="externalDashboardUrl.length"
class="mt-1 js-external-dashboard-link"
variant="primary"
:href="externalDashboardUrl"
target="_blank"
rel="noopener noreferrer"
>
{{ __('View full dashboard') }}
<icon name="external-link" />
</gl-button>
</div>
</gl-form-group>
</div>
</div>
<div v-if="!showEmptyState">
<graph-group
v-for="(groupData, index) in groups"
......
app/assets/javascripts/pipelines/components/pipeline_url.vue
View file @ 7dc2d5eb
......@@ -102,7 +102,11 @@ export default {
<span
v-if="pipeline.flags.detached_merge_request_pipeline"
v-gl-tooltip
:title="__('This pipeline is run on the source branch')"
:title="
__(
'The code of a detached pipeline is tested against the source branch instead of merged results',
)
"
class="js-pipeline-url-detached badge badge-info"
>
{{ __('detached') }}
......
app/assets/stylesheets/pages/prometheus.scss
View file @ 7dc2d5eb
.prometheus-graphs {
.dropdowns {
.dropdown-menu-toggle {
svg {
position: absolute;
right: 5%;
top: 25%;
}
.dropdown-buttons {
> div {
margin-left: auto;
}
}
.dropdown-menu-toggle,
.dropdown-menu {
width: 240px;
}
.col-form-label {
line-height: 1;
padding-top: 0;
}
.form-group {
margin-bottom: map-get($spacing-scale, 3);
}
}
......
app/views/projects/pipelines/_info.html.haml
View file @ 7dc2d5eb
......@@ -43,7 +43,7 @@
} }
Auto DevOps
- if @pipeline.detached_merge_request_pipeline?
%span.js-pipeline-url-mergerequest.badge.badge-info.has-tooltip{ title: "This pipeline is run on the source branch" }
%span.js-pipeline-url-mergerequest.badge.badge-info.has-tooltip{ title: "The code of a detached pipeline is tested against the source branch instead of merged results" }
detached
- if @pipeline.stuck?
%span.js-pipeline-url-stuck.badge.badge-warning
......
changelogs/unreleased/62137-add-tooltip-to-improve-clarity-of-detached-label-state-in-the-merge-request-pipeline.yml 0 → 100644
View file @ 7dc2d5eb
---
title: Updated the detached pipeline badge tooltip text to offer a better explanation
merge_request: 31626
author:
type: other
changelogs/unreleased/64730-metrics-dashboard-menu-is-cramped-with-new-features-enabled.yml 0 → 100644
View file @ 7dc2d5eb
---
title: Improve layout of dropdowns in the metrics dashboard page
merge_request: 31239
author:
type: fixed
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7