feat: add base mock

package.json

@@ -20,6 +20,7 @@
     "lodash.get": "^4.4.2",
     "lodash.pick": "^4.4.0",
     "md5": "^2.2.1",
+    "mockjs": "^1.0.1-beta3",
     "moment": "^2.24.0",
     "nprogress": "^0.2.0",
     "viser-vue": "^2.3.3",
@@ -48,10 +49,10 @@
     "eslint-plugin-vue": "^5.0.0",
     "less": "^3.8.1",
     "less-loader": "^4.1.0",
-    "vue-svg-icon-loader": "^2.1.1",
-    "vue-template-compiler": "^2.5.22",
     "opencollective": "^1.0.3",
-    "opencollective-postinstall": "^2.0.2"
+    "opencollective-postinstall": "^2.0.2",
+    "vue-svg-icon-loader": "^2.1.1",
+    "vue-template-compiler": "^2.5.22"
   },
   "eslintConfig": {
     "root": true,
@@ -128,4 +129,4 @@
     "type": "opencollective",
     "url": "https://opencollective.com/ant-design-pro-vue"
   }
-}
+}

src/main.js

@@ -14,6 +14,11 @@ import './utils/filter' // global filter
 
 Vue.config.productionTip = false
 
+// mock
+if (process.env.NODE_ENV !== 'production' || process.env.VUE_APP_PREVIEW === 'true') {
+  import('./mock')
+}
+
 // mount axios Vue.$http and this.$http
 Vue.use(VueAxios)
 

src/mock/index.js

@@ -0,0 +1,8 @@
+import Mock from 'mockjs'
+
+import './services/auth'
+import './services/user'
+
+Mock.setup({
+  timeout: 800 // setter delay time
+})

src/mock/services/auth.js

@@ -0,0 +1,38 @@
+import Mock from 'mockjs'
+import { builder, getBody } from '../util'
+
+const username = ['admin', 'user', 'super']
+const password = ['21232f297a57a5a743894a0e4a801fc3', '8914de686ab28dc22f30d3d8e107ff6c'] // admin, ant.design
+
+const login = (options) => {
+  const body = getBody(options)
+  console.log('mock: body', body)
+  if (!username.includes(body.username) || !password.includes(body.password)) {
+    return builder({}, '账户或密码错误', 401)
+  }
+
+  return builder({
+    'id': Mock.mock('@guid'),
+    'name': Mock.mock('@name'),
+    'username': 'admin',
+    'password': '',
+    'avatar': 'https://gw.alipayobjects.com/zos/rmsportal/jZUIxmJycoymBprLOUbT.png',
+    'status': 1,
+    'telephone': '',
+    'lastLoginIp': '27.154.74.117',
+    'lastLoginTime': 1534837621348,
+    'creatorId': 'admin',
+    'createTime': 1497160610259,
+    'deleted': 0,
+    'roleId': 'admin',
+    'lang': 'zh-CN',
+    'token': '4291d7da9005377ec9aec4a71ea837f'
+  }, '', 200, { 'Custom-Header': Mock.mock('@guid') })
+}
+
+const logout = () => {
+  return builder({}, '[测试接口] 注销成功')
+}
+
+Mock.mock(/\/auth\/login/, 'post', login)
+Mock.mock(/\/auth\/logout/, 'post', logout)

src/mock/services/user.js

