feat: 接口增加泛型支持

src/api/axios.ts

@@ -8,14 +8,14 @@ import { redirectErrorPage, getLocalStorage, routerTurnByName, isPreview } from
 import { fetchAllowList } from './axios.config'
 import includes from 'lodash/includes'
 
-export interface MyResponseType {
+export interface MyResponseType<T> {
   code: ResultEnum
-  data: any
+  data: T
   message: string
 }
 
 export interface MyRequestInstance extends Axios {
-  (config: AxiosRequestConfig): Promise<MyResponseType>
+  <T = any>(config: AxiosRequestConfig): Promise<MyResponseType<T>>
 }
 
 const axiosInstance = axios.create({

src/api/http.ts

@@ -9,16 +9,16 @@ import {
 } from '@/enums/httpEnum'
 import type { RequestGlobalConfigType, RequestConfigType } from '@/store/modules/chartEditStore/chartEditStore.d'
 
-export const get = (url: string, params?: object) => {
+export const get = <T = any>(url: string, params?: object) => {
-  return axiosInstance({
+  return axiosInstance<T>({
     url: url,
     method: RequestHttpEnum.GET,
     params: params,
   })
 }
 
-export const post = (url: string, data?: object, headersType?: string) => {
+export const post = <T = any>(url: string, data?: object, headersType?: string) => {
-  return axiosInstance({
+  return axiosInstance<T>({
     url: url,
     method: RequestHttpEnum.POST,
     data: data,
@@ -28,8 +28,8 @@ export const post = (url: string, data?: object, headersType?: string) => {
   })
 }
 
-export const patch = (url: string, data?: object, headersType?: string) => {
+export const patch = <T = any>(url: string, data?: object, headersType?: string) => {
-  return axiosInstance({
+  return axiosInstance<T>({
     url: url,
     method: RequestHttpEnum.PATCH,
     data: data,
@@ -39,8 +39,8 @@ export const patch = (url: string, data?: object, headersType?: string) => {
   })
 }
 
-export const put = (url: string, data?: object, headersType?: ContentTypeEnum) => {
+export const put = <T = any>(url: string, data?: object, headersType?: ContentTypeEnum) => {
-  return axiosInstance({
+  return axiosInstance<T>({
     url: url,
     method: RequestHttpEnum.PUT,
     data: data,
@@ -50,8 +50,8 @@ export const put = (url: string, data?: object, headersType?: ContentTypeEnum) =
   })
 }
 
-export const del = (url: string, params?: object) => {
+export const del = <T = any>(url: string, params?: object) => {
-  return axiosInstance({
+  return axiosInstance<T>({
     url: url,
     method: RequestHttpEnum.DELETE,
     params
@@ -82,11 +82,11 @@ export const http = (type?: RequestHttpEnum) => {
 }
 const prefix = 'javascript:'
 // 对输入字符进行转义处理
-export const translateStr = (target: string | object) => {
+export const translateStr = (target: string | Record<any, any>) => {
   if (typeof target === 'string') {
     if (target.startsWith(prefix)) {
       const funcStr = target.split(prefix)[1]
-      let result;
+      let result
       try {
         result = new Function(`${funcStr}`)()
       } catch (error) {
@@ -100,8 +100,8 @@ export const translateStr = (target: string | object) => {
   }
   for (const key in target) {
     if (Object.prototype.hasOwnProperty.call(target, key)) {
-      const subTarget = (target as any)[key];
+      const subTarget = target[key]
-      (target as any)[key] = translateStr(subTarget)
+      target[key] = translateStr(subTarget)
     }
   }
   return target

src/api/path/project.api.ts

@@ -1,84 +1,98 @@
 import { http } from '@/api/http'
 import { httpErrorHandle } from '@/utils'
 import { ContentTypeEnum, RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEnum'
+import { ProjectItem, ProejctDetail } from './project'
 
 // * 项目列表
 export const projectListApi = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.PROJECT}/list`, data);
+    const res = await http(RequestHttpEnum.GET)<ProjectItem[]>(`${ModuleTypeEnum.PROJECT}/list`, data)
-    return res;
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 新增项目
 export const createProjectApi = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/create`, data);
+    const res = await http(RequestHttpEnum.POST)<{
-    return res;
+      /**
+       * 项目id
+       */
+      id: number
+    }>(`${ModuleTypeEnum.PROJECT}/create`, data)
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 获取项目
 export const fetchProjectApi = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.PROJECT}/getData`, data);
+    const res = await http(RequestHttpEnum.GET)<ProejctDetail>(`${ModuleTypeEnum.PROJECT}/getData`, data)
-    return res;
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 保存项目
 export const saveProjectApi = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/save/data`, data, ContentTypeEnum.FORM_URLENCODED);
+    const res = await http(RequestHttpEnum.POST)(
-    return res;
+      `${ModuleTypeEnum.PROJECT}/save/data`,
+      data,
+      ContentTypeEnum.FORM_URLENCODED
+    )
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 修改项目基础信息
 export const updateProjectApi = async (data: object) => {
   try {
-    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/edit`, data);
+    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/edit`, data)
-    return res;
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
-
 // * 删除项目
 export const deleteProjectApi = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.DELETE)(`${ModuleTypeEnum.PROJECT}/delete`, data);
+    const res = await http(RequestHttpEnum.DELETE)(`${ModuleTypeEnum.PROJECT}/delete`, data)
-    return res;
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 修改发布状态 [-1未发布,1发布]
 export const changeProjectReleaseApi = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.PUT)(`${ModuleTypeEnum.PROJECT}/publish`, data);
+    const res = await http(RequestHttpEnum.PUT)(`${ModuleTypeEnum.PROJECT}/publish`, data)
-    return res;
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 上传文件
 export const uploadFile = async (data: object) => {
-  try { 
+  try {
-    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.PROJECT}/upload`, data, ContentTypeEnum.FORM_DATA);
+    const res = await http(RequestHttpEnum.POST)<{
-    return res;
+      /**
+       * 文件地址
+       */
+      fileName: string
+    }>(`${ModuleTypeEnum.PROJECT}/upload`, data, ContentTypeEnum.FORM_DATA)
+    return res
   } catch {
-    httpErrorHandle();
+    httpErrorHandle()
   }
-}
+}

src/api/path/project.d.ts

@@ -0,0 +1,39 @@
+export type ProjectItem = {
+  /**
+   * 项目 id
+   */
+  id: string
+  /**
+   * 项目名称
+   */
+  projectName: string
+  /**
+   * 项目状态:\
+   * -1: 未发布\
+   * 1: 已发布
+   */
+  state: number
+  /**
+   * 创建时间
+   */
+  createTime: string
+  /**
+   * 预览图片url
+   */
+  indexImage: string
+  /**
+   * 创建者 id
+   */
+  createUserId: string
+  /**
+   * 项目备注
+   */
+  remarks: string
+}
+
+export interface ProejctDetail extends ProjectItem {
+  /**
+   * 项目参数
+   */
+   content: string
+}

src/api/path/system.api.ts

@@ -1,33 +1,39 @@
 import { http } from '@/api/http'
 import { httpErrorHandle } from '@/utils'
 import { RequestHttpEnum, ModuleTypeEnum } from '@/enums/httpEnum'
+import { LoginResult } from './system'
 
 // * 登录
 export const loginApi = async (data: object) => {
   try {
-    const res = await http(RequestHttpEnum.POST)(`${ModuleTypeEnum.SYSTEM}/login`, data);
+    const res = await http(RequestHttpEnum.POST)<LoginResult>(`${ModuleTypeEnum.SYSTEM}/login`, data)
-    return res;
+    return res
-  } catch(err) {
+  } catch (err) {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 登出
 export const logoutApi = async () => {
   try {
-    const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.SYSTEM}/logout`);
+    const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.SYSTEM}/logout`)
-    return res;
+    return res
-  } catch(err) {
+  } catch (err) {
-    httpErrorHandle();
+    httpErrorHandle()
   }
 }
 
 // * 获取 oss 上传接口
 export const ossUrlApi = async (data: object) => {
   try {
-    const res = await http(RequestHttpEnum.GET)(`${ModuleTypeEnum.SYSTEM}/getOssInfo`, data);
+    const res = await http(RequestHttpEnum.GET)<{
-    return res;
+      /**
-  } catch(err) {
+       * bucket 地址
-    httpErrorHandle();
+       */
+      bucketURL?: string
+    }>(`${ModuleTypeEnum.SYSTEM}/getOssInfo`, data)
+    return res
+  } catch (err) {
+    httpErrorHandle()
   }
-}
+}

src/api/path/system.d.ts

@@ -0,0 +1,26 @@
+export interface LoginResult {
+  token: {
+    /**
+     * token 值
+     */
+    tokenValue: string
+    /**
+     * token key
+     */
+    tokenName: string
+  }
+  userinfo: {
+    /**
+     * 昵称
+     */
+    nickname: string
+    /**
+     * 用户名
+     */
+    username: string
+    /**
+     * 用户 id
+     */
+    id: string
+  }
+}

src/views/project/items/components/ProjectItemsList/hooks/useData.hook.ts

@@ -27,11 +27,11 @@ export const useDataListInit = () => {
     const res = await projectListApi({
       page: paginat.page,
       limit: paginat.limit
-    }) as any
+    });
-    if (res.data) {
+    if (res &&res.data) {
-      const { count } = res
+      const { count } = res as any; // 这里的count与data平级，不在Response结构中
       paginat.count = count
-      list.value = res.data.map((e: any) => {
+      list.value = res.data.map((e) => {
         const { id, projectName, state, createTime, indexImage, createUserId } = e
         return {
           id: id,

src/views/project/items/index.d.ts

@@ -1,7 +1,7 @@
 export type Chartype = {
   id: number | string
   title: string // 标题
-  label: string // 标签
+  label?: string // 标签
   time: string, // 时间
   image: string, // 预览图地址
   createId: string, // 创建者