顶部tab静态页面初始化

src/router/index.js

@@ -36,7 +36,8 @@ const router = new VueRouter({
           meta: { myInd: 0 },
           component: () => import('@/views/home/News.vue')
         },
-        // 馆藏子路由
+
+        // 馆藏管理
         {
           name: 'holding0',
           path: 'holding0',
@@ -132,6 +133,30 @@ const router = new VueRouter({
           path: 'holding5_add',
           meta: { myInd: 1 },
           component: () => import('@/views/holding/holding5_add.vue')
+        },
+
+        // 征集品管理
+        {
+          name: 'collect0',
+          path: 'collect0',
+          meta: { myInd: 2 },
+          component: () => import('@/views/collect/collect0.vue')
+        },
+
+        // 馆藏统计
+        {
+          name: 'statistics0',
+          path: 'statistics0',
+          meta: { myInd: 3 },
+          component: () => import('@/views/statistics/statistics0.vue')
+        },
+
+        // 系统管理
+        {
+          name: 'system0',
+          path: 'system0',
+          meta: { myInd: 4 },
+          component: () => import('@/views/system/system0.vue')
         }
       ]
     }

src/views/collect/collect0.vue

@@ -0,0 +1,41 @@
+<template>
+<div class='collect'>
+  征集品管理
+</div>
+</template>
+
+<script>
+export default {
+  name: 'collect',
+  components: {},
+  data () {
+    return {
+
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+
+  },
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created () {
+
+  },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted () {
+
+  },
+  beforeCreate () {}, // 生命周期 - 创建之前
+  beforeMount () {}, // 生命周期 - 挂载之前
+  beforeUpdate () {}, // 生命周期 - 更新之前
+  updated () {}, // 生命周期 - 更新之后
+  beforeDestroy () {}, // 生命周期 - 销毁之前
+  destroyed () {}, // 生命周期 - 销毁完成
+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
+}
+</script>
+<style lang='less' scoped>
+//@import url(); 引入公共css类
+
+</style>

src/views/layout/index.vue

@@ -8,9 +8,9 @@
 
         <router-link to="/layout/home" :class='{active:$route.meta.myInd===0}'>首页</router-link>
         <router-link to="/layout/holding0" :class='{active:$route.meta.myInd===1}'>馆藏管理</router-link>
-        <router-link to="/layout/home2">征集品管理</router-link>
-        <router-link to="/layout/home3">馆藏统计</router-link>
-        <router-link to="/layout/home4">系统管理</router-link>
+        <router-link to="/layout/collect0" :class='{active:$route.meta.myInd===2}'>征集品管理</router-link>
+        <router-link to="/layout/statistics0" :class='{active:$route.meta.myInd===3}'>馆藏统计</router-link>
+        <router-link to="/layout/system0" :class='{active:$route.meta.myInd===4}'>系统管理</router-link>
       </div>
       <div class="right">
         <div class="img">

src/views/statistics/statistics0.vue

@@ -0,0 +1,41 @@
+<template>
+<div class='statistics'>
+  馆藏统计
+</div>
+</template>
+
+<script>
+export default {
+  name: 'statistics',
+  components: {},
+  data () {
+    return {
+
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+
+  },
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created () {
+
+  },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted () {
+
+  },
+  beforeCreate () {}, // 生命周期 - 创建之前
+  beforeMount () {}, // 生命周期 - 挂载之前
+  beforeUpdate () {}, // 生命周期 - 更新之前
+  updated () {}, // 生命周期 - 更新之后
+  beforeDestroy () {}, // 生命周期 - 销毁之前
+  destroyed () {}, // 生命周期 - 销毁完成
+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
+}
+</script>
+<style lang='less' scoped>
+//@import url(); 引入公共css类
+
+</style>

src/views/system/system0.vue

@@ -0,0 +1,41 @@
+<template>
+<div class='system'>
+  系统管理
+</div>
+</template>
+
+<script>
+export default {
+  name: 'system',
+  components: {},
+  data () {
+    return {
+
+    }
+  },
+  computed: {},
+  watch: {},
+  methods: {
+
+  },
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created () {
+
+  },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted () {
+
+  },
+  beforeCreate () {}, // 生命周期 - 创建之前
+  beforeMount () {}, // 生命周期 - 挂载之前
+  beforeUpdate () {}, // 生命周期 - 更新之前
+  updated () {}, // 生命周期 - 更新之后
+  beforeDestroy () {}, // 生命周期 - 销毁之前
+  destroyed () {}, // 生命周期 - 销毁完成
+  activated () {} // 如果页面有keep-alive缓存功能，这个函数会触发
+}
+</script>
+<style lang='less' scoped>
+//@import url(); 引入公共css类
+
+</style>