add products page

src/router/index.js

@@ -16,6 +16,20 @@ const routes = [
       bodyClass: "home-page"
     }
   },
+  {
+    path: "/products",
+    name: "Products",
+    // route level code-splitting
+    // this generates a separate chunk (about.[hash].js) for this route
+    // which is lazy-loaded when the route is visited.
+    component: () =>
+      import(/* webpackChunkName: "services" */ "@/views/Products.vue"),
+    meta: {
+      title: "Platform One | Products",
+      bodyClass: "products-page",
+      breadcrumb: "Products"
+    }
+  },
   {
     path: "/services",
     name: "Services",
@@ -26,7 +40,8 @@ const routes = [
       import(/* webpackChunkName: "services" */ "@/views/Services.vue"),
     meta: {
       title: "Platform One | Services",
-      bodyClass: "services-page"
+      bodyClass: "services-page",
+      breadcrumb: "Services"
     }
   },
   {
@@ -39,20 +54,22 @@ const routes = [
       import(/* webpackChunkName: "who-we-are" */ "@/views/WhoWeAre.vue"),
     meta: {
       title: "Platform One | Who We Are",
-      bodyClass: "who-we-are-page"
+      bodyClass: "who-we-are-page",
+      breadcrumb: "Who We Are"
     }
   },
-  { path: "/partybus", redirect: "/abms-adce" },
+  { path: "/partybus", redirect: "/products/abms-adce" },
   {
-    path: "/abms-adce",
+    path: "/products/abms-adce",
     name: "ADCE",
     // route level code-splitting
     // this generates a separate chunk (about.[hash].js) for this route
     // which is lazy-loaded when the route is visited.
     component: () => import(/* webpackChunkName: "adce" */ "@/views/ADCE.vue"),
     meta: {
-      title: "Platform One | ABMS-ADCE",
-      bodyClass: "adce-page"
+      title: "Platform One | Products | ABMS-ADCE",
+      bodyClass: "adce-page",
+      breadcrumb: "ABMS ADCE - Party Bus"
     }
   },
   {
@@ -65,7 +82,8 @@ const routes = [
       import(/* webpackChunkName: "ContactUs" */ "@/views/ContactUs.vue"),
     meta: {
       title: "Platform One | Contact Us",
-      bodyClass: "contact-us-page"
+      bodyClass: "contact-us-page",
+      breadcrumb: "Contact Us"
     }
   }
 ];
@@ -88,6 +106,7 @@ const router = new VueRouter({
 });
 
 const vueBodyClass = new VueBodyClass(routes);
+
 // This callback runs before every route change, including on page load.
 router.beforeEach((to, from, next) => {
   vueBodyClass.guard(to, next);

src/views/Products.vue

+<template>
+  <div class="home">
+    <PageHeader title="Platform One Products" />
+    <ProductsSummary />
+  </div>
+</template>
+
+<script>
+import PageHeader from "@/components/PageHeader";
+import ProductsSummary from "@/components/ProductsSummary";
+
+export default {
+  name: "Products",
+  components: {
+    PageHeader,
+    ProductsSummary
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.home {
+  .page-header {
+    margin-bottom: 5rem !important;
+  }
+}
+</style>