<template>
 <transition :name="transitionName">
 <router-view></router-view>
 </transition>
</template>

<script>
export default {
 name: 'app',
 data () {
 return {
 transitionName: 'fade'
 }
 },
 watch: {
 '$route' (to, from) {
 let toDepth = to.meta
 let fromDepth = from.meta
 if (fromDepth > toDepth) {
 this.transitionName = 'fade-left'
 } else if (fromDepth < toDepth) {
 this.transitionName = 'fade-right'
 } else {
 this.transitionName = 'fade'
 }
 }
 }
}
</script>

<style>
</style>

<template>
 <div class="content">
 <!--<transition name="fade" mode="out-in">-->
 <router-view></router-view>
 <!--</transition>-->
 <Tabbar 
 :routers="[
 {path: '/index/home', icon: 'icon-home', name: '首頁'},
 {path: '/index/loading', icon: 'icon-course', name: '加載'},
 {path: '/index/message', icon: 'icon-info', name: '信息'}
 ]"
 >
 </Tabbar>
 </div>
</template>

<script>
export default {
 name: 'Index',
 components: {Tabbar: require('components/Tabbar')},
 data () {
 return {

 }
 }
}
</script>

<style lang="scss" scoped> 
.content{
 background-color: #eee;
}
</style>

import fetch from 'isomorphic-fetch'
import store from 'store'
import router from './router'
var env = process.env.NODE_ENV
var rootUrl
if (env === 'development') {
 rootUrl = ''
}
if (env === 'production') {
 rootUrl = ''
}
const post = function (url, params = {}) {
 return fetch(rootUrl + url, {
 method: 'post',
 headers: {
 'Content-type': 'application/json; charset=utf-8',
 'Authorization': store.get('token')
 },
 body: JSON.stringify(params)
 }).then(function (res) {
 if (res.status === 401) {
 // 沒有權(quán)限
 api.logout()
 } else {
 return res.json()
 }
 })
}

const urls = [
 'classAtCurDate' // 普通接口列表
]

var api = {}

for (var url of urls) {
 (function (url) {
 api[url] = (params) => {
 console.log(url)
 return post('course/' + url, params)
 }
 })(url)
}
// 需要特殊處理的接口
api.logout = () => {
 store.clearAll()
 router.push('login')
}

api.login = (params) => {
 store.set('id', 1)
 store.set('token', 2)
 return Promise.resolve({params})
}
export default api

// 在main.js中導(dǎo)入api接口
import api from '../src/api'
Vue.$api = Vue.prototype.$api = api

router.beforeEach((to, from, next) => {
 if (cache.get('id') && to.path === '/login') {
 next('/index')
 } else if (!cache.get('id') && to.path !== '/login') {
 next('/login')
 } else {
 next()
 }
})