Revert "Merge branch 'winh-prettier-job-app' into 'master'"
This reverts merge request !22463
This commit is contained in:
Filipa Lacerda
parent
d76c647797
commit
02719344cc
1 changed files with 146 additions and 146 deletions
|
|
@ -1,164 +1,164 @@
|
|||
<script>
|
||||
import _ from 'underscore';
|
||||
import { mapGetters, mapState, mapActions } from 'vuex';
|
||||
import { isScrolledToBottom } from '~/lib/utils/scroll_utils';
|
||||
import bp from '~/breakpoints';
|
||||
import CiHeader from '~/vue_shared/components/header_ci_component.vue';
|
||||
import Callout from '~/vue_shared/components/callout.vue';
|
||||
import createStore from '../store';
|
||||
import EmptyState from './empty_state.vue';
|
||||
import EnvironmentsBlock from './environments_block.vue';
|
||||
import ErasedBlock from './erased_block.vue';
|
||||
import Log from './job_log.vue';
|
||||
import LogTopBar from './job_log_controllers.vue';
|
||||
import StuckBlock from './stuck_block.vue';
|
||||
import Sidebar from './sidebar.vue';
|
||||
import _ from 'underscore';
|
||||
import { mapGetters, mapState, mapActions } from 'vuex';
|
||||
import { isScrolledToBottom } from '~/lib/utils/scroll_utils';
|
||||
import bp from '~/breakpoints';
|
||||
import CiHeader from '~/vue_shared/components/header_ci_component.vue';
|
||||
import Callout from '~/vue_shared/components/callout.vue';
|
||||
import createStore from '../store';
|
||||
import EmptyState from './empty_state.vue';
|
||||
import EnvironmentsBlock from './environments_block.vue';
|
||||
import ErasedBlock from './erased_block.vue';
|
||||
import Log from './job_log.vue';
|
||||
import LogTopBar from './job_log_controllers.vue';
|
||||
import StuckBlock from './stuck_block.vue';
|
||||
import Sidebar from './sidebar.vue';
|
||||
|
||||
export default {
|
||||
name: 'JobPageApp',
|
||||
store: createStore(),
|
||||
components: {
|
||||
CiHeader,
|
||||
Callout,
|
||||
EmptyState,
|
||||
EnvironmentsBlock,
|
||||
ErasedBlock,
|
||||
Log,
|
||||
LogTopBar,
|
||||
StuckBlock,
|
||||
Sidebar,
|
||||
},
|
||||
props: {
|
||||
runnerSettingsUrl: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null,
|
||||
export default {
|
||||
name: 'JobPageApp',
|
||||
store: createStore(),
|
||||
components: {
|
||||
CiHeader,
|
||||
Callout,
|
||||
EmptyState,
|
||||
EnvironmentsBlock,
|
||||
ErasedBlock,
|
||||
Log,
|
||||
LogTopBar,
|
||||
StuckBlock,
|
||||
Sidebar,
|
||||
},
|
||||
runnerHelpUrl: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null,
|
||||
props: {
|
||||
runnerSettingsUrl: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
runnerHelpUrl: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
endpoint: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
terminalPath: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
pagePath: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
logState: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
endpoint: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
terminalPath: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
pagePath: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
logState: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState([
|
||||
'isLoading',
|
||||
'job',
|
||||
'isSidebarOpen',
|
||||
'trace',
|
||||
'isTraceComplete',
|
||||
'traceSize',
|
||||
'isTraceSizeVisible',
|
||||
'isScrollBottomDisabled',
|
||||
'isScrollTopDisabled',
|
||||
'isScrolledToBottomBeforeReceivingTrace',
|
||||
'hasError',
|
||||
]),
|
||||
...mapGetters([
|
||||
'headerActions',
|
||||
'headerTime',
|
||||
'shouldRenderCalloutMessage',
|
||||
'shouldRenderTriggeredLabel',
|
||||
'hasEnvironment',
|
||||
'isJobStuck',
|
||||
'hasTrace',
|
||||
'emptyStateIllustration',
|
||||
'isScrollingDown',
|
||||
'emptyStateAction',
|
||||
]),
|
||||
computed: {
|
||||
...mapState([
|
||||
'isLoading',
|
||||
'job',
|
||||
'isSidebarOpen',
|
||||
'trace',
|
||||
'isTraceComplete',
|
||||
'traceSize',
|
||||
'isTraceSizeVisible',
|
||||
'isScrollBottomDisabled',
|
||||
'isScrollTopDisabled',
|
||||
'isScrolledToBottomBeforeReceivingTrace',
|
||||
'hasError',
|
||||
]),
|
||||
...mapGetters([
|
||||
'headerActions',
|
||||
'headerTime',
|
||||
'shouldRenderCalloutMessage',
|
||||
'shouldRenderTriggeredLabel',
|
||||
'hasEnvironment',
|
||||
'isJobStuck',
|
||||
'hasTrace',
|
||||
'emptyStateIllustration',
|
||||
'isScrollingDown',
|
||||
'emptyStateAction',
|
||||
]),
|
||||
|
||||
shouldRenderContent() {
|
||||
return !this.isLoading && !this.hasError;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
// Once the job log is loaded,
|
||||
// fetch the stages for the dropdown on the sidebar
|
||||
job(newVal, oldVal) {
|
||||
if (_.isEmpty(oldVal) && !_.isEmpty(newVal.pipeline)) {
|
||||
this.fetchStages();
|
||||
shouldRenderContent() {
|
||||
return !this.isLoading && !this.hasError;
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.throttled = _.throttle(this.toggleScrollButtons, 100);
|
||||
watch: {
|
||||
// Once the job log is loaded,
|
||||
// fetch the stages for the dropdown on the sidebar
|
||||
job(newVal, oldVal) {
|
||||
if (_.isEmpty(oldVal) && !_.isEmpty(newVal.pipeline)) {
|
||||
this.fetchStages();
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.throttled = _.throttle(this.toggleScrollButtons, 100);
|
||||
|
||||
this.setJobEndpoint(this.endpoint);
|
||||
this.setTraceOptions({
|
||||
logState: this.logState,
|
||||
pagePath: this.pagePath,
|
||||
});
|
||||
this.setJobEndpoint(this.endpoint);
|
||||
this.setTraceOptions({
|
||||
logState: this.logState,
|
||||
pagePath: this.pagePath,
|
||||
});
|
||||
|
||||
this.fetchJob();
|
||||
this.fetchTrace();
|
||||
this.fetchJob();
|
||||
this.fetchTrace();
|
||||
|
||||
window.addEventListener('resize', this.onResize);
|
||||
window.addEventListener('scroll', this.updateScroll);
|
||||
},
|
||||
window.addEventListener('resize', this.onResize);
|
||||
window.addEventListener('scroll', this.updateScroll);
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.updateSidebar();
|
||||
},
|
||||
|
||||
destroyed() {
|
||||
window.removeEventListener('resize', this.onResize);
|
||||
window.removeEventListener('scroll', this.updateScroll);
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapActions([
|
||||
'setJobEndpoint',
|
||||
'setTraceOptions',
|
||||
'fetchJob',
|
||||
'fetchStages',
|
||||
'hideSidebar',
|
||||
'showSidebar',
|
||||
'toggleSidebar',
|
||||
'fetchTrace',
|
||||
'scrollBottom',
|
||||
'scrollTop',
|
||||
'toggleScrollButtons',
|
||||
'toggleScrollAnimation',
|
||||
]),
|
||||
onResize() {
|
||||
mounted() {
|
||||
this.updateSidebar();
|
||||
this.updateScroll();
|
||||
},
|
||||
updateSidebar() {
|
||||
if (bp.getBreakpointSize() === 'xs') {
|
||||
this.hideSidebar();
|
||||
} else if (!this.isSidebarOpen) {
|
||||
this.showSidebar();
|
||||
}
|
||||
},
|
||||
updateScroll() {
|
||||
if (!isScrolledToBottom()) {
|
||||
this.toggleScrollAnimation(false);
|
||||
} else if (this.isScrollingDown) {
|
||||
this.toggleScrollAnimation(true);
|
||||
}
|
||||
|
||||
this.throttled();
|
||||
destroyed() {
|
||||
window.removeEventListener('resize', this.onResize);
|
||||
window.removeEventListener('scroll', this.updateScroll);
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
methods: {
|
||||
...mapActions([
|
||||
'setJobEndpoint',
|
||||
'setTraceOptions',
|
||||
'fetchJob',
|
||||
'fetchStages',
|
||||
'hideSidebar',
|
||||
'showSidebar',
|
||||
'toggleSidebar',
|
||||
'fetchTrace',
|
||||
'scrollBottom',
|
||||
'scrollTop',
|
||||
'toggleScrollButtons',
|
||||
'toggleScrollAnimation',
|
||||
]),
|
||||
onResize() {
|
||||
this.updateSidebar();
|
||||
this.updateScroll();
|
||||
},
|
||||
updateSidebar() {
|
||||
if (bp.getBreakpointSize() === 'xs') {
|
||||
this.hideSidebar();
|
||||
} else if (!this.isSidebarOpen) {
|
||||
this.showSidebar();
|
||||
}
|
||||
},
|
||||
updateScroll() {
|
||||
if (!isScrolledToBottom()) {
|
||||
this.toggleScrollAnimation(false);
|
||||
} else if (this.isScrollingDown) {
|
||||
this.toggleScrollAnimation(true);
|
||||
}
|
||||
|
||||
this.throttled();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue