sys cli2

package.json

@@ -1,63 +1,63 @@
 {
-  "name": "avue-cli",
-  "version": "2.0.0",
-  "private": true,
-  "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint",
-    "test:unit": "vue-cli-service test:unit",
-    "test:e2e": "vue-cli-service test:e2e"
-  },
-  "dependencies": {
-    "@smallwei/avue": "^1.3.1-beta3",
-    "avue-plugin-transfer": "^0.0.2",
-    "avue-plugin-ueditor": "^0.0.1",
-    "axios": "^0.18.0",
-    "babel-loader": "^8.0.2",
-    "babel-plugin-transform-runtime": "^6.23.0",
-    "babel-polyfill": "^6.26.0",
-    "classlist-polyfill": "^1.2.0",
-    "driver.js": "^0.6.2",
-    "element-ui": "^2.4.6",
-    "file-saver": "^1.3.8",
-    "html2canvas": "^1.0.0-alpha.12",
-    "js-cookie": "^2.2.0",
-    "mockjs": "^1.0.1-beta3",
-    "moment": "^2.22.2",
-    "nprogress": "^0.2.0",
-    "script-loader": "^0.7.2",
-    "vue": "^2.5.16",
-    "vue-axios": "^2.1.2",
-    "vue-clipboard2": "^0.2.1",
-    "vue-json-editor": "^1.2.3",
-    "vue-json-tree-view": "^2.1.4",
-    "vue-quill-editor": "^3.0.6",
-    "vue-router": "^3.0.1",
-    "vuedraggable": "^2.16.0",
-    "vuex": "^3.0.1",
-    "xlsx": "^0.13.3"
-  },
-  "devDependencies": {
-    "@vue/cli-plugin-babel": "^3.0.0",
-    "@vue/cli-plugin-e2e-cypress": "^3.0.0",
-    "@vue/cli-plugin-eslint": "^3.0.0",
-    "@vue/cli-plugin-unit-mocha": "^3.0.0",
-    "@vue/cli-service": "^3.0.0",
-    "@vue/test-utils": "^1.0.0-beta.20",
-    "chai": "^4.1.2",
-    "node-sass": "^4.9.0",
-    "sass-loader": "^7.0.1",
-    "vue-template-compiler": "^2.5.17"
-  },
-  "lint-staged": {
-    "*.js": [
-      "vue-cli-service lint",
-      "git add"
-    ],
-    "*.vue": [
-      "vue-cli-service lint",
-      "git add"
-    ]
-  }
-}
+    "name": "avue-cli",
+    "version": "2.0.0",
+    "private": true,
+    "scripts": {
+        "serve": "vue-cli-service serve",
+        "build": "vue-cli-service build",
+        "lint": "vue-cli-service lint",
+        "test:unit": "vue-cli-service test:unit",
+        "test:e2e": "vue-cli-service test:e2e"
+    },
+    "dependencies": {
+        "@smallwei/avue": "^1.4.0",
+        "avue-plugin-transfer": "^0.0.2",
+        "avue-plugin-ueditor": "^0.0.1",
+        "axios": "^0.18.0",
+        "babel-loader": "^8.0.2",
+        "babel-plugin-transform-runtime": "^6.23.0",
+        "babel-polyfill": "^6.26.0",
+        "classlist-polyfill": "^1.2.0",
+        "driver.js": "^0.6.2",
+        "element-ui": "^2.4.6",
+        "file-saver": "^1.3.8",
+        "html2canvas": "^1.0.0-alpha.12",
+        "js-cookie": "^2.2.0",
+        "mockjs": "^1.0.1-beta3",
+        "moment": "^2.22.2",
+        "nprogress": "^0.2.0",
+        "script-loader": "^0.7.2",
+        "vue": "^2.5.16",
+        "vue-axios": "^2.1.2",
+        "vue-clipboard2": "^0.2.1",
+        "vue-json-editor": "^1.2.3",
+        "vue-json-tree-view": "^2.1.4",
+        "vue-quill-editor": "^3.0.6",
+        "vue-router": "^3.0.1",
+        "vuedraggable": "^2.16.0",
+        "vuex": "^3.0.1",
+        "xlsx": "^0.13.3"
+    },
+    "devDependencies": {
+        "@vue/cli-plugin-babel": "^3.1.1",
+        "@vue/cli-plugin-e2e-cypress": "^3.1.2",
+        "@vue/cli-plugin-eslint": "^3.1.5",
+        "@vue/cli-plugin-unit-mocha": "^3.1.1",
+        "@vue/cli-service": "^3.1.4",
+        "@vue/test-utils": "^1.0.0-beta.25",
+        "chai": "^4.1.2",
+        "node-sass": "^4.9.0",
+        "sass-loader": "^7.0.1",
+        "vue-template-compiler": "^2.5.17"
+    },
+    "lint-staged": {
+        "*.js": [
+            "vue-cli-service lint",
+            "git add"
+        ],
+        "*.vue": [
+            "vue-cli-service lint",
+            "git add"
+        ]
+    }
+}

