src/router/index.js

@@ -58,25 +58,91 @@ const routes = [
         }
       },
       {
-        path: 'test',
+        path: 'apis',
-        component: () => import('@/views/layout/Users.vue'),
+        component: () => import('@/views/layout/APIs.vue'),
         meta: {
-          title: '充值中心',
+          title: 'API管理',
-          icon: 'inbox',
+          icon: 'layers',
           showInMenu: true,
           showInUser: false,
           isHome: false
         }
       },
       {
-        path: 'api',
+        path: 'packages',
-        component: () => import('@/views/layout/Dashboard.vue'),
+        component: () => import('@/views/layout/Packages.vue'),
         meta: {
-          title: 'API管理',
+          title: '套餐管理',
-          icon: 'home',
+          icon: 'grid',
           showInMenu: true,
           showInUser: false,
-          isHome:true
+          isHome: false
+        }
+      },
+      {
+        path: 'buypackage',
+        component: () => import('@/views/layout/BuyPackage.vue'),
+        meta: {
+          title: '套餐购买',
+          icon: 'shopping-bag',
+          showInMenu: true,
+          showInUser: true,
+          isHome: false
+        }
+      },
+      {
+        path: 'orders',
+        component: () => import('@/views/layout/Orders.vue'),
+        meta: {
+          title: '订单管理',
+          icon: 'shopping-cart',
+          showInMenu: true,
+          showInUser: false,
+          isHome: false
+        }
+      }, 
+      {
+        path: 'balance',
+        component: () => import('@/views/layout/Balance.vue'),
+        meta: {
+          title: '充值中心',
+          icon: 'dollar-sign',
+          showInMenu: true,
+          showInUser: true,
+          isHome: false
+        }
+      },
+      {
+        path: 'records',
+        component: () => import('@/views/layout/Records.vue'),
+        meta: {
+          title: '消费记录',
+          icon: 'archive',
+          showInMenu: true,
+          showInUser: true,
+          isHome: false
+        }
+      },
+      {
+        path: 'system',
+        component: () => import('@/views/layout/SystemConfig.vue'),
+        meta: {
+          title: '系统设置',
+          icon: 'settings',
+          showInMenu: true,
+          showInUser:false,
+          isHome:false
+        }
+      },
+      {
+        path: 'center',
+        component: () => import('@/views/layout/PersonalCenter.vue'),
+        meta: {
+          title: '个人中心',
+          icon: 'user',
+          showInMenu: false,
+          showInUser:true,
+          isHome:false
         }
       },
     ]

src/views/auth/Login.vue

