feat: ✨ 更改 api 引入的方法更合理化

src/api/demo.js

@@ -0,0 +1,86 @@
+import { find, map, random } from 'lodash'
+import faker from 'faker/locale/zh_CN'
+import { service, serviceForMock, request, requestForMock, mock } from '@/api/_service.js'
+import * as tools from '@/api/_tools.js'
+
+const db = [
+  { id: '1', name: '用户 1', address: '上海市普陀区金沙江路 1518 弄' },
+  { id: '2', name: '用户 2', address: '上海市普陀区金沙江路 1517 弄' },
+  { id: '3', name: '用户 3', address: '上海市普陀区金沙江路 1519 弄' },
+  { id: '4', name: '用户 4', address: '上海市普陀区金沙江路 1516 弄' }
+]
+
+/**
+ * @description 列表
+ */
+export function DEMO_MOCK_LIST () {
+  // 模拟数据
+  mock
+    .onAny('/demo/business/issues/142/fetch')
+    .reply(...tools.responseSuccess({ list: db }))
+  // 接口请求
+  return requestForMock({
+    url: '/demo/business/issues/142/fetch',
+    method: 'get'
+  })
+}
+
+/**
+ * @description 详情
+ * @param {String} id 项目 ID
+ */
+export function DEMO_MOCK_DETAIL (id) {
+  // 模拟数据
+  mock
+    .onAny('/demo/business/issues/142/detail')
+    .reply(config => tools.responseSuccess(find(db, { id: config.params.id })))
+  // 接口请求
+  return requestForMock({
+    url: '/demo/business/issues/142/detail',
+    method: 'get',
+    params: {
+      id
+    }
+  })
+}
+
+/**
+ * @description 列表
+ */
+export function DEMO_MOCK_LIST2 (params = {}) {
+  // 模拟数据
+  mock
+    .onAny('/demo/business/table/1/fetch')
+    .reply(config => tools.responseSuccess({
+      page: {
+        total: 1000
+      },
+      list: map(Array(config.params.pageSize), () => ({
+        key: faker.random.uuid(),
+        value: [10, 100, 200, 500][random(0, 3)],
+        type: faker.random.boolean(),
+        admin: faker.name.firstName() + faker.name.lastName(),
+        adminNote: faker.random.words(),
+        dateTimeCreat: faker.date.past(),
+        used: faker.random.boolean(),
+        dateTimeUse: faker.date.past()
+      }))
+    }))
+  // 接口请求
+  return requestForMock({
+    url: '/demo/business/table/1/fetch',
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * @description 错误日志示例 请求一个不存在的地址
+ */
+export function DEMO_LOG_AJAX () {
+  // 接口请求
+  return requestForMock({
+    url: '/invalid-url',
+    method: 'get'
+  })
+}

src/api/index.js

@@ -1,17 +0,0 @@
-import { assign, map } from 'lodash'
-import faker from 'faker/locale/zh_CN'
-import { service, request, serviceForMock, requestForMock, mock } from './service'
-import * as tools from './tools'
-
-const files = require.context('./modules', true, /\.api\.js$/)
-const generators = files.keys().map(key => files(key).default)
-
-export default assign({}, ...map(generators, generator => generator({
-  service,
-  request,
-  serviceForMock,
-  requestForMock,
-  mock,
-  faker,
-  tools
-})))

src/api/modules/demo.api.js

@@ -1,85 +0,0 @@
-import { find, map, random } from 'lodash'
-
-const businessIssue142Db = [
-  { id: '1', name: '用户 1', address: '上海市普陀区金沙江路 1518 弄' },
-  { id: '2', name: '用户 2', address: '上海市普陀区金沙江路 1517 弄' },
-  { id: '3', name: '用户 3', address: '上海市普陀区金沙江路 1519 弄' },
-  { id: '4', name: '用户 4', address: '上海市普陀区金沙江路 1516 弄' }
-]
-
-export default ({ service, request, serviceForMock, requestForMock, mock, faker, tools }) => ({
-  /**
-   * @description https://d2.pub/d2-admin/preview/#/demo/business/issues/142
-   * @description 列表
-   */
-  DEMO_BUSINESS_ISSUE_142_LIST () {
-    // 模拟数据
-    mock
-      .onAny('/demo/business/issues/142/fetch')
-      .reply(...tools.responseSuccess({ list: businessIssue142Db }))
-    // 接口请求
-    return requestForMock({
-      url: '/demo/business/issues/142/fetch',
-      method: 'get'
-    })
-  },
-  /**
-   * @description https://d2.pub/d2-admin/preview/#/demo/business/issues/142
-   * @description 详情
-   * @param {String} id 项目 ID
-   */
-  DEMO_BUSINESS_ISSUE_142_DETAIL (id) {
-    // 模拟数据
-    mock
-      .onAny('/demo/business/issues/142/detail')
-      .reply(config => tools.responseSuccess(find(businessIssue142Db, { id: config.params.id })))
-    // 接口请求
-    return requestForMock({
-      url: '/demo/business/issues/142/detail',
-      method: 'get',
-      params: {
-        id
-      }
-    })
-  },
-  /**
-   * @description https://d2.pub/d2-admin/preview/#/demo/business/table/1
-   * @description 列表
-   */
-  DEMO_BUSINESS_TABLE_1_LIST (params = {}) {
-    // 模拟数据
-    mock
-      .onAny('/demo/business/table/1/fetch')
-      .reply(config => tools.responseSuccess({
-        page: {
-          total: 1000
-        },
-        list: map(Array(config.params.pageSize), () => ({
-          key: faker.random.uuid(),
-          value: [10, 100, 200, 500][random(0, 3)],
-          type: faker.random.boolean(),
-          admin: faker.name.firstName() + faker.name.lastName(),
-          adminNote: faker.random.words(),
-          dateTimeCreat: faker.date.past(),
-          used: faker.random.boolean(),
-          dateTimeUse: faker.date.past()
-        }))
-      }))
-    // 接口请求
-    return requestForMock({
-      url: '/demo/business/table/1/fetch',
-      method: 'get',
-      params
-    })
-  },
-  /**
-   * @description 错误日志示例 请求一个不存在的地址
-   */
-  DEMO_LOG_AJAX () {
-    // 接口请求
-    return requestForMock({
-      url: '/invalid-url',
-      method: 'get'
-    })
-  }
-})

src/api/modules/file.api.js

@@ -1,13 +0,0 @@
-export default ({ service, request, serviceForMock, requestForMock, mock, faker, tools }) => ({
-  /**
-   * @description 请求项目中的文件
-   * @param {String} url 文件地址
-   */
-  FILE_GET (url = '') {
-    return request({
-      baseURL: process.env.BASE_URL,
-      url,
-      method: 'get'
-    })
-  }
-})

src/api/modules/sys.user.api.js

@@ -1,31 +0,0 @@
-import { find, assign } from 'lodash'
-
-const users = [
-  { username: 'admin', password: 'admin', uuid: 'admin-uuid', name: 'Admin' },
-  { username: 'editor', password: 'editor', uuid: 'editor-uuid', name: 'Editor' },
-  { username: 'user1', password: 'user1', uuid: 'user1-uuid', name: 'User1' }
-]
-
-export default ({ service, request, serviceForMock, requestForMock, mock, faker, tools }) => ({
-  /**
-   * @description 登录
-   * @param {Object} data 登录携带的信息
-   */
-  SYS_USER_LOGIN (data = {}) {
-    // 模拟数据
-    mock
-      .onAny('/login')
-      .reply(config => {
-        const user = find(users, tools.parse(config.data))
-        return user
-          ? tools.responseSuccess(assign({}, user, { token: faker.random.uuid() }))
-          : tools.responseError({}, '账号或密码不正确')
-      })
-    // 接口请求
-    return requestForMock({
-      url: '/login',
-      method: 'post',
-      data
-    })
-  }
-})

src/api/sys.user.js

@@ -0,0 +1,32 @@
+import { find, assign } from 'lodash'
+import faker from 'faker/locale/zh_CN'
+import { service, serviceForMock, request, requestForMock, mock } from '@/api/_service.js'
+import * as tools from '@/api/_tools.js'
+
+const users = [
+  { username: 'admin', password: 'admin', uuid: 'admin-uuid', name: 'Admin' },
+  { username: 'editor', password: 'editor', uuid: 'editor-uuid', name: 'Editor' },
+  { username: 'user1', password: 'user1', uuid: 'user1-uuid', name: 'User1' }
+]
+
+/**
+ * @description 登录
+ * @param {Object} data 登录携带的信息
+ */
+export function SYS_USER_LOGIN (data = {}) {
+  // 模拟数据
+  mock
+    .onAny('/login')
+    .reply(config => {
+      const user = find(users, tools.parse(config.data))
+      return user
+        ? tools.responseSuccess(assign({}, user, { token: faker.random.uuid() }))
+        : tools.responseError({}, '账号或密码不正确')
+    })
+  // 接口请求
+  return requestForMock({
+    url: '/login',
+    method: 'post',
+    data
+  })
+}

src/components/d2-markdown/index.vue

@@ -12,6 +12,16 @@ import marked from 'marked'
 import highlight from 'highlight.js'
 import bandupan from './plugin/baidupan'
 import 'github-markdown-css'
+import { request } from '@/api/_service.js'
+
+function FILE_GET (url = '') {
+  return request({
+    baseURL: process.env.BASE_URL,
+    url,
+    method: 'get'
+  })
+}
+
 export default {
   name: 'd2-markdown',
   props: {
@@ -63,7 +73,7 @@ export default {
     },
     // 从 url 加载原始数据
     async getReadme (url) {
-      const data = await this.$api.FILE_GET(url)
+      const data = await FILE_GET(url)
       return this.marked(data)
     },
     marked (data) {

src/plugin/api/index.js

@@ -1,7 +0,0 @@
-import api from '@/api'
-
-export default {
-  install (Vue) {
-    Vue.prototype.$api = api
-  }
-}

src/plugin/d2admin/index.js

@@ -11,7 +11,6 @@ import '@/assets/svg-icons'
 import i18n from '@/i18n.js'
 
 // 功能插件
-import pluginApi from '@/plugin/api'
 import pluginError from '@/plugin/error'
 import pluginLog from '@/plugin/log'
 import pluginOpen from '@/plugin/open'
@@ -34,7 +33,6 @@ export default {
       i18n: (key, value) => i18n.t(key, value)
     })
     // 插件
-    Vue.use(pluginApi)
     Vue.use(pluginError)
     Vue.use(pluginLog)
     Vue.use(pluginOpen)

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

@@ -1,7 +1,7 @@
 import { Message, MessageBox } from 'element-ui'
 import util from '@/libs/util.js'
 import router from '@/router'
-import api from '@/api'
+import { SYS_USER_LOGIN } from '@/api/sys.user.js'
 
 export default {
   namespaced: true,
@@ -17,7 +17,7 @@ export default {
       username = '',
       password = ''
     } = {}) {
-      const res = await api.SYS_USER_LOGIN({ username, password })
+      const res = await SYS_USER_LOGIN({ username, password })
       // 设置 cookie 一定要存 uuid 和 token 两个 cookie
       // 整个系统依赖这两个数据进行校验和存储
       // uuid 是用户身份唯一标识 用户注册的时候确定 并且不可改变 不可重复

src/views/demo/playground/log/ajax/index.vue

@@ -8,10 +8,12 @@
 </template>
 
 <script>
+import { DEMO_LOG_AJAX } from '@/api/demo.js'
+
 export default {
   methods: {
     handleClick () {
-      this.$api.DEMO_LOG_AJAX()
+      DEMO_LOG_AJAX()
     }
   }
 }