Skip to content

Commit 254d222

Browse files
author
ricardo
committed
refactor: 优化前端API请求处理
- 优化前端HTTP客户端，使其直接返回响应数据 - 更新所有调用API的组件，直接处理响应数据，简化代码 - 同步更新TypeScript API生成逻辑，移除不必要的AxiosResponse类型
1 parent 04f8b77 commit 254d222

File tree

13 files changed

+118
-141
lines changed

13 files changed

+118
-141
lines changed

‎frontend/src/App.vue‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -96,11 +96,10 @@ const updateGlobalConfig = () => {
9696
request
9797
.addOrUpdateGlobalConfig({ data: globalConfig })
9898
.then(response => {
99-
const resp = response.data as ResponseModel
100-
if (resp.code != 0) {
101-
ElMessage.warning(resp.msg || "保存失败")
99+
if (response.code != 0) {
100+
ElMessage.warning(response.msg || "保存失败")
102101
} else {
103-
globalConfig.id = resp.data
102+
globalConfig.id = response.data
104103
}
105104
})
106105
.catch(error => {
@@ -183,11 +182,10 @@ const onContextMenu = async (e: MouseEvent) => {
183182
*/
184183
const initGlobalConfig = async (): Promise<void> => {
185184
request.getGlobalConfig({}).then(response => {
186-
const resp = response.data as ResponseModel
187-
if (resp.code != 0) {
188-
ElMessage.warning(resp.msg)
185+
if (response.code != 0) {
186+
ElMessage.warning(response.msg)
189187
} else {
190-
const model = resp.data.data
188+
const model = response.data.data
191189
if (model) {
192190
Object.assign(globalConfig, model)
193191
toggleDark(model.dark_mode)

‎frontend/src/api/client.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,11 @@ instance.interceptors.request.use(
1818

1919
class httpClient {
2020
async get(url: string, params: {}){
21-
return await instance.get(url, { params: params })
21+
return (await instance.get(url, { params: params })).data
2222
}
2323

2424
async post(url: string, params: {}){
25-
return await instance.post(url, params )
25+
return (await instance.post(url, params )).data
2626
}
2727
}
2828

‎frontend/src/api/request.ts‎

Lines changed: 38 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,175 +1,174 @@
11
import { client } from "./client"
2-
import type { AxiosResponse } from "axios"
32

43
class Request {
54
/**
65
* get_bili_config.
76
* @param {Object} params 传递给服务器的参数对象。
8-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
7+
* @returns {Promise<ResponseModel>} 操作的响应。
98
*/
10-
async getBiliConfig(params: {}): Promise<AxiosResponse<any>> {
9+
async getBiliConfig(params: {}): Promise<ResponseModel> {
1110
return await client.get("/api/get_bili_config", params)
1211
}
1312

1413
/**
1514
* add_or_update_bili_config.
1615
* @param {Object} params 传递给服务器的参数对象。
17-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
16+
* @returns {Promise<ResponseModel>} 操作的响应。
1817
*/
19-
async addOrUpdateBiliConfig(params: {}): Promise<AxiosResponse<any>> {
18+
async addOrUpdateBiliConfig(params: {}): Promise<ResponseModel> {
2019
return await client.post("/api/add_or_update_bili_config", params)
2120
}
2221

2322
/**
2423
* get_bili_credential_list.
2524
* @param {Object} params 传递给服务器的参数对象。
26-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
25+
* @returns {Promise<ResponseModel>} 操作的响应。
2726
*/
28-
async getBiliCredentialList(params: {}): Promise<AxiosResponse<any>> {
27+
async getBiliCredentialList(params: {}): Promise<ResponseModel> {
2928
return await client.get("/api/get_bili_credential_list", params)
3029
}
3130

3231
/**
3332
* refresh_bili_credential.
3433
* @param {Object} params 传递给服务器的参数对象。
35-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
34+
* @returns {Promise<ResponseModel>} 操作的响应。
3635
*/
37-
async refreshBiliCredential(params: {}): Promise<AxiosResponse<any>> {
36+
async refreshBiliCredential(params: {}): Promise<ResponseModel> {
3837
return await client.get("/api/refresh_bili_credential", params)
3938
}
4039

4140
/**
4241
* delete_bili_credential.
4342
* @param {Object} params 传递给服务器的参数对象。
44-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
43+
* @returns {Promise<ResponseModel>} 操作的响应。
4544
*/
46-
async deleteBiliCredential(params: {}): Promise<AxiosResponse<any>> {
45+
async deleteBiliCredential(params: {}): Promise<ResponseModel> {
4746
return await client.post("/api/delete_bili_credential", params)
4847
}
4948

5049
/**
5150
* update_bili_credential.
5251
* @param {Object} params 传递给服务器的参数对象。
53-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
52+
* @returns {Promise<ResponseModel>} 操作的响应。
5453
*/
55-
async updateBiliCredential(params: {}): Promise<AxiosResponse<any>> {
54+
async updateBiliCredential(params: {}): Promise<ResponseModel> {
5655
return await client.post("/api/update_bili_credential", params)
5756
}
5857

5958
/**
6059
* get_bili_credential_code.
6160
* @param {Object} params 传递给服务器的参数对象。
62-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
61+
* @returns {Promise<ResponseModel>} 操作的响应。
6362
*/
64-
async getBiliCredentialCode(params: {}): Promise<AxiosResponse<any>> {
63+
async getBiliCredentialCode(params: {}): Promise<ResponseModel> {
6564
return await client.get("/api/get_bili_credential_code", params)
6665
}
6766

6867
/**
6968
* check_qr_code.
7069
* @param {Object} params 传递给服务器的参数对象。
71-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
70+
* @returns {Promise<ResponseModel>} 操作的响应。
7271
*/
73-
async checkQrCode(params: {}): Promise<AxiosResponse<any>> {
72+
async checkQrCode(params: {}): Promise<ResponseModel> {
7473
return await client.get("/api/check_qr_code", params)
7574
}
7675

7776
/**
7877
* get_dy_config.
7978
* @param {Object} params 传递给服务器的参数对象。
80-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
79+
* @returns {Promise<ResponseModel>} 操作的响应。
8180
*/
82-
async getDyConfig(params: {}): Promise<AxiosResponse<any>> {
81+
async getDyConfig(params: {}): Promise<ResponseModel> {
8382
return await client.get("/api/get_dy_config", params)
8483
}
8584

8685
/**
8786
* add_or_update_dy_config.
8887
* @param {Object} params 传递给服务器的参数对象。
89-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
88+
* @returns {Promise<ResponseModel>} 操作的响应。
9089
*/
91-
async addOrUpdateDyConfig(params: {}): Promise<AxiosResponse<any>> {
90+
async addOrUpdateDyConfig(params: {}): Promise<ResponseModel> {
9291
return await client.post("/api/add_or_update_dy_config", params)
9392
}
9493

9594
/**
9695
* get_global_config.
9796
* @param {Object} params 传递给服务器的参数对象。
98-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
97+
* @returns {Promise<ResponseModel>} 操作的响应。
9998
*/
100-
async getGlobalConfig(params: {}): Promise<AxiosResponse<any>> {
99+
async getGlobalConfig(params: {}): Promise<ResponseModel> {
101100
return await client.get("/api/get_global_config", params)
102101
}
103102

104103
/**
105104
* add_or_update_global_config.
106105
* @param {Object} params 传递给服务器的参数对象。
107-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
106+
* @returns {Promise<ResponseModel>} 操作的响应。
108107
*/
109-
async addOrUpdateGlobalConfig(params: {}): Promise<AxiosResponse<any>> {
108+
async addOrUpdateGlobalConfig(params: {}): Promise<ResponseModel> {
110109
return await client.post("/api/add_or_update_global_config", params)
111110
}
112111

113112
/**
114113
* get_history_list.
115114
* @param {Object} params 传递给服务器的参数对象。
116-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
115+
* @returns {Promise<ResponseModel>} 操作的响应。
117116
*/
118-
async getHistoryList(params: {}): Promise<AxiosResponse<any>> {
117+
async getHistoryList(params: {}): Promise<ResponseModel> {
119118
return await client.get("/api/get_history_list", params)
120119
}
121120

122121
/**
123122
* check_update.
124123
* @param {Object} params 传递给服务器的参数对象。
125-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
124+
* @returns {Promise<ResponseModel>} 操作的响应。
126125
*/
127-
async checkUpdate(params: {}): Promise<AxiosResponse<any>> {
126+
async checkUpdate(params: {}): Promise<ResponseModel> {
128127
return await client.get("/api/check_updates", params)
129128
}
130129

131130
/**
132131
* get_playlist_list.
133132
* @param {Object} params 传递给服务器的参数对象。
134-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
133+
* @returns {Promise<ResponseModel>} 操作的响应。
135134
*/
136-
async getPlaylistList(params: {}): Promise<AxiosResponse<any>> {
135+
async getPlaylistList(params: {}): Promise<ResponseModel> {
137136
return await client.get("/api/get_playlist_list", params)
138137
}
139138

140139
/**
141140
* get_playlist.
142141
* @param {Object} params 传递给服务器的参数对象。
143-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
142+
* @returns {Promise<ResponseModel>} 操作的响应。
144143
*/
145-
async getPlaylist(params: {}): Promise<AxiosResponse<any>> {
144+
async getPlaylist(params: {}): Promise<ResponseModel> {
146145
return await client.get("/api/get_playlist", params)
147146
}
148147

149148
/**
150149
* add_or_update_playlist.
151150
* @param {Object} params 传递给服务器的参数对象。
152-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
151+
* @returns {Promise<ResponseModel>} 操作的响应。
153152
*/
154-
async addOrUpdatePlaylist(params: {}): Promise<AxiosResponse<any>> {
153+
async addOrUpdatePlaylist(params: {}): Promise<ResponseModel> {
155154
return await client.post("/api/add_or_update_playlist", params)
156155
}
157156

158157
/**
159158
* delete_playlist.
160159
* @param {Object} params 传递给服务器的参数对象。
161-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
160+
* @returns {Promise<ResponseModel>} 操作的响应。
162161
*/
163-
async deletePlaylist(params: {}): Promise<AxiosResponse<any>> {
162+
async deletePlaylist(params: {}): Promise<ResponseModel> {
164163
return await client.post("/api/delete_playlist", params)
165164
}
166165

167166
/**
168167
* import_playlist.
169168
* @param {Object} params 传递给服务器的参数对象。
170-
* @returns {Promise<AxiosResponse<any>>} 操作的响应。
169+
* @returns {Promise<ResponseModel>} 操作的响应。
171170
*/
172-
async importPlaylist(params: {}): Promise<AxiosResponse<any>> {
171+
async importPlaylist(params: {}): Promise<ResponseModel> {
173172
return await client.post("/api/import_playlist", params)
174173
}
175174

‎frontend/src/components/playlist/addPlaylistDialog.vue‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -53,14 +53,13 @@ const onSubmit = () => {
5353
loading.value = true
5454
baseFormValue.create_time = getNowTimespan()
5555
request.addOrUpdatePlaylist({ data: baseFormValue }).then(response => {
56-
const resp = response.data as ResponseModel
57-
if (resp.code != 0) {
58-
ElMessage.warning(resp.msg)
56+
if (response.code != 0) {
57+
ElMessage.warning(response.msg)
5958
loading.value = false
6059
return
6160
}
62-
ElMessage.success(resp.msg)
63-
baseFormValue.id = resp.data
61+
ElMessage.success(response.msg)
62+
baseFormValue.id = response.data
6463
const result: PlaylistModel = {
6564
id: baseFormValue.id,
6665
song_name: baseFormValue.song_name,

‎frontend/src/components/settings/appSettingTab.vue‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,10 @@ const initConfig = () => {
2323
request
2424
.getGlobalConfig({})
2525
.then(response => {
26-
const resp = response.data as ResponseModel
27-
if (resp.code != 0){
28-
ElMessage.warning(resp.msg || "获取失败")
26+
if (response.code != 0){
27+
ElMessage.warning(response.msg || "获取失败")
2928
}else{
30-
const data = resp.data.data
29+
const data = response.data.data
3130
if(data){
3231
Object.assign(baseFormValue, data)
3332
}
@@ -46,12 +45,11 @@ const addOrUpdateConfig = () => {
4645
request
4746
.addOrUpdateGlobalConfig({ data: baseFormValue })
4847
.then(response => {
49-
const resp = response.data as ResponseModel
50-
if(resp.code != 0){
51-
ElMessage.warning(resp.msg || "保存失败")
48+
if(response.code != 0){
49+
ElMessage.warning(response.msg || "保存失败")
5250
}else{
53-
baseFormValue.id = resp.data
54-
ElMessage.success(resp.msg || "保存成功")
51+
baseFormValue.id = response.data
52+
ElMessage.success(response.msg || "保存成功")
5553
toggleDark(baseFormValue.dark_mode)
5654
themeStore.setDarkTheme(baseFormValue.dark_mode)
5755
}

0 commit comments

Comments
 (0)