From d927d4172f0edd4a9fb296e26a3a4f0d93c934a2 Mon Sep 17 00:00:00 2001 From: Pan Date: Tue, 19 Mar 2019 18:46:30 +0800 Subject: [PATCH] refine code --- mock/article.js | 30 ++++++++++++++++++++--------- mock/remoteSearch.js | 24 ++++++++++++++--------- mock/user.js | 11 +++++++++-- src/layout/components/Navbar.vue | 8 ++++---- src/store/modules/user.js | 12 ++++++------ src/utils/request.js | 6 +++++- src/views/table/dragTable.vue | 19 +++++++++--------- src/views/table/inlineEditTable.vue | 17 ++++++++-------- src/views/zip/index.vue | 9 ++++----- 9 files changed, 81 insertions(+), 55 deletions(-) diff --git a/mock/article.js b/mock/article.js index c6914cd7..d8e575c1 100644 --- a/mock/article.js +++ b/mock/article.js @@ -48,8 +48,11 @@ export default [ const pageList = mockList.filter((item, index) => index < limit * page && index >= limit * (page - 1)) return { - total: mockList.length, - items: pageList + code: '20000', + data: { + total: mockList.length, + items: pageList + } } } }, @@ -61,7 +64,10 @@ export default [ const { id } = config.query for (const article of List) { if (article.id === +id) { - return article + return { + code: '20000', + data: article + } } } } @@ -71,12 +77,16 @@ export default [ url: '/article/pv', type: 'get', response: _ => { - return { pvData: [ - { key: 'PC', pv: 1024 }, - { key: 'mobile', pv: 1024 }, - { key: 'ios', pv: 1024 }, - { key: 'android', pv: 1024 } - ] + return { + code: '20000', + data: { + pvData: [ + { key: 'PC', pv: 1024 }, + { key: 'mobile', pv: 1024 }, + { key: 'ios', pv: 1024 }, + { key: 'android', pv: 1024 } + ] + } } } }, @@ -86,6 +96,7 @@ export default [ type: 'post', response: _ => { return { + code: '20000', data: 'success' } } @@ -96,6 +107,7 @@ export default [ type: 'post', response: _ => { return { + code: '20000', data: 'success' } } diff --git a/mock/remoteSearch.js b/mock/remoteSearch.js index 28519f5c..d07422c9 100644 --- a/mock/remoteSearch.js +++ b/mock/remoteSearch.js @@ -21,7 +21,10 @@ export default [ const lowerCaseName = item.name.toLowerCase() return !(name && lowerCaseName.indexOf(name.toLowerCase()) < 0) }) - return { items: mockNameList } + return { + code: '20000', + data: { items: mockNameList } + } } }, @@ -31,14 +34,17 @@ export default [ type: 'get', response: _ => { return { - total: 20, - 'items|20': [{ - order_no: '@guid()', - timestamp: +Mock.Random.date('T'), - username: '@name()', - price: '@float(1000, 15000, 0, 2)', - 'status|1': ['success', 'pending'] - }] + code: '20000', + data: { + total: 20, + 'items|20': [{ + order_no: '@guid()', + timestamp: +Mock.Random.date('T'), + username: '@name()', + price: '@float(1000, 15000, 0, 2)', + 'status|1': ['success', 'pending'] + }] + } } } } diff --git a/mock/user.js b/mock/user.js index e9830e91..2bf4ee55 100644 --- a/mock/user.js +++ b/mock/user.js @@ -30,7 +30,10 @@ export default [ type: 'post', response: config => { const { username } = config.body - return tokens[username] + return { + code: '20000', + data: tokens[username] + } } }, @@ -40,7 +43,10 @@ export default [ type: 'get', response: config => { const { token } = config.query - return users[token] + return { + code: '20000', + data: users[token] + } } }, @@ -50,6 +56,7 @@ export default [ type: 'post', response: _ => { return { + code: '20000', data: 'success' } } diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index a99e768a..b1924a25 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -77,10 +77,10 @@ export default { toggleSideBar() { this.$store.dispatch('toggleSideBar') }, - logout() { - this.$store.dispatch('Logout').then(() => { - location.reload()// In order to re-instantiate the vue-router object to avoid bugs - }) + async logout() { + await this.$store.dispatch('Logout') + // In order to re-instantiate the vue-router object to avoid bugs + location.reload() } } } diff --git a/src/store/modules/user.js b/src/store/modules/user.js index 462bb42f..55459120 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -36,7 +36,7 @@ const user = { login({ username: username.trim(), password: password }).then(response => { const { data } = response commit('SET_TOKEN', data.token) - setToken(response.data.token) + setToken(data.token) resolve() }).catch(error => { reject(error) @@ -54,17 +54,17 @@ const user = { reject('Verification failed, please Login again.') } - const { roles } = data + const { roles, name, avatar, introduction } = data // roles must be a non-empty array if (!roles || roles.length <= 0) { reject('getInfo: roles must be a non-null array!') } - commit('SET_ROLES', data.roles) - commit('SET_NAME', data.name) - commit('SET_AVATAR', data.avatar) - commit('SET_INTRODUCTION', data.introduction) + commit('SET_ROLES', roles) + commit('SET_NAME', name) + commit('SET_AVATAR', avatar) + commit('SET_INTRODUCTION', introduction) resolve(data) }).catch(error => { reject(error) diff --git a/src/utils/request.js b/src/utils/request.js index 70cf881b..58fe9fac 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -29,7 +29,11 @@ service.interceptors.request.use( // response interceptor service.interceptors.response.use( - response => response, + /** + * If you want to get information such as headers or status + * Please return response => response + */ + response => response.data, /** * 下面的注释为通过在response里，自定义code来标示请求状态 * 当code返回如下情况则说明权限有问题，登出并返回到登录页 diff --git a/src/views/table/dragTable.vue b/src/views/table/dragTable.vue index 28132d11..a5fa71cd 100644 --- a/src/views/table/dragTable.vue +++ b/src/views/table/dragTable.vue @@ -96,17 +96,16 @@ export default { this.getList() }, methods: { - getList() { + async getList() { this.listLoading = true - fetchList(this.listQuery).then(response => { - this.list = response.data.items - this.total = response.data.total - this.listLoading = false - this.oldList = this.list.map(v => v.id) - this.newList = this.oldList.slice() - this.$nextTick(() => { - this.setSort() - }) + const { data } = await fetchList(this.listQuery) + this.list = data.items + this.total = data.total + this.listLoading = false + this.oldList = this.list.map(v => v.id) + this.newList = this.oldList.slice() + this.$nextTick(() => { + this.setSort() }) }, setSort() { diff --git a/src/views/table/inlineEditTable.vue b/src/views/table/inlineEditTable.vue index 105a0ab1..fb19d037 100644 --- a/src/views/table/inlineEditTable.vue +++ b/src/views/table/inlineEditTable.vue @@ -88,17 +88,16 @@ export default { this.getList() }, methods: { - getList() { + async getList() { this.listLoading = true - fetchList(this.listQuery).then(response => { - const items = response.data.items - this.list = items.map(v => { - this.$set(v, 'edit', false) // https://vuejs.org/v2/guide/reactivity.html - v.originalTitle = v.title // will be used when user click the cancel botton - return v - }) - this.listLoading = false + const { data } = await fetchList(this.listQuery) + const items = data.items + this.list = items.map(v => { + this.$set(v, 'edit', false) // https://vuejs.org/v2/guide/reactivity.html + v.originalTitle = v.title // will be used when user click the cancel botton + return v }) + this.listLoading = false }, cancelEdit(row) { row.title = row.originalTitle diff --git a/src/views/zip/index.vue b/src/views/zip/index.vue index c75848dc..ed7e8af2 100644 --- a/src/views/zip/index.vue +++ b/src/views/zip/index.vue @@ -53,12 +53,11 @@ export default { this.fetchData() }, methods: { - fetchData() { + async fetchData() { this.listLoading = true - fetchList().then(response => { - this.list = response.data.items - this.listLoading = false - }) + const { data } = await fetchList() + this.list = data.items + this.listLoading = false }, handleDownload() { this.downloadLoading = true