diff --git a/mock/article.js b/mock/article.js
index 50218ae..12ec1e8 100755
--- a/mock/article.js
+++ b/mock/article.js
@@ -27,12 +27,18 @@ for (let i = 0; i < count; i++) {
   }))
 }
 
-export default [
-  {
-    url: '/vue-element-admin/article/list',
+export default [{
+    url: '/yp/article/list',
     type: 'get',
     response: config => {
-      const { importance, type, title, page = 1, limit = 20, sort } = config.query
+      const {
+        importance,
+        type,
+        title,
+        page = 1,
+        limit = 20,
+        sort
+      } = config.query
 
       let mockList = List.filter(item => {
         if (importance && item.importance !== +importance) return false
@@ -58,10 +64,12 @@ export default [
   },
 
   {
-    url: '/vue-element-admin/article/detail',
+    url: '/yp/article/detail',
     type: 'get',
     response: config => {
-      const { id } = config.query
+      const {
+        id
+      } = config.query
       for (const article of List) {
         if (article.id === +id) {
           return {
@@ -74,17 +82,28 @@ export default [
   },
 
   {
-    url: '/vue-element-admin/article/pv',
+    url: '/yp/article/pv',
     type: 'get',
     response: _ => {
       return {
         code: 20000,
         data: {
-          pvData: [
-            { key: 'PC', pv: 1024 },
-            { key: 'mobile', pv: 1024 },
-            { key: 'ios', pv: 1024 },
-            { key: 'android', pv: 1024 }
+          pvData: [{
+              key: 'PC',
+              pv: 1024
+            },
+            {
+              key: 'mobile',
+              pv: 1024
+            },
+            {
+              key: 'ios',
+              pv: 1024
+            },
+            {
+              key: 'android',
+              pv: 1024
+            }
           ]
         }
       }
@@ -92,7 +111,7 @@ export default [
   },
 
   {
-    url: '/vue-element-admin/article/create',
+    url: '/yp/article/create',
     type: 'post',
     response: _ => {
       return {
@@ -103,7 +122,7 @@ export default [
   },
 
   {
-    url: '/vue-element-admin/article/update',
+    url: '/yp/article/update',
     type: 'post',
     response: _ => {
       return {
@@ -113,4 +132,3 @@ export default [
     }
   }
 ]
-
diff --git a/mock/remote-search.js b/mock/remote-search.js
index 60809cb..890cd68 100755
--- a/mock/remote-search.js
+++ b/mock/remote-search.js
@@ -13,7 +13,7 @@ NameList.push({ name: 'mock-Pan' })
 export default [
   // username search
   {
-    url: '/vue-element-admin/search/user',
+    url: '/yp/search/user',
     type: 'get',
     response: config => {
       const { name } = config.query
@@ -30,7 +30,7 @@ export default [
 
   // transaction list
   {
-    url: '/vue-element-admin/transaction/list',
+    url: '/yp/transaction/list',
     type: 'get',
     response: _ => {
       return {
diff --git a/mock/role/index.js b/mock/role/index.js
index 4c9a2a5..d2d1b8b 100755
--- a/mock/role/index.js
+++ b/mock/role/index.js
@@ -50,7 +50,7 @@ const roles = [
 export default [
   // mock get all routes form server
   {
-    url: '/vue-element-admin/routes',
+    url: '/yp/routes',
     type: 'get',
     response: _ => {
       return {
@@ -62,7 +62,7 @@ export default [
 
   // mock get all roles form server
   {
-    url: '/vue-element-admin/roles',
+    url: '/yp/roles',
     type: 'get',
     response: _ => {
       return {
@@ -74,7 +74,7 @@ export default [
 
   // add role
   {
-    url: '/vue-element-admin/role',
+    url: '/yp/role',
     type: 'post',
     response: {
       code: 20000,
@@ -86,7 +86,7 @@ export default [
 
   // update role
   {
-    url: '/vue-element-admin/role/[A-Za-z0-9]',
+    url: '/yp/role/[A-Za-z0-9]',
     type: 'put',
     response: {
       code: 20000,
@@ -98,7 +98,7 @@ export default [
 
   // delete role
   {
-    url: '/vue-element-admin/role/[A-Za-z0-9]',
+    url: '/yp/role/[A-Za-z0-9]',
     type: 'delete',
     response: {
       code: 20000,
diff --git a/mock/role/routes.js b/mock/role/routes.js
index bf67131..21cbed1 100755
--- a/mock/role/routes.js
+++ b/mock/role/routes.js
@@ -23,13 +23,23 @@ export const constantRoutes = [
     hidden: true
   },
   {
+    path: '/401',
+    component: 'views/error-page/401',
+    hidden: true
+  },
+  {
+    path: '/403',
+    component: 'views/error-page/403',
+    hidden: true
+  },
+  {
     path: '/404',
     component: 'views/error-page/404',
     hidden: true
   },
   {
-    path: '/401',
-    component: 'views/error-page/401',
+    path: '/500',
+    component: 'views/error-page/500',
     hidden: true
   },
   {
@@ -73,46 +83,46 @@ export const constantRoutes = [
 ]
 
 export const asyncRoutes = [
-  {
-    path: '/permission',
-    component: 'layout/Layout',
-    redirect: '/permission/index',
-    alwaysShow: true,
-    meta: {
-      title: 'permission',
-      icon: 'lock',
-      roles: ['admin', 'assistant', 'runner', 'shoper']
-    },
-    children: [
-      {
-        path: 'page',
-        component: 'views/permission/page',
-        name: 'PagePermission',
-        meta: {
-          title: 'pagePermission',
-          roles: ['admin','assistant']
-        }
-      },
-      {
-        path: 'directive',
-        component: 'views/permission/directive',
-        name: 'DirectivePermission',
-        meta: {
-          title: 'directivePermission',
-          roles:['shoper']
-        }
-      },
-      {
-        path: 'role',
-        component: 'views/permission/role',
-        name: 'RolePermission',
-        meta: {
-          title: 'rolePermission',
-          roles: ['runner']
-        }
-      }
-    ]
-  },
+  // {
+  //   path: '/permission',
+  //   component: 'layout/Layout',
+  //   redirect: '/permission/index',
+  //   alwaysShow: true,
+  //   meta: {
+  //     title: 'permission',
+  //     icon: 'lock',
+  //     // roles: ['admin', 'assistant', 'runner', 'shoper']
+  //   },
+  //   children: [
+  //     {
+  //       path: 'page',
+  //       component: 'views/permission/page',
+  //       name: 'PagePermission',
+  //       meta: {
+  //         title: 'pagePermission',
+  //         roles: ['admin','assistant']
+  //       }
+  //     },
+  //     {
+  //       path: 'directive',
+  //       component: 'views/permission/directive',
+  //       name: 'DirectivePermission',
+  //       meta: {
+  //         title: 'directivePermission',
+  //         roles:['shoper']
+  //       }
+  //     },
+  //     {
+  //       path: 'role',
+  //       component: 'views/permission/role',
+  //       name: 'RolePermission',
+  //       meta: {
+  //         title: 'rolePermission',
+  //         roles: ['runner']
+  //       }
+  //     }
+  //   ]
+  // },
 
   {
     path: '/icon',
@@ -385,6 +395,12 @@ export const asyncRoutes = [
         component: 'views/error-page/404',
         name: 'Page404',
         meta: { title: 'page404', noCache: true }
+      },
+      {
+        path: '500',
+        component: 'views/error-page/500',
+        name: 'Page500',
+        meta: { title: 'page500', noCache: true }
       }
     ]
   },
diff --git a/mock/user.js b/mock/user.js
index aac2c4f..6bc1fb0 100755
--- a/mock/user.js
+++ b/mock/user.js
@@ -1,4 +1,6 @@
 
+import Mock from 'mockjs'
+
 const tokens = {
   admin: {
     token: 'admin-token'
@@ -41,10 +43,40 @@ const users = {
   }
 }
 
+const List = []
+const count = 100
+
+const baseContent = '<p>I am testing data, I am testing data.</p><p><img src="https://wpimg.wallstcn.com/4c69009c-0fd4-4153-b112-6cb53d1cf943"></p>'
+const image_uri = 'https://wpimg.wallstcn.com/e4558086-631c-425c-9430-56ffb46e70b3'
+
+for (let i = 0; i < count; i++) {
+  List.push(Mock.mock({
+    uid: '@increment',
+    create_time: +Mock.Random.date('T'),
+    nickname: '@first',
+    reviewer: '@first',
+    title: '@title(5, 10)',
+    openid:'@sentence(12,12)',
+    content_short: 'mock data',
+    content: baseContent,
+    forecast: '@float(0, 100, 2, 2)',
+    importance: '@integer(1, 3)',
+    'type|1': ['CN', 'US', 'JP', 'EU'],
+    'status|1': ['published', 'draft'],
+    display_time: '@datetime',
+    comment_disabled: true,
+    son_of_adv: '@integer(300, 5000)',//下线
+    souceof:'@integer(300, 5000)',//源自
+    image_uri,
+    'roles|1': ['admin', 'assistant', 'shoper', 'runner'],
+    platforms: ['a-platform']//哪个平台
+  }))
+}
+
 export default [
   // user login
   {
-    url: '/vue-element-admin/user/login',
+    url: '/yp/user/login',
     type: 'post',
     response: config => {
       const { username } = config.body
@@ -67,7 +99,7 @@ export default [
 
   // get user info
   {
-    url: '/vue-element-admin/user/info\.*',
+    url: '/yp/user/info\.*',
     type: 'get',
     response: config => {
       const { token } = config.query
@@ -90,7 +122,29 @@ export default [
 
   // user logout
   {
-    url: '/vue-element-admin/user/logout',
+    url: '/yp/user/logout',
+    type: 'post',
+    response: _ => {
+      return {
+        code: 20000,
+        data: 'success'
+      }
+    }
+  },
+  // user create
+  {
+    url: '/yp/user/create',
+    type: 'post',
+    response: _ => {
+      return {
+        code: 20000,
+        data: 'success'
+      }
+    }
+  },
+  // user update
+  {
+    url: '/yp/user/update',
     type: 'post',
     response: _ => {
       return {
@@ -98,5 +152,52 @@ export default [
         data: 'success'
       }
     }
+  },
+  // user del
+  {
+    url: '/yp/user/del',
+    type: 'post',
+    response: _ => {
+      return {
+        code: 20000,
+        data: 'success'
+      }
+    }
+  },
+  // user list
+  {
+    url: '/yp/user/list',
+    type: 'get',
+    response: config => {
+      const {
+        importance,
+        type,
+        title,
+        page = 1,
+        limit = 20,
+        sort
+      } = config.query
+
+      let mockList = List.filter(item => {
+        if (importance && item.importance !== +importance) return false
+        if (type && item.type !== type) return false
+        if (title && item.title.indexOf(title) < 0) return false
+        return true
+      })
+
+      if (sort === '-id') {
+        mockList = mockList.reverse()
+      }
+
+      const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1))
+
+      return {
+        code: 20000,
+        data: {
+          total: mockList.length,
+          items: pageList
+        }
+      }
+    }
   }
 ]
diff --git a/package.json b/package.json
index ec3ae6f..573db9f 100755
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
     "build:prod": "vue-cli-service build",
     "build:stage": "vue-cli-service build --mode staging",
     "preview": "node build/index.js --preview",
-    "lint": "eslint --ext .js,.vue src",
+    "lint": "eslint --fix --ext .js,.vue src",
     "test:unit": "jest --clearCache && vue-cli-service test:unit",
     "test:ci": "npm run lint && npm run test:unit",
     "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
@@ -43,6 +43,7 @@
     "url": "https://github.com/PanJiaChen/vue-element-admin/issues"
   },
   "dependencies": {
+    "ant-design-vue": "^1.5.5",
     "axios": "0.18.1",
     "clipboard": "2.0.4",
     "codemirror": "5.45.0",
@@ -55,14 +56,17 @@
     "js-cookie": "2.2.0",
     "jsonlint": "1.6.3",
     "jszip": "3.2.1",
+    "less-loader": "^6.1.0",
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",
     "pinyin": "2.9.0",
+    "qs": "^6.9.4",
     "screenfull": "4.2.0",
     "showdown": "1.9.0",
     "sortablejs": "1.8.4",
     "tui-editor": "1.3.3",
+    "vant": "^2.8.0",
     "vue": "2.6.10",
     "vue-count-to": "1.0.13",
     "vue-i18n": "7.3.2",
diff --git a/src/api/article.js b/src/api/article.js
index 407bda1..7300a72 100755
--- a/src/api/article.js
+++ b/src/api/article.js
@@ -1,8 +1,16 @@
 import request from '@/utils/request'
 
+// export const getPersonInfo = data => {
+//   return service({
+//     url: '/person_pay/getpersoninfo',
+//     method: 'post',
+//     data
+//   })
+// }
+
 export function fetchList(query) {
   return request({
-    url: '/vue-element-admin/article/list',
+    url: '/yp/article/list',
     method: 'get',
     params: query
   })
@@ -10,23 +18,27 @@ export function fetchList(query) {
 
 export function fetchArticle(id) {
   return request({
-    url: '/vue-element-admin/article/detail',
+    url: '/yp/article/detail',
     method: 'get',
-    params: { id }
+    params: {
+      id
+    }
   })
 }
 
 export function fetchPv(pv) {
   return request({
-    url: '/vue-element-admin/article/pv',
+    url: '/yp/article/pv',
     method: 'get',
-    params: { pv }
+    params: {
+      pv
+    }
   })
 }
 
 export function createArticle(data) {
   return request({
-    url: '/vue-element-admin/article/create',
+    url: '/yp/article/create',
     method: 'post',
     data
   })
@@ -34,7 +46,7 @@ export function createArticle(data) {
 
 export function updateArticle(data) {
   return request({
-    url: '/vue-element-admin/article/update',
+    url: '/yp/article/update',
     method: 'post',
     data
   })
diff --git a/src/api/remote-search.js b/src/api/remote-search.js
index 02e42b4..263d90f 100755
--- a/src/api/remote-search.js
+++ b/src/api/remote-search.js
@@ -2,7 +2,7 @@ import request from '@/utils/request'
 
 export function searchUser(name) {
   return request({
-    url: '/vue-element-admin/search/user',
+    url: '/yp/search/user',
     method: 'get',
     params: { name }
   })
@@ -10,7 +10,7 @@ export function searchUser(name) {
 
 export function transactionList(query) {
   return request({
-    url: '/vue-element-admin/transaction/list',
+    url: '/yp/transaction/list',
     method: 'get',
     params: query
   })
diff --git a/src/api/role.js b/src/api/role.js
index 959bbd2..bc42811 100755
--- a/src/api/role.js
+++ b/src/api/role.js
@@ -2,21 +2,21 @@ import request from '@/utils/request'
 
 export function getRoutes() {
   return request({
-    url: '/vue-element-admin/routes',
+    url: '/yp/routes',
     method: 'get'
   })
 }
 
 export function getRoles() {
   return request({
-    url: '/vue-element-admin/roles',
+    url: '/yp/roles',
     method: 'get'
   })
 }
 
 export function addRole(data) {
   return request({
-    url: '/vue-element-admin/role',
+    url: '/yp/role',
     method: 'post',
     data
   })
diff --git a/src/api/user.js b/src/api/user.js
index b8b8741..07e657a 100755
--- a/src/api/user.js
+++ b/src/api/user.js
@@ -2,7 +2,7 @@ import request from '@/utils/request'
 
 export function login(data) {
   return request({
-    url: '/vue-element-admin/user/login',
+    url: '/yp/user/login',
     method: 'post',
     data
   })
@@ -10,7 +10,7 @@ export function login(data) {
 
 export function getInfo(token) {
   return request({
-    url: '/vue-element-admin/user/info',
+    url: '/yp/user/info',
     method: 'get',
     params: { token }
   })
@@ -18,7 +18,39 @@ export function getInfo(token) {
 
 export function logout() {
   return request({
-    url: '/vue-element-admin/user/logout',
+    url: '/yp/user/logout',
     method: 'post'
   })
 }
+
+export function fetchList(query) {
+  return request({
+    url: '/yp/user/list',
+    method: 'get',
+    params: query
+  })
+}
+
+export function createUser(query) {
+  return request({
+    url: '/yp/user/create',
+    method: 'post',
+    params: query
+  })
+}
+
+export function updateUser(query) {
+  return request({
+    url: '/yp/user/update',
+    method: 'post',
+    params: query
+  })
+}
+
+export function delUser(query) {
+  return request({
+    url: '/yp/user/del',
+    method: 'post',
+    params: query
+  })
+}
diff --git a/src/lang/en.js b/src/lang/en.js
index ae221ba..29a81be 100755
--- a/src/lang/en.js
+++ b/src/lang/en.js
@@ -1,5 +1,42 @@
 export default {
+  // 添加的新词条------start
+  prod: {
+    menu_title: 'products'
+  },
+  order: {
+
+  },
+  users: {
+
+  },
+  site: {
+
+  },
+  meta: {
+
+  },
+  system: {
+    memu: '系统'
+  },
   route: {
+    users: 'users',
+    usersList: 'user list',
+    shopers: 'shoper suply chain',
+    prods: 'products',
+    orders: 'orders',
+    sites: 'sites',
+    metas: {
+      metas: 'meta',
+      list: 'tree'
+    },
+    systems: {
+      systems: 'system',
+      sites: 'site seting',
+      money: 'money seting',
+      industry: 'industry seting',
+      template: 'template seting'
+    },
+    // 添加的新词条------end
     dashboard: 'Dashboard',
     documentation: 'Documentation',
     guide: 'Guide',
@@ -73,7 +110,15 @@ export default {
     size: 'Global Size'
   },
   login: {
-    title: 'Login Form',
+    runner: 'officer Runner',
+    shoper: 'shop of Suply Chain',
+    assistant: 'worker in system',
+    signup: 'sign up',
+    forgetpassword: 'forget password',
+    rememberpassword: 'remember password',
+
+    // title: 'let\'s conquer the world',
+    title: 'LET\'S FUCK THE WORLD',
     logIn: 'Login',
     username: 'Username',
     password: 'Password',
diff --git a/src/lang/es.js b/src/lang/es.js
index 8187bfe..51eab14 100755
--- a/src/lang/es.js
+++ b/src/lang/es.js
@@ -1,5 +1,42 @@
 export default {
+  // 添加的新词条------start
+  prod: {
+    menu_title: 'products'
+  },
+  order: {
+
+  },
+  users: {
+
+  },
+  site: {
+
+  },
+  meta: {
+
+  },
+  system: {
+    memu: '系统'
+  },
   route: {
+    users: 'users',
+    usersList: 'user list',
+    shopers: 'shoper suply chain',
+    prods: 'products',
+    orders: 'orders',
+    sites: 'sites',
+    metas: {
+      metas: '元',
+      list: '树'
+    },
+    systems: {
+      systems: '系统设置',
+      sites: '站点设置',
+      money: '货币设置',
+      industry: '行业设置',
+      template: '模版设置'
+    },
+    // 添加的新词条------end
     dashboard: 'Panel de control',
     documentation: 'Documentación',
     guide: 'Guía',
@@ -73,6 +110,13 @@ export default {
     profile: 'Profile'
   },
   login: {
+    runner: 'officer Runner',
+    shoper: 'shop of Suply Chain',
+    assistant: 'worker in system',
+    signup: 'sign up',
+    forgetpassword: 'forget password',
+    rememberpassword: 'remember password',
+
     title: 'Formulario de acceso',
     logIn: 'Acceso',
     username: 'Usuario',
diff --git a/src/lang/ja.js b/src/lang/ja.js
index 7dccd12..d023dc6 100755
--- a/src/lang/ja.js
+++ b/src/lang/ja.js
@@ -1,5 +1,42 @@
 export default {
+  // 添加的新词条------start
+  prod: {
+    menu_title: 'products'
+  },
+  order: {
+
+  },
+  users: {
+
+  },
+  site: {
+
+  },
+  meta: {
+
+  },
+  system: {
+    memu: '系统'
+  },
   route: {
+    users: 'users',
+    usersList: 'user list',
+    shopers: 'shoper suply chain',
+    prods: 'products',
+    orders: 'orders',
+    sites: 'sites',
+    metas: {
+      metas: '元',
+      list: '树'
+    },
+    systems: {
+      systems: '系统设置',
+      sites: '站点设置',
+      money: '货币设置',
+      industry: '行业设置',
+      template: '模版设置'
+    },
+    // 添加的新词条------end
     dashboard: 'トップ',
     documentation: 'ドキュメント',
     guide: 'ガイド',
@@ -73,6 +110,13 @@ export default {
     size: '画面サイズ'
   },
   login: {
+    runner: 'officer Runner',
+    shoper: 'shop of Suply Chain',
+    assistant: 'worker in system',
+    signup: 'sign up',
+    forgetpassword: 'forget password',
+    rememberpassword: 'remember password',
+
     title: 'ユーザログイン',
     logIn: 'ログイン',
     username: 'ユーザ名',
diff --git a/src/lang/zh.js b/src/lang/zh.js
index dee804d..945c82f 100755
--- a/src/lang/zh.js
+++ b/src/lang/zh.js
@@ -1,5 +1,42 @@
 export default {
+  // 添加的新词条------start
+  prod: {
+    menu_title: 'products'
+  },
+  order: {
+
+  },
+  users: {
+
+  },
+  site: {
+
+  },
+  meta: {
+
+  },
+  system: {
+    memu: '系统'
+  },
   route: {
+    users: '用户',
+    usersList: '列表',
+    shopers: '厂商',
+    prods: '产品',
+    orders: '订单',
+    sites: '站点',
+    metas: {
+      metas: '元',
+      list: '树'
+    },
+    systems: {
+      systems: '系统设置',
+      sites: '站点设置',
+      money: '货币设置',
+      industry: '行业设置',
+      template: '模版设置'
+    },
+    // 添加的新词条------end
     dashboard: '首页',
     documentation: '文档',
     guide: '引导页',
@@ -73,7 +110,14 @@ export default {
     size: '布局大小'
   },
   login: {
-    title: '系统登录',
+    runner: '运营官',
+    shoper: '商家',
+    assistant: '操作员',
+    signup: '注册',
+    forgetpassword: '忘记密码',
+    rememberpassword: 'remember password',
+
+    title: '鱼皮出海',
     logIn: '登录',
     username: '账号',
     password: '密码',
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index 119c6df..d2bf434 100755
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -22,11 +22,12 @@
         <span>{{ $t('settings.sidebarLogo') }}</span>
         <el-switch v-model="sidebarLogo" class="drawer-switch" />
       </div>
-      <a v-if="isShowJob" href="https://panjiachen.github.io/vue-element-admin-site/zh/job/" target="_blank" class="job-link">
+
+      <a v-if="isShowJob" href="https://glass.xiuyetang.com/" target="_blank" class="job-link">
         <el-alert
-          title="部门目前非常缺人！有兴趣的可以点击了解详情。坐标: 字节跳动"
+          title="鱼皮计划极为宏大，而且极为可行，我们要努力写代码，尽快打通任督二脉，要做好很有钱的思想准备"
           type="success"
-          :closable="false"
+          :closable="true"
         />
       </a>
 
diff --git a/src/router/index.js b/src/router/index.js
index 2e3b738..86dd9f9 100755
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -7,11 +7,14 @@ Vue.use(Router)
 import Layout from '@/layout'
 
 /* Router Modules */
-import componentsRouter from './modules/components'
-import chartsRouter from './modules/charts'
+// import componentsRouter from './modules/components'
+// import chartsRouter from './modules/charts'
 import tableRouter from './modules/table'
 // import nestedRouter from './modules/nested'
 import userRouter from './modules/user'
+import systemRouter from './modules/system'
+import prodRouter from './modules/prod'
+import metaRouter from './modules/meta'
 
 /**
  * Note: sub-menu only appear when route children.length >= 1
@@ -67,6 +70,11 @@ export const constantRoutes = [
     hidden: true
   },
   {
+    path: '/500',
+    component: () => import('@/views/error-page/500'),
+    hidden: true
+  },
+  {
     path: '/401',
     component: () => import('@/views/error-page/401'),
     hidden: true
@@ -96,33 +104,33 @@ export const constantRoutes = [
   //     }
   //   ]
   // },
-  // {
-  //   path: '/guide',
-  //   component: Layout,
-  //   redirect: '/guide/index',
-  //   children: [
-  //     {
-  //       path: 'index',
-  //       component: () => import('@/views/guide/index'),
-  //       name: 'Guide',
-  //       meta: { title: 'guide', icon: 'guide', noCache: true }
-  //     }
-  //   ]
-  // },
   {
-    path: '/profile',
+    path: '/guide',
     component: Layout,
-    redirect: '/profile/index',
-    hidden: true,
+    redirect: '/guide/index',
     children: [
       {
         path: 'index',
-        component: () => import('@/views/profile/index'),
-        name: 'Profile',
-        meta: { title: 'profile', icon: 'user', noCache: true }
+        component: () => import('@/views/guide/index'),
+        name: 'Guide',
+        meta: { title: 'guide', icon: 'guide', noCache: true }
       }
     ]
   }
+  // {
+  //   path: '/profile',
+  //   component: Layout,
+  //   redirect: '/profile/index',
+  //   hidden: true,
+  //   children: [
+  //     {
+  //       path: 'index',
+  //       component: () => import('@/views/profile/index'),
+  //       name: 'Profile',
+  //       meta: { title: 'profile', icon: 'user', noCache: true }
+  //     }
+  //   ]
+  // }
 ]
 
 /**
@@ -172,114 +180,19 @@ export const asyncRoutes = [
   //     }
   //   ]
   // },
+  tableRouter,
+  metaRouter,
+  userRouter,
+  prodRouter,
   {
-    path: '/meta',
-    component: Layout,
-    redirect: '/meta/page',
-    alwaysShow: true, // will always show the root menu
-    name: 'Meta',
-    meta: {
-      title: 'Meta',
-      icon: 'lock',
-      roles: ['admin', 'assistant'] // you can set roles in root nav
-    },
-    children: [
-      {
-        path: 'page',
-        component: () => import('@/views/permission/page'),
-        name: 'MetaList',
-        meta: {
-          title: 'MetaList',
-          roles: ['admin', 'assistant'] // or you can only set roles in sub nav
-        }
-      },
-      {
-        path: 'defined',
-        component: () => import('@/views/permission/directive'),
-        name: 'MetaDefiend',
-        meta: {
-          title: 'MetaDefiend',
-          roles: ['admin', 'assistant']
-          // if do not set roles, means: this page does not require permission
-        }
-      }
-    ]
-  },
-  {
-    path: '/users',
-    component: Layout,
-    redirect: '/users/page',
-    alwaysShow: true, // will always show the root menu
-    name: 'Users',
-    meta: {
-      title: 'Users',
-      icon: 'lock',
-      roles: ['admin', 'assistant'] // you can set roles in root nav
-    },
-    children: [
-      {
-        path: 'page',
-        component: () => import('@/views/permission/page'),
-        name: 'UserList',
-        meta: {
-          title: 'UserList',
-          roles: ['admin', 'assistant'] // or you can only set roles in sub nav
-        }
-      },
-      {
-        path: 'defined',
-        component: () => import('@/views/permission/directive'),
-        name: 'UserDefiend',
-        meta: {
-          title: 'UserDefiend',
-          roles: ['admin', 'assistant']
-          // if do not set roles, means: this page does not require permission
-        }
-      }
-    ]
-  },
-  {
-    path: '/prod',
-    component: Layout,
-    redirect: '/prod/page',
-    alwaysShow: true, // will always show the root menu
-    name: 'Prod',
-    meta: {
-      title: 'Prod',
-      icon: 'lock',
-      roles: ['admin', 'assistant', 'runner', 'shoper'] // you can set roles in root nav
-    },
-    children: [
-      {
-        path: 'page',
-        component: () => import('@/views/permission/page'),
-        name: 'ProdList',
-        meta: {
-          title: 'ProdList',
-          roles: ['admin', 'assistant', 'runner', 'shoper'] // or you can only set roles in sub nav
-        }
-      },
-      {
-        path: 'defined',
-        component: () => import('@/views/permission/directive'),
-        name: 'ProdDefiend',
-        meta: {
-          title: 'ProdDefiend',
-          roles: ['admin', 'assistant', 'shoper']
-          // if do not set roles, means: this page does not require permission
-        }
-      }
-    ]
-  },
-  {
-    path: '/order',
+    path: '/orders',
     component: Layout,
     redirect: '/order/page',
     alwaysShow: true, // will always show the root menu
     name: 'Order',
     meta: {
-      title: 'Order',
-      icon: 'lock',
+      title: 'orders',
+      icon: 'shopping',
       roles: ['admin', 'assistant', 'runner', 'shoper'] // you can set roles in root nav
     },
     children: [
@@ -305,14 +218,14 @@ export const asyncRoutes = [
     ]
   },
   {
-    path: '/site',
+    path: '/sites',
     component: Layout,
     redirect: '/site/page',
     alwaysShow: true, // will always show the root menu
     name: 'Site',
     meta: {
-      title: 'Site',
-      icon: 'lock',
+      title: 'sites',
+      icon: 'people',
       roles: ['admin', 'assistant', 'runner'] // you can set roles in root nav
     },
     children: [
@@ -337,39 +250,7 @@ export const asyncRoutes = [
       }
     ]
   },
-  {
-    path: '/system',
-    component: Layout,
-    redirect: '/system/page',
-    alwaysShow: true, // will always show the root menu
-    name: 'System',
-    meta: {
-      title: 'System',
-      icon: 'lock',
-      roles: ['admin', 'assistant', 'runner'] // you can set roles in root nav
-    },
-    children: [
-      {
-        path: 'page',
-        component: () => import('@/views/permission/page'),
-        name: 'SystemList',
-        meta: {
-          title: 'SystemList',
-          roles: ['admin', 'assistant', 'runner'] // or you can only set roles in sub nav
-        }
-      },
-      {
-        path: 'defined',
-        component: () => import('@/views/permission/directive'),
-        name: 'SystemDefiend',
-        meta: {
-          title: 'SystemDefiend',
-          roles: ['admin', 'assistant', 'runner']
-          // if do not set roles, means: this page does not require permission
-        }
-      }
-    ]
-  },
+
   // {
   //   path: '/icon',
   //   component: Layout,
@@ -382,13 +263,12 @@ export const asyncRoutes = [
   //     }
   //   ]
   // },
-
+  systemRouter,
   /** when your routing map is too long, you can split it into small modules **/
-  componentsRouter,
-  chartsRouter,
+  // componentsRouter,
+  // chartsRouter,
   // nestedRouter,
-  tableRouter,
-  userRouter,
+  // tableRouter,
 
   // {
   //   path: '/example',
diff --git a/src/router/modules/meta.js b/src/router/modules/meta.js
new file mode 100644
index 0000000..0f009cb
--- /dev/null
+++ b/src/router/modules/meta.js
@@ -0,0 +1,25 @@
+import Layout from '@/layout'
+
+const metaRouter = {
+  path: '/meta',
+  component: Layout,
+  redirect: '/meta/page',
+  alwaysShow: true, // will always show the root menu
+  name: 'Meta',
+  meta: {
+    title: 'metas.metas',
+    icon: 'zip',
+    roles: ['admin', 'assistant'] // you can set roles in root nav
+  },
+  children: [{
+    path: 'page',
+    component: () => import('@/views/meta/complex-table'),
+    name: 'MetaList',
+    meta: {
+      title: 'MetaList',
+      icon: 'zip',
+      roles: ['admin', 'assistant'] // or you can only set roles in sub nav
+    }
+  }]
+}
+export default metaRouter
diff --git a/src/router/modules/prod.js b/src/router/modules/prod.js
new file mode 100644
index 0000000..180b5e2
--- /dev/null
+++ b/src/router/modules/prod.js
@@ -0,0 +1,38 @@
+/** When your routing table is too long, you can split it into small modules**/
+
+import Layout from '@/layout'
+
+const prodRouter = {
+  path: '/prods',
+  component: Layout,
+  redirect: '/prod/page',
+  alwaysShow: true, // will always show the root menu
+  name: 'Prod',
+  meta: {
+    title: 'prods', // 会自动被i18n替换
+    icon: 'star',
+    roles: ['admin', 'assistant', 'runner', 'shoper'] // you can set roles in root nav
+  },
+  children: [{
+    path: 'page',
+    component: () => import('@/views/permission/page'),
+    name: 'ProdList',
+    meta: {
+      title: 'ProdList',
+      roles: ['admin', 'assistant', 'runner', 'shoper'] // or you can only set roles in sub nav
+    }
+  },
+  {
+    path: 'defined',
+    component: () => import('@/views/permission/directive'),
+    name: 'ProdDefiend',
+    meta: {
+      title: 'ProdDefiend',
+      roles: ['admin', 'assistant', 'shoper']
+      // if do not set roles, means: this page does not require permission
+    }
+  }
+  ]
+}
+
+export default prodRouter
diff --git a/src/router/modules/system.js b/src/router/modules/system.js
new file mode 100644
index 0000000..f4bb5e5
--- /dev/null
+++ b/src/router/modules/system.js
@@ -0,0 +1,54 @@
+import Layout from '@/layout'
+
+const systemRouter = {
+  path: '/system',
+  component: Layout,
+  redirect: '/system/page',
+  alwaysShow: true, // will always show the root menu
+  name: 'System',
+  meta: {
+    title: 'systems.systems',
+    icon: 'component',
+    roles: ['admin', 'assistant', 'runner'] // you can set roles in root nav
+  },
+  children: [{
+    path: 'page',
+    component: () => import('@/views/example/list'),
+    name: 'SystemList',
+    meta: {
+      title: 'systems.sites',
+      roles: ['admin', 'assistant', 'runner'] // or you can only set roles in sub nav
+    }
+  },
+  {
+    path: 'page',
+    component: () => import('@/views/example/list'),
+    name: 'SystemList',
+    meta: {
+      title: 'systems.money',
+      roles: ['admin', 'assistant', 'runner'] // or you can only set roles in sub nav
+    }
+  },
+  {
+    path: 'page',
+    component: () => import('@/views/example/list'),
+    name: 'SystemList',
+    meta: {
+      title: 'systems.industry',
+      roles: ['admin', 'assistant', 'runner'] // or you can only set roles in sub nav
+    }
+  },
+  {
+    path: 'page',
+    component: () => import('@/views/example/list'),
+    name: 'SystemList',
+    meta: {
+      title: 'systems.template',
+      roles: ['admin', 'assistant', 'runner'] // or you can only set roles in sub nav
+    }
+  }
+
+  ]
+}
+
+export default systemRouter
diff --git a/src/router/modules/user.js b/src/router/modules/user.js
index e5e0eb3..b658126 100644
--- a/src/router/modules/user.js
+++ b/src/router/modules/user.js
@@ -5,31 +5,32 @@ import Layout from '@/layout'
 const chartsRouter = {
   path: '/users',
   component: Layout,
-  redirect: 'noRedirect',
+  redirect: '/users/page',
+  alwaysShow: true, // will always show the root menu
   name: 'Users',
   meta: {
-    title: '用户管理',
-    icon: 'peoples'
+    title: 'users',
+    icon: 'peoples',
+    roles: ['admin', 'assistant'] // you can set roles in root nav
   },
-  children: [
-    {
-      path: 'keyboard',
-      component: () => import('@/views/charts/keyboard'),
-      name: 'KeyboardChart',
-      meta: { title: 'keyboardChart', noCache: true }
-    },
-    {
-      path: 'line',
-      component: () => import('@/views/charts/line'),
-      name: 'LineChart',
-      meta: { title: 'lineChart', noCache: true }
-    },
-    {
-      path: 'mix-chart',
-      component: () => import('@/views/charts/mix-chart'),
-      name: 'MixChart',
-      meta: { title: 'mixChart', noCache: true }
+  children: [{
+    path: 'page',
+    component: () => import('@/views/users/list'),
+    name: 'UserList',
+    meta: {
+      title: 'UserList',
+      roles: ['admin', 'assistant', 'shoper', 'runner'] // or you can only set roles in sub nav
     }
+  }
+    // ,{
+    //   path: '/icons',
+    //   component: () => import('@/views/icons/index'),
+    //   name: 'icons',
+    //   meta: {
+    //     title: 'icons',
+    //     roles: ['admin', 'assistant', 'shoper', 'runner'] // or you can only set roles in sub nav
+    //   }
+    // }
   ]
 }
 
diff --git a/src/settings.js b/src/settings.js
index 1e4683f..ab93b30 100755
--- a/src/settings.js
+++ b/src/settings.js
@@ -1,5 +1,5 @@
 module.exports = {
-  title: 'Vue Element Admin',
+  title: 'Let\'s fuck this workd',
 
   /**
    * @type {boolean} true | false
@@ -17,13 +17,13 @@ module.exports = {
    * @type {boolean} true | false
    * @description Whether fix the header
    */
-  fixedHeader: false,
+  fixedHeader: true,
 
   /**
    * @type {boolean} true | false
    * @description Whether show the logo in sidebar
    */
-  sidebarLogo: false,
+  sidebarLogo: true,
 
   /**
    * @type {boolean} true | false
diff --git a/src/utils/request.js b/src/utils/request.js
index 2fb95ac..3ec0583 100755
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,30 +1,81 @@
 import axios from 'axios'
-import { MessageBox, Message } from 'element-ui'
+import qs from 'qs'
+import {
+  MessageBox,
+  Message,
+  // Loading,
+  Notification
+} from 'element-ui'
 import store from '@/store'
-import { getToken } from '@/utils/auth'
+import {
+  getToken
+} from '@/utils/auth'
 
 // create an axios instance
 const service = axios.create({
   baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
-  // withCredentials: true, // send cookies when cross-domain requests
-  timeout: 5000 // request timeout
+  withCredentials: true, // send cookies when cross-domain requests
+  timeout: 3000 // request timeout
 })
-
+// let loadingInstance
 // request interceptor
 service.interceptors.request.use(
   config => {
-    // do something before request is sent
-
+    const token = sessionStorage.getItem('access_token')
+    // const csrf = store.getters.csrf
+    if (token) {
+      config.headers = {
+        'access-token': token,
+        'Content-Type': 'application/x-www-form-urlencoded'
+      }
+    }
+    if (config.url === 'refresh') {
+      config.headers = {
+        'refresh-token': sessionStorage.getItem('refresh_token'),
+        'Content-Type': 'application/x-www-form-urlencoded'
+      }
+    }
+    // let options = {
+    //   lock: true,
+    //   fullscreen: false,
+    //   text: '数据加载中……',
+    //   // background: '#FFCC00',
+    //   spinner: 'el-icon-loading'
+    // };
+    const options = {
+      type: 'success',
+      message: config.url,
+      title: 'request axios ',
+      showClose: true,
+      duration: 3000
+    }
+    Notification(options)
+    // loadingInstance = Loading.service(options);
+    config.method === 'post'
+      ? config.data = qs.stringify({
+        ...config.data
+      })
+      : config.params = {
+        ...config.params
+      }
     if (store.getters.token) {
       // let each request carry token
       // ['X-Token'] is a custom headers key
       // please modify it according to the actual situation
       config.headers['X-Token'] = getToken()
     }
+    config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
+
     return config
+    // do something before request is sent
   },
   error => {
     // do something with request error
+    Message({
+      message: error || 'Error',
+      type: 'error',
+      duration: 5 * 1000
+    })
     console.log(error) // for debug
     return Promise.reject(error)
   }
@@ -35,7 +86,7 @@ service.interceptors.response.use(
   /**
    * If you want to get http information such as headers or status
    * Please return  response => response
-  */
+   */
 
   /**
    * Determine the request status by custom code
@@ -43,6 +94,27 @@ service.interceptors.response.use(
    * You can also judge the status by HTTP Status Code
    */
   response => {
+    const options = {
+      type: 'error',
+      message: response.status,
+      title: 'response status value ',
+      showClose: true,
+      duration: 1000
+    }
+    Notification(options)
+    // Notification.close()
+    // 这里根据后端提供的数据进行对应的处理
+    console.log('response===>', response)
+    // 定时刷新access-token
+    // if (!response.data.value && response.data.data.message === 'token invalid') {
+    //   // 刷新token
+    //   store.dispatch('refresh').then(response => {
+    //   sessionStorage.setItem('access_token', response.data)
+    //   }).catch(error => {
+    //   throw new Error('token刷新' + error)
+    //   })
+    // }
+
     const res = response.data
 
     // if the custom code is not 20000, it is judged as an error.
@@ -72,14 +144,24 @@ service.interceptors.response.use(
     }
   },
   error => {
-    console.log('err' + error) // for debug
+    console.log('error', error)
+    // console.log(JSON.stringify(error));
+    // 500的状态也应该处理一下
+    // 401-403的状态也应该处理一下
+    const text = JSON.parse(JSON.stringify(error)).response.status === 404
+      ? '404'
+      : '网络异常，请重试'
     Message({
-      message: error.message,
+      message: text || 'Error',
       type: 'error',
       duration: 5 * 1000
     })
+
     return Promise.reject(error)
   }
 )
 
+// 假设你想移除拦截器
+// axios.interceptors.request.eject(service);
+
 export default service
diff --git a/src/views/dashboard/admin/index.vue b/src/views/dashboard/admin/index.vue
index 8cb557b..63ff774 100755
--- a/src/views/dashboard/admin/index.vue
+++ b/src/views/dashboard/admin/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="dashboard-editor-container">
-    <github-corner class="github-corner" />
+    <!-- <github-corner class="github-corner" /> -->
 
     <panel-group @handleSetLineChartData="handleSetLineChartData" />
 
@@ -41,7 +41,7 @@
 </template>
 
 <script>
-import GithubCorner from '@/components/GithubCorner'
+// import GithubCorner from '@/components/GithubCorner'
 import PanelGroup from './components/PanelGroup'
 import LineChart from './components/LineChart'
 import RaddarChart from './components/RaddarChart'
@@ -73,7 +73,7 @@ const lineChartData = {
 export default {
   name: 'DashboardAdmin',
   components: {
-    GithubCorner,
+    // GithubCorner,
     PanelGroup,
     LineChart,
     RaddarChart,
diff --git a/src/views/dashboard/editor/index.vue b/src/views/dashboard/editor/index.vue
index d2b29ed..e2085a6 100755
--- a/src/views/dashboard/editor/index.vue
+++ b/src/views/dashboard/editor/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="dashboard-editor-container">
-    <div class=" clearfix">
+    <div class="clearfix">
       <pan-thumb :image="avatar" style="float: left">
         Your roles:
         <span v-for="item in roles" :key="item" class="pan-info-roles">{{ item }}</span>
@@ -20,55 +20,53 @@
 <script>
 import { mapGetters } from 'vuex'
 import PanThumb from '@/components/PanThumb'
-import GithubCorner from '@/components/GithubCorner'
+// import GithubCorner from '@/components/GithubCorner'
 
 export default {
   name: 'DashboardEditor',
-  components: { PanThumb, GithubCorner },
+  // components: { PanThumb, GithubCorner },
+  components: { PanThumb },
   data() {
     return {
-      emptyGif: 'https://wpimg.wallstcn.com/0e03b7da-db9e-4819-ba10-9016ddfdaed3'
+      emptyGif:
+        'https://wpimg.wallstcn.com/0e03b7da-db9e-4819-ba10-9016ddfdaed3'
     }
   },
   computed: {
-    ...mapGetters([
-      'name',
-      'avatar',
-      'roles'
-    ])
+    ...mapGetters(['name', 'avatar', 'roles'])
   }
 }
 </script>
 
 <style lang="scss" scoped>
-  .emptyGif {
+.emptyGif {
+  display: block;
+  width: 45%;
+  margin: 0 auto;
+}
+
+.dashboard-editor-container {
+  background-color: #e3e3e3;
+  min-height: 100vh;
+  padding: 50px 60px 0px;
+  .pan-info-roles {
+    font-size: 12px;
+    font-weight: 700;
+    color: #333;
     display: block;
-    width: 45%;
-    margin: 0 auto;
   }
-
-  .dashboard-editor-container {
-    background-color: #e3e3e3;
-    min-height: 100vh;
-    padding: 50px 60px 0px;
-    .pan-info-roles {
-      font-size: 12px;
-      font-weight: 700;
-      color: #333;
-      display: block;
-    }
-    .info-container {
-      position: relative;
-      margin-left: 190px;
-      height: 150px;
-      line-height: 200px;
-      .display_name {
-        font-size: 48px;
-        line-height: 48px;
-        color: #212121;
-        position: absolute;
-        top: 25px;
-      }
+  .info-container {
+    position: relative;
+    margin-left: 190px;
+    height: 150px;
+    line-height: 200px;
+    .display_name {
+      font-size: 48px;
+      line-height: 48px;
+      color: #212121;
+      position: absolute;
+      top: 25px;
     }
   }
+}
 </style>
diff --git a/src/views/error-page/500.vue b/src/views/error-page/500.vue
new file mode 100644
index 0000000..45a34e7
--- /dev/null
+++ b/src/views/error-page/500.vue
@@ -0,0 +1,57 @@
+<template>
+  <div class="error-page">
+    <div class="error-code">
+      5
+      <span>0</span>0
+    </div>
+    <div class="error-desc">啊哦~ 系统出了故障！</div>
+    <div class="error-handle">
+      <router-link to="/">
+        <el-button type="primary" size="large">返回首页</el-button>
+      </router-link>
+      <el-button class="error-btn" type="primary" size="large" @click="goBack">返回上一页</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  methods: {
+    goBack() {
+      this.$router.go(-1)
+    }
+  }
+}
+</script>
+<style scoped>
+.error-page {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  background: #f3f3f3;
+  box-sizing: border-box;
+}
+.error-code {
+  line-height: 1;
+  font-size: 250px;
+  font-weight: bolder;
+  color: #f02d2d;
+}
+.error-code span {
+  color: #00a854;
+}
+.error-desc {
+  font-size: 30px;
+  color: #777;
+}
+.error-handle {
+  margin-top: 30px;
+  padding-bottom: 200px;
+}
+.error-btn {
+  margin-left: 100px;
+}
+</style>
diff --git a/src/views/error-page/502.vue b/src/views/error-page/502.vue
deleted file mode 100644
index b01d319..0000000
--- a/src/views/error-page/502.vue
+++ /dev/null
@@ -1,57 +0,0 @@
-<template>
-  <div class="error-page">
-    <div class="error-code">
-      5
-      <span>0</span>2
-    </div>
-    <div class="error-desc">啊哦~ 系统出了故障！</div>
-    <div class="error-handle">
-      <router-link to="/">
-        <el-button type="primary" size="large">返回首页</el-button>
-      </router-link>
-      <el-button class="error-btn" type="primary" size="large" @click="goBack">返回上一页</el-button>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  methods: {
-    goBack() {
-      this.$router.go(-1)
-    }
-  }
-}
-</script>
-<style scoped>
-.error-page {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  background: #f3f3f3;
-  box-sizing: border-box;
-}
-.error-code {
-  line-height: 1;
-  font-size: 250px;
-  font-weight: bolder;
-  color: #f02d2d;
-}
-.error-code span {
-  color: #00a854;
-}
-.error-desc {
-  font-size: 30px;
-  color: #777;
-}
-.error-handle {
-  margin-top: 30px;
-  padding-bottom: 200px;
-}
-.error-btn {
-  margin-left: 100px;
-}
-</style>
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 6842045..2670a64 100755
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,11 +1,15 @@
 <template>
   <div class="login-container">
-    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" autocomplete="on" label-position="left">
-
+    <el-form
+      ref="loginForm"
+      :model="loginForm"
+      :rules="loginRules"
+      class="login-form"
+      autocomplete="on"
+      label-position="left"
+    >
       <div class="title-container">
-        <h3 class="title">
-          {{ $t('login.title') }}
-        </h3>
+        <h3 class="title">{{ $t('login.title') }}</h3>
         <lang-select class="set-language" />
       </div>
 
@@ -47,26 +51,47 @@
           </span>
         </el-form-item>
       </el-tooltip>
-
-      <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">
-        {{ $t('login.logIn') }}
-      </el-button>
-
+      <div
+        style="position:relative;text-align:right;height:30px;line-height:30px;border:0px #000 solid;margin-top:-20px;"
+      >
+        <!-- <el-checkbox v-model="checked">{{$t('rememberpassword')}}</el-checkbox> -->
+        <el-link type="primary">{{ $t('login.forgetpassword') }}</el-link>
+      </div>
+      <el-button
+        :loading="loading"
+        type="primary"
+        style="width:100%;"
+        @click.native.prevent="handleLogin"
+      >{{ $t('login.logIn') }}</el-button>
+      <div
+        style="position:relative;text-align:right;height:30px;line-height:30px;border:0px #000 solid;margin-bottom:30px;"
+      >
+        <div class="tips">
+          <el-link type="primary">{{ $t('login.signup') }}</el-link>
+        </div>
+      </div>
       <div style="position:relative">
         <div class="tips">
           <span>{{ $t('login.username') }} : admin</span>
           <span>{{ $t('login.password') }} : {{ $t('login.any') }}</span>
         </div>
         <div class="tips">
-          <span style="margin-right:18px;">
-            {{ $t('login.username') }} : editor
-          </span>
+          <span style="margin-right:18px;">{{ $t('login.username') }} : assistant</span>
           <span>{{ $t('login.password') }} : {{ $t('login.any') }}</span>
         </div>
-
-        <el-button class="thirdparty-button" type="primary" @click="showDialog=true">
-          {{ $t('login.thirdparty') }}
-        </el-button>
+        <div class="tips">
+          <span style="margin-right:18px;">{{ $t('login.username') }} : runner</span>
+          <span>{{ $t('login.password') }} : {{ $t('login.any') }}</span>
+        </div>
+        <div class="tips">
+          <span style="margin-right:18px;">{{ $t('login.username') }} : shoper</span>
+          <span>{{ $t('login.password') }} : {{ $t('login.any') }}</span>
+        </div>
+        <el-button
+          class="thirdparty-button"
+          type="primary"
+          @click="showDialog=true"
+        >{{ $t('login.thirdparty') }}</el-button>
       </div>
     </el-form>
 
@@ -77,6 +102,7 @@
       <br>
       <social-sign />
     </el-dialog>
+    <!-- <vfd></vfd> -->
   </div>
 </template>
 
@@ -84,9 +110,10 @@
 import { validUsername } from '@/utils/validate'
 import LangSelect from '@/components/LangSelect'
 import SocialSign from './components/SocialSignin'
-
+// import vfd from "vfd";
 export default {
   name: 'Login',
+  // components: { LangSelect, SocialSign, vfd },
   components: { LangSelect, SocialSign },
   data() {
     const validateUsername = (rule, value, callback) => {
@@ -109,8 +136,12 @@ export default {
         password: '111111'
       },
       loginRules: {
-        username: [{ required: true, trigger: 'blur', validator: validateUsername }],
-        password: [{ required: true, trigger: 'blur', validator: validatePassword }]
+        username: [
+          { required: true, trigger: 'blur', validator: validateUsername }
+        ],
+        password: [
+          { required: true, trigger: 'blur', validator: validatePassword }
+        ]
       },
       passwordType: 'password',
       capsTooltip: false,
@@ -148,7 +179,7 @@ export default {
   methods: {
     checkCapslock(e) {
       const { key } = e
-      this.capsTooltip = key && key.length === 1 && (key >= 'A' && key <= 'Z')
+      this.capsTooltip = key && key.length === 1 && key >= 'A' && key <= 'Z'
     },
     showPwd() {
       if (this.passwordType === 'password') {
@@ -164,9 +195,13 @@ export default {
       this.$refs.loginForm.validate(valid => {
         if (valid) {
           this.loading = true
-          this.$store.dispatch('user/login', this.loginForm)
+          this.$store
+            .dispatch('user/login', this.loginForm)
             .then(() => {
-              this.$router.push({ path: this.redirect || '/', query: this.otherQuery })
+              this.$router.push({
+                path: this.redirect || '/',
+                query: this.otherQuery
+              })
               this.loading = false
             })
             .catch(() => {
@@ -212,8 +247,8 @@ export default {
 /* 修复input 背景不协调 和光标变色 */
 /* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
 
-$bg:#283443;
-$light_gray:#fff;
+$bg: #283443;
+$light_gray: #fff;
 $cursor: #fff;
 
 @supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
@@ -256,9 +291,9 @@ $cursor: #fff;
 </style>
 
 <style lang="scss" scoped>
-$bg:#2d3a4b;
-$dark_gray:#889aa4;
-$light_gray:#eee;
+$bg: #2d3a4b;
+$dark_gray: #889aa4;
+$light_gray: #eee;
 
 .login-container {
   min-height: 100%;
diff --git a/src/views/meta/complex-table.vue b/src/views/meta/complex-table.vue
index 6cad8db..f073374 100755
--- a/src/views/meta/complex-table.vue
+++ b/src/views/meta/complex-table.vue
@@ -290,7 +290,7 @@ export default {
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
-          this.temp.author = 'vue-element-admin'
+          this.temp.author = '秀野堂主'
           createArticle(this.temp).then(() => {
             this.list.unshift(this.temp)
             this.dialogFormVisible = false
diff --git a/src/views/order/complex-table.vue b/src/views/order/complex-table.vue
index 6cad8db..f073374 100755
--- a/src/views/order/complex-table.vue
+++ b/src/views/order/complex-table.vue
@@ -290,7 +290,7 @@ export default {
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
-          this.temp.author = 'vue-element-admin'
+          this.temp.author = '秀野堂主'
           createArticle(this.temp).then(() => {
             this.list.unshift(this.temp)
             this.dialogFormVisible = false
diff --git a/src/views/prod/complex-table.vue b/src/views/prod/complex-table.vue
index 6cad8db..f073374 100755
--- a/src/views/prod/complex-table.vue
+++ b/src/views/prod/complex-table.vue
@@ -290,7 +290,7 @@ export default {
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
-          this.temp.author = 'vue-element-admin'
+          this.temp.author = '秀野堂主'
           createArticle(this.temp).then(() => {
             this.list.unshift(this.temp)
             this.dialogFormVisible = false
diff --git a/src/views/system/complex-table.vue b/src/views/system/complex-table.vue
index 6cad8db..f073374 100755
--- a/src/views/system/complex-table.vue
+++ b/src/views/system/complex-table.vue
@@ -290,7 +290,7 @@ export default {
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
-          this.temp.author = 'vue-element-admin'
+          this.temp.author = '秀野堂主'
           createArticle(this.temp).then(() => {
             this.list.unshift(this.temp)
             this.dialogFormVisible = false
diff --git a/src/views/table/complex-table.vue b/src/views/table/complex-table.vue
index 6cad8db..f073374 100755
--- a/src/views/table/complex-table.vue
+++ b/src/views/table/complex-table.vue
@@ -290,7 +290,7 @@ export default {
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
-          this.temp.author = 'vue-element-admin'
+          this.temp.author = '秀野堂主'
           createArticle(this.temp).then(() => {
             this.list.unshift(this.temp)
             this.dialogFormVisible = false
diff --git a/src/views/users/list.vue b/src/views/users/list.vue
new file mode 100644
index 0000000..513eb36
--- /dev/null
+++ b/src/views/users/list.vue
@@ -0,0 +1,618 @@
+<template>
+  <div class="app-container">
+    <div class="filter-container">
+      <el-input
+        v-model="listQuery.title"
+        :placeholder="$t('table.title')"
+        style="width: 200px;"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-select
+        v-model="listQuery.importance"
+        :placeholder="$t('table.importance')"
+        clearable
+        style="width: 90px"
+        class="filter-item"
+      >
+        <el-option
+          v-for="item in importanceOptions"
+          :key="item"
+          :label="item"
+          :value="item"
+        />
+      </el-select>
+      <el-select
+        v-model="listQuery.type"
+        :placeholder="$t('table.type')"
+        clearable
+        class="filter-item"
+        style="width: 130px"
+      >
+        <el-option
+          v-for="item in calendarTypeOptions"
+          :key="item.key"
+          :label="item.display_name+'('+item.key+')'"
+          :value="item.key"
+        />
+      </el-select>
+      <el-select
+        v-model="listQuery.sort"
+        style="width: 140px"
+        class="filter-item"
+        @change="handleFilter"
+      >
+        <el-option
+          v-for="item in sortOptions"
+          :key="item.key"
+          :label="item.label"
+          :value="item.key"
+        />
+      </el-select>
+      <el-button
+        v-waves
+        class="filter-item"
+        type="primary"
+        icon="el-icon-search"
+        @click="handleFilter"
+      >
+        {{ $t('table.search') }}
+      </el-button>
+      <el-button
+        class="filter-item"
+        style="margin-left: 10px;"
+        type="primary"
+        icon="el-icon-edit"
+        @click="handleCreate"
+      >
+        {{ $t('table.add') }}
+      </el-button>
+      <el-button
+        v-waves
+        :loading="downloadLoading"
+        class="filter-item"
+        type="primary"
+        icon="el-icon-download"
+        @click="handleDownload"
+      >
+        {{ $t('table.export') }}
+      </el-button>
+      <el-checkbox
+        v-model="showReviewer"
+        class="filter-item"
+        style="margin-left:15px;"
+        @change="tableKey=tableKey+1"
+      >
+        {{ $t('table.reviewer') }}
+      </el-checkbox>
+    </div>
+
+    <el-table
+      :key="tableKey"
+      v-loading="listLoading"
+      :data="list"
+      border
+      fit
+      highlight-current-row
+      style="width: 100%;"
+      @sort-change="sortChange"
+    >
+      <el-table-column
+        :label="$t('table.uid')"
+        prop="id"
+        sortable="custom"
+        align="center"
+        width="80"
+        :class-name="getSortClass('id')"
+      >
+        <template slot-scope="{row}">
+          <span>{{ row.uid }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.create_time')"
+        width="150px"
+        align="center"
+      >
+        <template slot-scope="{row}">
+          <span>{{ row.create_time | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.openid')"
+        min-width="150px"
+      >
+        <template slot-scope="{row}">
+          <span
+            class="link-type"
+            @click="handleUpdate(row)"
+          >{{ row.title }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.nickname')"
+        width="110px"
+        align="center"
+      >
+        <template slot-scope="{row}">
+          <span>{{ row.nickname }}</span>
+          <el-tag>{{ row.type | typeFilter }}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        v-if="showReviewer"
+        :label="$t('table.reviewer')"
+        width="110px"
+        align="center"
+      >
+        <template slot-scope="{row}">
+          <span style="color:red;">{{ row.reviewer }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.importance')"
+        width="80px"
+      >
+        <template slot-scope="{row}">
+          <svg-icon
+            v-for="n in +row.importance"
+            :key="n"
+            icon-class="star"
+            class="meta-item__icon"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.son_of_adv')"
+        align="center"
+        width="95"
+      >
+        <template slot-scope="{row}">
+          <span
+            v-if="row.son_of_adv"
+            class="link-type"
+            @click="handleFetchPv(row.son_of_adv)"
+          >{{ row.son_of_adv }}</span>
+          <span v-else>0</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.status')"
+        class-name="status-col"
+        width="100"
+      >
+        <template slot-scope="{row}">
+          <el-tag :type="row.status | statusFilter">{{ row.status }}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        :label="$t('table.actions')"
+        align="center"
+        width="230"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="{row,$index}">
+          <el-button
+            type="primary"
+            size="mini"
+            @click="handleUpdate(row)"
+          >{{ $t('table.edit') }}</el-button>
+          <el-button
+            v-if="row.status!='deleted'"
+            size="mini"
+            type="danger"
+            @click="handleDelete(row,$index)"
+          >{{ $t('table.delete') }}</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="listQuery.page"
+      :limit.sync="listQuery.limit"
+      @pagination="getList"
+    />
+    <el-dialog
+      :title="textMap[dialogStatus]"
+      :visible.sync="dialogFormVisible"
+    >
+      <el-form
+        ref="dataForm"
+        :rules="rules"
+        :model="temp"
+        label-position="left"
+        label-width="70px"
+        style="width: 400px; margin-left:50px;"
+      >
+        <el-form-item
+          :label="$t('table.type')"
+          prop="type"
+        >
+          <el-select
+            v-model="temp.type"
+            class="filter-item"
+            placeholder="Please select"
+          >
+            <el-option
+              v-for="item in calendarTypeOptions"
+              :key="item.key"
+              :label="item.display_name"
+              :value="item.key"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          :label="$t('table.create_time')"
+          prop="create_time"
+        >
+          <el-date-picker
+            v-model="temp.create_time"
+            type="datetime"
+            placeholder="Please pick a date"
+          />
+        </el-form-item>
+        <el-form-item
+          :label="$t('table.业务记录')"
+          prop="title"
+        >
+          <el-input v-model="temp.title" />
+        </el-form-item>
+        <el-form-item :label="$t('table.status')">
+          <el-select
+            v-model="temp.status"
+            class="filter-item"
+            placeholder="Please select"
+          >
+            <el-option
+              v-for="item in statusOptions"
+              :key="item"
+              :label="item"
+              :value="item"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item :label="$t('table.importance')">
+          <el-rate
+            v-model="temp.importance"
+            :colors="['#99A9BF', '#F7BA2A', '#FF9900']"
+            :max="3"
+            style="margin-top:8px;"
+          />
+        </el-form-item>
+        <el-form-item :label="$t('table.remark')">
+          <el-input
+            v-model="temp.remark"
+            :autosize="{ minRows: 2, maxRows: 4}"
+            type="textarea"
+            placeholder="Please input"
+          />
+        </el-form-item>
+      </el-form>
+      <div
+        slot="footer"
+        class="dialog-footer"
+      >
+        <el-button @click="dialogFormVisible = false">{{ $t('table.cancel') }}</el-button>
+        <el-button
+          type="primary"
+          @click="dialogStatus==='create'?createData():updateData()"
+        >{{ $t('table.confirm') }}</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      :visible.sync="dialogPvVisible"
+      title="Reading statistics"
+    >
+      <el-table
+        :data="pvData"
+        border
+        fit
+        highlight-current-row
+        style="width: 100%"
+      >
+        <el-table-column
+          prop="key"
+          label="Channel"
+        />
+        <el-table-column
+          prop="pv"
+          label="Pv"
+        />
+      </el-table>
+      <span
+        slot="footer"
+        class="dialog-footer"
+      >
+        <el-button
+          type="primary"
+          @click="dialogPvVisible = false"
+        >{{ $t('table.confirm') }}</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  fetchList,
+  fetchPv,
+  createUser,
+  updateUser,
+  delUser
+} from '@/api/user'
+import waves from '@/directive/waves' // waves directive
+import { parseTime } from '@/utils'
+import Pagination from '@/components/Pagination' // secondary package based on el-pagination
+
+const calendarTypeOptions = [
+  { key: 'CN', display_name: 'China' },
+  { key: 'US', display_name: 'USA' },
+  { key: 'JP', display_name: 'Japan' },
+  { key: 'EU', display_name: 'Eurozone' }
+]
+
+// arr to obj, such as { CN : "China", US : "USA" }
+const calendarTypeKeyValue = calendarTypeOptions.reduce((acc, cur) => {
+  acc[cur.key] = cur.display_name
+  return acc
+}, {})
+
+export default {
+  name: 'ComplexTable',
+  components: { Pagination },
+  directives: { waves },
+  filters: {
+    statusFilter(status) {
+      const statusMap = {
+        published: 'success',
+        draft: 'info',
+        deleted: 'danger'
+      }
+      return statusMap[status]
+    },
+    typeFilter(type) {
+      return calendarTypeKeyValue[type]
+    }
+  },
+  data() {
+    return {
+      tableKey: 0,
+      list: null,
+      total: 0,
+      listLoading: true,
+      listQuery: {
+        page: 1,
+        limit: 20,
+        importance: undefined,
+        title: undefined,
+        type: undefined,
+        sort: '+id'
+      },
+      importanceOptions: [1, 2, 3],
+      calendarTypeOptions,
+      sortOptions: [
+        { label: 'ID Ascending', key: '+id' },
+        { label: 'ID Descending', key: '-id' }
+      ],
+      statusOptions: ['published', 'draft', 'deleted'],
+      showReviewer: false,
+      temp: {
+        id: undefined,
+        importance: 1,
+        remark: '',
+        create_time: new Date(),
+        title: '',
+        type: '',
+        status: 'published'
+      },
+      dialogFormVisible: false,
+      dialogStatus: '',
+      textMap: {
+        update: 'Edit',
+        create: 'Create'
+      },
+      dialogPvVisible: false,
+      pvData: [],
+      rules: {
+        type: [
+          { required: true, message: 'type is required', trigger: 'change' }
+        ],
+        create_time: [
+          {
+            type: 'date',
+            required: true,
+            message: 'create_time is required',
+            trigger: 'change'
+          }
+        ],
+        title: [
+          { required: true, message: 'title is required', trigger: 'blur' }
+        ]
+      },
+      downloadLoading: false
+    }
+  },
+  created: async function() {
+    const params = {
+      card_no: '111'
+    }
+    const res = await this.getList(params)
+    console.log('resresresres', res)
+  },
+  methods: {
+    getList() {
+      this.listLoading = true
+      fetchList(this.listQuery).then(response => {
+        this.list = response.data.items
+        this.total = response.data.total
+
+        // Just to simulate the time of the request
+        setTimeout(() => {
+          this.listLoading = false
+        }, 1.5 * 1000)
+      })
+    },
+    handleFilter() {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    handleModifyStatus(row, status) {
+      this.$message({
+        message: '操作成功',
+        type: 'success'
+      })
+      row.status = status
+    },
+    sortChange(data) {
+      const { prop, order } = data
+      if (prop === 'id') {
+        this.sortByID(order)
+      }
+    },
+    sortByID(order) {
+      if (order === 'ascending') {
+        this.listQuery.sort = '+id'
+      } else {
+        this.listQuery.sort = '-id'
+      }
+      this.handleFilter()
+    },
+    resetTemp() {
+      this.temp = {
+        id: undefined,
+        importance: 1,
+        remark: '',
+        create_time: new Date(),
+        title: '',
+        status: 'published',
+        type: ''
+      }
+    },
+    handleCreate() {
+      this.resetTemp()
+      this.dialogStatus = 'create'
+      this.dialogFormVisible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+      // const data = []
+      // createUser(data).then(() => {
+      //   this.$notify({
+      //     title: "成功",
+      //     message: "添加成功",
+      //     type: "success",
+      //     duration: 2000
+      //   });
+      // });
+    },
+    createData() {
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          this.temp.id = parseInt(Math.random() * 100) + 1024 // mock a id
+          this.temp.author = '秀野堂主'
+          createUser(this.temp).then(() => {
+            this.list.unshift(this.temp)
+            this.dialogFormVisible = false
+            this.$notify({
+              title: '成功',
+              message: '创建成功',
+              type: 'success',
+              duration: 2000
+            })
+          })
+        }
+      })
+    },
+    handleUpdate(row) {
+      this.temp = Object.assign({}, row) // copy obj
+      this.temp.create_time = new Date(this.temp.create_time)
+      this.dialogStatus = 'update'
+      this.dialogFormVisible = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+    },
+    updateData() {
+      this.$refs['dataForm'].validate(valid => {
+        if (valid) {
+          const tempData = Object.assign({}, this.temp)
+          tempData.create_time = +new Date(tempData.create_time) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464
+          updateUser(tempData).then(() => {
+            const index = this.list.findIndex(v => v.id === this.temp.id)
+            this.list.splice(index, 1, this.temp)
+            this.dialogFormVisible = false
+            this.$notify({
+              title: '成功',
+              message: '更新成功',
+              type: 'success',
+              duration: 2000
+            })
+          })
+        }
+      })
+    },
+    handleDelete(row, index) {
+      const data = []
+      delUser(data).then(() => {
+        this.list.splice(index, 1)
+        this.$notify({
+          title: '成功',
+          message: '删除成功',
+          type: 'success',
+          duration: 2000
+        })
+      })
+    },
+    handleFetchPv(pv) {
+      fetchPv(pv).then(response => {
+        this.pvData = response.data.pvData
+        this.dialogPvVisible = true
+      })
+    },
+    handleDownload() {
+      this.downloadLoading = true
+      import('@/vendor/Export2Excel').then(excel => {
+        const tHeader = [
+          'create_time',
+          'title',
+          'type',
+          'importance',
+          'status'
+        ]
+        const filterVal = [
+          'create_time',
+          'title',
+          'type',
+          'importance',
+          'status'
+        ]
+        const data = this.formatJson(filterVal)
+        excel.export_json_to_excel({
+          header: tHeader,
+          data,
+          filename: 'table-list'
+        })
+        this.downloadLoading = false
+      })
+    },
+    formatJson(filterVal) {
+      return this.list.map(v =>
+        filterVal.map(j => {
+          if (j === 'create_time') {
+            return parseTime(v[j])
+          } else {
+            return v[j]
+          }
+        })
+      )
+    },
+    getSortClass: function(key) {
+      const sort = this.listQuery.sort
+      return sort === `+${key}` ? 'ascending' : 'descending'
+    }
+  }
+}
+</script>
diff --git a/tests/unit/utils/validate.spec.js b/tests/unit/utils/validate.spec.js
index 99e6980..fac1f15 100755
--- a/tests/unit/utils/validate.spec.js
+++ b/tests/unit/utils/validate.spec.js
@@ -2,7 +2,9 @@ import { validUsername, validURL, validLowerCase, validUpperCase, validAlphabets
 describe('Utils:validate', () => {
   it('validUsername', () => {
     expect(validUsername('admin')).toBe(true)
+    expect(validUsername('assistant')).toBe(true)
     expect(validUsername('runner')).toBe(true)
+    expect(validUsername('shoper')).toBe(true)
     // expect(validUsername('xxxx')).toBe(false)
     // expect(validUsername('xxxx')).toBe(false)
     // expect(validUsername('xxxx')).toBe(false)