Commit 71400fce authored by Bryce Johnson's avatar Bryce Johnson

Add tooltips to linked pipelines [ci-skip]

parent e757b285
<script> <script>
import ciStatus from '../../../vue_shared/components/ci_icon.vue'; import ciStatus from '../../../vue_shared/components/ci_icon.vue';
import tooltipMixin from '../../../vue_shared/mixins/tooltip';
export default { export default {
props: { props: {
...@@ -20,9 +21,17 @@ export default { ...@@ -20,9 +21,17 @@ export default {
required: true, required: true,
}, },
}, },
mixins: [
tooltipMixin,
],
components: { components: {
ciStatus, ciStatus,
}, },
computed: {
tooltipText() {
return `${this.projectName} - ${this.pipelineStatus.label}`;
},
}
}; };
</script> </script>
...@@ -31,8 +40,12 @@ export default { ...@@ -31,8 +40,12 @@ export default {
<div class="curve"></div> <div class="curve"></div>
<div> <div>
<a <a
:href="pipelinePath" class="linked-pipeline-content"
class="linked-pipeline-content"> :href="pipelinePath"
:title="tooltipText"
ref="tooltip"
data-toggle="tooltip"
data-container="body">
<span class="linked-pipeline-status ci-status-text"> <span class="linked-pipeline-status ci-status-text">
<ci-status :status="pipelineStatus"/> <ci-status :status="pipelineStatus"/>
</span> </span>
......
const mockTriggerers = [ const mockTriggerers = [
{ id: 111, path: 'hello/world/tho', project: { name: 'GitLab Shell' }, details: { status: { icon: 'icon_status_pending', group: 'pending' } } }, { id: 111, path: 'hello/world/tho', project: { name: 'GitLab Shell' }, details: { status: { icon: 'icon_status_pending', group: 'pending', label: 'pending' } } },
]; ];
const mockTriggereds = [ const mockTriggereds = [
{ id: 111, path: 'hello/world/tho', project: { name: 'GitLab EE' }, details: { status: { icon: 'icon_status_failed', group: 'failed' } } }, { id: 111, path: 'hello/world/tho', project: { name: 'GitLab EE' }, details: { status: { icon: 'icon_status_failed', group: 'failed', label: 'failed' } } },
{ id: 111, path: 'hello/world/tho', project: { name: 'Gitaly' }, details: { status: { icon: 'icon_status_pending', group: 'pending' } } }, { id: 111, path: 'hello/world/tho', project: { name: 'Gitaly' }, details: { status: { icon: 'icon_status_pending', group: 'pending', label: 'pending' } } },
{ id: 111, path: 'hello/world/tho', project: { name: 'GitHub' }, details: { status: { icon: 'icon_status_success', group: 'success' } } }, { id: 111, path: 'hello/world/tho', project: { name: 'GitHub' }, details: { status: { icon: 'icon_status_success', group: 'success', label: 'success' } } },
]; ];
export default class PipelineStore { export default class PipelineStore {
......
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