Merge pull request #251 from kubero-dev/feature/improve-log-tabs

Show build and fetch log tab only on git deployments

Author: mms-gianni

client/src/components/apps/detail.vue

@@ -19,7 +19,7 @@
 
         <v-tabs-items v-model="tab">
             <v-tab-item transition="false" class="background">
-                <logs :pipeline="pipeline" :phase="phase" :app="app"/>
+                <logs :pipeline="pipeline" :phase="phase" :app="app" :deploymentstrategy="appData.spec.deploymentstrategy"/>
             </v-tab-item>
             <v-tab-item transition="false" class="background">
                 <events :pipeline="pipeline" :phase="phase" :app="app"/>
@@ -32,6 +32,7 @@
 </template>
 
 <script>
+import axios from "axios";
 export default {
     data () {
         return {
@@ -58,8 +59,41 @@ export default {
                     href: `#/pipeline/${this.pipeline}/${this.phase}/${this.app}/detail`,
                 }
             ],
+            pipelineData: {},
+            appData: {},
         }
     },
+    mounted() {
+        this.loadPipeline();
+        this.loadApp();
+        this.socketJoin();
+    },
+    beforeDestroy() {
+        this.socketLeave();
+    },
+    methods: {
+        socketLeave() {
+            this.$socket.client.emit("leave", {
+                room: `${this.pipeline}-${this.phase}-${this.app}`,
+            });
+        },
+        socketJoin() {
+            this.$socket.client.emit("join", {
+                room: `${this.pipeline}-${this.phase}-${this.app}`,
+            });
+        },
+        loadPipeline() {
+            axios.get('/api/pipelines/'+this.pipeline).then(response => {
+                this.pipelineData = response.data;
+            });
+        },
+        loadApp() {
+            axios.get('/api/pipelines/'+this.pipeline+'/'+this.phase+'/'+this.app).then(response => {
+                this.appData = response.data;
+            });
+        },
+    },
+
     components: {
         events : () => import('./events.vue'),
         logs : () => import('./logstab.vue'),

client/src/components/apps/logs.vue

@@ -2,9 +2,9 @@
     <div style="height: 95%;">
     <v-tabs class="console-bar">
         <template>
-            <v-tab @click="getLogHistory('web')">web</v-tab>
-            <v-tab @click="getLogHistory('builder')">build</v-tab>
-            <v-tab @click="getLogHistory('fetcher')">fetch</v-tab>
+            <v-tab @click="getLogHistory('web')">run</v-tab>
+            <v-tab v-if="deploymentstrategy == 'git'" @click="getLogHistory('builder')">build</v-tab>
+            <v-tab v-if="deploymentstrategy == 'git'" @click="getLogHistory('fetcher')">fetch</v-tab>
         </template>
     </v-tabs>
     <div class="console" id="console">
@@ -44,7 +44,11 @@ export default {
       app: {
         type: String,
         default: "new"
-      }
+      },
+      deploymentstrategy: {
+        type: String,
+        default: "docker"
+      },
     },
     data: () => ({
         loglines: [

client/src/components/apps/logstab.vue

@@ -18,7 +18,7 @@
         </v-row>
         <v-row style="height: 1100px">
             <v-col cols="12" sm="12" md="12">
-                <logs :pipeline=pipeline :phase=phase :app=app></logs>
+                <logs :pipeline=pipeline :phase=phase :app=app :deploymentstrategy=deploymentstrategy></logs>
             </v-col>
         </v-row>
 
@@ -39,7 +39,11 @@ export default {
       app: {
         type: String,
         default: "new"
-      }
+      },
+      deploymentstrategy: {
+        type: String,
+        default: "docker"
+      },
     },
     data: () => ({
     }),