refactor: 重构API接口响应格式，带来简洁高效的接口设计 (#1256)

src/api/list.ts

@@ -1,7 +1,8 @@
 import { http } from "@/utils/http";
 
 type Result = {
-  success: boolean;
+  code: number;
+  message: string;
   data?: {
     /** 列表数据 */
     list: Array<any>;

src/api/mock.ts

@@ -1,7 +1,8 @@
 import { http } from "@/utils/http";
 
 type Result = {
-  success: boolean;
+  code: number;
+  message: string;
   data: Array<any>;
 };
 

src/api/routes.ts

@@ -1,7 +1,8 @@
 import { http } from "@/utils/http";
 
 type Result = {
-  success: boolean;
+  code: number;
+  message: string;
   data: Array<any>;
 };
 

src/api/system.ts

@@ -1,12 +1,14 @@
 import { http } from "@/utils/http";
 
 type Result = {
-  success: boolean;
+  code: number;
+  message: string;
   data?: Array<any>;
 };
 
 type ResultTable = {
-  success: boolean;
+  code: number;
+  message: string;
   data?: {
     /** 列表数据 */
     list: Array<any>;

src/api/user.ts

@@ -1,7 +1,8 @@
 import { http } from "@/utils/http";
 
 export type UserResult = {
-  success: boolean;
+  code: number;
+  message: string;
   data: {
     /** 头像 */
     avatar: string;
@@ -23,7 +24,8 @@ export type UserResult = {
 };
 
 export type RefreshTokenResult = {
-  success: boolean;
+  code: number;
+  message: string;
   data: {
     /** `token` */
     accessToken: string;
@@ -50,12 +52,14 @@ export type UserInfo = {
 };
 
 export type UserInfoResult = {
-  success: boolean;
+  code: number;
+  message: string;
   data: UserInfo;
 };
 
 type ResultTable = {
-  success: boolean;
+  code: number;
+  message: string;
   data?: {
     /** 列表数据 */
     list: Array<any>;

src/components/ReMap/src/Amap.vue

@@ -92,14 +92,16 @@ onBeforeMount(() => {
 
       // 获取模拟车辆信息
       mapJson()
-        .then(({ data }) => {
-          const points: object = data.map(v => {
-            return {
-              lnglat: [v.lng, v.lat],
-              ...v
-            };
-          });
-          if (MarkerCluster) MarkerCluster.setData(points);
+        .then(({ code, data }) => {
+          if (code === 0) {
+            const points: object = data.map(v => {
+              return {
+                lnglat: [v.lng, v.lat],
+                ...v
+              };
+            });
+            if (MarkerCluster) MarkerCluster.setData(points);
+          }
         })
         .catch(err => {
           console.log("err:", err);

src/router/utils.ts

@@ -209,18 +209,26 @@ function initRouter() {
       });
     } else {
       return new Promise(resolve => {
-        getAsyncRoutes().then(({ data }) => {
-          handleAsyncRoutes(cloneDeep(data));
-          storageLocal().setItem(key, data);
-          resolve(router);
+        getAsyncRoutes().then(({ code, data }) => {
+          if (code === 0) {
+            handleAsyncRoutes(cloneDeep(data));
+            storageLocal().setItem(key, data);
+            resolve(router);
+          } else {
+            resolve(router);
+          }
         });
       });
     }
   } else {
     return new Promise(resolve => {
-      getAsyncRoutes().then(({ data }) => {
-        handleAsyncRoutes(cloneDeep(data));
-        resolve(router);
+      getAsyncRoutes().then(({ code, data }) => {
+        if (code === 0) {
+          handleAsyncRoutes(cloneDeep(data));
+          resolve(router);
+        } else {
+          resolve(router);
+        }
       });
     });
   }

src/store/modules/user.ts

@@ -80,7 +80,7 @@ export const useUserStore = defineStore("pure-user", {
       return new Promise<UserResult>((resolve, reject) => {
         getLogin(data)
           .then(data => {
-            if (data?.success) setToken(data.data);
+            if (data.code === 0) setToken(data.data);
             resolve(data);
           })
           .catch(error => {
@@ -103,7 +103,7 @@ export const useUserStore = defineStore("pure-user", {
       return new Promise<RefreshTokenResult>((resolve, reject) => {
         refreshTokenApi(data)
           .then(data => {
-            if (data) {
+            if (data.code === 0) {
               setToken(data.data);
               resolve(data);
             }

src/views/account-settings/components/Profile.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { reactive, ref } from "vue";
 import { formUpload } from "@/api/mock";
 import { message } from "@/utils/message";
+import { onMounted, reactive, ref } from "vue";
 import { type UserInfo, getMine } from "@/api/user";
 import type { FormInstance, FormRules } from "element-plus";
 import ReCropperPreview from "@/components/ReCropperPreview";
@@ -73,8 +73,8 @@ const handleSubmitImage = () => {
     files: new File([cropperBlob.value], "avatar")
   });
   formUpload(formData)
-    .then(({ success, data }) => {
-      if (success) {
+    .then(({ code }) => {
+      if (code === 0) {
         message("更新头像成功", { type: "success" });
         handleClose();
       } else {
@@ -98,8 +98,11 @@ const onSubmit = async (formEl: FormInstance) => {
   });
 };
 
-getMine().then(res => {
-  Object.assign(userInfos, res.data);
+onMounted(async () => {
+  const { code, data } = await getMine();
+  if (code === 0) {
+    Object.assign(userInfos, data);
+  }
 });
 </script>
 

src/views/account-settings/components/SecurityLog.vue

@@ -55,11 +55,13 @@ const columns: TableColumnList = [
 
 async function onSearch() {
   loading.value = true;
-  const { data } = await getMineLogs();
-  dataList.value = data.list;
-  pagination.total = data.total;
-  pagination.pageSize = data.pageSize;
-  pagination.currentPage = data.currentPage;
+  const { code, data } = await getMineLogs();
+  if (code === 0) {
+    dataList.value = data.list;
+    pagination.total = data.total;
+    pagination.pageSize = data.pageSize;
+    pagination.currentPage = data.currentPage;
+  }
 
   setTimeout(() => {
     loading.value = false;

src/views/account-settings/index.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { getMine } from "@/api/user";
 import { useRouter } from "vue-router";
-import { ref, onBeforeMount } from "vue";
 import { ReText } from "@/components/ReText";
 import Profile from "./components/Profile.vue";
+import { ref, onMounted, onBeforeMount } from "vue";
 import Preferences from "./components/Preferences.vue";
 import SecurityLog from "./components/SecurityLog.vue";
 import { useGlobal, deviceDetection } from "@pureadmin/utils";
@@ -61,8 +61,11 @@ const panes = [
 ];
 const witchPane = ref("profile");
 
-getMine().then(res => {
-  userInfo.value = res.data;
+onMounted(async () => {
+  const { code, data } = await getMine();
+  if (code === 0) {
+    userInfo.value = data;
+  }
 });
 </script>
 

src/views/components/upload/form.vue

@@ -23,8 +23,8 @@ const submitForm = formEl => {
         date: validateForm.date // 别的字段
       });
       formUpload(formData)
-        .then(({ success }) => {
-          if (success) {
+        .then(({ code }) => {
+          if (code === 0) {
             message("提交成功", { type: "success" });
           } else {
             message("提交失败");

src/views/list/card/index.vue

@@ -38,12 +38,14 @@ const dataLoading = ref(true);
 
 const getCardListData = async () => {
   try {
-    const { data } = await getCardList();
-    productList.value = data.list;
-    pagination.value = {
-      ...pagination.value,
-      total: data.list.length
-    };
+    const { code, data } = await getCardList();
+    if (code === 0) {
+      productList.value = data.list;
+      pagination.value = {
+        ...pagination.value,
+        total: data.list.length
+      };
+    }
   } catch (e) {
     console.log(e);
   } finally {

src/views/login/index.vue

@@ -74,7 +74,7 @@ const onLogin = async (formEl: FormInstance | undefined) => {
           password: ruleForm.password
         })
         .then(res => {
-          if (res.success) {
+          if (res.code === 0) {
             // 获取后端路由
             return initRouter().then(() => {
               disabled.value = true;

src/views/monitor/logs/login/hook.tsx

@@ -129,11 +129,13 @@ export function useRole(tableRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getLoginLogsList(toRaw(form));
-    dataList.value = data.list;
-    pagination.total = data.total;
-    pagination.pageSize = data.pageSize;
-    pagination.currentPage = data.currentPage;
+    const { code, data } = await getLoginLogsList(toRaw(form));
+    if (code === 0) {
+      dataList.value = data.list;
+      pagination.total = data.total;
+      pagination.pageSize = data.pageSize;
+      pagination.currentPage = data.currentPage;
+    }
 
     setTimeout(() => {
       loading.value = false;

src/views/monitor/logs/operation/hook.tsx

@@ -134,11 +134,13 @@ export function useRole(tableRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getOperationLogsList(toRaw(form));
-    dataList.value = data.list;
-    pagination.total = data.total;
-    pagination.pageSize = data.pageSize;
-    pagination.currentPage = data.currentPage;
+    const { code, data } = await getOperationLogsList(toRaw(form));
+    if (code === 0) {
+      dataList.value = data.list;
+      pagination.total = data.total;
+      pagination.pageSize = data.pageSize;
+      pagination.currentPage = data.currentPage;
+    }
 
     setTimeout(() => {
       loading.value = false;

src/views/monitor/logs/system/hook.tsx

@@ -204,11 +204,13 @@ export function useRole(tableRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getSystemLogsList(toRaw(form));
-    dataList.value = data.list;
-    pagination.total = data.total;
-    pagination.pageSize = data.pageSize;
-    pagination.currentPage = data.currentPage;
+    const { code, data } = await getSystemLogsList(toRaw(form));
+    if (code === 0) {
+      dataList.value = data.list;
+      pagination.total = data.total;
+      pagination.pageSize = data.pageSize;
+      pagination.currentPage = data.currentPage;
+    }
 
     setTimeout(() => {
       loading.value = false;

src/views/monitor/online/hook.tsx

@@ -80,11 +80,13 @@ export function useRole() {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getOnlineLogsList(toRaw(form));
-    dataList.value = data.list;
-    pagination.total = data.total;
-    pagination.pageSize = data.pageSize;
-    pagination.currentPage = data.currentPage;
+    const { code, data } = await getOnlineLogsList(toRaw(form));
+    if (code === 0) {
+      dataList.value = data.list;
+      pagination.total = data.total;
+      pagination.pageSize = data.pageSize;
+      pagination.currentPage = data.currentPage;
+    }
 
     setTimeout(() => {
       loading.value = false;

src/views/permission/page/index.vue

@@ -33,7 +33,7 @@ function onChange() {
   useUserStoreHook()
     .loginByUsername({ username: username.value, password: "admin123" })
     .then(res => {
-      if (res.success) {
+      if (res.code === 0) {
         storageLocal().removeItem("async-routes");
         usePermissionStoreHook().clearAllCachePage();
         initRouter();

src/views/system/dept/utils/hook.tsx

@@ -74,17 +74,20 @@ export function useDept() {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getDeptList(); // 这里是返回一维数组结构，前端自行处理成树结构，返回格式要求：唯一id加父节点parentId，parentId取父节点id
-    let newData = data;
-    if (!isAllEmpty(form.name)) {
-      // 前端搜索部门名称
-      newData = newData.filter(item => item.name.includes(form.name));
+    const { code, data } = await getDeptList(); // 这里是返回一维数组结构，前端自行处理成树结构，返回格式要求：唯一id加父节点parentId，parentId取父节点id
+    if (code === 0) {
+      let newData = data;
+      if (!isAllEmpty(form.name)) {
+        // 前端搜索部门名称
+        newData = newData.filter(item => item.name.includes(form.name));
+      }
+      if (!isAllEmpty(form.status)) {
+        // 前端搜索状态
+        newData = newData.filter(item => item.status === form.status);
+      }
+      dataList.value = handleTree(newData); // 处理成树结构
     }
-    if (!isAllEmpty(form.status)) {
-      // 前端搜索状态
-      newData = newData.filter(item => item.status === form.status);
-    }
-    dataList.value = handleTree(newData); // 处理成树结构
+
     setTimeout(() => {
       loading.value = false;
     }, 500);

src/views/system/menu/utils/hook.tsx

@@ -106,15 +106,18 @@ export function useMenu() {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getMenuList(); // 这里是返回一维数组结构，前端自行处理成树结构，返回格式要求：唯一id加父节点parentId，parentId取父节点id
-    let newData = data;
-    if (!isAllEmpty(form.title)) {
-      // 前端搜索菜单名称
-      newData = newData.filter(item =>
-        transformI18n(item.title).includes(form.title)
-      );
+    const { code, data } = await getMenuList(); // 这里是返回一维数组结构，前端自行处理成树结构，返回格式要求：唯一id加父节点parentId，parentId取父节点id
+    if (code === 0) {
+      let newData = data;
+      if (!isAllEmpty(form.title)) {
+        // 前端搜索菜单名称
+        newData = newData.filter(item =>
+          transformI18n(item.title).includes(form.title)
+        );
+      }
+      dataList.value = handleTree(newData); // 处理成树结构
     }
-    dataList.value = handleTree(newData); // 处理成树结构
+
     setTimeout(() => {
       loading.value = false;
     }, 500);

src/views/system/role/utils/hook.tsx

@@ -163,11 +163,13 @@ export function useRole(treeRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getRoleList(toRaw(form));
-    dataList.value = data.list;
-    pagination.total = data.total;
-    pagination.pageSize = data.pageSize;
-    pagination.currentPage = data.currentPage;
+    const { code, data } = await getRoleList(toRaw(form));
+    if (code === 0) {
+      dataList.value = data.list;
+      pagination.total = data.total;
+      pagination.pageSize = data.pageSize;
+      pagination.currentPage = data.currentPage;
+    }
 
     setTimeout(() => {
       loading.value = false;
@@ -229,8 +231,10 @@ export function useRole(treeRef: Ref) {
     if (id) {
       curRow.value = row;
       isShow.value = true;
-      const { data } = await getRoleMenuIds({ id });
-      treeRef.value.setCheckedKeys(data);
+      const { code, data } = await getRoleMenuIds({ id });
+      if (code === 0) {
+        treeRef.value.setCheckedKeys(data);
+      }
     } else {
       curRow.value = null;
       isShow.value = false;
@@ -268,9 +272,11 @@ export function useRole(treeRef: Ref) {
 
   onMounted(async () => {
     onSearch();
-    const { data } = await getRoleMenu();
-    treeIds.value = getKeyList(data, "id");
-    treeData.value = handleTree(data);
+    const { code, data } = await getRoleMenu();
+    if (code === 0) {
+      treeIds.value = getKeyList(data, "id");
+      treeData.value = handleTree(data);
+    }
   });
 
   watch(isExpandAll, val => {

src/views/system/user/utils/hook.tsx

@@ -272,11 +272,13 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getUserList(toRaw(form));
-    dataList.value = data.list;
-    pagination.total = data.total;
-    pagination.pageSize = data.pageSize;
-    pagination.currentPage = data.currentPage;
+    const { code, data } = await getUserList(toRaw(form));
+    if (code === 0) {
+      dataList.value = data.list;
+      pagination.total = data.total;
+      pagination.pageSize = data.pageSize;
+      pagination.currentPage = data.currentPage;
+    }
 
     setTimeout(() => {
       loading.value = false;
@@ -497,13 +499,16 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
     onSearch();
 
     // 归属部门
-    const { data } = await getDeptList();
-    higherDeptOptions.value = handleTree(data);
-    treeData.value = handleTree(data);
+    const { code, data } = await getDeptList();
+    if (code === 0) {
+      higherDeptOptions.value = handleTree(data);
+      treeData.value = handleTree(data);
+    }
+
     treeLoading.value = false;
 
     // 角色列表
-    roleOptions.value = (await getAllRoleList()).data;
+    roleOptions.value = (await getAllRoleList()).data ?? [];
   });
 
   return {