feat: 添加注销功能

src/api/login.ts

@@ -156,3 +156,8 @@ export const postResetPasswordAPI = (data: ResetPasswordParams) => {
     data
   });
 };
+
+/**用户注销 */
+export const postUnbscribeAPI = () => {
+  return http.request<null>("post", `/api/unsubscribe`);
+};

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

@@ -5,7 +5,8 @@ defineOptions({
   name: "AccountSafe"
 });
 
-const { handleReset, handlePhone, handleEmail, userInfo } = useUserInfo();
+const { handleReset, handlePhone, handleEmail, userInfo, handleUnsubscribe } =
+  useUserInfo();
 </script>
 
 <template>
@@ -57,6 +58,14 @@ const { handleReset, handlePhone, handleEmail, userInfo } = useUserInfo();
       >
     </div>
     <el-divider />
+    <div class="flex items-center">
+      <div class="flex-1">
+        <p>注销账号</p>
+        <el-text class="mx-1" type="info" />
+      </div>
+      <el-button type="danger" text @click="handleUnsubscribe">注销</el-button>
+    </div>
+    <el-divider />
   </div>
 </template>
 

src/views/account-settings/utils/hooks.tsx

@@ -1,8 +1,14 @@
 import { message } from "@/utils/message";
 import { addDialog } from "@/components/ReDialog";
 import { reactive, ref, onMounted, watch } from "vue";
-import { ElForm, ElFormItem, ElInput, ElProgress } from "element-plus";
-import { getUserInfoAPI } from "@/api/login";
+import {
+  ElForm,
+  ElFormItem,
+  ElInput,
+  ElMessageBox,
+  ElProgress
+} from "element-plus";
+import { getUserInfoAPI, postUnbscribeAPI } from "@/api/login";
 import {
   putUpdateEmailAPI,
   putUpdatePasswordAPI,
@@ -12,6 +18,8 @@ import { isAllEmpty, isEmail, isPhone, storageLocal } from "@pureadmin/utils";
 import { zxcvbn } from "@zxcvbn-ts/core";
 import { setUserInfo, userInfoKey } from "@/utils/auth";
 import type { UserInfo } from "types/system";
+import { transformI18n } from "@/plugins/i18n";
+import { useUserStoreHook } from "@/store/modules/user";
 
 export const useUserInfo = () => {
   /** 密码正则（密码格式应为8-18位数字、字母、符号的任意两种组合） */
@@ -338,11 +346,47 @@ export const useUserInfo = () => {
     });
   };
 
+  /**注销账号 */
+  const handleUnsubscribe = async () => {
+    ElMessageBox.confirm(
+      transformI18n("logout:cancellMessage"),
+      transformI18n("buttons:Cancell"),
+      {
+        confirmButtonText: transformI18n("buttons:Confirm"),
+        cancelButtonText: transformI18n("buttons:Cancel"),
+        type: "warning",
+        center: true
+      }
+    )
+      .then(async () => {
+        const res = await postUnbscribeAPI();
+        if (!res.success) {
+          useUserStoreHook().logOut();
+          message(transformI18n("logout:cancellSuccess"), {
+            type: "success",
+            duration: 1000
+          });
+        } else {
+          message(transformI18n("logout:cancellFail"), {
+            type: "error",
+            duration: 1000
+          });
+        }
+      })
+      .catch(() => {
+        message(transformI18n("logout:cancellCancel"), {
+          type: "info",
+          duration: 1000
+        });
+      });
+  };
+
   return {
     userInfo,
     getUserInfo,
     handleReset,
     handlePhone,
-    handleEmail
+    handleEmail,
+    handleUnsubscribe
   };
 };