debian-mirror-gitlab/app/assets/javascripts/jobs/components/header.vue

98 lines
2.2 KiB
Vue
Raw Normal View History

2017-09-10 17:25:29 +05:30
<script>
2018-10-15 14:42:47 +05:30
import ciHeader from '../../vue_shared/components/header_ci_component.vue';
import loadingIcon from '../../vue_shared/components/loading_icon.vue';
import callout from '../../vue_shared/components/callout.vue';
2017-09-10 17:25:29 +05:30
2018-10-15 14:42:47 +05:30
export default {
name: 'JobHeaderSection',
components: {
ciHeader,
loadingIcon,
callout,
},
props: {
job: {
type: Object,
required: true,
2018-03-17 18:26:18 +05:30
},
2018-10-15 14:42:47 +05:30
isLoading: {
type: Boolean,
required: true,
2017-09-10 17:25:29 +05:30
},
2018-10-15 14:42:47 +05:30
},
data() {
return {
actions: this.getActions(),
};
},
computed: {
status() {
return this.job && this.job.status;
2017-09-10 17:25:29 +05:30
},
2018-10-15 14:42:47 +05:30
shouldRenderContent() {
return !this.isLoading && Object.keys(this.job).length;
2018-03-17 18:26:18 +05:30
},
2018-10-15 14:42:47 +05:30
shouldRenderReason() {
return !!(this.job.status && this.job.callout_message);
2017-09-10 17:25:29 +05:30
},
2018-10-15 14:42:47 +05:30
/**
* When job has not started the key will be `false`
* When job started the key will be a string with a date.
*/
jobStarted() {
return !this.job.started === false;
},
2018-11-08 19:23:39 +05:30
headerTime() {
return this.jobStarted ? this.job.started : this.job.created_at;
},
2018-10-15 14:42:47 +05:30
},
watch: {
job() {
this.actions = this.getActions();
},
},
methods: {
getActions() {
const actions = [];
2017-09-10 17:25:29 +05:30
2018-10-15 14:42:47 +05:30
if (this.job.new_issue_path) {
actions.push({
label: 'New issue',
path: this.job.new_issue_path,
2018-11-08 19:23:39 +05:30
cssClass: 'js-new-issue btn btn-new btn-inverted d-none d-md-block d-lg-block d-xl-block',
2018-10-15 14:42:47 +05:30
type: 'link',
});
}
return actions;
2017-09-10 17:25:29 +05:30
},
2018-10-15 14:42:47 +05:30
},
};
2017-09-10 17:25:29 +05:30
</script>
<template>
2018-10-15 14:42:47 +05:30
<header>
<div class="js-build-header build-header top-area">
<ci-header
v-if="shouldRenderContent"
:status="status"
:item-id="job.id"
2018-11-08 19:23:39 +05:30
:time="headerTime"
2018-10-15 14:42:47 +05:30
:user="job.user"
:actions="actions"
:has-sidebar-button="true"
:should-render-triggered-label="jobStarted"
2018-11-08 19:23:39 +05:30
item-name="Job"
2018-10-15 14:42:47 +05:30
/>
<loading-icon
v-if="isLoading"
size="2"
class="prepend-top-default append-bottom-default"
/>
</div>
<callout
v-if="shouldRenderReason"
:message="job.callout_message"
2018-03-17 18:26:18 +05:30
/>
2018-10-15 14:42:47 +05:30
</header>
2017-09-10 17:25:29 +05:30
</template>