seepur/resources/scripts/applications/home/app.vue

<template>
  <div class="app">
    <Header :appName="appName" />
    <div class="columns m-t-xs is-fullheight">
      <div class="column sidebar">
        <SideBar :title="appName" :menu="menu" :appName="appName" />
      </div>
      <section class="section column app-content">
        <div class="container">
          <router-view></router-view>
        </div>
      </section>
    </div>
  </div>
</template>

<script lang="ts">
import Header from "./components/Header.vue";
import Services from "../services/index";
// import AppRouter from "./router/router.vue";
import {
  default as SideBar,
  IMenuItem
} from "../shared/components/SideBar/SideBar.vue";
const menu: IMenuItem[] = [
  {
    href: "/",
    text: "Home",
    isRouterLink: true,
    icon: "fa fa-home"
  },
  {
    href: "/applications",
    text: "Applications",
    isRouterLink: true,
    icon: "fa fa-puzzle-piece"
  },
  {
    href: "/settings",
    isRouterLink: true,
    text: "Settings",
    icon: "fa fa-gears"
  },
  {
    isRouterLink: false,
    href: "/logout",
    text: "Logout",
    icon: "fa fa-sign-out"
  }
];
// Services.ApiService.getConnections();

export default {
  name: "App",
  // router: AppRouter,
  components: {
    SideBar,
    Header
  },
  data() {
    return {
      appName: "Seepur",
      menu
    };
  }
};
</script>