public/index.html

@@ -29,7 +29,7 @@
     <script src="<%= BASE_URL %>util/pad-zeropadding.js" charset="utf-8"></script>
     <script src="<%= BASE_URL %>cdn/vue/2.5.2/vue.min.js" charset="utf-8"></script>
     <script src="<%= BASE_URL %>cdn/vuex/2.4.1/vuex.min.js" charset="utf-8"></script>
-    <script src="<%= BASE_URL %>cdn/vue-router/3.0.1/vue-router.js" charset="utf-8"></script>
+    <script src="<%= BASE_URL %>cdn/vue-router/3.0.1/vue-router.min.js" charset="utf-8"></script>
     <script src="<%= BASE_URL %>cdn/axios/1.0.0/axios.min.js" charset="utf-8"></script>
     <script src="<%= BASE_URL %>cdn/element-ui/2.4.6/index.js" charset="utf-8"></script>
 </body>

src/const/website.js

@@ -1,6 +1,6 @@
 export default {
-    title: "Avue",
-    logo: "A",
+    title: "PigX",
+    logo: "P",
     indexTitle: 'avue-cli By smallwei',
     whiteList: ["/login", "/404", "/401", "/lock"], //配置无权限可以访问的页面
     whiteTagList: ["/login", "/404", "/401", "/lock", ], //配置不添加tags页面 （'/advanced-router/mutative-detail/*'——*为通配符）
@@ -25,4 +25,4 @@ export default {
             children: 'children'
         }
     }
-}
+}

src/page/index/sidebar/index.vue