@@ -72,7 +72,6 @@ export default {
                 const res = await this.$api.login(this.formdata)
                 let msg = ''
                 let type = 'danger'
-                console.log(res)
                 switch (res.code) {
                     case 2000: msg = '登录成功'; break
                     case 2001: msg = '用户名或密码错误'; break

src/views/layout/APIs.vue

@@ -0,0 +1,43 @@
+<template>
+    <div class="main-wrapper">
+
+        <div class="row">
+            <div class="col" v-if="isLoaded">
+                <DataTable title="API管理" 
+                :headers="tableHeaders" 
+                :rows="tableData" 
+                :data-count="dataCount" />
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import DataTable from '@/components/DataTable.vue';
+
+
+export default {
+    name: "APIs",
+    components: {
+        DataTable
+    },
+    data() {
+        return {
+            isLoaded: false,
+            tableHeaders: [
+                { text: "", value: "", width: "" }
+            ],
+            tableData: [],
+            dataCount: 0
+        }
+    },
+    methods: {
+
+    },
+    mounted(){
+        this.isLoaded = true
+    }
+}
+</script>
+
+<style scoped></style>

src/views/layout/Home.vue

@@ -8,18 +8,18 @@
                             <a class="nav-link" id="sidebar-toggle" href="#" @click="toggerSiderBar"><i data-feather="arrow-left"></i></a>
                         </li>
                         <li class="nav-item">
-                            <a class="nav-link" href="#">主页</a>
+                            <router-link class="nav-link" to="/layout/index">主页</router-link>
                         </li>
                         <li class="nav-item">
-                            <a class="nav-link" href="#">设置</a>
+                            <router-link class="nav-link" to="/layout/system">设置</router-link>
                         </li>
                         <li class="nav-item">
-                            <a class="nav-link" href="#">帮助</a>
+                            <router-link class="nav-link" to="/about">帮助</router-link>
                         </li>
                     </ul>
                 </div>
                 <div class="logo">
-                    <a class="navbar-brand" href="index.html"></a>
+                    <router-link class="navbar-brand" to="/home"></router-link>
                 </div>
                 <div class="" id="headerNav">
                     <ul class="navbar-nav">
@@ -29,14 +29,14 @@
                             <div class="dropdown-menu dropdown-menu-end dropdown-lg search-drop-menu"
                                 aria-labelledby="searchDropDown">
                                 <form>
-                                    <input class="form-control" type="text" placeholder="Type something.."
+                                    <input class="form-control" type="text" placeholder="由此搜索.."
                                         aria-label="Search">
                                 </form>
-                                <h6 class="dropdown-header">Recent Searches</h6>
+                                <h6 class="dropdown-header">近期搜索</h6>
-                                <a class="dropdown-item" href="#">charts</a>
+                                <a class="dropdown-item" href="#">图表</a>
-                                <a class="dropdown-item" href="#">new orders</a>
+                                <a class="dropdown-item" href="#">新订单</a>
-                                <a class="dropdown-item" href="#">file manager</a>
+                                <a class="dropdown-item" href="#">用户管理</a>
-                                <a class="dropdown-item" href="#">new users</a>
+                                <a class="dropdown-item" href="#">新用户</a>
                             </div>
                         </li>
                         <li class="nav-item dropdown">
@@ -118,15 +118,15 @@
                                     src="../../assets/images/avatars/profile-image.png" alt=""></a>
                             <div class="dropdown-menu dropdown-menu-end profile-drop-menu"
                                 aria-labelledby="profileDropDown">
-                                <a class="dropdown-item" href="#"><i data-feather="user"></i>Profile</a>
+                                <router-link class="dropdown-item" to="/layout/center"><i data-feather="user"></i>个人中心</router-link>
-                                <a class="dropdown-item" href="#"><i data-feather="inbox"></i>Messages</a>
+                                <a class="dropdown-item" href="#"><i data-feather="inbox"></i>消息</a>
-                                <a class="dropdown-item" href="#"><i data-feather="edit"></i>Activities<span
+                                <a class="dropdown-item" href="#"><i data-feather="edit"></i>活动<span
                                         class="badge rounded-pill bg-success">12</span></a>
-                                <a class="dropdown-item" href="#"><i data-feather="check-circle"></i>Tasks</a>
+                                <a class="dropdown-item" href="#"><i data-feather="check-circle"></i>任务</a>
                                 <div class="dropdown-divider"></div>
-                                <a class="dropdown-item" href="#"><i data-feather="settings"></i>Settings</a>
+                                <router-link class="dropdown-item" to="/layout/system"><i data-feather="settings"></i>系统设置</router-link>
-                                <a class="dropdown-item" href="#"><i data-feather="unlock"></i>Lock</a>
+                                <a class="dropdown-item" href="#" @click.prevent="unlock"><i data-feather="unlock"></i>锁定</a>
-                                <a class="dropdown-item" href="#"><i data-feather="log-out"></i>Logout</a>
+                                <a class="dropdown-item" href="#" @click.prevent="logout"><i data-feather="log-out"></i>注销</a>
                             </div>
                         </li>
                     </ul>
@@ -158,6 +158,7 @@
 
 <script>
 
+import auth from '@/utils/auth'
 import feather from 'feather-icons'
 import { mapGetters } from 'vuex'
 export default {
@@ -177,6 +178,14 @@ export default {
             const baseroutes = this.$router.options.routes
             const route = baseroutes.find(x => x.path == '/layout')
             this.routeMenu = route.children.filter(x => this.isAdmin ? x.meta.showInMenu : (x.meta.showInMenu && x.meta.showInUser))
+        },
+        unlock(){
+            this.$alert('还没写...','info')
+        },
+        logout(){
+            auth.clear()
+            this.$alert('登录状态失效，请重新登录...','info')
+            this.$router.push('/auth/login')
         }
     },watch:{
         isAdmin:{