web(feat): Add config file and custom header

web/README.md

@@ -31,5 +31,14 @@ yarn build
 yarn lint
 ```
 
+### Basic Header Theeming
+
+Not happy with the default Docat logo and header?
+Just add your custom html header to the `/var/www/html/config.json` file.
+
+```
+{"headerHTML": "<h1>MyCompany</h1>"}
+```
+
 ### Customize configuration
 See [Configuration Reference](https://cli.vuejs.org/config/).

web/package.json

@@ -41,7 +41,9 @@
       "plugin:vue/essential",
       "eslint:recommended"
     ],
-    "rules": {},
+    "rules": {
+      "no-console": "off"
+    },
     "parserOptions": {
       "parser": "babel-eslint"
     },

web/src/components/Layout.vue

@@ -5,8 +5,7 @@
         <div class="md-layout-item md-size-15 md-small-hide"></div>
         <div class="md-layout-item">
           <router-link to="/">
-            <img class="logo" alt="docat logo" src="../assets/logo.png" />
-            <h1>DOCAT</h1>
+            <div v-html="header" />
           </router-link>
           <slot name="toolbar"></slot>
         </div>
@@ -29,10 +28,24 @@
 </template>
 
 <script>
+import ProjectRepository from '@/repositories/ProjectRepository'
+
 export default {
   name: 'layout',
   props: {
     fullscreen: Boolean,
+  },
+  data() {
+    const defaultHeader = '<img class="logo" alt="docat logo" src="' + require('../assets/logo.png') + '" /><h1>DOCAT</h1>'
+    return {
+      header: defaultHeader,
+    }
+  },
+  async created() {
+    const config = ProjectRepository.getConfig()
+    if (config.hasOwnProperty('headerHTML')){
+      this.header = config.headerHTML
+    }
   }
 }
 </script>

web/src/repositories/ProjectRepository.js

@@ -3,6 +3,18 @@ import Repository from '@/repositories/Repository'
 const resource = 'doc'
 export default {
 
+  /**
+  * Get Config
+  */
+  async getConfig() {
+    try {
+      const result = await Repository.get(`${Repository.defaults.baseURL}/config.json`)
+      return result.data;
+    } catch {
+      return {}
+    }
+  },
+
   /**
    * Returns all projects
    */