@@ -31,8 +31,8 @@ export default {
   created () {
     this.$store.dispatch("GetMenu").then(data => {
       if (data.length === 0) return
-      this.$router.addRoutes(this.$router.$avueRouter.formatRoutes(data, true))
-    });
+      this.$router.$avueRouter.formatRoutes(data, true);
+    })
   },
   computed: {
     ...mapGetters(['website', 'menu', 'tag', 'keyCollapse', 'screen']),
@@ -43,5 +43,4 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-</style>
-
+</style>

src/page/index/sidebar/sidebarItem.vue

@@ -1,15 +1,16 @@
 <template>
   <div class="menu-wrapper">
-    <template v-for="(item,index) in menu">
-      <el-menu-item v-if="validatenull(item[childrenKey])"
-                    :index="filterPath(item[pathKey],index)"
+    <template v-for="item in menu">
+      <el-menu-item v-if="validatenull(item[childrenKey]) && vaildRoles(item)"
+                    :index="item[pathKey]"
                     @click="open(item)"
-                    :key="item[labelKey]">
+                    :key="item[labelKey]"
+                    :class="{'is-active':nowTagValue===item[pathKey]}">
         <i :class="item[iconKey]"></i>
         <span slot="title">{{item[labelKey]}}</span>
       </el-menu-item>
-      <el-submenu v-else
-                  :index="filterPath(item[labelKey],index)"
+      <el-submenu v-else-if="!validatenull(item[childrenKey])&&vaildRoles(item)"
+                  :index="item[pathKey]"
                   :key="item[labelKey]">
         <template slot="title">
           <i :class="item[iconKey]"></i>
@@ -17,16 +18,16 @@
                 :class="{'el-menu--display':collapse}">{{item[labelKey]}}</span>
         </template>
         <template v-for="(child,cindex) in item[childrenKey]">
-          <el-menu-item :class="{'siderbar-active':nowTagValue==child[pathKey]}"
-                        :index="filterPath(child[pathKey],cindex)"
+          <el-menu-item :index="child[pathKey],cindex"
                         @click="open(child)"
+                        :class="{'is-active':nowTagValue===child[pathKey]}"
                         v-if="validatenull(child[childrenKey])"
                         :key="child[labelKey]">
             <i :class="child[iconKey]"></i>
             <span slot="title">{{child[labelKey]}}</span>
           </el-menu-item>
           <sidebar-item v-else
-                        :menu="[child]"
+                        :menu="child[childrenKey]"
                         :key="cindex"
                         :props="props"
                         :screen="screen"
@@ -37,6 +38,7 @@
   </div>
 </template>
 <script>
+import { mapGetters } from 'vuex'
 import { validatenull } from '@/util/validate';
 import config from './config.js'
 export default {
@@ -65,6 +67,7 @@ export default {
   },
   mounted () { },
   computed: {
+    ...mapGetters(['roles']),
     labelKey () { return this.props.label || this.config.propsDefault.label },
     pathKey () { return this.props.path || this.config.propsDefault.path },
     iconKey () { return this.props.icon || this.config.propsDefault.icon },
@@ -72,12 +75,13 @@ export default {
     nowTagValue () { return this.$router.$avueRouter.getValue(this.$route) }
   },
   methods: {
+    vaildRoles (item) {
+      item.meta = item.meta || {};
+      return item.meta.roles ? item.meta.roles.includes(this.roles) : true
+    },
     validatenull (val) {
       return validatenull(val);
     },
-    filterPath (path, index) {
-      return path == null ? index + '' : path
-    },
     open (item) {
       if (this.screen <= 1) this.$store.commit("SET_COLLAPSE");
       this.$router.push({
@@ -91,13 +95,3 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
-//刷新激活状态
-.siderbar-active {
-  i,
-  span {
-    color: #409eff;
-  }
-}
-</style>
-

src/page/index/tags.vue

@@ -33,7 +33,6 @@
 <script>
 import { mapGetters, mapState } from 'vuex'
 
-import { isObjectValueEqual } from '@/util/util';
 export default {
   name: 'tags',
   data () {
@@ -89,9 +88,6 @@ export default {
         query: tag.query
       })
     },
-    isObjectValueEqual (a, b) {
-      return isObjectValueEqual(a, b)
-    },
     closeOthersTags () {
       this.$store.commit('DEL_TAG_OTHER')
     },
@@ -118,4 +114,3 @@ export default {
 }
 </script>
 
-

src/page/login/index.vue

@@ -2,15 +2,19 @@
   <div class="login-container pull-height"
        @keyup.enter.native="handleLogin">
     <div class="login-logo animated fadeIn">
-      <el-dropdown @command="handleCommand">
-        <span class="el-dropdown-link">
-          默认租户<i class="el-icon-arrow-down el-icon--right"></i>
-        </span>
-        <el-dropdown-menu slot="dropdown">
-          <el-dropdown-item command="1">租户1</el-dropdown-item>
-          <el-dropdown-item command="2">租户2</el-dropdown-item>
-        </el-dropdown-menu>
-      </el-dropdown>
+      <el-select v-model="active"
+                 placeholder="请选择租户，不选为默认"
+                 size="mini">
+        <el-option label="默认租户"
+                   value="">
+        </el-option>
+        <el-option label="租户1"
+                   value="1">
+        </el-option>
+        <el-option label="租户2"
+                   value="2">
+        </el-option>
+      </el-select>
     </div>
     <div class="login-weaper">
       <div class="login-left animated fadeInLeft">
@@ -30,7 +34,8 @@
       </div>
       <div class="login-border  animated fadeInRight">
         <div class="login-main">
-          <h4 class="login-title">登录 {{website.title}}</h4>
+          <h4 class="login-title">登录 {{website.title}}
+          </h4>
           <userLogin v-if="activeName==='user'"></userLogin>
           <codeLogin v-else-if="activeName==='code'"></codeLogin>
           <thirdLogin v-else-if="activeName==='third'"></thirdLogin>
@@ -53,6 +58,7 @@ import codeLogin from "./codelogin";
 import thirdLogin from "./thirdlogin";
 import topColor from "../index/top/top-color";
 import color from "@/mixins/color";
+import { setStore } from '@/util/store'
 import { mapGetters } from "vuex";
 import { validatenull } from '@/util/validate'
 export default {
@@ -66,6 +72,7 @@ export default {
   },
   data () {
     return {
+      active: '',
       activeName: "user"
     };
   },
@@ -95,9 +102,9 @@ export default {
   },
   props: [],
   methods: {
-      handleCommand(command) {
-          sessionStorage.setItem('tenantId',command)
-      }
+    handleCommand (command) {
+      setStore({ name: 'tenantId', content: command, type: 'session' })
+    }
   }
 };
 </script>
@@ -114,7 +121,7 @@ export default {
   left: 0;
   width: 100%;
   height: 500px;
-  margin-top: -200px;
+  margin-top: -220px;
 }
 .login-container::before {
   z-index: -1024;
@@ -134,8 +141,8 @@ export default {
 }
 .login-logo {
   position: absolute;
-  top: 0;
-  right: 0;
+  top: 10px;
+  right: 30px;
   font-size: 24px;
   color: #333;
 }
@@ -161,6 +168,9 @@ export default {
   width: 50%;
   box-sizing: border-box;
 }
+.login-select {
+  display: inline-block;
+}
 .login-main > h3 {
   margin-bottom: 20px;
 }

src/permission.js

@@ -1,18 +1,14 @@
 import router from './router/router'
 import store from './store'
+import { getToken } from '@/util/auth'
 import NProgress from 'nprogress' // progress bar
 import 'nprogress/nprogress.css' // progress bar style
-
-
-import { asyncRouterMap } from '@/router/router'
 NProgress.configure({ showSpinner: false });
 const lockPage = store.getters.website.lockPage; //锁屏页
-const whiteList = store.getters.website.whiteList; //不鉴权白名单
-const whiteTagList = store.getters.website.whiteTagList; //不加tags白名单
-router.addRoutes(asyncRouterMap);
 router.beforeEach((to, from, next) => {
     NProgress.start()
-    if (store.getters.access_token) {
+    const meta = to.meta || {};
+    if (getToken()) {
         if (store.getters.isLock && to.path != lockPage) {
             next({ path: lockPage })
         } else if (to.path === '/login') {
@@ -27,8 +23,8 @@ router.beforeEach((to, from, next) => {
                     })
                 })
             } else {
-                if (!router.$avueRouter.vaildPath(whiteTagList, to.path)) {
-                    const value = to.query.src ? to.query.src : to.path;
+                if (meta.isTab !== false) {
+                    const value = to.query.src ? to.query.src : to.fullPath;
                     const label = to.query.name ? to.query.name : to.name;
                     store.commit('ADD_TAG', {
                         label: label,
@@ -41,7 +37,7 @@ router.beforeEach((to, from, next) => {
             }
         }
     } else {
-        if (router.$avueRouter.vaildPath(whiteList, to.path)) {
+        if (meta.isAuth === false) {
             next()
         } else {
             next('/login')
@@ -53,5 +49,4 @@ router.afterEach(() => {
     NProgress.done();
     const title = store.getters.tag.label;
     router.$avueRouter.setTitle(title);
-});
-//正则验证路由
+});

src/router/avue-router.js

@@ -16,9 +16,10 @@ RouterPlugin.install = function(router, store) {
     this.$router.$avueRouter = {
         //全局配置
         $website: this.$store.getters.website,
+        safe: this,
         // 设置标题
         setTitle: function(title) {
-            title = title ? `${title}——Avue 通用管理 系统快速开发框架` : 'Avue 通用管理 系统快速开发框架';
+            title = title ? `${title}——PigX Pro 快速开发框架` : 'PigX Pro 快速开发框架';
             document.title = title;
         },
         closeTag: (value) => {
@@ -57,7 +58,6 @@ RouterPlugin.install = function(router, store) {
         },
         //动态路由
         formatRoutes: function(aMenu, first) {
-            if (!aMenu) return;
             const aRouter = []
             const propsConfig = this.$website.menu.props;
             const propsDefault = {
@@ -66,6 +66,7 @@ RouterPlugin.install = function(router, store) {
                 icon: propsConfig.icon || 'icon',
                 children: propsConfig.children || 'children'
             }
+            if (!aMenu) return;
             aMenu.forEach(oMenu => {
                 const path = oMenu[propsDefault.path],
                     component = oMenu.component,
@@ -113,9 +114,13 @@ RouterPlugin.install = function(router, store) {
                     })()
                 }
                 aRouter.push(oRouter)
-
             })
-            return aRouter
+            if (first) {
+                this.safe.$router.addRoutes(aRouter)
+            } else {
+                return aRouter
+            }
+
         }
     }
 }

src/router/axios.js

@@ -5,63 +5,60 @@
  */
 // 引入axios以及element ui中的loading和message组件
 import axios from 'axios'
-import router from '../router/router'
+import { serialize } from '@/util/util'
 import store from '../store'
-import {
-  getToken
-} from '@/util/auth'
+import { getStore } from '../util/store'
+import { getToken } from '@/util/auth'
 import NProgress from 'nprogress' // progress bar
 import errorCode from '@/const/errorCode'
-import {
-  Message
-} from 'element-ui'
+import { Message } from 'element-ui'
 import 'nprogress/nprogress.css' // progress bar style
 axios.defaults.timeout = 30000;
 //返回其他状态吗
-// axios.defaults.validateStatus = function(status) {
-//     return status >= 200 && status < 500; // 默认的
-// };
+axios.defaults.validateStatus = function(status) {
+    return status >= 200 && status <= 500; // 默认的
+};
 //跨域请求，允许保存cookie
 axios.defaults.withCredentials = true;
+// NProgress Configuration
 NProgress.configure({
-  showSpinner: false
-}) // NProgress Configuration
+    showSpinner: false
+});
 //HTTPrequest拦截
 axios.interceptors.request.use(config => {
-  NProgress.start() // start progress bar
-  if (store.getters.access_token) {
-    config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
-  }
-
-  if (sessionStorage.getItem('tenantId')) {
-    config.headers['TENANT_ID'] = sessionStorage.getItem('tenantId') // 租户ID
-  }
-  return config
+    NProgress.start() // start progress bar
+    if (store.getters.access_token) {
+        config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
+    }
+    const TENANT_ID = getStore({ name: 'tenantId' });
+    if (TENANT_ID) {
+        config.headers['TENANT_ID'] = TENANT_ID // 租户ID
+    }
+    //headers中配置serialize为true开启序列化
+    if (config.methods === 'post' && config.headers.serialize) {
+        config.data = serialize(config.data);
+        delete config.data.serialize;
+    }
+    return config
 }, error => {
-  console.log('err' + error) // for debug
-  return Promise.reject(error)
-})
+    return Promise.reject(error)
+});
 //HTTPresponse拦截
 axios.interceptors.response.use(res => {
-  NProgress.done();
-  return res
+    NProgress.done();
+    const status = Number(res.status);
+    const message = res.data.message || errorCode[status] || errorCode['default'];
+    if (status !== 200) {
+        Message({
+            message: message,
+            type: 'error'
+        })
+        return Promise.reject(new Error(message))
+    }
+    return res;
 }, error => {
-  NProgress.done()
-  let errMsg = error.toString()
-  let code = errMsg.substr(errMsg.indexOf('code') + 5)
-  Message({
-    message: errorCode[code] || errorCode['default'],
-    type: 'error'
-  })
-  if (parseInt(code) === 401 || parseInt(code) === 403) {
-    store.dispatch('FedLogOut').then(() => {
-      router.push({
-        path: '/login'
-      });
-    })
-  }
-  return Promise.reject(new Error(error))
-
+    NProgress.done()
+    return Promise.reject(new Error(error))
 })
 
 export default axios

src/router/page/index.js

@@ -1,63 +1,65 @@
 import Layout from '@/page/index/'
 export default [{
-        path: '*',
-        redirect: '/404',
-        hidden: true
-    }, {
         path: '/login',
         name: '登录页',
         component: () =>
             import ( /* webpackChunkName: "page" */ '@/page/login/index'),
         meta: {
             keepAlive: true,
+            isTab: false,
+            isAuth: false
         }
     },
-    {
-        path: '/authredirect',
-        name: '授权页',
-        component: () =>
-            import ( /* webpackChunkName: "page" */ '@/page/login/authredirect')
-    },
     {
         path: '/lock',
         name: '锁屏页',
         component: () =>
             import ( /* webpackChunkName: "page" */ '@/page/lock/index'),
+        meta: {
+            keepAlive: true,
+            isTab: false,
+            isAuth: false
+        }
     },
     {
         path: '/404',
         component: () =>
             import ( /* webpackChunkName: "page" */ '@/components/error-page/404'),
-        name: '404'
+        name: '404',
+        meta: {
+            keepAlive: true,
+            isTab: false,
+            isAuth: false
+        }
+
     },
     {
         path: '/403',
         component: () =>
             import ( /* webpackChunkName: "page" */ '@/components/error-page/403'),
-        name: '403'
+        name: '403',
+        meta: {
+            keepAlive: true,
+            isTab: false,
+            isAuth: false
+        }
     },
     {
         path: '/500',
         component: () =>
             import ( /* webpackChunkName: "page" */ '@/components/error-page/500'),
-        name: '500'
+        name: '500',
+        meta: {
+            keepAlive: true,
+            isTab: false,
+            isAuth: false
+        }
     },
     {
         path: '/',
         name: '主页',
         redirect: '/wel'
     },
-    {
-        path: '/wel',
-        component: Layout,
-        redirect: '/wel/index',
-        children: [{
-            path: 'index',
-            name: '首页',
-            component: () =>
-                import ( /* webpackChunkName: "page" */ '@/page/wel'),
-        }]
-    },
     {
         path: '/myiframe',
         component: Layout,

src/router/router.js

@@ -20,6 +20,6 @@ let Router = new VueRouter({
     routes: [].concat([])
 });
 AvueRouter.install(Router, Store);
-Router.addRoutes(Router.$avueRouter.formatRoutes(Store.state.user.menu, true));
-export default Router;
-export const asyncRouterMap = [].concat(PageRouter, ViewsRouter)
+Router.$avueRouter.formatRoutes(Store.state.user.menu, true);
+Router.addRoutes([...PageRouter, ...ViewsRouter]);
+export default Router;

src/router/views/index.js

@@ -1,13 +1,13 @@
 import Layout from '@/page/index/'
 export default [{
-    path: '/info',
+    path: '/wel',
     component: Layout,
-    redirect: '/info/index',
+    redirect: '/wel/index',
     children: [{
         path: 'index',
         name: '首页',
         component: () =>
-            import ( /* webpackChunkName: "views" */ '@/views/admin/user/info')
+            import ( /* webpackChunkName: "views" */ '@/page/wel')
     }]
 }, {
     path: '/crud',

src/store/modules/tags.js

@@ -1,5 +1,5 @@
 import { setStore, getStore } from '@/util/store'
-import { isObjectValueEqual } from '@/util/util'
+import { diff } from '@/util/util'
 const tagObj = {
     label: '', //标题名称
     value: '', //标题的路径
@@ -38,22 +38,14 @@ const navs = {
         ADD_TAG: (state, action) => {
             state.tag = action;
             setStore({ name: 'tag', content: state.tag, type: 'session' })
-            if (state.tagList.some(ele => isObjectValueEqual(ele, action))) return
+            if (state.tagList.some(ele => diff(ele, action))) return
             state.tagList.push(action)
             setFistTag(state.tagList);
             setStore({ name: 'tagList', content: state.tagList, type: 'session' })
         },
         DEL_TAG: (state, action) => {
             state.tagList = state.tagList.filter(item => {
-                if (typeof(action) === 'object') {
-                    let a = Object.assign({}, item);
-                    let b = Object.assign({}, action);
-                    delete a.close;
-                    delete b.__ob__;
-                    return !isObjectValueEqual(a, b)
-                } else {
-                    return item.value !== action
-                }
+                return !diff(item, action);
             })
             setFistTag(state.tagList);
             setStore({ name: 'tagList', content: state.tagList, type: 'session' })

src/util/util.js

@@ -1,9 +1,42 @@
-import {
-    validatenull
-} from './validate'
+import { validatenull } from './validate'
+//表单序列化
+export const serialize = data => {
+    let list = [];
+    Object.keys(data).forEach(ele => {
+        list.push(`${ele}=${data[ele]}`)
+    })
+    return list.join('&');
+};
 /**
- * 设置灰度模式
+ * 判断路由是否相等
  */
+export const diff = (obj1, obj2) => {
+        delete obj1.close;
+        var o1 = obj1 instanceof Object;
+        var o2 = obj2 instanceof Object;
+        if (!o1 || !o2) { /*  判断不是对象  */
+            return obj1 === obj2;
+        }
+
+        if (Object.keys(obj1).length !== Object.keys(obj2).length) {
+            return false;
+            //Object.keys() 返回一个由对象的自身可枚举属性(key值)组成的数组,例如：数组返回下表：let arr = ["a", "b", "c"];console.log(Object.keys(arr))->0,1,2;
+        }
+
+        for (var attr in obj1) {
+            var t1 = obj1[attr] instanceof Object;
+            var t2 = obj2[attr] instanceof Object;
+            if (t1 && t2) {
+                return diff(obj1[attr], obj2[attr]);
+            } else if (obj1[attr] !== obj2[attr]) {
+                return false;
+            }
+        }
+        return true;
+    }
+    /**
+     * 设置灰度模式
+     */
 export const toggleGrayMode = (status) => {
     if (status) {
         document.body.className = document.body.className + ' grayMode';

src/views/admin/user/index.vue

@@ -22,9 +22,8 @@
                  ref="crud"
                  v-model="form"
                  :page="page"
+                 @on-load="getList"
                  :table-loading="listLoading"
-                 @current-change="handleCurrentChange"
-                 @size-change="handleSizeChange"
                  @search-change="handleFilter"
                  @refresh-change="handleRefreshChange"
                  @row-update="update"
@@ -118,14 +117,11 @@ export default {
       page: {
         total: 0, // 总页数
         currentPage: 1, // 当前页数
-        pageSize: 20 // 每页显示多少条
+        pageSize: 20, // 每页显示多少条,
+        isAsc: false//是否倒序
       },
       list: [],
       listLoading: true,
-      listQuery: {
-        page: 1,
-        limit: 20
-      },
       role: [],
       form: {},
       rolesOptions: [],
@@ -150,16 +146,17 @@ export default {
     }
   },
   created () {
-    this.getList();
     this.sys_user_add = this.permissions["sys_user_add"];
     this.sys_user_edit = this.permissions["sys_user_edit"];
     this.sys_user_del = this.permissions["sys_user_del"];
   },
   methods: {
-    getList () {
+    getList (page, params) {
       this.listLoading = true;
-      this.listQuery.isAsc = false;
-      fetchList(this.listQuery).then(response => {
+      fetchList(Object.assign({
+        page: page.currentPage,
+        limit: page.pageSize
+      }, params)).then(response => {
         this.list = response.data.records;
         this.page.total = response.data.total
         this.listLoading = false;
@@ -176,20 +173,11 @@ export default {
       });
     },
     handleFilter (param) {
-      this.listQuery = Object.assign(this.listQuery, param)
-      this.listQuery.page = 1;
-      this.getList();
-    },
-    handleSizeChange (val) {
-      this.listQuery.limit = val;
-      this.getList();
+      this.page.page = 1;
+      this.getList(this.page, param);
     },
     handleRefreshChange () {
-      this.getList()
-    },
-    handleCurrentChange (val) {
-      this.listQuery.page = val;
-      this.getList();
+      this.getList(this.page)
     },
     handleCreate () {
       this.$refs.crud.rowAdd();

vue.config.js

@@ -66,4 +66,4 @@ module.exports = {
             },
         }
     }
-}
+}