From d1e4b12a25e4511090bc32b2a9c09de1ba9a19ae Mon Sep 17 00:00:00 2001 From: aweikalee Date: Tue, 1 Aug 2023 16:35:43 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=9C=8D=E5=8A=A1=E7=AB=AF?= =?UTF-8?q?=E6=A1=86=E6=9E=B6=E5=8F=98=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/http.ts | 2 +- src/api/moudule/base.ts | 21 +++++- src/api/moudule/bill.ts | 65 +++++++++++-------- src/api/moudule/detail.ts | 8 ++- src/api/moudule/itinerary.ts | 6 +- src/api/moudule/schedule.ts | 12 ++-- src/api/moudule/user.ts | 3 +- src/config.ts | 6 +- src/store/mutations.ts | 1 + src/store/state.ts | 2 + src/views/Bill/Editor.vue | 5 +- src/views/Detail/Editor.vue | 2 +- src/views/Detail/components/FormPosition.vue | 4 +- .../Itinerary/components/FormCurrency.vue | 2 +- .../Itinerary/components/FormPartner.vue | 2 +- src/views/User/Login.vue | 3 +- src/views/index.d.ts | 2 + vue.config.js | 9 ++- 18 files changed, 104 insertions(+), 51 deletions(-) diff --git a/src/api/http.ts b/src/api/http.ts index cdcab4e..bc08f3c 100644 --- a/src/api/http.ts +++ b/src/api/http.ts @@ -43,8 +43,8 @@ const defaultHttpConfig: IHttpBaseConfig = { } export class HttpRequest { + instance!: AxiosInstance private MIN_TIME!: number - private instance!: AxiosInstance constructor( axiosConfig?: AxiosRequestConfig, diff --git a/src/api/moudule/base.ts b/src/api/moudule/base.ts index e1e31ed..663cfaf 100644 --- a/src/api/moudule/base.ts +++ b/src/api/moudule/base.ts @@ -2,15 +2,32 @@ import Vue from 'vue' import { server } from '@/config' import { HttpRequest } from '@/api/http' import { Adapt, IAdaptRuleOption } from '../adapt' +import store from '@/store' const http = new HttpRequest( { baseURL: server.baseUrl, timeout: 0, - withCredentials: true // 携带cookie + withCredentials: true, // 携带cookie }, { - MIN_TIME: 100 + MIN_TIME: 100, + } +) + +http.instance.interceptors.request.use( + /* 请求发送之前 */ + (config) => { + const token = store.state.token + const newToken = token ? 'Bearer ' + token : undefined + config.headers['Authorization'] = newToken + + return config + }, + + /* 发送请求错误时 */ + (error) => { + return Promise.reject(error) } ) diff --git a/src/api/moudule/bill.ts b/src/api/moudule/bill.ts index 42bc2cf..c7988ab 100644 --- a/src/api/moudule/bill.ts +++ b/src/api/moudule/bill.ts @@ -9,7 +9,7 @@ export default class extends ApiBase { update_time: 'timestamp', payer: 'array', participant: 'array', - balance: 'array' + balance: 'array', }) } read(id: number, local = false) { @@ -36,10 +36,13 @@ export default class extends ApiBase { } else { lastUpdate = await db.lastUpdate(pid) timestamp = lastUpdate ? lastUpdate.update_time : -1 - request = this.http.get( - `/bills/${pid}?timestamp=${timestamp}`, - { loading } - ) + request = this.http.get(`/bill`, { + params: { + pid, + timestamp, + }, + loading, + }) } return new Promise((resolve, reject) => { request @@ -47,21 +50,20 @@ export default class extends ApiBase { let dbRequest: Array> = [] if (!local && res) { dbRequest = res.map((item) => { - if (item.state === 0 && item.id) { - return db.delete(item.id) - } else { - if ('payer' in item) { - item.payer.sort() - } - if ('participant' in item) { - item.participant.sort() - } - return db.update(item) + if ('payer' in item) { + item.payer.sort() + } + if ('participant' in item) { + item.participant.sort() } + return db.update(item) }) as any } Promise.all(dbRequest) .then(() => { + res = res + ? res.filter((item) => !item.deletedAt) + : res res = this.adapt(res, true) resolve(res) }) @@ -76,7 +78,7 @@ export default class extends ApiBase { return db.create(data) } else { return this.http.post(`/bill`, data, { - loading + loading, }) } } @@ -86,15 +88,21 @@ export default class extends ApiBase { return db.update(data) } else { return this.http.put(`/bill`, data, { - loading + loading, }) } } createLists(data: IBill[], loading = false, local = false) { data = this.adapt(data) - return this.http.post(`/bills`, data, { - loading - }) + return this.http.post( + `/bill/batch`, + { + bill: data, + }, + { + loading, + } + ) } delete(id: number, loading = false, local = false) { if (local) { @@ -103,11 +111,11 @@ export default class extends ApiBase { return new Promise((reslove, reject) => { this.http .delete(`/bill/${id}`, { - loading + loading, }) .then(() => { db.delete(id) - .then(() => reslove()) + .then(() => reslove(null)) .catch((err) => reject(err)) }) .catch((err) => reject(err)) @@ -122,12 +130,13 @@ export default class extends ApiBase { } else { lastUpdate = await db.lastUpdate(pid) timestamp = lastUpdate ? lastUpdate.update_time : -1 - return this.http.get( - `/bill/${pid}/count?timestamp=${timestamp}`, - { - loading - } - ) + return this.http.get(`/bill/count`, { + params: { + pid, + timestamp, + }, + loading, + }) } } lastUpdate(pid: number) { diff --git a/src/api/moudule/detail.ts b/src/api/moudule/detail.ts index 6779b62..e89d803 100644 --- a/src/api/moudule/detail.ts +++ b/src/api/moudule/detail.ts @@ -23,7 +23,11 @@ export default class extends ApiBase { lists(pid: number) { return new Promise((resolve, reject) => { this.http - .get(`/details/${pid}`) + .get(`/detail`, { + params: { + pid + } + }) .then((res) => { res = this.adapt(res, true) resolve(res) @@ -52,7 +56,7 @@ export default class extends ApiBase { } sort(data: IDetail[], loading = false) { return this.http.patch( - `/details/sort`, + `/detail/sort`, data.map((item) => { return { id: item.id, diff --git a/src/api/moudule/itinerary.ts b/src/api/moudule/itinerary.ts index b1935d6..09c54a0 100644 --- a/src/api/moudule/itinerary.ts +++ b/src/api/moudule/itinerary.ts @@ -32,7 +32,11 @@ export default class extends ApiBase { lists(page: number) { return new Promise((resolve, reject) => { this.http - .get(`/itineraries/${page}`) + .get(`/itinerary`, { + params: { + page + } + }) .then((res) => { res = this.adapt(res, true) resolve(res) diff --git a/src/api/moudule/schedule.ts b/src/api/moudule/schedule.ts index 2817170..1c975db 100644 --- a/src/api/moudule/schedule.ts +++ b/src/api/moudule/schedule.ts @@ -26,10 +26,14 @@ export default class extends ApiBase { } }) } - lists(page: number) { + lists(pid: number) { return new Promise((resolve, reject) => { this.http - .get(`/schedules/${page}`) + .get(`/schedule`, { + params: { + pid + } + }) .then((res) => { res = this.adapt(res, true) resolve(res) @@ -52,13 +56,13 @@ export default class extends ApiBase { }) } delete(id: number, loading = false) { - return this.http.delete(`/itinerary/${id}`, { + return this.http.delete(`/schedule/${id}`, { loading }) } sort(data: ISchedule[], loading = false) { return this.http.patch( - `/schedules/sort`, + `/schedule/sort`, data.map((item) => { return { id: item.id, diff --git a/src/api/moudule/user.ts b/src/api/moudule/user.ts index ec3e345..b926910 100644 --- a/src/api/moudule/user.ts +++ b/src/api/moudule/user.ts @@ -9,6 +9,7 @@ export default class extends ApiBase { return this.http.post<{ username: string nickname: string + token: string }>('/login', { username, password @@ -18,7 +19,7 @@ export default class extends ApiBase { return new Promise((resolve, reject) => { this.http.post('/logout').catch((err) => reject(err)) store.commit('logout') - resolve() + resolve(null) }) } register(data: any) { diff --git a/src/config.ts b/src/config.ts index 4334042..166462e 100644 --- a/src/config.ts +++ b/src/config.ts @@ -1,7 +1,7 @@ import Vue from 'vue' const dev = Vue.config.devtools -const mock = Vue.config.devtools && true // 测试时根据需求修改布尔值 +const mock = Vue.config.devtools && !true // 测试时根据需求修改布尔值 const ossMock = mock || (!mock && true) // 测试时根据需求修改布尔值 const name = process.env.VUE_APP_FILE_SELF // 项目名字 服务器上按项目名对文件进行分类 @@ -17,8 +17,8 @@ const name = process.env.VUE_APP_FILE_SELF // 项目名字 服务器上按项目 export const server = { name, - baseUrl: !dev ? `/${name}/v1` : mock ? `/` : `//127.0.0.1:82/${name}/v1`, - baseRouteUrl: !dev ? `/${name}/#/` : `/#/` + baseUrl: !dev ? `/api` : mock ? `/mock` : `/api`, + baseRouteUrl: `/#/` } export const ossServer = { name, diff --git a/src/store/mutations.ts b/src/store/mutations.ts index 41737ed..269ef99 100644 --- a/src/store/mutations.ts +++ b/src/store/mutations.ts @@ -74,6 +74,7 @@ const mutations: MutationTree = { login(state, payload: IUserInfo) { setState(state, 'username', payload.username, 2592000) setState(state, 'nickname', payload.nickname, 2592000) + setState(state, 'token', payload.token, 2592000) setState(state, 'loggedin', true, 2592000) }, logout(state) { diff --git a/src/store/state.ts b/src/store/state.ts index 166ce24..8a8c6b7 100644 --- a/src/store/state.ts +++ b/src/store/state.ts @@ -19,6 +19,7 @@ export interface ILocalState { time: number value: any }> + token: string username: string nickname: string loggedin: boolean @@ -27,6 +28,7 @@ export interface ILocalState { export const localState: ILocalState = { lastRoute: '', // 记录用户最后浏览的页面 用于PWA打开时能直接打开该页（允许记录的页面有[/, /itinerary/:id, /schedule/:id, /bill/:pid]） drafts: [], + token: '', username: '', nickname: '', loggedin: false, diff --git a/src/views/Bill/Editor.vue b/src/views/Bill/Editor.vue index 912bf7c..af7e210 100644 --- a/src/views/Bill/Editor.vue +++ b/src/views/Bill/Editor.vue @@ -65,7 +65,8 @@ export default class BillEditor extends Vue { balance: [], create_time: 0, update_time: 0, - count: 1 + count: 1, + deletedAt: null } ready = false @@ -193,7 +194,7 @@ export default class BillEditor extends Vue { { this.$store.commit('login', { username: res.username, - nickname: res.nickname + nickname: res.nickname, + token: res.token }) const path = this.$route.path if (res.username === 'test') { diff --git a/src/views/index.d.ts b/src/views/index.d.ts index da6d3df..108b59b 100644 --- a/src/views/index.d.ts +++ b/src/views/index.d.ts @@ -84,6 +84,7 @@ export interface IBill { create_time: number update_time: number count: number + deletedAt: string | null } export interface IConsumptionType { @@ -98,4 +99,5 @@ export interface IUserInfo { username?: string nickname?: string password?: string + token?: string } diff --git a/vue.config.js b/vue.config.js index 4c2baa8..6065bd9 100644 --- a/vue.config.js +++ b/vue.config.js @@ -185,11 +185,18 @@ module.exports = { // }) ] }, + devServer: { + proxy: { + '/api': { + target: 'http://localhost:3000' + } + } + }, chainWebpack: (config) => { /* 拦截请求 返回mock数据 */ config.devServer.set('before', (app) => { app.use( - '/', + '/mock', (req, res, next) => { setTimeout(next, Math.random() * 700 + 100) // 模拟请求响应时间 },