summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPhil Hughes <me@iamphill.com>2018-05-24 12:11:55 +0100
committerPhil Hughes <me@iamphill.com>2018-05-24 12:11:55 +0100
commit1e48b7eec0499e44eb1dcd32393005f709b5c816 (patch)
treebc1f07f7c1aa345e6c756811a61340ed55dbcced
parent4b4618936d0af203820be3a9392d7e555464cf3f (diff)
downloadgitlab-ce-1e48b7eec0499e44eb1dcd32393005f709b5c816.tar.gz
removed need for jobs component
-rw-r--r--app/assets/javascripts/ide/components/jobs/list.vue10
-rw-r--r--app/assets/javascripts/ide/components/jobs/stage.vue10
-rw-r--r--app/assets/javascripts/ide/components/pipelines/jobs.vue59
-rw-r--r--app/assets/javascripts/ide/components/pipelines/list.vue46
4 files changed, 54 insertions, 71 deletions
diff --git a/app/assets/javascripts/ide/components/jobs/list.vue b/app/assets/javascripts/ide/components/jobs/list.vue
index ef1d4580d6a..fd6bfdf86d0 100644
--- a/app/assets/javascripts/ide/components/jobs/list.vue
+++ b/app/assets/javascripts/ide/components/jobs/list.vue
@@ -1,5 +1,4 @@
<script>
-import { mapState } from 'vuex';
import LoadingIcon from '../../../vue_shared/components/loading_icon.vue';
import Stage from './stage.vue';
@@ -13,9 +12,10 @@ export default {
type: Array,
required: true,
},
- },
- computed: {
- ...mapState('pipelines', ['isLoadingJobs']),
+ loading: {
+ type: Boolean,
+ required: true,
+ },
},
};
</script>
@@ -23,7 +23,7 @@ export default {
<template>
<div>
<loading-icon
- v-if="isLoadingJobs && !stages.length"
+ v-if="loading && !stages.length"
class="prepend-top-default"
size="2"
/>
diff --git a/app/assets/javascripts/ide/components/jobs/stage.vue b/app/assets/javascripts/ide/components/jobs/stage.vue
index c00ac458745..7f1a0ed1218 100644
--- a/app/assets/javascripts/ide/components/jobs/stage.vue
+++ b/app/assets/javascripts/ide/components/jobs/stage.vue
@@ -31,6 +31,12 @@ export default {
collapseIcon() {
return this.stage.isCollapsed ? 'angle-left' : 'angle-down';
},
+ showLoadingIcon() {
+ return this.stage.isLoading && !this.stage.jobs.length;
+ },
+ jobsCount() {
+ return this.stage.jobs.length;
+ },
},
created() {
this.fetchJobs(this.stage);
@@ -69,7 +75,7 @@ export default {
</strong>
<div class="append-right-8">
<span class="badge">
- {{ stage.jobs.length }}
+ {{ jobsCount }}
</span>
</div>
<icon
@@ -82,7 +88,7 @@ export default {
v-show="!stage.isCollapsed"
>
<loading-icon
- v-if="stage.isLoading && !stage.jobs.length"
+ v-if="showLoadingIcon"
/>
<template v-else>
<item
diff --git a/app/assets/javascripts/ide/components/pipelines/jobs.vue b/app/assets/javascripts/ide/components/pipelines/jobs.vue
deleted file mode 100644
index 08edc0e56a5..00000000000
--- a/app/assets/javascripts/ide/components/pipelines/jobs.vue
+++ /dev/null
@@ -1,59 +0,0 @@
-<script>
-import { mapActions, mapGetters, mapState } from 'vuex';
-import Tabs from '../../../vue_shared/components/tabs/tabs';
-import Tab from '../../../vue_shared/components/tabs/tab.vue';
-import JobsList from '../jobs/list.vue';
-
-export default {
- components: {
- Tabs,
- Tab,
- JobsList,
- },
- computed: {
- ...mapGetters('pipelines', ['jobsCount', 'failedJobsCount', 'failedStages']),
- ...mapState('pipelines', ['stages', 'isLoadingJobs']),
- },
- created() {
- this.fetchStages();
- },
- methods: {
- ...mapActions('pipelines', ['fetchStages']),
- },
-};
-</script>
-
-<template>
- <div>
- <tabs>
- <tab active>
- <template slot="title">
- Jobs
- <span
- v-if="!isLoadingJobs || jobsCount"
- class="badge"
- >
- {{ jobsCount }}
- </span>
- </template>
- <jobs-list
- :stages="stages"
- />
- </tab>
- <tab>
- <template slot="title">
- Failed Jobs
- <span
- v-if="!isLoadingJobs || failedJobsCount"
- class="badge"
- >
- {{ failedJobsCount }}
- </span>
- </template>
- <jobs-list
- :stages="failedStages"
- />
- </tab>
- </tabs>
- </div>
-</template>
diff --git a/app/assets/javascripts/ide/components/pipelines/list.vue b/app/assets/javascripts/ide/components/pipelines/list.vue
index d8f75d2f6a3..8eed902d4e2 100644
--- a/app/assets/javascripts/ide/components/pipelines/list.vue
+++ b/app/assets/javascripts/ide/components/pipelines/list.vue
@@ -2,17 +2,22 @@
import { mapActions, mapGetters, mapState } from 'vuex';
import LoadingIcon from '../../../vue_shared/components/loading_icon.vue';
import CiIcon from '../../../vue_shared/components/ci_icon.vue';
-import JobsList from './jobs.vue';
+import Tabs from '../../../vue_shared/components/tabs/tabs';
+import Tab from '../../../vue_shared/components/tabs/tab.vue';
+import JobsList from '../jobs/list.vue';
export default {
components: {
LoadingIcon,
CiIcon,
+ Tabs,
+ Tab,
JobsList,
},
computed: {
...mapGetters(['currentProject']),
- ...mapState('pipelines', ['isLoadingPipeline', 'latestPipeline']),
+ ...mapGetters('pipelines', ['jobsCount', 'failedJobsCount', 'failedStages']),
+ ...mapState('pipelines', ['isLoadingPipeline', 'latestPipeline', 'stages', 'isLoadingJobs']),
statusIcon() {
return {
group: this.latestPipeline.status,
@@ -21,10 +26,10 @@ export default {
},
},
created() {
- this.fetchLatestPipeline();
+ return this.fetchLatestPipeline().then(() => this.fetchStages());
},
methods: {
- ...mapActions('pipelines', ['fetchLatestPipeline']),
+ ...mapActions('pipelines', ['fetchLatestPipeline', 'fetchStages']),
},
};
</script>
@@ -56,7 +61,38 @@ export default {
</a>
</span>
</header>
- <jobs-list />
+ <tabs>
+ <tab active>
+ <template slot="title">
+ Jobs
+ <span
+ v-if="!isLoadingJobs || jobsCount"
+ class="badge"
+ >
+ {{ jobsCount }}
+ </span>
+ </template>
+ <jobs-list
+ :loading="isLoadingJobs"
+ :stages="stages"
+ />
+ </tab>
+ <tab>
+ <template slot="title">
+ Failed Jobs
+ <span
+ v-if="!isLoadingJobs || failedJobsCount"
+ class="badge"
+ >
+ {{ failedJobsCount }}
+ </span>
+ </template>
+ <jobs-list
+ :loading="isLoadingJobs"
+ :stages="failedStages"
+ />
+ </tab>
+ </tabs>
</template>
</div>
</template>