use svg banner and logo, fix routing issue

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>

ui/src/components/CloudMonkey/Resource.vue

@@ -155,10 +155,16 @@
         </template>
 
         <a slot="name" slot-scope="text, record" href="javascript:;">
-          <router-link :to="{ path: $route.name + '/' + record.id }">{{ text }}</router-link>
+          <router-link :to="{ path: $route.path + '/' + record.id }">{{ text }}</router-link>
+        </a>
+        <a slot="displayname" slot-scope="text, record" href="javascript:;">
+          <router-link :to="{ path: $route.path + '/' + record.id }">{{ text }}</router-link>
         </a>
         <a slot="username" slot-scope="text, record" href="javascript:;">
-          <router-link :to="{ path: $route.name + '/' + record.id }">{{ text }}</router-link>
+          <router-link :to="{ path: $route.path + '/' + record.id }">{{ text }}</router-link>
+        </a>
+        <a slot="ipaddress" slot-scope="text, record" href="javascript:;">
+          <router-link :to="{ path: $route.path + '/' + record.id }">{{ text }}</router-link>
         </a>
         <a slot="vmname" slot-scope="text, record" href="javascript:;">
           <router-link :to="{ path: '/vm/' + record.virtualmachineid }">{{ text }}</router-link>
@@ -173,7 +179,8 @@
         </template>
 
         <a slot="account" slot-scope="text, record" href="javascript:;">
-          <router-link :to="{ path: '/account/' + record.accountid }">{{ text }}</router-link>
+          <router-link :to="{ path: '/account/' + record.accountid }" v-if="record.accountid">{{ text }}</router-link>
+          <router-link :to="{ path: '/account', query: { name: record.account } }" v-else>{{ text }}</router-link>
         </a>
         <a slot="domain" slot-scope="text, record" href="javascript:;">
           <router-link :to="{ path: '/domain/' + record.domainid }">{{ text }}</router-link>

ui/src/components/layouts/UserLayout.vue

@@ -3,7 +3,7 @@
     <div class="container">
       <div class="top">
         <div class="header">
-          <img src="~@/assets/banner.png" class="logo" alt="logo">
+          <img src="~@/assets/banner.svg" class="logo" alt="logo">
         </div>
       </div>
       <route-view></route-view>
@@ -74,6 +74,8 @@ export default {
           }
 
           .logo {
+            width: 100%;
+            max-width: 480px;
             vertical-align: top;
             border-style: none;
           }

ui/src/components/tools/Logo.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="logo">
-    <img class="logo-image" src="../../assets/logo.png"/>
+    <img class="logo-image" src="~@/assets/logo.svg"/>
     <project-menu></project-menu>
   </div>
 </template>
@@ -33,7 +33,7 @@ export default {
   height: 64px;
   position: relative;
   line-height: 64px;
-  padding-left: 24px;
+  padding-left: 8px;
   -webkit-transition: all .3s;
   transition: all .3s;
   background: #002140;
@@ -46,9 +46,8 @@ export default {
 }
 
 .logo-image {
-  margin-right: 10px;
+  width: 60px;
-  height: 32px;
+  margin-right: 8px;
-  width: 32px;
   display: inline-block;
   vertical-align: middle;
 }

ui/src/components/tools/ProjectMenu.vue

@@ -87,7 +87,7 @@ export default {
 <style lang="less" scoped>
 .project-wrapper {
   &-select {
-    width: 75%;
+    width: 70%;
   }
 }
 </style>

ui/src/views/Test.vue

@@ -1,36 +0,0 @@
-<template>
-  <div class="home">
-    <div class="banner">
-      <img style="width: 64px; height: 64px" src="../assets/logo.png">
-      <h3 style="margin-top: 1rem">Welcome to Primate App</h3>
-    </div>
-  </div>
-</template>
-
-<script>
-
-export default {
-  name: 'Home',
-  components: {
-  },
-  data () {
-    return {
-    }
-  },
-  methods: {
-  }
-}
-</script>
-
-<style scoped>
-  .home {
-    width: 900px;
-    margin: 0 auto;
-    padding: 25px 0;
-  }
-  .home > .banner {
-    text-align: center;
-    padding: 25px 0;
-    margin: 25px 0;
-  }
-</style>