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

<script lang="ts">
import Vue from "vue";
import VueRouter, {
  RouteConfig,
  RouterOptions,
  RouterMode,
  NavigationGuard
} from "vue-router";
Vue.use(VueRouter);

// Views
import Home from "../views/home.vue";
import Settings from "../views/settings.vue";
import Call from "../views/call.vue";
import ChildProfile from "../views/child_profile.vue";
import EditBook from "../views/edit_book.vue";
import BookOfflineViewer from "../views/BookOfflineViewer.vue";

// Call Views
import CallLobby from "../views/call_views/Lobby.vue";
import CallBook from "../views/call_views/Book.vue";

const routes: RouteConfig[] = [
  /** Define Application Routes */
  {
    path: "/",
    component: Home,
    name: "root"
  },
  {
    path: "/settings",
    component: Settings
  },
  {
    path: "/create/book",
    component: EditBook
  },
  {
    path: "/book/:id",
    component: BookOfflineViewer
  },
  {
    path: "/call/:id",
    component: Call,
    children: [
      { path: "", component: CallLobby, name: "lobby" },
      { path: "book", component: CallBook, name: "book" }
    ]
  },
  {
    path: "/child/:id",
    component: ChildProfile
  },
  {
    path: "*",
    redirect: { name: "root" }
  }
];

const AppRouter = new VueRouter({ routes, mode: "history" });

export default AppRouter;
</script>