appsnbcbweicheng 1.2.11 → 1.2.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -0,0 +1,351 @@
|
|
|
1
|
+
[
|
|
2
|
+
{
|
|
3
|
+
"key": "feeManage",
|
|
4
|
+
"name": "手续费管理",
|
|
5
|
+
"ind": 6,
|
|
6
|
+
"child": [
|
|
7
|
+
{
|
|
8
|
+
"key": "feeIncome",
|
|
9
|
+
"value": "保险费用实收入账管理",
|
|
10
|
+
"ind": 3,
|
|
11
|
+
"actions": [
|
|
12
|
+
"feeIncomeDownload",
|
|
13
|
+
"feeIncomeDel",
|
|
14
|
+
"feeIncomeAdd",
|
|
15
|
+
"feeIncomeEdit"
|
|
16
|
+
]
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
"key": "invoice",
|
|
20
|
+
"value": "手续费开票管理",
|
|
21
|
+
"ind": 5,
|
|
22
|
+
"actions": [
|
|
23
|
+
"invoiceDownload",
|
|
24
|
+
"invoiceDel",
|
|
25
|
+
"invoiceAdd",
|
|
26
|
+
"invoiceEdit"
|
|
27
|
+
]
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
"key": "feeGrant",
|
|
31
|
+
"value": "手续费发放管理",
|
|
32
|
+
"ind": 6,
|
|
33
|
+
"actions": [
|
|
34
|
+
"feeGrantDownload",
|
|
35
|
+
"feeGrantDel",
|
|
36
|
+
"feeGrantAdd",
|
|
37
|
+
"feeGrantEdit"
|
|
38
|
+
]
|
|
39
|
+
}
|
|
40
|
+
]
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
"key": "creditManage",
|
|
44
|
+
"name": "保险授信额度管理",
|
|
45
|
+
"ind": 7,
|
|
46
|
+
"child": [
|
|
47
|
+
{
|
|
48
|
+
"key": "quotaRegister",
|
|
49
|
+
"value": "保险授信额度登记",
|
|
50
|
+
"ind": 0,
|
|
51
|
+
"actions": [
|
|
52
|
+
"quotaRegisterDownload",
|
|
53
|
+
"quotaRegisterDel",
|
|
54
|
+
"quotaRegisterAdd",
|
|
55
|
+
"quotaRegisterEdit"
|
|
56
|
+
]
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"key": "quotaLedger",
|
|
60
|
+
"value": "保险授信额度使用台账",
|
|
61
|
+
"ind": 1,
|
|
62
|
+
"actions": [
|
|
63
|
+
"quotaLedgerDownload",
|
|
64
|
+
"quotaLedgerDel",
|
|
65
|
+
"quotaLedgerAdd",
|
|
66
|
+
"quotaLedgerEdit"
|
|
67
|
+
]
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
"key": "quotaStats",
|
|
71
|
+
"value": "单一存量产品额度统计",
|
|
72
|
+
"ind": 2,
|
|
73
|
+
"actions": [
|
|
74
|
+
"quotaStatsDownload",
|
|
75
|
+
"quotaStatsDel",
|
|
76
|
+
"quotaStatsAdd",
|
|
77
|
+
"quotaStatsEdit"
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
]
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
"key": "recordCheck",
|
|
84
|
+
"name": "双录质检管理",
|
|
85
|
+
"ind": 8,
|
|
86
|
+
"child": [
|
|
87
|
+
{
|
|
88
|
+
"key": "ledgerQuery",
|
|
89
|
+
"value": "保险双录质检台账登记查询",
|
|
90
|
+
"ind": 3,
|
|
91
|
+
"actions": [
|
|
92
|
+
"ledgerQueryDownload",
|
|
93
|
+
"ledgerQueryDel",
|
|
94
|
+
"ledgerQueryAdd",
|
|
95
|
+
"ledgerQueryEdit"
|
|
96
|
+
]
|
|
97
|
+
}
|
|
98
|
+
]
|
|
99
|
+
},
|
|
100
|
+
{
|
|
101
|
+
"key": "queryManage",
|
|
102
|
+
"name": "查询管理",
|
|
103
|
+
"ind": 10,
|
|
104
|
+
"child": [
|
|
105
|
+
{
|
|
106
|
+
"key": "staffPerformance",
|
|
107
|
+
"value": "营销人员绩效查询",
|
|
108
|
+
"ind": 2,
|
|
109
|
+
"actions": [
|
|
110
|
+
"staffPerformanceDownload",
|
|
111
|
+
"staffPerformanceDel",
|
|
112
|
+
"staffPerformanceAdd",
|
|
113
|
+
"staffPerformanceEdit"
|
|
114
|
+
]
|
|
115
|
+
},
|
|
116
|
+
{
|
|
117
|
+
"key": "pensionDeal",
|
|
118
|
+
"value": "养老投连交易查询",
|
|
119
|
+
"ind": 4,
|
|
120
|
+
"actions": [
|
|
121
|
+
"pensionDealDownload",
|
|
122
|
+
"pensionDealDel",
|
|
123
|
+
"pensionDealAdd",
|
|
124
|
+
"pensionDealEdit"
|
|
125
|
+
]
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
"key": "policyError",
|
|
129
|
+
"value": "投保报错查询",
|
|
130
|
+
"ind": 6,
|
|
131
|
+
"actions": [
|
|
132
|
+
"policyErrorDownload",
|
|
133
|
+
"policyErrorDel",
|
|
134
|
+
"policyErrorAdd",
|
|
135
|
+
"policyErrorEdit"
|
|
136
|
+
]
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
"key": "checkMismatch",
|
|
140
|
+
"value": "非实时校验不符查询",
|
|
141
|
+
"ind": 7,
|
|
142
|
+
"actions": [
|
|
143
|
+
"checkMismatchDownload",
|
|
144
|
+
"checkMismatchDel",
|
|
145
|
+
"checkMismatchAdd",
|
|
146
|
+
"checkMismatchEdit"
|
|
147
|
+
]
|
|
148
|
+
},
|
|
149
|
+
{
|
|
150
|
+
"key": "insurerProduct",
|
|
151
|
+
"value": "代销保险公司及产品查询",
|
|
152
|
+
"ind": 8,
|
|
153
|
+
"actions": [
|
|
154
|
+
"insurerProductDownload",
|
|
155
|
+
"insurerProductDel",
|
|
156
|
+
"insurerProductAdd",
|
|
157
|
+
"insurerProductEdit"
|
|
158
|
+
]
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
"key": "productList",
|
|
162
|
+
"value": "产品代销清单查询",
|
|
163
|
+
"ind": 9,
|
|
164
|
+
"actions": [
|
|
165
|
+
"productListDownload",
|
|
166
|
+
"productListDel",
|
|
167
|
+
"productListAdd",
|
|
168
|
+
"productListEdit"
|
|
169
|
+
]
|
|
170
|
+
}
|
|
171
|
+
]
|
|
172
|
+
},
|
|
173
|
+
{
|
|
174
|
+
"key": "reportManage",
|
|
175
|
+
"name": "报表管理",
|
|
176
|
+
"ind": 12,
|
|
177
|
+
"child": [
|
|
178
|
+
{
|
|
179
|
+
"key": "salesLedger",
|
|
180
|
+
"value": "网点销售台账",
|
|
181
|
+
"ind": 0,
|
|
182
|
+
"actions": [
|
|
183
|
+
"salesLedgerDownload",
|
|
184
|
+
"salesLedgerDel",
|
|
185
|
+
"salesLedgerAdd",
|
|
186
|
+
"salesLedgerEdit"
|
|
187
|
+
]
|
|
188
|
+
},
|
|
189
|
+
{
|
|
190
|
+
"key": "premiumReport",
|
|
191
|
+
"value": "总保费报表",
|
|
192
|
+
"ind": 1,
|
|
193
|
+
"actions": [
|
|
194
|
+
"premiumReportDownload",
|
|
195
|
+
"premiumReportDel",
|
|
196
|
+
"premiumReportAdd",
|
|
197
|
+
"premiumReportEdit"
|
|
198
|
+
]
|
|
199
|
+
},
|
|
200
|
+
{
|
|
201
|
+
"key": "regulationStats",
|
|
202
|
+
"value": "保险兼业统计表(监管)",
|
|
203
|
+
"ind": 4,
|
|
204
|
+
"actions": [
|
|
205
|
+
"regulationStatsDownload",
|
|
206
|
+
"regulationStatsDel",
|
|
207
|
+
"regulationStatsAdd",
|
|
208
|
+
"regulationStatsEdit"
|
|
209
|
+
]
|
|
210
|
+
}
|
|
211
|
+
]
|
|
212
|
+
},
|
|
213
|
+
{
|
|
214
|
+
"key": "batchPayment",
|
|
215
|
+
"name": "批量代收付管理",
|
|
216
|
+
"ind": 14,
|
|
217
|
+
"child": [
|
|
218
|
+
{
|
|
219
|
+
"key": "reconReport",
|
|
220
|
+
"value": "批量代收付回盘文件报表",
|
|
221
|
+
"ind": 4,
|
|
222
|
+
"actions": [
|
|
223
|
+
"reconReportDownload",
|
|
224
|
+
"reconReportDel",
|
|
225
|
+
"reconReportAdd",
|
|
226
|
+
"reconReportEdit"
|
|
227
|
+
]
|
|
228
|
+
}
|
|
229
|
+
]
|
|
230
|
+
},
|
|
231
|
+
{
|
|
232
|
+
"key": "qualificationManage",
|
|
233
|
+
"name": "财富资质管理",
|
|
234
|
+
"ind": 15,
|
|
235
|
+
"child": [
|
|
236
|
+
{
|
|
237
|
+
"key": "eduQuery",
|
|
238
|
+
"value": "继续教育查询",
|
|
239
|
+
"ind": 0,
|
|
240
|
+
"actions": [
|
|
241
|
+
"eduQueryDownload",
|
|
242
|
+
"eduQueryDel",
|
|
243
|
+
"eduQueryAdd",
|
|
244
|
+
"eduQueryEdit"
|
|
245
|
+
]
|
|
246
|
+
},
|
|
247
|
+
{
|
|
248
|
+
"key": "courseManage",
|
|
249
|
+
"value": "培训课程管理",
|
|
250
|
+
"ind": 1,
|
|
251
|
+
"actions": [
|
|
252
|
+
"courseManageDownload",
|
|
253
|
+
"courseManageDel",
|
|
254
|
+
"courseManageAdd",
|
|
255
|
+
"courseManageEdit"
|
|
256
|
+
]
|
|
257
|
+
},
|
|
258
|
+
{
|
|
259
|
+
"key": "promiseSign",
|
|
260
|
+
"value": "人员承诺书签署管理",
|
|
261
|
+
"ind": 2,
|
|
262
|
+
"actions": [
|
|
263
|
+
"promiseSignDownload",
|
|
264
|
+
"promiseSignDel",
|
|
265
|
+
"promiseSignAdd",
|
|
266
|
+
"promiseSignEdit"
|
|
267
|
+
]
|
|
268
|
+
}
|
|
269
|
+
]
|
|
270
|
+
},
|
|
271
|
+
{
|
|
272
|
+
"key": "insurerFeedback",
|
|
273
|
+
"name": "保险公司回传信息管理",
|
|
274
|
+
"ind": 16,
|
|
275
|
+
"child": [
|
|
276
|
+
{
|
|
277
|
+
"key": "renewalInfo",
|
|
278
|
+
"value": "续期保费支付信息查询",
|
|
279
|
+
"ind": 4,
|
|
280
|
+
"actions": [
|
|
281
|
+
"renewalInfoDownload",
|
|
282
|
+
"renewalInfoDel",
|
|
283
|
+
"renewalInfoAdd",
|
|
284
|
+
"renewalInfoEdit"
|
|
285
|
+
]
|
|
286
|
+
}
|
|
287
|
+
]
|
|
288
|
+
}
|
|
289
|
+
]
|
|
290
|
+
|
|
291
|
+
|
|
292
|
+
const menuData = [/* 上面整理的 JSON 结构粘贴到这里 */];
|
|
293
|
+
|
|
294
|
+
async function batchAddMenus() {
|
|
295
|
+
for (const parent of menuData) {
|
|
296
|
+
// 1. 添加父级菜单
|
|
297
|
+
const parentRes = await fetch('/api/menu/addParent', {
|
|
298
|
+
method: 'POST',
|
|
299
|
+
headers: { 'Content-Type': 'application/json' },
|
|
300
|
+
body: JSON.stringify({
|
|
301
|
+
key: parent.key,
|
|
302
|
+
name: parent.name,
|
|
303
|
+
ind: parent.ind
|
|
304
|
+
})
|
|
305
|
+
});
|
|
306
|
+
const parentResult = await parentRes.json();
|
|
307
|
+
const parentId = parentResult.data?.id; // 假设接口返回父级id
|
|
308
|
+
|
|
309
|
+
if (!parentId) {
|
|
310
|
+
console.error(`父级菜单添加失败:${parent.key}`);
|
|
311
|
+
continue;
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
for (const child of parent.child) {
|
|
315
|
+
// 2. 添加子菜单
|
|
316
|
+
const childRes = await fetch('/api/menu/addChild', {
|
|
317
|
+
method: 'POST',
|
|
318
|
+
headers: { 'Content-Type': 'application/json' },
|
|
319
|
+
body: JSON.stringify({
|
|
320
|
+
key: child.key,
|
|
321
|
+
value: child.value,
|
|
322
|
+
ind: child.ind,
|
|
323
|
+
parentId: parentId
|
|
324
|
+
})
|
|
325
|
+
});
|
|
326
|
+
const childResult = await childRes.json();
|
|
327
|
+
const childId = childResult.data?.id;
|
|
328
|
+
|
|
329
|
+
if (!childId) {
|
|
330
|
+
console.error(`子菜单添加失败:${child.key}`);
|
|
331
|
+
continue;
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
// 3. 添加功能模块
|
|
335
|
+
for (const action of child.actions || []) {
|
|
336
|
+
await fetch('/api/menu/addAction', {
|
|
337
|
+
method: 'POST',
|
|
338
|
+
headers: { 'Content-Type': 'application/json' },
|
|
339
|
+
body: JSON.stringify({
|
|
340
|
+
key: action,
|
|
341
|
+
name: action.split('_')[1], // 例如:add、edit
|
|
342
|
+
parentKey: child.key,
|
|
343
|
+
parentId: childId
|
|
344
|
+
})
|
|
345
|
+
});
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
console.log("批量添加菜单完成!");
|
|
351
|
+
}
|
package/readme.md
CHANGED
|
@@ -1,295 +0,0 @@
|
|
|
1
|
-
# Vue项目Axios请求封装规范文档
|
|
2
|
-
|
|
3
|
-
## **1. 目录结构规范**
|
|
4
|
-
```markdown
|
|
5
|
-
src/
|
|
6
|
-
├── api/
|
|
7
|
-
│ ├── index.js # Axios实例及基础配置
|
|
8
|
-
│ ├── interceptors/ # 拦截器目录
|
|
9
|
-
│ │ ├── request.js # 请求拦截器
|
|
10
|
-
│ │ └── response.js # 响应拦截器
|
|
11
|
-
│ └── modules/ # API模块目录
|
|
12
|
-
│ ├── user.js # 用户相关API
|
|
13
|
-
│ ├── product.js # 产品相关API
|
|
14
|
-
│ └── ... # 其他模块
|
|
15
|
-
```
|
|
16
|
-
|
|
17
|
-
---
|
|
18
|
-
|
|
19
|
-
## **2. 核心实现代码**
|
|
20
|
-
|
|
21
|
-
### **2.1 Axios实例配置 (`api/index.js`)**
|
|
22
|
-
```javascript
|
|
23
|
-
import axios from 'axios'
|
|
24
|
-
import { requestInterceptors } from './interceptors/request'
|
|
25
|
-
import { responseInterceptors, responseErrorHandlers } from './interceptors/response'
|
|
26
|
-
|
|
27
|
-
const service = axios.create({
|
|
28
|
-
baseURL: process.env.VUE_APP_API_BASE_URL,
|
|
29
|
-
timeout: 15000,
|
|
30
|
-
headers: { 'Content-Type': 'application/json' }
|
|
31
|
-
})
|
|
32
|
-
|
|
33
|
-
// 拦截器挂载
|
|
34
|
-
service.interceptors.request.use(requestInterceptors.onFulfilled, requestInterceptors.onRejected)
|
|
35
|
-
service.interceptors.response.use(responseInterceptors.onFulfilled, responseErrorHandlers.onRejected)
|
|
36
|
-
|
|
37
|
-
/**
|
|
38
|
-
* 封装核心请求方法
|
|
39
|
-
* @param {string} method 请求方法
|
|
40
|
-
* @param {string} url 请求地址
|
|
41
|
-
* @param {object} params GET参数
|
|
42
|
-
* @param {object} data POST数据
|
|
43
|
-
* @param {object} config 额外配置
|
|
44
|
-
*/
|
|
45
|
-
function request(method, url, { params, data, ...config } = {}) {
|
|
46
|
-
return service({ method, url, params, data, ...config })
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
// 按请求方法分类导出
|
|
50
|
-
export default {
|
|
51
|
-
get(url, params, config) {
|
|
52
|
-
return request('GET', url, { params, ...config })
|
|
53
|
-
},
|
|
54
|
-
post(url, data, config) {
|
|
55
|
-
return request('POST', url, { data, ...config })
|
|
56
|
-
},
|
|
57
|
-
put(url, data, config) {
|
|
58
|
-
return request('PUT', url, { data, ...config })
|
|
59
|
-
},
|
|
60
|
-
delete(url, params, config) {
|
|
61
|
-
return request('DELETE', url, { params, ...config })
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
---
|
|
67
|
-
|
|
68
|
-
### **2.2 请求拦截器 (`interceptors/request.js`)**
|
|
69
|
-
```javascript
|
|
70
|
-
import { getToken } from '@/utils/auth'
|
|
71
|
-
import { ElLoading } from 'element-plus'
|
|
72
|
-
|
|
73
|
-
let loadingInstance = null
|
|
74
|
-
|
|
75
|
-
export const requestInterceptors = {
|
|
76
|
-
onFulfilled: (config) => {
|
|
77
|
-
// 1. Token处理
|
|
78
|
-
const token = getToken()
|
|
79
|
-
if (token) {
|
|
80
|
-
config.headers.Authorization = `Bearer ${token}`
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
// 2. Loading控制
|
|
84
|
-
if (config.showLoading !== false) {
|
|
85
|
-
loadingInstance = ElLoading.service({
|
|
86
|
-
lock: true,
|
|
87
|
-
text: '加载中...'
|
|
88
|
-
})
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
return config
|
|
92
|
-
},
|
|
93
|
-
onRejected: (error) => {
|
|
94
|
-
loadingInstance?.close()
|
|
95
|
-
return Promise.reject(error)
|
|
96
|
-
}
|
|
97
|
-
}
|
|
98
|
-
```
|
|
99
|
-
|
|
100
|
-
---
|
|
101
|
-
|
|
102
|
-
### **2.3 响应拦截器 (`interceptors/response.js`)**
|
|
103
|
-
```javascript
|
|
104
|
-
import { ElMessage } from 'element-plus'
|
|
105
|
-
import { checkTokenExpiration } from '@/utils/auth'
|
|
106
|
-
|
|
107
|
-
let loadingInstance = null
|
|
108
|
-
|
|
109
|
-
export const responseInterceptors = {
|
|
110
|
-
onFulfilled: (response) => {
|
|
111
|
-
loadingInstance?.close()
|
|
112
|
-
const { data } = response
|
|
113
|
-
|
|
114
|
-
if (data?.code !== 200) {
|
|
115
|
-
ElMessage.error(data.message || '业务异常')
|
|
116
|
-
return Promise.reject(data)
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
return data
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
export const responseErrorHandlers = {
|
|
124
|
-
onRejected: (error) => {
|
|
125
|
-
loadingInstance?.close()
|
|
126
|
-
|
|
127
|
-
if (error.response) {
|
|
128
|
-
switch (error.response.status) {
|
|
129
|
-
case 401:
|
|
130
|
-
checkTokenExpiration()
|
|
131
|
-
break
|
|
132
|
-
case 403:
|
|
133
|
-
ElMessage.error('无访问权限')
|
|
134
|
-
break
|
|
135
|
-
case 500:
|
|
136
|
-
ElMessage.error('服务器错误')
|
|
137
|
-
break
|
|
138
|
-
default:
|
|
139
|
-
ElMessage.error(error.response.data?.message || '请求失败')
|
|
140
|
-
}
|
|
141
|
-
} else {
|
|
142
|
-
ElMessage.error(error.message.includes('timeout') ? '请求超时' : '网络异常')
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
return Promise.reject(error)
|
|
146
|
-
}
|
|
147
|
-
}
|
|
148
|
-
```
|
|
149
|
-
|
|
150
|
-
---
|
|
151
|
-
|
|
152
|
-
## **3. API模块规范**
|
|
153
|
-
|
|
154
|
-
### **3.1 用户模块示例 (`modules/user.js`)**
|
|
155
|
-
```javascript
|
|
156
|
-
import http from '../index'
|
|
157
|
-
|
|
158
|
-
export default {
|
|
159
|
-
// GET请求示例
|
|
160
|
-
getUserList(params) {
|
|
161
|
-
return http.get('/user/list', params, {
|
|
162
|
-
showLoading: true,
|
|
163
|
-
retryCount: 2
|
|
164
|
-
})
|
|
165
|
-
},
|
|
166
|
-
|
|
167
|
-
// POST请求示例
|
|
168
|
-
login(data) {
|
|
169
|
-
return http.post('/auth/login', data, {
|
|
170
|
-
headers: { 'X-Custom-Header': 'value' }
|
|
171
|
-
})
|
|
172
|
-
},
|
|
173
|
-
|
|
174
|
-
// PUT请求示例
|
|
175
|
-
updateProfile(data) {
|
|
176
|
-
return http.put('/user/profile', data)
|
|
177
|
-
},
|
|
178
|
-
|
|
179
|
-
// DELETE请求示例
|
|
180
|
-
deleteUser(id) {
|
|
181
|
-
return http.delete(`/user/${id}`)
|
|
182
|
-
}
|
|
183
|
-
}
|
|
184
|
-
```
|
|
185
|
-
|
|
186
|
-
---
|
|
187
|
-
|
|
188
|
-
## **4. 组件调用规范**
|
|
189
|
-
|
|
190
|
-
### **4.1 基础调用方式**
|
|
191
|
-
```javascript
|
|
192
|
-
import userApi from '@/api/modules/user'
|
|
193
|
-
|
|
194
|
-
export default {
|
|
195
|
-
methods: {
|
|
196
|
-
async loadData() {
|
|
197
|
-
try {
|
|
198
|
-
const res = await userApi.getUserList({ page: 1, size: 10 })
|
|
199
|
-
console.log('数据加载成功', res.data)
|
|
200
|
-
} catch (error) {
|
|
201
|
-
console.error('数据加载失败', error)
|
|
202
|
-
}
|
|
203
|
-
}
|
|
204
|
-
}
|
|
205
|
-
}
|
|
206
|
-
```
|
|
207
|
-
|
|
208
|
-
### **4.2 并发请求示例**
|
|
209
|
-
```javascript
|
|
210
|
-
Promise.all([
|
|
211
|
-
userApi.getUserInfo(),
|
|
212
|
-
productApi.getProductList()
|
|
213
|
-
]).then(([userRes, productRes]) => {
|
|
214
|
-
// 处理结果
|
|
215
|
-
})
|
|
216
|
-
```
|
|
217
|
-
|
|
218
|
-
---
|
|
219
|
-
|
|
220
|
-
## **5. 配置参数说明**
|
|
221
|
-
|
|
222
|
-
| 参数名 | 类型 | 默认值 | 说明 |
|
|
223
|
-
| ------------- | ------- | ----- | -------------- |
|
|
224
|
-
| `showLoading` | boolean | true | 是否显示loading动画 |
|
|
225
|
-
| `showError` | boolean | true | 是否自动显示错误提示 |
|
|
226
|
-
| `retryCount` | number | 0 | 网络错误时自动重试次数 |
|
|
227
|
-
| `headers` | object | {} | 自定义请求头 |
|
|
228
|
-
| `timeout` | number | 15000 | 单独设置请求超时时间(ms) |
|
|
229
|
-
|
|
230
|
-
---
|
|
231
|
-
|
|
232
|
-
## **6. 最佳实践**
|
|
233
|
-
|
|
234
|
-
1. **模块化拆分**
|
|
235
|
-
- 按业务功能划分API模块
|
|
236
|
-
- 每个模块文件不超过300行代码
|
|
237
|
-
|
|
238
|
-
2. **错误处理原则**
|
|
239
|
-
- 网络错误:拦截器统一处理
|
|
240
|
-
- 业务错误:组件中根据code特殊处理
|
|
241
|
-
|
|
242
|
-
3. **性能优化**
|
|
243
|
-
```javascript
|
|
244
|
-
// 取消重复请求示例
|
|
245
|
-
const CancelToken = axios.CancelToken
|
|
246
|
-
let cancel
|
|
247
|
-
|
|
248
|
-
http.get('/url', {
|
|
249
|
-
cancelToken: new CancelToken(c => cancel = c)
|
|
250
|
-
})
|
|
251
|
-
|
|
252
|
-
// 需要取消时调用
|
|
253
|
-
cancel()
|
|
254
|
-
```
|
|
255
|
-
|
|
256
|
-
4. **安全规范**
|
|
257
|
-
- 敏感接口必须添加Token
|
|
258
|
-
- 生产环境关闭`console.log`
|
|
259
|
-
|
|
260
|
-
---
|
|
261
|
-
|
|
262
|
-
## **7. 附录**
|
|
263
|
-
|
|
264
|
-
### **7.1 环境变量配置**
|
|
265
|
-
```dotenv
|
|
266
|
-
# .env.development
|
|
267
|
-
VUE_APP_API_BASE_URL=http://dev-api.example.com
|
|
268
|
-
VUE_APP_TIMEOUT=20000
|
|
269
|
-
|
|
270
|
-
# .env.production
|
|
271
|
-
VUE_APP_API_BASE_URL=https://api.example.com
|
|
272
|
-
```
|
|
273
|
-
|
|
274
|
-
### **7.2 常见问题排查**
|
|
275
|
-
1. **404错误**
|
|
276
|
-
- 检查`baseURL`是否正确
|
|
277
|
-
- 确认后端路由是否存在
|
|
278
|
-
|
|
279
|
-
2. **401未授权**
|
|
280
|
-
- 检查Token是否过期
|
|
281
|
-
- 确认请求头`Authorization`格式正确
|
|
282
|
-
|
|
283
|
-
3. **500服务器错误**
|
|
284
|
-
- 检查请求参数格式
|
|
285
|
-
- 联系后端排查服务异常
|
|
286
|
-
|
|
287
|
-
---
|
|
288
|
-
|
|
289
|
-
**文档版本**:v1.0.0
|
|
290
|
-
**最后更新**:2023年8月
|
|
291
|
-
**适用版本**:Vue 2.x/3.x + Axios 0.21+
|
|
292
|
-
|
|
293
|
-
---
|
|
294
|
-
|
|
295
|
-
> 该文档配套代码已通过ESLint Standard验证,可直接用于生产环境。建议团队统一按照此规范实施,如需调整请通过RFC流程提案修改。
|