From d615565b50a39100c308b430b6c5ed47f5f7b986 Mon Sep 17 00:00:00 2001 From: KUN1007 Date: Sun, 27 Aug 2023 17:57:59 +0800 Subject: [PATCH] pref: standardized api and interface naming --- src/api.d.ts | 2 +- src/api/edit/index.ts | 8 +- src/api/edit/types/edit.ts | 7 +- src/api/home/index.ts | 12 ++- src/api/home/types/home.ts | 12 +-- src/api/index.ts | 19 +++++ src/api/kungalgamer/index.ts | 4 +- src/api/reply/index.ts | 0 src/api/reply/types/reply.ts | 0 src/api/topic/index.ts | 34 +++++++++ src/api/topic/types/topic.ts | 22 ++++-- src/api/type.ts | 3 - src/api/update-log/index.ts | 6 +- src/api/update-log/types/updateLog.ts | 2 +- src/store/modules/edit.ts | 14 ++-- src/store/modules/home.ts | 7 +- src/store/modules/kungalgamer.ts | 4 +- src/store/modules/topic.ts | 74 ++++++++++++++++--- .../article/components/ArticleContent.vue | 2 +- .../topic/content/KUNGalgameTopicContent.vue | 23 +++++- 20 files changed, 194 insertions(+), 61 deletions(-) create mode 100644 src/api/index.ts delete mode 100644 src/api/reply/index.ts delete mode 100644 src/api/reply/types/reply.ts delete mode 100644 src/api/type.ts diff --git a/src/api.d.ts b/src/api.d.ts index e79e7ccd..23279b07 100644 --- a/src/api.d.ts +++ b/src/api.d.ts @@ -1,4 +1,4 @@ -/** 所有 api 接口的响应数据都应该准守该格式 */ +/** 所有 api 接口的响应数据都为该格式 */ interface KUNGalgameResponseData { code: number message: string diff --git a/src/api/edit/index.ts b/src/api/edit/index.ts index 5cd5872e..5b9466c0 100644 --- a/src/api/edit/index.ts +++ b/src/api/edit/index.ts @@ -5,12 +5,12 @@ const editURLs = { create: `/edit/topic`, } -export async function postNewTopicApi( - newTopicData: Edit.CreateTopicRequestData -): Promise { +export async function postEditNewTopicApi( + newTopicData: Edit.EditCreateTopicRequestData +): Promise { try { // 调用 fetchPost 函数 - const response = await fetchPost( + const response = await fetchPost( editURLs.create, newTopicData ) diff --git a/src/api/edit/types/edit.ts b/src/api/edit/types/edit.ts index 25fc49f6..e42275e8 100644 --- a/src/api/edit/types/edit.ts +++ b/src/api/edit/types/edit.ts @@ -1,4 +1,4 @@ -export interface CreateTopicRequestData { +export interface EditCreateTopicRequestData { title: string content: string time: number @@ -7,7 +7,7 @@ export interface CreateTopicRequestData { uid: string } -export interface KUNGalgameTopic { +export interface EditKUNGalgameTopic { tid: number // title: string // content: string @@ -29,4 +29,5 @@ export interface KUNGalgameTopic { } // 创建话题响应数据的格式 -export type CreateTopicResponseData = KUNGalgameResponseData +export type EditCreateTopicResponseData = + KUNGalgameResponseData diff --git a/src/api/home/index.ts b/src/api/home/index.ts index fb792cce..4229cf30 100644 --- a/src/api/home/index.ts +++ b/src/api/home/index.ts @@ -31,10 +31,12 @@ export async function getHomeTopicApi( } // 首页今日热门话题 -export async function getHomeNavHotTopicApi(): Promise { +export async function getHomeNavHotTopicApi(): Promise { try { // 调用 fetchPost 函数 - const response = await fetchGet(homeURLs.navHot) + const response = await fetchGet( + homeURLs.navHot + ) return response } catch (error) { @@ -45,10 +47,12 @@ export async function getHomeNavHotTopicApi(): Promise { +export async function getHomeNavNewTopicApi(): Promise { try { // 调用 fetchPost 函数 - const response = await fetchGet(homeURLs.navNew) + const response = await fetchGet( + homeURLs.navNew + ) return response } catch (error) { diff --git a/src/api/home/types/home.ts b/src/api/home/types/home.ts index b04fad6f..8fe8fcf4 100644 --- a/src/api/home/types/home.ts +++ b/src/api/home/types/home.ts @@ -1,16 +1,16 @@ -interface UserInfo { +interface HomeUserInfo { uid: number avatar: string name: string } -export interface HotTopic { +export interface HomeHotTopic { tid: number title: string popularity: number } -export interface NewTopic { +export interface HomeNewTopic { tid: number title: string time: number @@ -38,16 +38,16 @@ export interface HomeTopic { tags: Array category: Array popularity: number - uid: UserInfo + uid: HomeUserInfo } // 首页响应数据的格式 // 左侧热门话题 10 个 -export type HotTopicResponseData = KUNGalgameResponseData +export type HomeHotTopicResponseData = KUNGalgameResponseData // 左侧最新话题 10 个 -export type NewTopicResponseData = KUNGalgameResponseData +export type HomeNewTopicResponseData = KUNGalgameResponseData // 中间展示的话题 export type HomeTopicResponseData = KUNGalgameResponseData diff --git a/src/api/index.ts b/src/api/index.ts new file mode 100644 index 00000000..73677634 --- /dev/null +++ b/src/api/index.ts @@ -0,0 +1,19 @@ +/** + * 这里的 interface 及 api 命名需遵循 请求方式 + 文件夹名 + Others 的规范，保证命名不重复 + */ + +// 暴露出所有 interface +export * from './edit/types/edit' +export * from './home/types/home' +export * from './kungalgamer/types/kungalgamer' +export * from './login/types/login' +export * from './topic/types/topic' +export * from './update-log/types/updateLog' + +// 暴露出所有 api +export * from './edit' +export * from './home' +export * from './kungalgamer' +export * from './login' +export * from './topic' +export * from './update-log' diff --git a/src/api/kungalgamer/index.ts b/src/api/kungalgamer/index.ts index 40669cb5..6265543e 100644 --- a/src/api/kungalgamer/index.ts +++ b/src/api/kungalgamer/index.ts @@ -1,9 +1,7 @@ import { KUNGalgamer } from './types/kungalgamer' import { fetchGet } from '@/utils/request' -export async function getSingleKUNGalgamerApi( - id: number -): Promise { +export async function getKUNGalgamerInfoApi(id: number): Promise { try { const url = `/kungalgamer/${id}` diff --git a/src/api/reply/index.ts b/src/api/reply/index.ts deleted file mode 100644 index e69de29b..00000000 diff --git a/src/api/reply/types/reply.ts b/src/api/reply/types/reply.ts deleted file mode 100644 index e69de29b..00000000 diff --git a/src/api/topic/index.ts b/src/api/topic/index.ts index 767e94cc..27669b22 100644 --- a/src/api/topic/index.ts +++ b/src/api/topic/index.ts @@ -3,8 +3,10 @@ import * as Topic from './types/topic' const topicURLs = { getTopicByTid: `/topic/detail`, + getRepliesByPid: `/topic/detail`, } +// 获取单个话题 export async function getTopicByTid( tid: number ): Promise { @@ -19,3 +21,35 @@ export async function getTopicByTid( throw new Error('Failed to fetch topic') } } + +// 根据话题 id 获取话题回复 +export async function getRepliesByPid( + request: Topic.ReplyRequestData +): Promise { + try { + const url = `${topicURLs.getRepliesByPid}/${request.tid}/reply` + + const response = await fetchGet(url) + + return response + } catch (error) { + console.log(error) + throw new Error('Failed to fetch topic') + } +} + +// 获取一个回复下面的评论 +export async function getCommentsByReplyRid( + request: Topic.ReplyRequestData +): Promise { + try { + const url = `${topicURLs.getRepliesByPid}/${request.tid}/reply` + + const response = await fetchGet(url) + + return response + } catch (error) { + console.log(error) + throw new Error('Failed to fetch topic') + } +} diff --git a/src/api/topic/types/topic.ts b/src/api/topic/types/topic.ts index c4fb1d00..cd652e51 100644 --- a/src/api/topic/types/topic.ts +++ b/src/api/topic/types/topic.ts @@ -1,5 +1,5 @@ // 话题主，回复主的信息 -export interface UserInfo { +export interface TopicUserInfo { uid: number name: string avatar: string @@ -7,7 +7,7 @@ export interface UserInfo { } // 被回复的用户信息 -export interface ToUserInfo { +export interface TopicToUserInfo { uid: number name: string } @@ -25,16 +25,25 @@ export interface TopicDetail { upvotes: number tags: string[] edited: number - user: UserInfo + user: TopicUserInfo rid: number[] } +// 回复的请求数据 +export interface TopicReplyRequestData { + tid: number + page?: number + limit?: number + sortField: string + sortOrder: string +} + // 回复的数据 export interface TopicReply { rid: number tid: number - r_user: UserInfo - to_user: ToUserInfo + r_user: TopicUserInfo + to_user: TopicToUserInfo edited: string content: string likes: number @@ -43,6 +52,9 @@ export interface TopicReply { cid: number[] } +// 评论的数据 +export interface TopicComment {} + // 获取单个话题响应数据的格式 export type TopicDetailResponseData = KUNGalgameResponseData diff --git a/src/api/type.ts b/src/api/type.ts deleted file mode 100644 index f8d69abf..00000000 --- a/src/api/type.ts +++ /dev/null @@ -1,3 +0,0 @@ -export * from './kungalgamer/types/kungalgamer' -export * from './topic/types/topic' -export * from './login/types/login' diff --git a/src/api/update-log/index.ts b/src/api/update-log/index.ts index 914fc432..13553ff0 100644 --- a/src/api/update-log/index.ts +++ b/src/api/update-log/index.ts @@ -1,7 +1,7 @@ import { fetchGet } from '@/utils/request' -import { KUNGalgameUpdateLog } from './types/updateLog' +import { UpdateLog } from './types/updateLog' -export async function getUpdateLogApi(): Promise { - return await fetchGet(`/update/logs`) +export async function getUpdateLogApi(): Promise { + return await fetchGet(`/update/logs`) } diff --git a/src/api/update-log/types/updateLog.ts b/src/api/update-log/types/updateLog.ts index d9312db3..2320df37 100644 --- a/src/api/update-log/types/updateLog.ts +++ b/src/api/update-log/types/updateLog.ts @@ -1,5 +1,5 @@ // 更新日志的数据接口 -export interface KUNGalgameUpdateLog { +export interface UpdateLog { // 更新描述 description: string // 更新发布时间 diff --git a/src/store/modules/edit.ts b/src/store/modules/edit.ts index c0ba1ded..8e5bc6d7 100644 --- a/src/store/modules/edit.ts +++ b/src/store/modules/edit.ts @@ -1,10 +1,10 @@ /* 编辑区的 store */ import { defineStore } from 'pinia' -import { postNewTopicApi } from '@/api/edit/index' +import { postEditNewTopicApi } from '@/api/index' import { - CreateTopicRequestData, - CreateTopicResponseData, -} from '@/api/edit/types/edit' + EditCreateTopicRequestData, + EditCreateTopicResponseData, +} from '@/api/index' interface Topic { // 话题标题 @@ -33,10 +33,10 @@ export const useKUNGalgameEditStore = defineStore({ actions: { // 创建话题 createNewTopic( - createTopicRequestData: CreateTopicRequestData - ): Promise { + createTopicRequestData: EditCreateTopicRequestData + ): Promise { return new Promise((resolve, reject) => { - postNewTopicApi(createTopicRequestData) + postEditNewTopicApi(createTopicRequestData) .then((res) => { resolve(res) }) diff --git a/src/store/modules/home.ts b/src/store/modules/home.ts index 0633a27b..09a8728d 100644 --- a/src/store/modules/home.ts +++ b/src/store/modules/home.ts @@ -1,12 +1,9 @@ /* 主页的 store */ import { defineStore } from 'pinia' -import { getHomeTopicApi } from '@/api/home/index' +import { getHomeTopicApi } from '@/api/index' -import { - HomeTopicRequestData, - HomeTopicResponseData, -} from '@/api/home/types/home' +import { HomeTopicRequestData, HomeTopicResponseData } from '@/api/index' interface HomeStore { keywords: string diff --git a/src/store/modules/kungalgamer.ts b/src/store/modules/kungalgamer.ts index 98cffece..2220596d 100644 --- a/src/store/modules/kungalgamer.ts +++ b/src/store/modules/kungalgamer.ts @@ -3,8 +3,8 @@ */ import { defineStore } from 'pinia' import { type Ref, ref } from 'vue' -import { LoginRequestData, LoginResponseData } from '@/api/type' -import { postLoginDataApi } from '@/api/login/index' +import { LoginRequestData, LoginResponseData } from '@/api/index' +import { postLoginDataApi } from '@/api/index' interface UserState { uid: Ref diff --git a/src/store/modules/topic.ts b/src/store/modules/topic.ts index d246dca1..460a5128 100644 --- a/src/store/modules/topic.ts +++ b/src/store/modules/topic.ts @@ -1,22 +1,36 @@ /* 话题详情的 store */ import { defineStore } from 'pinia' -interface Tag { - index: number - name: string +import { getRepliesByPid } from '@/api/index' +import { TopicReplyRequestData, TopicReplyResponseData } from '@/api/index' + +// 回复的缓存 +interface ReplyDraft { + r_uid: number + to_uid: number + content: string + tags: string[] } +// 评论的缓存 +interface CommentDraft { + c_uid: number + to_uid: number + content: string +} + +// 话题页面的 store interface Topic { // 是否正在被编辑 isEdit: boolean // 是否显示高级编辑模式 isShowAdvance: boolean - // 话题标题 - title: string - // 话题内容 - article: string - // 话题标签 - tags: Tag[] + // 回复的缓存 + replyDraft: ReplyDraft + // 获取回复的请求接口格式 + replyRequest: TopicReplyRequestData + // 评论的缓存 + commentDraft: CommentDraft } export const useKUNGalgameTopicStore = defineStore({ @@ -25,8 +39,44 @@ export const useKUNGalgameTopicStore = defineStore({ state: (): Topic => ({ isEdit: false, isShowAdvance: false, - title: '', - article: '', - tags: [], + replyDraft: { + r_uid: 0, + to_uid: 0, + content: '', + tags: [], + }, + replyRequest: { + tid: 0, + page: 0, + limit: 0, + sortField: '', + sortOrder: '', + }, + commentDraft: { + c_uid: 0, + to_uid: 0, + content: '', + }, }), + actions: { + // 获取回复 + getReplies(tid: number): Promise { + return new Promise((resolve, reject) => { + const requestData: TopicReplyRequestData = { + tid: tid, + page: this.replyRequest.page, + limit: this.replyRequest.limit, + sortField: this.replyRequest.sortField, + sortOrder: this.replyRequest.sortOrder, + } + getRepliesByPid(requestData) + .then((res) => { + resolve(res) + }) + .catch((error) => { + reject(error) + }) + }) + }, + }, }) diff --git a/src/views/Home/content/article/components/ArticleContent.vue b/src/views/Home/content/article/components/ArticleContent.vue index 61947090..423f1dd0 100644 --- a/src/views/Home/content/article/components/ArticleContent.vue +++ b/src/views/Home/content/article/components/ArticleContent.vue @@ -2,7 +2,7 @@ import { ref, watch } from 'vue' import SingleTopic from './SingleTopic.vue' -import { HomeTopic } from '@/api/home/types/home' +import { HomeTopic } from '@/api/index' // 导入主页 store import { useKUNGalgameHomeStore } from '@/store/modules/home' diff --git a/src/views/topic/content/KUNGalgameTopicContent.vue b/src/views/topic/content/KUNGalgameTopicContent.vue index 8ad8e891..73eed7eb 100644 --- a/src/views/topic/content/KUNGalgameTopicContent.vue +++ b/src/views/topic/content/KUNGalgameTopicContent.vue @@ -6,13 +6,34 @@ 页面被拆成 3 个大组件，这是话题部分 -->