Merge pull request #88 from rongxingsun/develop

axios封装

Former-commit-id: 699a97411a8cd105bb3f1c93002545811376ebba [formerly 699a97411a8cd105bb3f1c93002545811376ebba [formerly 699a97411a8cd105bb3f1c93002545811376ebba [formerly 699a97411a8cd105bb3f1c93002545811376ebba [formerly c2ae44d664354d69de8a4786c2a5a8875cb525aa [formerly 8f36bb1cf63aab56816fd996a36f771784d51941]]]]]
Former-commit-id: 987985ee9cdacd1d2075a89b6a2b4f922d40fa2d
Former-commit-id: 3de671c00016bcf817b5951d5fad967c4af2a101
Former-commit-id: 1f3b1b4f43b5c6594b82f51418b950b95e03d211 [formerly 61b20c9c2e3af33c65b4b6e84fea6d82e943f859]
Former-commit-id: 4b5b88cd5e0e251d0d3380ea3dd06b5108f9b386
Former-commit-id: fcb821a77d3c9f20d7423209fb306f4c33e169d5
Former-commit-id: 06785c42327d6cf53224d0e4c8ea413176b10317
Former-commit-id: c2b5d08b8d6a07a7d6b99a33d1b36b1252f5202c
Former-commit-id: 6ba3142559faec8aac82df124e1274ba3d8ab888

.env

@@ -2,3 +2,4 @@
 
 # 页面 title 前缀
 VUE_APP_TITLE=D2Admin
+VUE_APP_API=/api/

package-lock.json.REMOVED.git-id

@@ -1 +1 @@
-208665c165b32daf4021f61c3ad430a972cb9735
+937f5369a5d9b43eeb3c7fa2991f76724481721c

src/api/components/markdown/index.js

@@ -0,0 +1,9 @@
+import request from '@/plugin/axios'
+
+export function ComponentsMarkdownBase (url) {
+  return request({
+    baseURL: process.env.BASE_URL,
+    url,
+    method: 'get'
+  })
+}

src/api/demo/business/table/1/index.js

@@ -0,0 +1,9 @@
+import request from '@/plugin/axios'
+
+export function BusinessTable1List (data) {
+  return request({
+    url: '/demo/business/table/1',
+    method: 'post',
+    data
+  })
+}

src/api/demo/plugins/mocks/ajax/index.js

@@ -0,0 +1,8 @@
+import request from '@/plugin/axios'
+
+export function PluginMocksAjax () {
+  return request({
+    url: '/demo/plugins/mock/ajax',
+    method: 'get'
+  })
+}

src/api/sys/http/index.js

@@ -0,0 +1,17 @@
+import request from '@/plugin/axios'
+
+export function httpGet (url, params = {}) {
+  return request({
+    url,
+    method: 'get',
+    params
+  })
+}
+
+export function httpPost (url, data = {}) {
+  return request({
+    url,
+    method: 'post',
+    data
+  })
+}

src/api/sys/login/index.js

@@ -0,0 +1,9 @@
+import request from '@/plugin/axios'
+
+export function AccountLogin (data) {
+  return request({
+    url: '/login',
+    method: 'post',
+    data
+  })
+}

src/assets/style/theme/theme.scss.REMOVED.git-id

@@ -1 +1 @@
-87fff7214e7b64123842f1f52b649a8af614eb46
+bfee5e91a3b150e04d9f24695061f6f3e7c59342

src/components/d2-markdown/index.vue

@@ -12,6 +12,7 @@ import marked from 'marked'
 import highlight from 'highlight.js'
 import bandupan from './plugin/baidupan'
 import 'github-markdown-css'
