更改目录结构

web/src/plugins/element.js

@@ -0,0 +1,5 @@
+import Vue from 'vue'
+import Element from 'element-ui'
+import 'element-ui/lib/theme-chalk/index.css'
+
+Vue.use(Element)

web/src/plugins/mixin.js

@@ -0,0 +1,51 @@
+import Vue from "vue";
+
+function gDateFormat(p) {
+    var da = new Date(p);
+    var year = da.getFullYear();
+    var month = da.getMonth() + 1;
+    var dt = da.getDate();
+    var h = da.getHours();
+    var m = da.getMinutes();
+    var s = da.getSeconds();
+
+    return year + '-' + month + '-' + dt + ' ' + h + ':' + m + ':' + s;
+}
+
+var Mixin = {
+    data() {
+        return {
+            user_edit_dialog: false,
+            isLoading: false,
+        }
+    },
+    computed: {},
+    methods: {
+        tableDateFormat(row, column) {
+            var p = row[column.property];
+            if (p === undefined) {
+                return "";
+            }
+            return gDateFormat(p);
+        },
+        tableArrayFormat(row, column) {
+            var p = row[column.property];
+            if (p === undefined) {
+                return "";
+            }
+            return p.join("\n\r\n");
+        },
+        disVisible() {
+            this.user_edit_dialog = false
+        },
+    },
+}
+
+// Vue.filter("dateFormat", function (p) {
+//     return gDateFormat(p);
+// })
+Vue.mixin(Mixin)
+
+
+// export default Mixin
+

web/src/plugins/request.js

@@ -0,0 +1,48 @@
+// http://www.zhangwj.com/
+// 全局的 axios 默认值
+import axios from "axios";
+import {getToken, removeToken} from "./token";
+// axios.defaults.headers.common['Jwt'] = AUTH_TOKEN;
+axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
+
+if (process.env.NODE_ENV !== 'production') {
+    // 开发环境
+    axios.defaults.baseURL = 'http://172.23.83.233:8800';
+}
+
+function request(vm) {
+    // HTTP 请求拦截器
+    axios.interceptors.request.use(config => {
+        // 在发送请求之前做些什么
+        // 获取token, 并添加到 headers 请求头中
+        const token = getToken();
+        if (token) {
+            config.headers.Jwt = token;
+        }
+        return config;
+    });
+
+    console.log(vm)
+
+    // HTTP 响应拦截器
+    // 统一处理 401 状态，token 过期的处理，清除token跳转login
+    // 参数 1， 表示成功响应
+    axios.interceptors.response.use(null, err => {
+        // 没有登录或令牌过期
+        if (err.response.status === 401) {
+            // 注销，情况状态和token
+            // vm.$store.dispatch("logout");
+            // 跳转的登录页
+            removeToken();
+            vm.$router.push('/login');
+            // 注意: 这里的 vm 实例需要外部传入
+        }
+        return Promise.reject(err);
+    });
+}
+
+export default request
+
+
+
+

web/src/plugins/router.js

@@ -0,0 +1,74 @@
+import Vue from "vue";
+import VueRouter from "vue-router";
+import {getToken} from "./token";
+
+Vue.use(VueRouter)
+
+
+const routes = [
+    {path: '/login', component: () => import('@/pages/Login')},
+    {
+        path: '/admin',
+        component: () => import('@/layout/Layout'),
+        redirect: '/admin/home',
+        children: [
+            {path: 'home', component: () => import('@/pages/Home')},
+
+            {path: 'set/system', component: () => import('@/pages/set/System')},
+            {path: 'set/soft', component: () => import('@/pages/set/Soft')},
+            {path: 'set/other', component: () => import('@/pages/set/Other')},
+
+            {path: 'user/list', component: () => import('@/pages/user/List')},
+            {path: 'user/online', component: () => import('@/pages/user/Online')},
+            {path: 'user/ip_map', component: () => import('@/pages/user/IpMap')},
+
+            {path: 'group/list', component: () => import('@/pages/group/List')},
+
+        ],
+    },
+
+    {path: '*', redirect: '/admin/home'},
+]
+
+// 3. 创建 router 实例，然后传 `routes` 配置
+// 你还可以传别的配置参数, 不过先这么简单着吧。
+const router = new VueRouter({
+    routes
+})
+
+// 路由守卫
+router.beforeEach((to, from, next) => {
+    // 判断要进入的路由是否需要认证
+
+    const token = getToken();
+
+    console.log("beforeEach", from.path, to.path, token)
+    // console.log(from)
+
+    // 没有token,全都跳转到login
+    if (!token) {
+        if (to.path === "/login") {
+            next();
+            return;
+        }
+
+        next({
+            path: '/login',
+            query: {
+                redirect: to.path
+            }
+        });
+        return;
+    }
+
+    if (to.path === "/login") {
+        next({path: '/admin/home'});
+        return;
+    }
+
+    // 有token情况下
+    next();
+});
+
+export default router;
+

web/src/plugins/token.js

@@ -0,0 +1,22 @@
+const tokenKey = 'AnyLink-Jwt-Token'
+const tokenUser = 'AnyLink-Jwt-User'
+
+export function getToken() {
+    return localStorage.getItem(tokenKey)
+}
+
+export function setToken(token) {
+    return localStorage.setItem(tokenKey, token)
+}
+
+export function setUser(username) {
+    return localStorage.setItem(tokenUser, username)
+}
+
+export function getUser() {
+    return localStorage.getItem(tokenUser)
+}
+
+export function removeToken() {
+    return localStorage.removeItem(tokenKey)
+}