changeset 814:d6888d1439e5

error log and access log selectable
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 27 Sep 2018 17:32:48 +0200
parents 1a808929c2c5
children 01019d4c8359 cd79f62794dd
files client/src/logs/logs.vue
diffstat 1 files changed, 45 insertions(+), 11 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/logs/logs.vue	Thu Sep 27 17:32:25 2018 +0200
+++ b/client/src/logs/logs.vue	Thu Sep 27 17:32:48 2018 +0200
@@ -3,13 +3,27 @@
         <div class="d-flex flex-row">
             <div :class="spacer"></div>
             <div class="logoutput shadow">
-                <pre v-highlightjs="logs"><code class="accesslog"></code></pre>
+                <pre v-highlightjs="logs"><code class="bash"></code></pre>
             </div>
         </div>
+        <div class="logmenu">
+            <ul class="nav nav-pills">
+                <li class="nav-item">
+                    <a @click="fetch('system/log/apache2/access.log', 'accesslog')" :class="accesslogStyle" href="#">Accesslog</a>
+                </li>
+                <li class="nav-item">
+                    <a @click="fetch('system/log/apache2/error.log', 'errorlog')" :class="errorlogStyle" href="#">Errorlog</a>
+                </li>
+            </ul>
+        </div>
     </div>
 </template>
 
 <style scoped lang="scss">
+.logmenu {
+  margin-left: auto;
+  margin-right: auto;
+}
 .logoutput {
   width: 95%;
   height: 85vh;
@@ -41,31 +55,51 @@
 import { mapGetters } from "vuex";
 import { HTTP } from "../application/lib/http.js";
 
+const ACCESSLOG = "accesslog";
+const ERRORLOG = "errorlog";
+
 export default {
   name: "logs",
   mounted() {
-    HTTP.get("system/log/apache2/access.log", {
-      headers: { "X-Gemma-Auth": localStorage.getItem("token") }
-    })
-      .then(response => {
-        this.logs = response.data.content;
-      })
-      .catch(error => {
-        console.log(error);
-      });
+    this.fetch("system/log/apache2/access.log", ACCESSLOG);
   },
   data() {
     return {
-      logs: null
+      logs: null,
+      currentLog: null
     };
   },
   methods: {
+    fetch(file, type) {
+      HTTP.get(file, {
+        headers: { "X-Gemma-Auth": localStorage.getItem("token") }
+      })
+        .then(response => {
+          this.logs = response.data.content;
+          this.currentLog = type;
+        })
+        .catch(error => {
+          console.log(error);
+        });
+    },
     disallow(e) {
       e.target.blur();
     }
   },
   computed: {
     ...mapGetters("application", ["sidebarCollapsed", "isUsermenuCollapsed"]),
+    accesslogStyle() {
+      return {
+        active: this.currentLog == ACCESSLOG,
+        "nav-link": true
+      };
+    },
+    errorlogStyle() {
+      return {
+        active: this.currentLog == ERRORLOG,
+        "nav-link": true
+      };
+    },
     spacer() {
       return {
         spacer: true,