@@ -0,0 +1,373 @@
+import Mock from 'mockjs'
+import { builder, getBody } from '../util'
+
+const info = (options) => {
+  console.log('options', options)
+  const userInfo = {
+    'id': '4291d7da9005377ec9aec4a71ea837f',
+    'name': '天野远子',
+    'username': 'admin',
+    'password': '',
+    'avatar': '/avatar2.jpg',
+    'status': 1,
+    'telephone': '',
+    'lastLoginIp': '27.154.74.117',
+    'lastLoginTime': 1534837621348,
+    'creatorId': 'admin',
+    'createTime': 1497160610259,
+    'merchantCode': 'TLif2btpzg079h15bk',
+    'deleted': 0,
+    'roleId': 'admin',
+    'role': {}
+  }
+  // role
+  const roleObj = {
+    'id': 'admin',
+    'name': '管理员',
+    'describe': '拥有所有权限',
+    'status': 1,
+    'creatorId': 'system',
+    'createTime': 1497160610259,
+    'deleted': 0,
+    'permissions': [{
+      'roleId': 'admin',
+      'permissionId': 'dashboard',
+      'permissionName': '仪表盘',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'exception',
+      'permissionName': '异常页面权限',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'result',
+      'permissionName': '结果权限',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'profile',
+      'permissionName': '详细页权限',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'table',
+      'permissionName': '表格权限',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"import","defaultCheck":false,"describe":"导入"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'import',
+        'describe': '导入',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'form',
+      'permissionName': '表单权限',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'order',
+      'permissionName': '订单管理',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'permission',
+      'permissionName': '权限管理',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'role',
+      'permissionName': '角色管理',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'table',
+      'permissionName': '桌子管理',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"query","defaultCheck":false,"describe":"查询"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'query',
+        'describe': '查询',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }, {
+      'roleId': 'admin',
+      'permissionId': 'user',
+      'permissionName': '用户管理',
+      'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"import","defaultCheck":false,"describe":"导入"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"},{"action":"export","defaultCheck":false,"describe":"导出"}]',
+      'actionEntitySet': [{
+        'action': 'add',
+        'describe': '新增',
+        'defaultCheck': false
+      }, {
+        'action': 'import',
+        'describe': '导入',
+        'defaultCheck': false
+      }, {
+        'action': 'get',
+        'describe': '详情',
+        'defaultCheck': false
+      }, {
+        'action': 'update',
+        'describe': '修改',
+        'defaultCheck': false
+      }, {
+        'action': 'delete',
+        'describe': '删除',
+        'defaultCheck': false
+      }, {
+        'action': 'export',
+        'describe': '导出',
+        'defaultCheck': false
+      }],
+      'actionList': null,
+      'dataAccess': null
+    }]
+  }
+
+  roleObj.permissions.push({
+    'roleId': 'admin',
+    'permissionId': 'support',
+    'permissionName': '超级模块',
+    'actions': '[{"action":"add","defaultCheck":false,"describe":"新增"},{"action":"import","defaultCheck":false,"describe":"导入"},{"action":"get","defaultCheck":false,"describe":"详情"},{"action":"update","defaultCheck":false,"describe":"修改"},{"action":"delete","defaultCheck":false,"describe":"删除"},{"action":"export","defaultCheck":false,"describe":"导出"}]',
+    'actionEntitySet': [{
+      'action': 'add',
+      'describe': '新增',
+      'defaultCheck': false
+    }, {
+      'action': 'import',
+      'describe': '导入',
+      'defaultCheck': false
+    }, {
+      'action': 'get',
+      'describe': '详情',
+      'defaultCheck': false
+    }, {
+      'action': 'update',
+      'describe': '修改',
+      'defaultCheck': false
+    }, {
+      'action': 'delete',
+      'describe': '删除',
+      'defaultCheck': false
+    }, {
+      'action': 'export',
+      'describe': '导出',
+      'defaultCheck': false
+    }],
+    'actionList': null,
+    'dataAccess': null
+  })
+
+  userInfo.role = roleObj
+  return builder(userInfo)
+}
+
+Mock.mock(/\/user\/info/, 'get', info)

src/mock/util.js

@@ -0,0 +1,38 @@
+const responseBody = {
+  message: '',
+  timestamp: 0,
+  result: null,
+  code: 0
+}
+
+export const builder = (data, message, code = 0, headers = {}) => {
+  responseBody.result = data
+  if (message !== undefined && message !== null) {
+    responseBody.message = message
+  }
+  if (code !== undefined && code !== 0) {
+    responseBody.code = code
+    responseBody._status = code
+  }
+  if (headers !== null && typeof headers === 'object' && Object.keys(headers).length > 0) {
+    responseBody._headers = headers
+  }
+  responseBody.timestamp = new Date().getTime()
+  return responseBody
+}
+
+export const getQueryParameters = (options) => {
+  const url = options.url
+  const search = url.split('?')[1]
+  if (!search) {
+    return {}
+  }
+  return JSON.parse('{"' + decodeURIComponent(search)
+    .replace(/"/g, '\\"')
+    .replace(/&/g, '","')
+    .replace(/=/g, '":"') + '"}')
+}
+
+export const getBody = (options) => {
+  return options.body && JSON.parse(options.body)
+}

vue.config.js

@@ -87,15 +87,15 @@ module.exports = {
 
   devServer: {
     // development server port 8000
-    port: 8000,
-    proxy: {
-      '/api': {
-        // target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro',
-        target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro',
-        ws: false,
-        changeOrigin: true
-      }
-    }
+    port: 8000
+    // proxy: {
+    //   '/api': {
+    //     // target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro',
+    //     target: 'https://mock.ihx.me/mock/5baf3052f7da7e07e04a5116/antd-pro',
+    //     ws: false,
+    //     changeOrigin: true
+    //   }
+    // }
   },
 
   lintOnSave: undefined,

yarn.lock

@@ -2848,6 +2848,11 @@ combined-stream@^1.0.6, combined-stream@~1.0.6:
   dependencies:
     delayed-stream "~1.0.0"
 
+commander@*:
+  version "2.20.0"
+  resolved "http://registry.npm.taobao.org/commander/download/commander-2.20.0.tgz#d58bb2b5c1ee8f87b0d340027e9e94e222c5a422"
+  integrity sha1-1YuytcHuj4ew00ACfp6U4iLFpCI=
+
 commander@2, commander@^2.18.0, commander@^2.19.0:
   version "2.19.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
@@ -7185,6 +7190,13 @@ mkdirp@0.5.1, mkdirp@0.5.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.0, mkdirp@
   dependencies:
     minimist "0.0.8"
 
+mockjs@^1.0.1-beta3:
+  version "1.0.1-beta3"
+  resolved "http://registry.npm.taobao.org/mockjs/download/mockjs-1.0.1-beta3.tgz#d234f3c27256397564f2c955142e891909537209"
+  integrity sha1-0jTzwnJWOXVk8slVFC6JGQlTcgk=
+  dependencies:
+    commander "*"
+
 moment@^2.21.0, moment@^2.24.0:
   version "2.24.0"
   resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"