+import { ComponentsMarkdownBase } from '@/api/components/markdown'
 export default {
   name: 'd2-markdown',
   props: {
@@ -63,7 +64,7 @@ export default {
     },
     // 从 url 加载原始数据
     async getReadme (url) {
-      const data = await this.$axios.get(url)
+      const data = await ComponentsMarkdownBase(url)
       return this.marked(data)
     },
     marked (data) {

src/layout/header-aside/components/menu-header/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-menu mode="horizontal" @select="handleMenuSelect">
+  <el-menu mode="horizontal" :default-active="active" @select="handleMenuSelect">
     <template v-for="(menu, menuIndex) in header">
       <d2-layout-header-aside-menu-item v-if="menu.children === undefined" :menu="menu" :key="menuIndex"/>
       <d2-layout-header-aside-menu-sub v-else :menu="menu" :key="menuIndex"/>
@@ -25,6 +25,19 @@ export default {
     ...mapState('d2admin/menu', [
       'header'
     ])
+  },
+  data () {
+    return {
+      active: ''
+    }
+  },
+  watch: {
+    '$route.matched': {
+      handler (val) {
+        this.active = val[val.length - 1].path
+      },
+      immediate: true
+    }
   }
 }
 </script>

src/mock/api/sys/login/index.js

@@ -21,7 +21,7 @@ const userDB = [
   }
 ]
 
-Mock.mock('/login', 'post', ({url, type, body}) => {
+Mock.mock('/api/login', 'post', ({url, type, body}) => {
   const bodyObj = JSON.parse(body)
   const user = userDB.find(e => e.username === bodyObj.username && e.password === bodyObj.password)
   if (user) {

src/pages/demo/business/table/1/index.vue

@@ -17,6 +17,7 @@
 </template>
 
 <script>
+import { BusinessTable1List } from '@/api/demo/business/table/1'
 export default {
   // name 值和本页的 $route.name 一致才可以缓存页面
   name: 'demo-business-table-1',
@@ -53,7 +54,7 @@ export default {
       this.$notify({
         title: '开始请求模拟表格数据'
       })
-      this.$axios.post('/api/demo/business/table/1', {
+      BusinessTable1List({
         ...form,
         page: this.page
       })

src/pages/demo/components/markdown/url.vue

@@ -1,6 +1,6 @@
 <template>
   <d2-container>
     <template slot="header">异步加载文件</template>
-    <d2-markdown :url="`${$baseUrl}markdown/demo.md`"/>
+    <d2-markdown url="markdown/demo.md"/>
   </d2-container>
 </template>

src/pages/demo/plugins/mock/ajax.vue

@@ -23,6 +23,7 @@
 </template>
 
 <script>
+import { PluginMocksAjax } from '@/api/demo/plugins/mocks/ajax'
 export default {
   data () {
     return {
@@ -37,7 +38,7 @@ export default {
   },
   methods: {
     ajax () {
-      this.$axios.get('/api/demo/plugins/mock/ajax')
+      PluginMocksAjax()
         .then(res => {
           this.table.columns = Object.keys(res.list[0]).map(e => ({
             label: e,

src/plugin/axios/index.js

@@ -1,13 +1,47 @@
 import axios from 'axios'
+import { Message } from 'element-ui'
+import util from '@/libs/util'
 
-axios.interceptors.response.use(res => {
+// create an axios instance
-  return res.data
+const service = axios.create({
-}, err => {
+  baseURL: process.env.VUE_APP_API,
-  return Promise.reject(err)
+  timeout: 5000 // 请求超时时间
 })
 
-export default {
+// request interceptor
-  install (Vue, options) {
+service.interceptors.request.use(
-    Vue.prototype.$axios = axios
+  config => {
+    if (!(/^https:\/\/|http:\/\//.test(config.url))) {
+      // Do something before request is sent
+      const token = util.cookies.get('token')
+      if (token && token !== 'undefined') {
+        // 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
+        config.headers['X-Token'] = token
       }
-}
+    }
+    return config
+  },
+  error => {
+    // Do something with request error
+    console.log(error) // for debug
+    Promise.reject(error)
+  }
+)
+
+// respone interceptor
+service.interceptors.response.use(
+  response => {
+    return response.data
+  },
+  error => {
+    console.log('err' + error) // for debug
+    Message({
+      message: error.message,
+      type: 'error',
+      duration: 5 * 1000
+    })
+    return Promise.reject(error)
+  }
+)
+
+export default service

src/plugin/d2admin/index.js

@@ -8,7 +8,6 @@ import '@/components'
 // svg 图标
 import '@/assets/svg-icons'
 // 功能插件
-import pluginAxios from '@/plugin/axios'
 import pluginError from '@/plugin/error'
 import pluginExport from '@/plugin/export'
 import pluginImport from '@/plugin/import'
@@ -20,7 +19,6 @@ export default {
     // Element
     Vue.use(ElementUI)
     // 插件
-    Vue.use(pluginAxios)
     Vue.use(pluginError)
     Vue.use(pluginExport)
     Vue.use(pluginImport)

src/store/modules/d2admin/modules/account.js

@@ -1,4 +1,5 @@
 import util from '@/libs/util.js'
+import { AccountLogin } from '@/api/sys/login'
 
 export default {
   namespaced: true,
@@ -12,13 +13,9 @@ export default {
      */
     login ({ commit }, { vm, username, password }) {
       // 开始请求登录接口
-      vm.$axios({
+      AccountLogin({
-        method: 'post',
-        url: '/login',
-        data: {
         username,
         password
-        }
       })
         .then(res => {
           // 设置 cookie 一定要存 uuid 和 token 两个 cookie

src/store/modules/d2admin/modules/releases.js

@@ -1,4 +1,4 @@
-import axios from 'axios'
+import { httpGet } from '@/api/sys/http'
 import semver from 'semver'
 import util from '@/libs/util.js'
 import setting from '@/setting.js'
@@ -19,7 +19,7 @@ export default {
      * @param {Object} param context
      */
     checkUpdate ({ state, commit }) {
-      axios.get(setting.releases.api)
+      httpGet(setting.releases.api)
         .then(res => {
           let versionGet = res.tag_name
           const update = semver.lt(state.version, versionGet)