Added vue-router
This commit is contained in:
parent
092836359b
commit
3b524fbe93
|
@ -30,6 +30,7 @@
|
|||
"file-loader": "^1.1.4",
|
||||
"vue-loader": "^13.0.5",
|
||||
"vue-template-compiler": "^2.5.9",
|
||||
"vue-router": "^2.5.3",
|
||||
"webpack": "^3.8.1",
|
||||
"webpack-dev-server": "^2.9.5"
|
||||
}
|
||||
|
|
17
view/main.js
17
view/main.js
|
@ -2,11 +2,13 @@
|
|||
---------------------------------------------------------*/
|
||||
/* (1) NPM libs */
|
||||
import Vue from 'vue'
|
||||
import VueRouter from 'vue-router'
|
||||
|
||||
/* (2) Internal libs */
|
||||
import {API} from './lib/api-es6'
|
||||
import {InfoBox} from './lib/infobox-es6'
|
||||
import {WSClient,WSClientBuilder} from './lib/ws-client-es6'
|
||||
import routes from './routes'
|
||||
|
||||
/* (3) Vues */
|
||||
import wrapper_vue from './vue/wrapper.vue'
|
||||
|
@ -25,13 +27,18 @@ require('./vue-config');
|
|||
window.gstore.add('server', window._SERVER);
|
||||
window.infobox = new InfoBox(window.gstore.data.info);
|
||||
|
||||
/* (4) Render view */
|
||||
/* (4) Init vue router */
|
||||
Vue.use(VueRouter);
|
||||
window.router = new VueRouter({
|
||||
mode: 'history',
|
||||
routes: routes[0]
|
||||
});
|
||||
|
||||
/* (5) Render view */
|
||||
new Vue({
|
||||
el: '#main-vue',
|
||||
render: h => h(wrapper_vue),
|
||||
data: {
|
||||
gstore: window.gstore.data
|
||||
}
|
||||
router: window.router,
|
||||
render: h => h(wrapper_vue)
|
||||
})
|
||||
|
||||
|
||||
|
|
|
@ -0,0 +1,19 @@
|
|||
export default { 0: [
|
||||
|
||||
{
|
||||
path: '/dashboard/',
|
||||
component: require('./vue/container/dashboard.vue')
|
||||
}, {
|
||||
path: '/profile/',
|
||||
component: require('./vue/container/profile.vue')
|
||||
}, {
|
||||
path: '/message/',
|
||||
component: require('./vue/container/message.vue')
|
||||
}, {
|
||||
path: '/notifications/',
|
||||
component: require('./vue/container/notifications.vue')
|
||||
}, {
|
||||
path: '*',
|
||||
redirect: '/dashboard/'
|
||||
}
|
||||
]}
|
|
@ -8,10 +8,7 @@
|
|||
<menu-comp></menu-comp>
|
||||
|
||||
<!-- Container -->
|
||||
<dashboard-container v-show="gstore.menu_item_active == 'dashboard'" ></dashboard-container>
|
||||
<profile-container v-show="gstore.menu_item_active == 'profile'" ></profile-container>
|
||||
<message-container v-show="gstore.menu_item_active == 'inbox'" ></message-container>
|
||||
<notifications-container v-show="gstore.menu_item_active == 'notifications'" ></notifications-container>
|
||||
<router-view></router-view>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
@ -25,12 +22,6 @@
|
|||
import header_vue from './header.vue';
|
||||
import menu_vue from './menu.vue';
|
||||
|
||||
import dashboardContainer_vue from './container/dashboard.vue';
|
||||
import profileContainer_vue from './container/profile.vue';
|
||||
import messageContainer_vue from './container/message.vue';
|
||||
import notificationsContainer_vue from './container/notifications.vue';
|
||||
|
||||
|
||||
export default {
|
||||
name: 'wrapper',
|
||||
data(){ return {
|
||||
|
@ -38,11 +29,7 @@ export default {
|
|||
}; },
|
||||
components: {
|
||||
'HeaderComp': header_vue,
|
||||
'MenuComp': menu_vue,
|
||||
'DashboardContainer': dashboardContainer_vue,
|
||||
'ProfileContainer': profileContainer_vue,
|
||||
'MessageContainer': messageContainer_vue,
|
||||
'NotificationsContainer': notificationsContainer_vue
|
||||
'MenuComp': menu_vue
|
||||
}
|
||||
}
|
||||
</script>
|
Loading…
Reference in New Issue