From 9543c7621c0bdea290f404da0962b1092072dce1 Mon Sep 17 00:00:00 2001
From: xdrm-brackets <doowap31@gmail.com>
Date: Wed, 28 Feb 2018 12:36:54 +0100
Subject: [PATCH] +added VueRouter

---
 package-lock.json                |  5 +++++
 package.json                     |  3 ++-
 webpack/component/home/page1.vue | 21 +++++++++++++++++++++
 webpack/component/home/page2.vue | 21 +++++++++++++++++++++
 webpack/page/home.js             | 15 ++++++++++++++-
 webpack/routes/home.js           | 14 ++++++++++++++
 webpack/vue/wrapper.vue          |  3 +++
 7 files changed, 80 insertions(+), 2 deletions(-)
 create mode 100644 webpack/component/home/page1.vue
 create mode 100644 webpack/component/home/page2.vue
 create mode 100644 webpack/routes/home.js

diff --git a/package-lock.json b/package-lock.json
index d765df2..41b3f5e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8586,6 +8586,11 @@
         }
       }
     },
+    "vue-router": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-2.8.1.tgz",
+      "integrity": "sha512-MC4jacHBhTPKtmcfzvaj2N7g6jgJ/Z/eIjZdt+yUaUOM1iKC0OUIlO/xCtz6OZFFTNUJs/1YNro2GN/lE+nOXA=="
+    },
     "vue-style-loader": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-3.1.2.tgz",
diff --git a/package.json b/package.json
index d7b7340..bfb1dc8 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,8 @@
     "build": "npm run bundle:clean; npm run bundle:prod; npm run scss"
   },
   "dependencies": {
-    "vue": "^2.5.9"
+    "vue": "^2.5.9",
+    "vue-router": "^2.5.3"
   },
   "browserslist": [
     "> 1%",
diff --git a/webpack/component/home/page1.vue b/webpack/component/home/page1.vue
new file mode 100644
index 0000000..5bee200
--- /dev/null
+++ b/webpack/component/home/page1.vue
@@ -0,0 +1,21 @@
+<template>
+
+	<div id='CONTAINER' class='page1'>
+
+	</div>
+
+</template>
+
+
+
+
+<script>
+
+	export default {
+		name: 'CONTAINER_PAGE1',
+		data(){
+			return { gstore: gstore.get }
+		}
+	}
+
+</script>
\ No newline at end of file
diff --git a/webpack/component/home/page2.vue b/webpack/component/home/page2.vue
new file mode 100644
index 0000000..050b3a2
--- /dev/null
+++ b/webpack/component/home/page2.vue
@@ -0,0 +1,21 @@
+<template>
+
+	<div id='CONTAINER' class='page2'>
+
+	</div>
+
+</template>
+
+
+
+
+<script>
+
+	export default {
+		name: 'CONTAINER_PAGE2',
+		data(){
+			return { gstore: gstore.get }
+		}
+	}
+
+</script>
\ No newline at end of file
diff --git a/webpack/page/home.js b/webpack/page/home.js
index 6734019..6061ad7 100644
--- a/webpack/page/home.js
+++ b/webpack/page/home.js
@@ -2,6 +2,8 @@
 ---------------------------------------------------------*/
 /* (1) NPM libs */
 import Vue         from 'vue'
+import VueRouter   from 'vue-router'
+import routes      from '../routes/home'
 
 /* (2) Vues */
 import wrapper_vue from '../vue/wrapper.vue'
@@ -15,9 +17,20 @@ require('../data/home');
 
 /* (2) Initialisation
 ---------------------------------------------------------*/
-/* (1) Render view */
+/* (1) Init Router */
+const router = new VueRouter({
+	mode: 'history',
+	routes: routes[0]
+});
+
+/* (2) Store router in gstore */
+gstore.add('router', router);
+
+/* (3) Render view */
+Vue.use(VueRouter);
 new Vue({
 	el: '#main-vue',
+	router,
 	render: h => h(wrapper_vue)
 });
 
diff --git a/webpack/routes/home.js b/webpack/routes/home.js
new file mode 100644
index 0000000..2daabf9
--- /dev/null
+++ b/webpack/routes/home.js
@@ -0,0 +1,14 @@
+export default{ 0: [
+
+	{
+		path: '/home/page1/',
+		component: require('../component/home/page1.vue').default
+	}, {
+		path: '/home/page2/',
+		component: require('../component/home/page2.vue').default
+	}, {
+		path: '*',
+		redirect: '/home/page1/'
+	}
+
+]}
\ No newline at end of file
diff --git a/webpack/vue/wrapper.vue b/webpack/vue/wrapper.vue
index da0867f..6e4fc18 100644
--- a/webpack/vue/wrapper.vue
+++ b/webpack/vue/wrapper.vue
@@ -7,6 +7,9 @@
 		<!-- Menu -->
 		<menu-comp></menu-comp>
 
+		<!-- Container -->
+		<router-view></router-view>
+
 	</div>
 </template>