diff --git a/src/views/activities/NewYearView.vue b/_deprecated/activities/NewYearView.vue
similarity index 91%
rename from src/views/activities/NewYearView.vue
rename to _deprecated/activities/NewYearView.vue
index 629bdd7..853e79f 100644
--- a/src/views/activities/NewYearView.vue
+++ b/_deprecated/activities/NewYearView.vue
@@ -34,10 +34,12 @@
 
 <script setup>
 import { ref } from 'vue'
-import { sendErrorDialog, sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
-import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar'
-import { get } from '@/utils/request'
-import userData from '@/utils/stores/userData/store'
+import Message from '@/utils/dialog.js'
+import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar.js'
+import { get } from '@/utils/request.js'
+import userData from '@/utils/stores/userData/store.js'
+
+const message = new Message()
 
 const commentList = ref([])
 const formRef = ref(null)
@@ -59,7 +61,7 @@ function timestampToTime(timestamp) {
 function submitComment() {
   startLoadingBar()
   if (newYear.value.comment === '') {
-    sendErrorDialog('内容不可为空！')
+    message.warning('内容不可为空！')
     finishLoadingBar()
     return
   }
diff --git a/src/views/activities/PrizeView.vue b/_deprecated/activities/PrizeView.vue
similarity index 97%
rename from src/views/activities/PrizeView.vue
rename to _deprecated/activities/PrizeView.vue
index d9fed55..781c193 100644
--- a/src/views/activities/PrizeView.vue
+++ b/_deprecated/activities/PrizeView.vue
@@ -46,10 +46,10 @@
 
 <script setup>
 import { ref } from 'vue'
-import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
-import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar'
-import { get } from '@/utils/request'
-import userData from '@/utils/stores/userData/store'
+import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog.js'
+import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar.js'
+import { get } from '@/utils/request.js'
+import userData from '@/utils/stores/userData/store.js'
 import { marked } from 'marked'
 
 const prizesList = ref([
diff --git a/package.json b/package.json
index bbeb6da..227f7a0 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "locyanfrp",
   "private": true,
-  "version": "2.3",
+  "version": "2.4",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -10,11 +10,11 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
+    "@vicons/fa": "^0.12.0",
+    "@vicons/fluent": "^0.12.0",
     "@vicons/ionicons4": "^0.12.0",
     "@vicons/ionicons5": "^0.12.0",
     "@vicons/material": "^0.12.0",
-    "@vicons/fa": "^0.12.0",
-    "@vicons/fluent": "^0.12.0",
     "axios": "^1.7.7",
     "highlight.js": "^11.10.0",
     "js-cookie": "^3.0.5",
@@ -33,6 +33,7 @@
     "vue-native-websocket": "^2.0.15",
     "vue-route": "^1.5.1",
     "vue-router": "^4.4.5",
+    "vue-turnstile": "^1.0.11",
     "vuex": "^4.1.0"
   },
   "devDependencies": {
diff --git a/src/App.vue b/src/App.vue
index 8f90ffa..dec3d53 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -7,7 +7,7 @@
             <the-message />
             <loading-bar />
             <the-dialog />
-            <notification />
+            <the-notification />
             <n-layout v-show="loading">
               <n-el class="load-container">
                 <n-spin></n-spin>
@@ -57,7 +57,7 @@ import {
   NNotificationProvider,
   useOsTheme
 } from 'naive-ui'
-import Notification from '@components/TheNotification.vue'
+import TheNotification from '@components/TheNotification.vue'
 import TheFooter from '@components/TheFooter.vue'
 import TheHeader from '@components/TheHeader.vue'
 import UserInfo from '@components/UserInfo.vue'
@@ -73,11 +73,13 @@ import hljs from 'highlight.js/lib/core'
 import ini from 'highlight.js/lib/languages/ini'
 import nginx from 'highlight.js/lib/languages/nginx'
 import api from '@/api'
-import { sendWarningMessage } from '@/utils/message'
+import Notification from '@/utils/notification'
 import { logout } from '@/utils/profile'
 import router from '@router'
 import { useRoute, useRouter } from 'vue-router'
 
+const notification = new Notification()
+
 // 手机状态下收缩菜单栏
 const collapsed = ref(true)
 if (document.body.clientWidth >= 1000) {
@@ -121,9 +123,9 @@ vRouter.afterEach(() => {
 async function fetchUserInfo() {
   let rs
   try {
-    rs = await api.v2.user.info.root.get(userData.getters.get_username)
+    rs = await api.v2.user.info.root.get(userData.getters.get_user_id)
   } catch (e) {
-    sendWarningMessage('查询用户信息失败: ' + e + '，请重新登录后台！')
+    notification.warning('查询用户信息失败', e + '，请重新登录后台！')
   }
   if (!rs) return
   if (rs.status === 200) {
@@ -142,7 +144,7 @@ async function fetchUserInfo() {
     return true
   }
   if (rs.status === 401) {
-    sendWarningMessage('登录过期或未登录，请重新登录后台！')
+    notification.warning('授权失效', '请重新登录后台！')
     logout()
   }
   return false
@@ -151,6 +153,11 @@ async function fetchUserInfo() {
 watch(
   () => route.meta,
   (value) => {
+    if (value.noSidebar) {
+      showMainSidebar.value = false
+      showGuestSidebar.value = false
+      return
+    }
     if (value.needLogin) {
       showMainSidebar.value = true
       showGuestSidebar.value = false
diff --git a/src/api/base.ts b/src/api/base.ts
index 36b15ce..780ec62 100644
--- a/src/api/base.ts
+++ b/src/api/base.ts
@@ -1,7 +1,7 @@
 const base = {
   api_v1_url: 'https://api.locyanfrp.cn',
-  api_v2_url: 'https://api-v2.locyanfrp.cn/api/v2',
-  // api_v2_url: 'http://localhost:18080/api/v2',
+  // api_v2_url: 'https://api-v2.locyanfrp.cn/api/v2',
+  api_v2_url: 'http://localhost:18080/api/v2',
   buildResponse: (res: any, useDataPath: boolean = true) => {
     const message =
       res.data?.message ??
diff --git a/src/api/index.ts b/src/api/index.ts
index 242338f..9d64fa4 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -1,8 +1,6 @@
-import v1 from './v1'
 import v2 from './v2'
 
 const api = {
-  v1: v1,
   v2: v2
 }
 
diff --git a/src/api/v1/Account/EditEmail.ts b/src/api/v1/Account/EditEmail.ts
deleted file mode 100644
index 1ac60c4..0000000
--- a/src/api/v1/Account/EditEmail.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-const EditEmail = async (username: string, token: string, email: string, code: string) => {
-  const rs = await get(`${base.api_v1_url}/Account/EditEmail`, {
-    username: username,
-    token: token,
-    email: email,
-    code: code
-  })
-  return base.buildResponse(rs, false)
-}
-
-export default EditEmail
diff --git a/src/api/v1/Account/SendEditMail.ts b/src/api/v1/Account/SendEditMail.ts
deleted file mode 100644
index 90c0aa3..0000000
--- a/src/api/v1/Account/SendEditMail.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-const SendEditMail = async (username: string, token: string, email: string) => {
-  const rs = await get(`${base.api_v1_url}/Account/SendEditMail`, {
-    username: username,
-    token: token,
-    email: email
-  })
-  return base.buildResponse(rs, false)
-}
-
-export default SendEditMail
diff --git a/src/api/v1/Account/index.ts b/src/api/v1/Account/index.ts
deleted file mode 100644
index c23ce48..0000000
--- a/src/api/v1/Account/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import EditEmail from './EditEmail'
-import SendEditMail from './SendEditMail'
-
-export default {
-  EditEmail: EditEmail,
-  SendEditMail: SendEditMail
-}
diff --git a/src/api/v1/App/GetBroadCast.ts b/src/api/v1/App/GetBroadCast.ts
deleted file mode 100644
index 86b799a..0000000
--- a/src/api/v1/App/GetBroadCast.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 获取公告
- * @returns {
- *   status: int,
- *   data: {
- *      broadcast: string
- *   }
- * }
- */
-const GetBroadCast = async () => {
-  const rs = await get(`${base.api_v1_url}/App/GetBroadCast`, {})
-  return base.buildResponse(rs, false)
-}
-
-export default GetBroadCast
diff --git a/src/api/v1/App/GetCSApp.ts b/src/api/v1/App/GetCSApp.ts
deleted file mode 100644
index ac6e53f..0000000
--- a/src/api/v1/App/GetCSApp.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 获取公告
- * @returns {
- *   status: int,
- *   data: {
- *      url: string,
- *      name: string,
- *   }
- * }
- */
-const GetCSApp = async () => {
-  const rs = await get(`${base.api_v1_url}/App/GetCSApp`, {})
-  return base.buildResponse(rs, false)
-}
-
-export default GetCSApp
diff --git a/src/api/v1/App/_root.ts b/src/api/v1/App/_root.ts
deleted file mode 100644
index a4f7f75..0000000
--- a/src/api/v1/App/_root.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 获取通知
- * @returns {
- *   status: int,
- *   data: {
- *      ads: string,
- *      content: string
- *   }
- * }
- */
-const root = async () => {
-  const rs = await get(`${base.api_v1_url}/App`, {})
-  return base.buildResponse(rs, false)
-}
-
-export default root
diff --git a/src/api/v1/App/index.ts b/src/api/v1/App/index.ts
deleted file mode 100644
index 0906172..0000000
--- a/src/api/v1/App/index.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import root from './_root'
-import GetBroadCast from './GetBroadCast'
-import GetCSApp from './GetCSApp'
-
-export default {
-  root: root,
-  GetBroadCast: GetBroadCast,
-  GetCSApp: GetCSApp
-}
diff --git a/src/api/v1/Donate/GetDonateInfo.ts b/src/api/v1/Donate/GetDonateInfo.ts
deleted file mode 100644
index 7b6748f..0000000
--- a/src/api/v1/Donate/GetDonateInfo.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 列出赞助列表
- */
-const GetDonateInfo = async (trade_no: string) => {
-  const rs = get(`${base.api_v1_url}/Donate/GetDonateInfo`, {
-    trade_no: trade_no
-  })
-  return base.buildResponse(await rs, false)
-}
-
-export default GetDonateInfo
diff --git a/src/api/v1/Donate/GetDonateList.ts b/src/api/v1/Donate/GetDonateList.ts
deleted file mode 100644
index ef9a8b5..0000000
--- a/src/api/v1/Donate/GetDonateList.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 列出赞助列表
- */
-const GetDonateList = async () => {
-  const rs = get(`${base.api_v1_url}/Donate/GetDonateList`, {})
-  return base.buildResponse(await rs, false)
-}
-
-export default GetDonateList
diff --git a/src/api/v1/Donate/SetMessage.ts b/src/api/v1/Donate/SetMessage.ts
deleted file mode 100644
index f9a3cdb..0000000
--- a/src/api/v1/Donate/SetMessage.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 列出赞助列表
- */
-const SetMessage = async (username: string, token: string, trade_no: string, message: string) => {
-  const rs = get(`${base.api_v1_url}/Donate/SetMessage`, {
-    username: username,
-    token: token,
-    trade_no: trade_no,
-    message: message
-  })
-  return base.buildResponse(await rs, false)
-}
-
-export default SetMessage
diff --git a/src/api/v1/Donate/index.ts b/src/api/v1/Donate/index.ts
deleted file mode 100644
index 246d872..0000000
--- a/src/api/v1/Donate/index.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import GetDonateInfo from './GetDonateInfo'
-import GetDonateList from './GetDonateList'
-import SetMessage from './SetMessage'
-
-export default {
-  GetDonateList: GetDonateList,
-  GetDonateInfo: GetDonateInfo,
-  SetMessage: SetMessage
-}
diff --git a/src/api/v1/Proxies/GetConfigFile.ts b/src/api/v1/Proxies/GetConfigFile.ts
deleted file mode 100644
index 51c443d..0000000
--- a/src/api/v1/Proxies/GetConfigFile.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-const GetConfigFile = async (username: string, token: string, node_id: number) => {
-  const rs = get(`${base.api_v1_url}/Proxies/GetConfigFile`, {
-    username: username,
-    token: token,
-    node: node_id
-  })
-  return base.buildResponse(await rs, false)
-}
-
-export default GetConfigFile
diff --git a/src/api/v1/Proxies/GetRandomPort.ts b/src/api/v1/Proxies/GetRandomPort.ts
deleted file mode 100644
index 384be6e..0000000
--- a/src/api/v1/Proxies/GetRandomPort.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 获取随机端口
- * @returns {
- *   status: int,
- *   data: {
- *      port: string
- *   }
- * }
- */
-const GetRandomPort = async (id: number) => {
-  const rs = await get(`${base.api_v1_url}/Proxies/GetRandomPort`, {
-    id: id
-  })
-  return base.buildResponse(rs, false)
-}
-
-export default GetRandomPort
diff --git a/src/api/v1/Proxies/index.ts b/src/api/v1/Proxies/index.ts
deleted file mode 100644
index c59fce4..0000000
--- a/src/api/v1/Proxies/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import GetConfigFile from './GetConfigFile'
-import GetRandomPort from './GetRandomPort'
-
-export default {
-  GetRandomPort: GetRandomPort,
-  GetConfigFile: GetConfigFile
-}
diff --git a/src/api/v1/User/DoResetPassowrdEmailSend.ts b/src/api/v1/User/DoResetPassowrdEmailSend.ts
deleted file mode 100644
index 16e23b0..0000000
--- a/src/api/v1/User/DoResetPassowrdEmailSend.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-/**
- * 发送重置密码邮件
- */
-const DoResetPasswordEmailSend = async (username: string) => {
-  // 2024-09-06 Muska_Ami: 怎么有人把 Password 打成 Passowrd，害的我还在想为什么 API 404
-  const rs = get(`${base.api_v1_url}/User/DoResetPassowrdEmailSend`, {
-    username: username
-  })
-  return base.buildResponse(await rs, false)
-}
-
-export default DoResetPasswordEmailSend
diff --git a/src/api/v1/User/DoResetPassword.ts b/src/api/v1/User/DoResetPassword.ts
deleted file mode 100644
index cf5892f..0000000
--- a/src/api/v1/User/DoResetPassword.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import base from '@/api/base'
-//@ts-ignore
-import { get } from '@/utils/request'
-
-const DoResetPassword = async (password: string, confirm: string, code: string) => {
-  const rs = get(`${base.api_v1_url}/User/DoResetPassword`, {
-    password: password,
-    confirm: confirm,
-    code: code
-  })
-  return base.buildResponse(await rs, false)
-}
-
-export default DoResetPassword
diff --git a/src/api/v1/User/index.ts b/src/api/v1/User/index.ts
deleted file mode 100644
index 55ffd3c..0000000
--- a/src/api/v1/User/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import DoResetPasswordEmailSend from './DoResetPassowrdEmailSend'
-import DoResetPassword from './DoResetPassword'
-
-export default {
-  DoResetPassword: DoResetPassword,
-  DoResetPasswordEmailSend: DoResetPasswordEmailSend
-}
diff --git a/src/api/v1/index.ts b/src/api/v1/index.ts
deleted file mode 100644
index 6d8fa23..0000000
--- a/src/api/v1/index.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import Account from './Account'
-import App from './App'
-import Donate from './Donate'
-import Proxies from './Proxies'
-import User from './User'
-
-export default {
-  App: App,
-  Account: Account,
-  Proxies: Proxies,
-  Donate: Donate,
-  User: User
-}
diff --git a/src/api/v2/app/all.api.ts b/src/api/v2/app/all.api.ts
new file mode 100644
index 0000000..dd9b463
--- /dev/null
+++ b/src/api/v2/app/all.api.ts
@@ -0,0 +1,12 @@
+//@ts-ignore
+import { get } from '@/utils/request'
+import base from '@/api/base'
+
+const all = async (user_id: number) => {
+  const rs = get(`${base.api_v2_url}/app/all`, {
+    user_id: user_id
+  })
+  return base.buildResponse(await rs)
+}
+
+export default all
diff --git a/src/api/v2/app/index.ts b/src/api/v2/app/index.ts
new file mode 100644
index 0000000..c7f7fbc
--- /dev/null
+++ b/src/api/v2/app/index.ts
@@ -0,0 +1,11 @@
+import root from './root.api'
+import info from './info.api'
+import update from './update.api'
+import all from './all.api'
+
+export default {
+  root: root,
+  info: info,
+  update: update,
+  all: all
+}
diff --git a/src/api/v2/app/info.api.ts b/src/api/v2/app/info.api.ts
new file mode 100644
index 0000000..0819d0f
--- /dev/null
+++ b/src/api/v2/app/info.api.ts
@@ -0,0 +1,13 @@
+//@ts-ignore
+import { get } from '@/utils/request'
+import base from '@/api/base'
+
+const info = async (user_id: number, app_id: number) => {
+  const rs = get(`${base.api_v2_url}/app/info`, {
+    user_id: user_id,
+    app_id: app_id
+  })
+  return base.buildResponse(await rs)
+}
+
+export default info
diff --git a/src/api/v2/app/root.api.ts b/src/api/v2/app/root.api.ts
new file mode 100644
index 0000000..2d0b2c7
--- /dev/null
+++ b/src/api/v2/app/root.api.ts
@@ -0,0 +1,33 @@
+import base from '@/api/base'
+//@ts-ignore
+import { post, deleteReq } from '@/utils/request'
+
+const postApp = async (
+  user_id: number,
+  app_name: string,
+  app_description: string | null,
+  redirect_url: string
+) => {
+  const rs = post(`${base.api_v2_url}/app`, {
+    user_id: user_id,
+    app_name: app_name,
+    app_description: app_description,
+    redirect_url: redirect_url
+  })
+  return base.buildResponse(await rs)
+}
+
+const deleteApp = async (user_id: number, app_id: number) => {
+  const rs = deleteReq(`${base.api_v2_url}/app`, {
+    user_id: user_id,
+    app_id: app_id
+  })
+  return base.buildResponse(await rs)
+}
+
+const root = {
+  post: postApp,
+  delete: deleteApp
+}
+
+export default root
diff --git a/src/api/v2/app/update.api.ts b/src/api/v2/app/update.api.ts
new file mode 100644
index 0000000..c344a91
--- /dev/null
+++ b/src/api/v2/app/update.api.ts
@@ -0,0 +1,22 @@
+//@ts-ignore
+import { post } from '@/utils/request'
+import base from '@/api/base'
+
+const update = async (
+  user_id: number,
+  app_id: number,
+  app_name: string,
+  app_description: string | null,
+  redirect_url: string | null
+) => {
+  const rs = post(`${base.api_v2_url}/app/update`, {
+    user_id: user_id,
+    app_id: app_id,
+    app_name: app_name,
+    app_description: app_description,
+    redirect_url: redirect_url
+  })
+  return base.buildResponse(await rs)
+}
+
+export default update
diff --git a/src/api/v2/auth/login.api.ts b/src/api/v2/auth/login.api.ts
index 01748d2..5dd35d5 100644
--- a/src/api/v2/auth/login.api.ts
+++ b/src/api/v2/auth/login.api.ts
@@ -2,10 +2,11 @@
 import { post } from '@/utils/request'
 import base from '@/api/base'
 
-const login = async (username: string, password: string) => {
+const login = async (username: number, password: string, captcha_response_token: string) => {
   const rs = post(`${base.api_v2_url}/auth/login`, {
     username: username,
-    password: password
+    password: password,
+    captcha_response_token: captcha_response_token
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/auth/oauth/authorize.api.ts b/src/api/v2/auth/oauth/authorize.api.ts
new file mode 100644
index 0000000..866a396
--- /dev/null
+++ b/src/api/v2/auth/oauth/authorize.api.ts
@@ -0,0 +1,20 @@
+//@ts-ignore
+import { post } from '@/utils/request'
+import base from '@/api/base'
+
+const authorize = async (
+  user_id: number,
+  app_id: number,
+  redirect_url: string,
+  request_permission_ids: Array<number>
+) => {
+  const rs = post(`${base.api_v2_url}/auth/oauth/authorize`, {
+    user_id: user_id,
+    app_id: app_id,
+    redirect_url: redirect_url,
+    request_permission_ids: request_permission_ids
+  })
+  return base.buildResponse(await rs)
+}
+
+export default authorize
diff --git a/src/api/v2/auth/oauth/index.ts b/src/api/v2/auth/oauth/index.ts
index 2d2eb78..de12ff9 100644
--- a/src/api/v2/auth/oauth/index.ts
+++ b/src/api/v2/auth/oauth/index.ts
@@ -1,5 +1,9 @@
 import qq from './qq'
+import permission from './permission'
+import authorize from './authorize.api'
 
 export default {
-  qq: qq
+  qq: qq,
+  permission: permission,
+  authorize: authorize
 }
diff --git a/src/api/v2/auth/oauth/permission/all.api.ts b/src/api/v2/auth/oauth/permission/all.api.ts
new file mode 100644
index 0000000..90575b7
--- /dev/null
+++ b/src/api/v2/auth/oauth/permission/all.api.ts
@@ -0,0 +1,12 @@
+//@ts-ignore
+import { get } from '@/utils/request'
+import base from '@/api/base'
+
+const all = async (user_id: number) => {
+  const rs = get(`${base.api_v2_url}/auth/oauth/permission/all`, {
+    user_id: user_id
+  })
+  return base.buildResponse(await rs)
+}
+
+export default all
diff --git a/src/api/v2/auth/oauth/permission/index.ts b/src/api/v2/auth/oauth/permission/index.ts
new file mode 100644
index 0000000..b597983
--- /dev/null
+++ b/src/api/v2/auth/oauth/permission/index.ts
@@ -0,0 +1,5 @@
+import all from './all.api'
+
+export default {
+  all: all
+}
diff --git a/src/api/v2/auth/oauth/qq/bind.api.ts b/src/api/v2/auth/oauth/qq/bind.api.ts
index 57ed743..a8bd9af 100644
--- a/src/api/v2/auth/oauth/qq/bind.api.ts
+++ b/src/api/v2/auth/oauth/qq/bind.api.ts
@@ -2,24 +2,24 @@ import base from '@/api/base'
 //@ts-ignore
 import { get, post, deleteReq } from '@/utils/request'
 
-const getBind = async (username: string) => {
+const getBind = async (user_id: number) => {
   const rs = await get(`${base.api_v2_url}/auth/oauth/qq/bind`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
 
-const postBind = async (username: string, code: string) => {
+const postBind = async (user_id: number, code: string) => {
   const rs = await post(`${base.api_v2_url}/auth/oauth/qq/bind`, {
-    username: username,
+    user_id: user_id,
     code: code
   })
   return base.buildResponse(rs)
 }
 
-const deleteBind = async (username: string) => {
+const deleteBind = async (user_id: number) => {
   const rs = await deleteReq(`${base.api_v2_url}/auth/oauth/qq/bind`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
diff --git a/src/api/v2/donate/index.ts b/src/api/v2/donate/index.ts
index 7f9b0d6..35f53b1 100644
--- a/src/api/v2/donate/index.ts
+++ b/src/api/v2/donate/index.ts
@@ -1,9 +1,11 @@
 import root from './root.api'
 import list from './list.api'
+import info from './info.api'
 import say from './say'
 
 export default {
   root: root,
   list: list,
+  info: info,
   say: say
 }
diff --git a/src/api/v2/donate/info.api.ts b/src/api/v2/donate/info.api.ts
new file mode 100644
index 0000000..84ceca5
--- /dev/null
+++ b/src/api/v2/donate/info.api.ts
@@ -0,0 +1,16 @@
+import base from '@/api/base'
+//@ts-ignore
+import { get } from '@/utils/request'
+
+/**
+ * 获取捐赠订单信息
+ */
+const list = async (user_id: number, trade_no: string) => {
+  const rs = get(`${base.api_v2_url}/donate/info`, {
+    user_id: user_id,
+    trade_no: trade_no
+  })
+  return base.buildResponse(await rs)
+}
+
+export default list
diff --git a/src/api/v2/donate/list.api.ts b/src/api/v2/donate/list.api.ts
index f1cb42e..2eb242e 100644
--- a/src/api/v2/donate/list.api.ts
+++ b/src/api/v2/donate/list.api.ts
@@ -5,9 +5,9 @@ import { get } from '@/utils/request'
 /**
  * 列出赞助列表
  */
-const list = async (username: number) => {
+const list = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/donate/list`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/donate/root.api.ts b/src/api/v2/donate/root.api.ts
index 38cd948..fd2a946 100644
--- a/src/api/v2/donate/root.api.ts
+++ b/src/api/v2/donate/root.api.ts
@@ -5,9 +5,9 @@ import { post } from '@/utils/request'
 /**
  * 创建赞助订单
  */
-const postDonate = async (username: string, money: string) => {
+const postDonate = async (user_id: number, money: string) => {
   const rs = post(`${base.api_v2_url}/donate`, {
-    username: username,
+    user_id: user_id,
     money: money
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/donate/say/all.api.ts b/src/api/v2/donate/say/all.api.ts
index 041746e..faf1504 100644
--- a/src/api/v2/donate/say/all.api.ts
+++ b/src/api/v2/donate/say/all.api.ts
@@ -2,12 +2,12 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const all = async (username: string | undefined) => {
+const all = async (user_id: number | undefined) => {
   const rs = get(
     `${base.api_v2_url}/donate/say/all`,
-    username
+    user_id
       ? {
-          username: username
+          user_id: user_id
         }
       : null
   )
diff --git a/src/api/v2/donate/say/root.api.ts b/src/api/v2/donate/say/root.api.ts
index bd3c5f3..5f421be 100644
--- a/src/api/v2/donate/say/root.api.ts
+++ b/src/api/v2/donate/say/root.api.ts
@@ -5,9 +5,9 @@ import { post } from '@/utils/request'
 /**
  * 列出赞助列表
  */
-const postSay = async (username: number, trade_no: string, message: string) => {
+const postSay = async (user_id: number, trade_no: string, message: string) => {
   const rs = post(`${base.api_v2_url}/donate/say`, {
-    username: username,
+    user_id: user_id,
     trade_no: trade_no,
     message: message
   })
diff --git a/src/api/v2/email/email.api.ts b/src/api/v2/email/email.api.ts
index c718901..da78a9f 100644
--- a/src/api/v2/email/email.api.ts
+++ b/src/api/v2/email/email.api.ts
@@ -2,9 +2,9 @@
 import { get } from '@/utils/request'
 import base from '@/api/base'
 
-const email = async (username: string, email: string) => {
+const email = async (user_id: number, email: string) => {
   const rs = get(`${base.api_v2_url}/email/email`, {
-    username: username,
+    user_id: user_id,
     email: email
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/email/password.api.ts b/src/api/v2/email/password.api.ts
index e7a1d77..eed5714 100644
--- a/src/api/v2/email/password.api.ts
+++ b/src/api/v2/email/password.api.ts
@@ -2,9 +2,9 @@
 import { get } from '@/utils/request'
 import base from '@/api/base'
 
-const password = async (username: string) => {
+const password = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/email/password`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/icp.api.ts b/src/api/v2/icp.api.ts
index deb00ad..edefc46 100644
--- a/src/api/v2/icp.api.ts
+++ b/src/api/v2/icp.api.ts
@@ -5,17 +5,17 @@ import { get, post, deleteReq } from '@/utils/request'
 /**
  * 审核 ICP 备案域名
  */
-const postIcp = async (username: string, domain: string) => {
+const postIcp = async (user_id: number, domain: string) => {
   const rs = post(`${base.api_v2_url}/icp`, {
-    username: username,
+    user_id: user_id,
     domain: domain
   })
   return base.buildResponse(await rs)
 }
 
-const deleteIcp = async (username: string, domain_id: number) => {
+const deleteIcp = async (user_id: number, domain_id: number) => {
   const rs = deleteReq(`${base.api_v2_url}/icp`, {
-    username: username,
+    user_id: user_id,
     id: domain_id
   })
   return base.buildResponse(await rs)
@@ -24,9 +24,9 @@ const deleteIcp = async (username: string, domain_id: number) => {
 /**
  * 列出已审核 ICP 备案域名
  */
-const getIcp = async (username: string) => {
+const getIcp = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/icp`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/index.ts b/src/api/v2/index.ts
index 9fcfa46..aee516d 100644
--- a/src/api/v2/index.ts
+++ b/src/api/v2/index.ts
@@ -9,6 +9,7 @@ import user from './user'
 import email from './email'
 import notice from './notice'
 import minecraft from './minecraft'
+import app from './app'
 
 export default {
   user: user,
@@ -21,5 +22,6 @@ export default {
   sign: sign,
   icp: icp,
   notice: notice,
-  minecraft: minecraft
+  minecraft: minecraft,
+  app: app
 }
diff --git a/src/api/v2/minecraft/game/all.api.ts b/src/api/v2/minecraft/game/all.api.ts
index d1919d2..e6ef171 100644
--- a/src/api/v2/minecraft/game/all.api.ts
+++ b/src/api/v2/minecraft/game/all.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const all = async (username: string) => {
+const all = async (user_id: number) => {
   const rs = await get(`${base.api_v2_url}/minecraft/game/all`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
diff --git a/src/api/v2/minecraft/game/root.api.ts b/src/api/v2/minecraft/game/root.api.ts
index 0c8d093..cdaaa0a 100644
--- a/src/api/v2/minecraft/game/root.api.ts
+++ b/src/api/v2/minecraft/game/root.api.ts
@@ -2,17 +2,17 @@ import base from '@/api/base'
 //@ts-ignore
 import { post, deleteReq } from '@/utils/request'
 
-const postGame = async (username: string, proxy_id: number) => {
+const postGame = async (user_id: number, proxy_id: number) => {
   const rs = await post(`${base.api_v2_url}/minecraft/game`, {
-    username: username,
+    user_id: user_id,
     proxy_id: proxy_id
   })
   return base.buildResponse(await rs)
 }
 
-const deleteGame = async (username: string, code: number) => {
+const deleteGame = async (user_id: number, code: number) => {
   const rs = await deleteReq(`${base.api_v2_url}/minecraft/game`, {
-    username: username,
+    user_id: user_id,
     code: code
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/node/all.api.ts b/src/api/v2/node/all.api.ts
index efcbc41..a4b2059 100644
--- a/src/api/v2/node/all.api.ts
+++ b/src/api/v2/node/all.api.ts
@@ -2,8 +2,10 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const all = async () => {
-  const rs = get(`${base.api_v2_url}/node/all`, {})
+const all = async (user_id: number) => {
+  const rs = get(`${base.api_v2_url}/node/all`, {
+    user_id: user_id
+  })
   return base.buildResponse(await rs)
 }
 
diff --git a/src/api/v2/node/index.ts b/src/api/v2/node/index.ts
index b597983..bb895da 100644
--- a/src/api/v2/node/index.ts
+++ b/src/api/v2/node/index.ts
@@ -1,5 +1,7 @@
 import all from './all.api'
+import port from './port'
 
 export default {
-  all: all
+  all: all,
+  port: port
 }
diff --git a/src/api/v2/node/port/index.ts b/src/api/v2/node/port/index.ts
new file mode 100644
index 0000000..d3fd61b
--- /dev/null
+++ b/src/api/v2/node/port/index.ts
@@ -0,0 +1,5 @@
+import random from './random.api'
+
+export default {
+  random: random
+}
diff --git a/src/api/v2/node/port/random.api.ts b/src/api/v2/node/port/random.api.ts
new file mode 100644
index 0000000..fbaf054
--- /dev/null
+++ b/src/api/v2/node/port/random.api.ts
@@ -0,0 +1,13 @@
+import base from '@/api/base'
+//@ts-ignore
+import { get } from '@/utils/request'
+
+const random = async (user_id: number, node_id: number) => {
+  const rs = get(`${base.api_v2_url}/node/port/random`, {
+    user_id: user_id,
+    node_id: node_id
+  })
+  return base.buildResponse(await rs)
+}
+
+export default random
diff --git a/src/api/v2/notice/content.api.ts b/src/api/v2/notice/content.api.ts
index 16dbca9..9165c29 100644
--- a/src/api/v2/notice/content.api.ts
+++ b/src/api/v2/notice/content.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const content = async (username: string, token: string) => {
+const content = async (user_id: number, token: string) => {
   const rs = get(`${base.api_v2_url}/notice/content`, {
-    username: username,
+    user_id: user_id,
     token: token
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/proxy/all.api.ts b/src/api/v2/proxy/all.api.ts
index ba85330..f64f63e 100644
--- a/src/api/v2/proxy/all.api.ts
+++ b/src/api/v2/proxy/all.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const list = async (username: string) => {
+const list = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/proxy/all`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/proxy/config.api.ts b/src/api/v2/proxy/config.api.ts
index 4dac83b..192db61 100644
--- a/src/api/v2/proxy/config.api.ts
+++ b/src/api/v2/proxy/config.api.ts
@@ -5,9 +5,9 @@ import { get } from '@/utils/request'
 /**
  * 获取单个隧道配置文件
  */
-const config = async (username: string, proxy_id: number, node_id: number) => {
+const config = async (user_id: number, proxy_id: number, node_id: number) => {
   const rs = get(`${base.api_v2_url}/proxy/config`, {
-    username: username,
+    user_id: user_id,
     proxy_id: proxy_id,
     node_id: node_id
   })
diff --git a/src/api/v2/proxy/down.api.ts b/src/api/v2/proxy/down.api.ts
index 0c21a78..224d337 100644
--- a/src/api/v2/proxy/down.api.ts
+++ b/src/api/v2/proxy/down.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { post } from '@/utils/request'
 
-const down = async (username: string, proxy_id: string) => {
+const down = async (user_id: number, proxy_id: string) => {
   const rs = post(`${base.api_v2_url}/proxy/down`, {
-    username: username,
+    user_id: user_id,
     proxy_id: proxy_id
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/proxy/root.api.ts b/src/api/v2/proxy/root.api.ts
index 90b57ae..bcc20f6 100644
--- a/src/api/v2/proxy/root.api.ts
+++ b/src/api/v2/proxy/root.api.ts
@@ -3,7 +3,7 @@ import base from '@/api/base'
 import { post, deleteReq } from '@/utils/request'
 
 const postProxy = async (
-  username: string,
+  user_id: number,
   name: string,
   local_ip: string,
   type: string,
@@ -16,7 +16,7 @@ const postProxy = async (
   domain: string
 ) => {
   const rs = post(`${base.api_v2_url}/proxy`, {
-    username: username,
+    user_id: user_id,
     name: name,
     local_ip: local_ip,
     type: type,
@@ -31,9 +31,9 @@ const postProxy = async (
   return base.buildResponse(await rs)
 }
 
-const deleteProxy = async (username: string, proxy_id: number) => {
+const deleteProxy = async (user_id: number, proxy_id: number) => {
   const rs = deleteReq(`${base.api_v2_url}/proxy`, {
-    username: username,
+    user_id: user_id,
     proxy_id: proxy_id
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/proxy/update.api.ts b/src/api/v2/proxy/update.api.ts
index 5f09d08..cca67b5 100644
--- a/src/api/v2/proxy/update.api.ts
+++ b/src/api/v2/proxy/update.api.ts
@@ -3,7 +3,7 @@ import base from '@/api/base'
 import { post } from '@/utils/request'
 
 const update = async (
-  username: string,
+  user_id: number,
   proxy_id: number,
   proxy_name: string,
   proxy_type: string,
@@ -17,7 +17,7 @@ const update = async (
   secret_key: string
 ) => {
   const rs = post(`${base.api_v2_url}/proxy/update`, {
-    username: username,
+    user_id: user_id,
     proxy_id: proxy_id,
     proxy_type: proxy_type,
     proxy_name: proxy_name,
diff --git a/src/api/v2/sign.api.ts b/src/api/v2/sign.api.ts
index 4e3540d..143f175 100644
--- a/src/api/v2/sign.api.ts
+++ b/src/api/v2/sign.api.ts
@@ -2,16 +2,16 @@ import base from '@/api/base'
 //@ts-ignore
 import { get, post } from '@/utils/request'
 
-const getSign = async (username: string) => {
+const getSign = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/sign`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
 
-const postSign = async (username: string) => {
+const postSign = async (user_id: number) => {
   const rs = post(`${base.api_v2_url}/sign`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/user/email.api.ts b/src/api/v2/user/email.api.ts
new file mode 100644
index 0000000..40c9077
--- /dev/null
+++ b/src/api/v2/user/email.api.ts
@@ -0,0 +1,13 @@
+import base from '@/api/base'
+//@ts-ignore
+import { post } from '@/utils/request'
+
+const password = async (user_id: number, verify_code: string) => {
+  const rs = await post(`${base.api_v2_url}/user/email`, {
+    user_id: user_id,
+    verify_code: verify_code
+  })
+  return base.buildResponse(rs)
+}
+
+export default password
diff --git a/src/api/v2/user/frp/token.api.ts b/src/api/v2/user/frp/token.api.ts
index 0db065f..2baa80e 100644
--- a/src/api/v2/user/frp/token.api.ts
+++ b/src/api/v2/user/frp/token.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { post } from '@/utils/request'
 
-const token = async (username: string) => {
+const token = async (user_id: number) => {
   const rs = await post(`${base.api_v2_url}/user/frp/token`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
diff --git a/src/api/v2/user/index.ts b/src/api/v2/user/index.ts
index d60047a..f16d15b 100644
--- a/src/api/v2/user/index.ts
+++ b/src/api/v2/user/index.ts
@@ -3,11 +3,13 @@ import info from './info'
 import password from './password.api'
 import token from './token'
 import traffic from './traffic.api'
+import email from './email.api'
 
 export default {
   info: info,
   token: token,
   password: password,
   traffic: traffic,
-  frp: frp
+  frp: frp,
+  email: email
 }
diff --git a/src/api/v2/user/info/qq.api.ts b/src/api/v2/user/info/qq.api.ts
index ef7c5bd..a4311c2 100644
--- a/src/api/v2/user/info/qq.api.ts
+++ b/src/api/v2/user/info/qq.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const qq = async (username: string) => {
+const qq = async (user_id: number) => {
   const rs = await get(`${base.api_v2_url}/user/info/qq`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
diff --git a/src/api/v2/user/info/root.api.ts b/src/api/v2/user/info/root.api.ts
index cf7b03d..514fe6e 100644
--- a/src/api/v2/user/info/root.api.ts
+++ b/src/api/v2/user/info/root.api.ts
@@ -2,9 +2,9 @@
 import { get } from '@/utils/request'
 import base from '@/api/base'
 
-const getInfo = async (username: string) => {
+const getInfo = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/user/info`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/user/password.api.ts b/src/api/v2/user/password.api.ts
index 177f375..d6e0c19 100644
--- a/src/api/v2/user/password.api.ts
+++ b/src/api/v2/user/password.api.ts
@@ -3,13 +3,13 @@ import base from '@/api/base'
 import { post } from '@/utils/request'
 
 const password = async (
-  username: string,
+  user_id: number,
   old_password: string | undefined,
   new_password: string,
   verify_code: string | undefined
 ) => {
   const rs = await post(`${base.api_v2_url}/user/password`, {
-    username: username,
+    user_id: user_id,
     old_password: old_password,
     new_password: new_password,
     verify_code: verify_code
diff --git a/src/api/v2/user/token/all.api.ts b/src/api/v2/user/token/all.api.ts
index e6658c8..f2fb923 100644
--- a/src/api/v2/user/token/all.api.ts
+++ b/src/api/v2/user/token/all.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { deleteReq } from '@/utils/request'
 
-const all = async (username: string) => {
+const all = async (user_id: number) => {
   const rs = await deleteReq(`${base.api_v2_url}/user/token/all`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
diff --git a/src/api/v2/user/token/root.api.ts b/src/api/v2/user/token/root.api.ts
index 533e993..429d307 100644
--- a/src/api/v2/user/token/root.api.ts
+++ b/src/api/v2/user/token/root.api.ts
@@ -2,16 +2,16 @@
 import { get, deleteReq } from '@/utils/request'
 import base from '@/api/base'
 
-const getToken = async (username: string) => {
+const getToken = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/user/token`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
 
-const deleteToken = async (username: string) => {
+const deleteToken = async (user_id: number) => {
   const rs = deleteReq(`${base.api_v2_url}/user/token`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/user/traffic.api.ts b/src/api/v2/user/traffic.api.ts
index 696468c..1e82239 100644
--- a/src/api/v2/user/traffic.api.ts
+++ b/src/api/v2/user/traffic.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { post } from '@/utils/request'
 
-const traffic = async (username: string) => {
+const traffic = async (user_id: number) => {
   const rs = await post(`${base.api_v2_url}/user/traffic`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(rs)
 }
diff --git a/src/api/v2/verification/realname.api.ts b/src/api/v2/verification/realname.api.ts
index 52d7956..167654b 100644
--- a/src/api/v2/verification/realname.api.ts
+++ b/src/api/v2/verification/realname.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { post } from '@/utils/request'
 
-const realname = async (username: string, name: string, id_card: string) => {
+const realname = async (user_id: number, name: string, id_card: string) => {
   const rs = post(`${base.api_v2_url}/verification/realname`, {
-    username: username,
+    user_id: user_id,
     name: name,
     id_card: id_card
   })
diff --git a/src/api/v2/verification/realperson/pay.api.ts b/src/api/v2/verification/realperson/pay.api.ts
index 8de50cf..e4a9ccb 100644
--- a/src/api/v2/verification/realperson/pay.api.ts
+++ b/src/api/v2/verification/realperson/pay.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const pay = async (username: string) => {
+const pay = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/verification/realperson/pay`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/api/v2/verification/realperson/query.api.ts b/src/api/v2/verification/realperson/query.api.ts
index 84a8177..e4e19df 100644
--- a/src/api/v2/verification/realperson/query.api.ts
+++ b/src/api/v2/verification/realperson/query.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const query = async (username: string, certify_id: string) => {
+const query = async (user_id: number, certify_id: string) => {
   const rs = get(`${base.api_v2_url}/verification/realperson/query`, {
-    username: username,
+    user_id: user_id,
     certify_id: certify_id
   })
   return base.buildResponse(await rs)
diff --git a/src/api/v2/verification/realperson/root.api.ts b/src/api/v2/verification/realperson/root.api.ts
index 3c4a399..d670dad 100644
--- a/src/api/v2/verification/realperson/root.api.ts
+++ b/src/api/v2/verification/realperson/root.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { post } from '@/utils/request'
 
-const postRealperson = async (username: string, name: string, id_card: string) => {
+const postRealperson = async (user_id: number, name: string, id_card: string) => {
   const rs = post(`${base.api_v2_url}/verification/realperson`, {
-    username: username,
+    user_id: user_id,
     name: name,
     id_card: id_card
   })
diff --git a/src/api/v2/verification/root.api.ts b/src/api/v2/verification/root.api.ts
index 9ff5bf9..3805e24 100644
--- a/src/api/v2/verification/root.api.ts
+++ b/src/api/v2/verification/root.api.ts
@@ -2,9 +2,9 @@ import base from '@/api/base'
 //@ts-ignore
 import { get } from '@/utils/request'
 
-const getVerification = async (username: string) => {
+const getVerification = async (user_id: number) => {
   const rs = get(`${base.api_v2_url}/verification`, {
-    username: username
+    user_id: user_id
   })
   return base.buildResponse(await rs)
 }
diff --git a/src/components/TheHeader.vue b/src/components/TheHeader.vue
index 3c9e279..a056106 100644
--- a/src/components/TheHeader.vue
+++ b/src/components/TheHeader.vue
@@ -53,7 +53,7 @@ import { changeUserInfoShow } from '@components/UserInfo.vue'
 
 const avatar = ref('')
 const announcementHtml = ref('')
-const showAnnouncement = ref(false)
+let showAnnouncement = ref(false)
 
 avatar.value = userData.getters.get_avatar
 
diff --git a/src/components/UserInfo.vue b/src/components/UserInfo.vue
index ad3737f..8a4ca85 100644
--- a/src/components/UserInfo.vue
+++ b/src/components/UserInfo.vue
@@ -92,20 +92,24 @@
 <script setup>
 import { logout } from '@/utils/profile'
 import userData from '@/utils/stores/userData/store'
-import { sendErrorMessage, sendSuccessMessage } from '@/utils/message'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
+import Notification from '@/utils/notification'
 import { onMounted, ref } from 'vue'
-import { useDialog, useLoadingBar, useMessage } from 'naive-ui'
+import { useLoadingBar } from 'naive-ui'
 import api from '@/api'
 import logger from '@/utils/logger'
 import router from '@router'
 
+const message = new Message()
+const dialog = new Dialog()
+const notification = new Notification()
+
 const dialogWidth = ref('30vw')
 const ldb = useLoadingBar()
-const message = useMessage()
 const binding = ref(false)
 const resetFrpTokenLoading = ref(false)
 const exitAllDevicesLoading = ref(false)
-const dialog = useDialog()
 if (document.body.clientWidth <= 800) {
   dialogWidth.value = '75vw'
 }
@@ -142,7 +146,7 @@ onMounted(async () => {
   if (userData.getters.get_token !== '') {
     let rs
     try {
-      rs = await api.v2.user.info.qq(userData.getters.get_username)
+      rs = await api.v2.user.info.qq(userData.getters.get_user_id)
     } catch (e) {
       logger.error(e)
       bindQQ.value.isDisable = true
@@ -160,7 +164,7 @@ onMounted(async () => {
       bindQQ.value.unBindDisable = true
       bindQQ.value.unBindMsg = '尚未绑定'
     } else {
-      sendErrorMessage('获取 QQ 绑定状态失败: ' + rs.message)
+      message.error('获取 QQ 绑定状态失败: ' + rs.message)
     }
   }
 })
@@ -168,7 +172,6 @@ onMounted(async () => {
 async function changeEmail() {
   if (tEmail.value.isEditDisable) {
     tEmail.value.isEditDisable = false
-    tEmail.value.isEditDisable1 = ref('')
     tEmail.value.msg = '确认'
   } else if (!tEmail.value.isEditDisable) {
     //换绑
@@ -176,12 +179,7 @@ async function changeEmail() {
     let rs
     ldb.start()
     try {
-      rs = await api.v1.Account.EditEmail(
-        userData.getters.get_username,
-        userData.getters.get_token,
-        tEmail.value.email,
-        tEmail.value.verify.code
-      )
+      rs = await api.v2.user.email(userData.getters.get_user_id, tEmail.value.verify.code)
     } catch (e) {
       logger.error(e)
       message.error('请求换绑失败: ' + e)
@@ -193,7 +191,7 @@ async function changeEmail() {
       ldb.error()
       return
     }
-    if (rs.status) {
+    if (rs.status === 200) {
       message.success(rs.message)
       tEmail.value.isEditDisable = true
       tEmail.value.isBtnDisable = false
@@ -214,7 +212,7 @@ async function sendChangeEmailCode() {
   ldb.start()
   let rs
   try {
-    rs = await api.v2.email.email(userData.getters.get_username, tEmail.value.email)
+    rs = await api.v2.email.email(userData.getters.get_user_id, tEmail.value.email)
   } catch (e) {
     logger.error(e)
     message.error('请求邮件验证码失败: ' + e)
@@ -240,7 +238,7 @@ async function doBindQQ() {
   binding.value = true
   let rs
   try {
-    rs = await api.v2.auth.oauth.qq.bind.get(userData.getters.get_username)
+    rs = await api.v2.auth.oauth.qq.bind.get(userData.getters.get_user_id)
   } catch (e) {
     logger.error(e)
     message.error('请求失败: ' + e)
@@ -256,7 +254,7 @@ async function unBindQQ() {
   binding.value = true
   let rs
   try {
-    rs = await api.v2.auth.oauth.qq.bind.delete(userData.getters.get_username)
+    rs = await api.v2.auth.oauth.qq.bind.delete(userData.getters.get_user_id)
   } catch (e) {
     logger.error(e)
     binding.value = false
@@ -291,7 +289,7 @@ async function unBindQQ() {
 function doLogOut() {
   changeUserInfoShow(false)
   logout()
-  sendSuccessMessage('您已登出，感谢您的使用！')
+  notification.success('已登出', '感谢您的使用！')
   router.push({ name: 'Login' })
 }
 
@@ -303,13 +301,13 @@ async function changePassword() {
     return
   }
   const data = {
-    username: userData.getters.get_username,
+    user_id: userData.getters.get_user_id,
     oldPassword: tPassword.value.oldPassword,
     newPassword: tPassword.value.newPassword
   }
   let rs
   try {
-    rs = await api.v2.user.password(data.username, data.oldPassword, data.newPassword, undefined)
+    rs = await api.v2.user.password(data.user_id, data.oldPassword, data.newPassword, undefined)
   } catch (e) {
     logger.error(e)
     tPassword.value.isLoading = false
@@ -318,7 +316,7 @@ async function changePassword() {
   if (!rs) return
   if (rs.status === 200) {
     tPassword.value.isLoading = false
-    sendSuccessMessage('修改成功')
+    message.success('修改成功')
     doLogOut()
   } else {
     tPassword.value.isLoading = false
@@ -327,22 +325,16 @@ async function changePassword() {
 }
 
 async function resetFrpToken() {
-  resetFrpTokenLoading.value = true
-
   const data = {
-    username: userData.getters.get_username
+    user_id: userData.getters.get_user_id
   }
 
-  dialog.warning({
-    title: '警告',
-    content: '你确定要重置访问密钥吗? 该操作不可逆',
-    positiveText: '确定',
-    negativeText: '取消',
-    maskClosable: false,
+  dialog.warning('你确定要重置访问密钥吗? 该操作不可逆', {
     onPositiveClick: async () => {
+      resetFrpTokenLoading.value = true
       let rs
       try {
-        rs = await api.v2.user.frp.token(data.username)
+        rs = await api.v2.user.frp.token(data.user_id)
       } catch (e) {
         logger.error(e)
         resetFrpTokenLoading.value = false
@@ -352,35 +344,26 @@ async function resetFrpToken() {
       if (rs.status === 200) {
         resetFrpTokenLoading.value = false
         userData.commit('set_frp_token', rs.data.frp_token)
-        sendSuccessMessage('重置成功')
+        message.success('重置成功')
       } else {
         resetFrpTokenLoading.value = false
         message.error('重置失败, 后端返回: ' + rs.message)
       }
-    },
-    onNegativeClick: () => {
-      resetFrpTokenLoading.value = false
     }
   })
 }
 
 async function exitAllDevices() {
-  exitAllDevicesLoading.value = true
-
   const data = {
-    username: userData.getters.get_username
+    user_id: userData.getters.get_user_id
   }
 
-  dialog.warning({
-    title: '警告',
-    content: '你确定要登出全部设备吗, 所有登录将会失效',
-    positiveText: '确定',
-    negativeText: '取消',
-    maskClosable: false,
+  dialog.warning('你确定要登出全部设备吗, 所有登录将会失效', {
     onPositiveClick: async () => {
+      exitAllDevicesLoading.value = true
       let rs
       try {
-        rs = await api.v2.user.token.all(data.username)
+        rs = await api.v2.user.token.all(data.user_id)
       } catch (e) {
         logger.error(e)
         exitAllDevicesLoading.value = false
@@ -390,15 +373,12 @@ async function exitAllDevices() {
       // const rs = await deleteReq('https://api-v2.locyanfrp.cn/api/v2/users/reset/token/all', data)
       if (rs.status === 200) {
         exitAllDevicesLoading.value = false
-        sendSuccessMessage('已全部退出')
+        message.success('已全部退出')
         doLogOut()
       } else {
         exitAllDevicesLoading.value = false
         message.error('退出失败, 后端返回: ' + rs.message)
       }
-    },
-    onNegativeClick: () => {
-      exitAllDevicesLoading.value = false
     }
   })
 }
@@ -409,7 +389,7 @@ import { ref } from 'vue'
 
 const show = ref(false)
 
-export const changeUserInfoShow = (status1) => {
-  show.value = status1
+export const changeUserInfoShow = (status) => {
+  show.value = status
 }
 </script>
diff --git a/src/components/sidebar/GuestSidebar.vue b/src/components/sidebar/GuestSidebar.vue
index 956457f..ad2e504 100644
--- a/src/components/sidebar/GuestSidebar.vue
+++ b/src/components/sidebar/GuestSidebar.vue
@@ -66,7 +66,7 @@ const menuOptions = [
 
 const active = ref('')
 
-router.beforeEach((to, from, next) => {
+router.beforeEach((to, _, next) => {
   computeActiveKey(menuOptions, to.path)
   next()
 })
@@ -84,7 +84,7 @@ const computeActiveKey = (menuOptions, path) => {
 const route = useRoute()
 computeActiveKey(menuOptions, route.path)
 
-const handleUpdateValue = (key, item) => {
+const handleUpdateValue = (_, item) => {
   router.push({ path: item.path })
 }
 </script>
diff --git a/src/components/sidebar/MainSidebar.vue b/src/components/sidebar/MainSidebar.vue
index 29a53d5..d4324fd 100644
--- a/src/components/sidebar/MainSidebar.vue
+++ b/src/components/sidebar/MainSidebar.vue
@@ -37,12 +37,11 @@ import {
   PaperPlane,
   PencilSharp,
   Person,
-  PlanetOutline,
   Key,
   CompassSharp,
   GameController
 } from '@vicons/ionicons5'
-import { MoreCircle20Filled } from '@vicons/fluent'
+import { MoreCircle20Filled, Box24Filled } from '@vicons/fluent'
 import { AttachMoneyFilled, AccountTreeOutlined } from '@vicons/material'
 
 import router from '@router'
@@ -65,28 +64,28 @@ const menuOptions = [
     key: 'dashboard',
     icon: renderIcon(CompassSharp)
   },
-  {
-    label: '新春活动',
-    key: 'yearly',
-    show: false,
-    icon: renderIcon(PlanetOutline),
-    children: [
-      {
-        path: '/hello2024',
-        label: '评价和祝福',
-        show: true,
-        key: 'new-year',
-        icon: renderIcon(PlanetOutline)
-      },
-      {
-        path: '/prize',
-        label: '抽奖',
-        show: true,
-        key: 'prize',
-        icon: renderIcon(PlanetOutline)
-      }
-    ]
-  },
+  // {
+  //   label: '新春活动',
+  //   key: 'yearly',
+  //   show: false,
+  //   icon: renderIcon(PlanetOutline),
+  //   children: [
+  //     {
+  //       path: '/hello2024',
+  //       label: '评价和祝福',
+  //       show: true,
+  //       key: 'new-year',
+  //       icon: renderIcon(PlanetOutline)
+  //     },
+  //     {
+  //       path: '/prize',
+  //       label: '抽奖',
+  //       show: true,
+  //       key: 'prize',
+  //       icon: renderIcon(PlanetOutline)
+  //     }
+  //   ]
+  // },
   {
     path: '/verification',
     label: '身份认证',
@@ -156,6 +155,12 @@ const menuOptions = [
       }
     ]
   },
+  {
+    path: '/app',
+    label: 'OAuth2.0 应用',
+    key: 'app',
+    icon: renderIcon(Box24Filled)
+  },
   {
     key: 'status',
     icon: renderIcon(List),
@@ -200,7 +205,7 @@ const menuOptions = [
 const active = ref('')
 // const menuInstRef = ref(null)
 
-router.beforeEach((to, from, next) => {
+router.beforeEach((to, _, next) => {
   computeActiveKey(menuOptions, to.path)
   next()
 })
@@ -218,7 +223,7 @@ const computeActiveKey = (menuOptions, path) => {
 const route = useRoute()
 computeActiveKey(menuOptions, route.path)
 
-const handleUpdateValue = (key, item) => {
+const handleUpdateValue = (_, item) => {
   router.push({ path: item.path })
 }
 </script>
diff --git a/src/main.js b/src/main.js
index 0bff9be..5e865e6 100644
--- a/src/main.js
+++ b/src/main.js
@@ -10,10 +10,10 @@ import axios from 'axios'
 import VueAxios from 'vue-axios'
 import userData from '@/utils/stores/userData/store'
 import userDataLocal from '@/utils/stores/userData/local'
-import { printTitle } from '@/utils/title'
+import banner from '@/utils/title'
 import Clipboard from 'v-clipboard'
 
-printTitle()
+banner()
 
 const app = createApp(App)
 app.use(userData)
diff --git a/src/router/index.js b/src/router/index.js
index b2561b9..1942f0b 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -72,6 +72,21 @@ const routes = [
               }
             },
             component: () => import('@views/auth/ResetPasswordView.vue')
+          },
+          {
+            path: 'oauth',
+            children: [
+              {
+                path: 'authorize',
+                name: 'OAuthAuthorize',
+                meta: {
+                  title: 'OAuth 授权界面',
+                  needLogin: true,
+                  noSidebar: true
+                },
+                component: () => import('@views/auth/oauth/AppAuthView.vue')
+              }
+            ]
           }
         ]
       },
@@ -120,26 +135,26 @@ const routes = [
         },
         component: () => import('@views/VerificationView.vue')
       },
-      {
-        path: '/hello2024',
-        name: 'NewYear',
-        meta: {
-          title: '留言',
-          keepAlive: true,
-          needLogin: true
-        },
-        component: () => import('@views/activities/NewYearView.vue')
-      },
-      {
-        path: '/prize',
-        name: 'Prize',
-        meta: {
-          title: '抽奖',
-          keepAlive: true,
-          needLogin: true
-        },
-        component: () => import('@views/activities/PrizeView.vue')
-      },
+      // {
+      //   path: '/hello2024',
+      //   name: 'NewYear',
+      //   meta: {
+      //     title: '留言',
+      //     keepAlive: true,
+      //     needLogin: true
+      //   },
+      //   component: () => import('../../_deprecated/activities/NewYearView.vue')
+      // },
+      // {
+      //   path: '/prize',
+      //   name: 'Prize',
+      //   meta: {
+      //     title: '抽奖',
+      //     keepAlive: true,
+      //     needLogin: true
+      //   },
+      //   component: () => import('../../_deprecated/activities/PrizeView.vue')
+      // },
       {
         path: '/donate',
         name: 'Donate',
@@ -160,6 +175,16 @@ const routes = [
         },
         component: () => import('@views/IcpCheckView.vue')
       },
+      {
+        path: '/app',
+        name: 'App',
+        meta: {
+          title: '应用',
+          keepAlive: true,
+          needLogin: true
+        },
+        component: () => import('@views/AppView.vue')
+      },
       {
         path: '/games',
         children: [
diff --git a/src/utils/dialog.js b/src/utils/dialog.js
index c479ebe..0992e48 100644
--- a/src/utils/dialog.js
+++ b/src/utils/dialog.js
@@ -1,23 +1,58 @@
-export const sendSuccessDialog = (message) => {
-  window.$dialog.success({
-    title: '厉害捏！',
-    content: message,
-    positiveText: '收到'
-  })
+class Dialog {
+  success(
+    message,
+    options = {
+      onPositiveClick: null,
+      onNegativeClick: null,
+      onMaskClick: null
+    }
+  ) {
+    window.$dialog.success({
+      title: '厉害捏！',
+      content: message,
+      positiveText: '收到',
+      negativeText: '不要',
+      onPositiveClick: options.onPositiveClick,
+      onNegativeClick: options.onNegativeClick,
+      onMaskClick: options.onMaskClick
+    })
+  }
+  warning(
+    message,
+    options = {
+      onPositiveClick: null,
+      onNegativeClick: null,
+      onMaskClick: null
+    }
+  ) {
+    window.$dialog.warning({
+      title: '这只是个警告罢了~',
+      content: message,
+      positiveText: '收到',
+      negativeText: '不要',
+      onPositiveClick: options.onPositiveClick,
+      onNegativeClick: options.onNegativeClick,
+      onMaskClick: options.onMaskClick
+    })
+  }
+  error(
+    message,
+    options = {
+      onPositiveClick: null,
+      onNegativeClick: null,
+      onMaskClick: null
+    }
+  ) {
+    window.$dialog.error({
+      title: '发生了点小错误...',
+      content: message,
+      positiveText: '收到',
+      negativeText: '不要',
+      onPositiveClick: options.onPositiveClick,
+      onNegativeClick: options.onNegativeClick,
+      onMaskClick: options.onMaskClick
+    })
+  }
 }
 
-export const sendWarningDialog = (message) => {
-  window.$dialog.warning({
-    title: '这只是个警告罢了~',
-    content: message,
-    positiveText: '收到'
-  })
-}
-
-export const sendErrorDialog = (message) => {
-  window.$dialog.error({
-    title: '发生了点小错误...',
-    content: message,
-    positiveText: '收到'
-  })
-}
+export default Dialog
diff --git a/src/utils/message.js b/src/utils/message.js
index 4c1298c..5ced20a 100644
--- a/src/utils/message.js
+++ b/src/utils/message.js
@@ -1,16 +1,14 @@
 // 2024-09-06 Muska_Ami: 他妈的 为什么要再造轮子啊
-
-export const sendSuccessMessage = (message) => {
-  // 需要确保已经在 setup 中执行了 window.$message = message
-  window.$message.success(message)
-}
-
-export const sendWarningMessage = (message) => {
-  // 需要确保已经在 setup 中执行了 window.$message = message
-  window.$message.warning(message)
+class Message {
+  success(message, options = {}) {
+    window.$message.success(message, options)
+  }
+  warning(message, options = {}) {
+    window.$message.warning(message, options)
+  }
+  error(message, options = {}) {
+    window.$message.error(message, options)
+  }
 }
 
-export const sendErrorMessage = (message) => {
-  // 需要确保已经在 setup 中执行了 window.$message = message
-  window.$message.error(message)
-}
+export default Message
diff --git a/src/utils/notice.js b/src/utils/notice.js
index 52c04e7..f8b6502 100644
--- a/src/utils/notice.js
+++ b/src/utils/notice.js
@@ -1,8 +1,10 @@
 import api from '@/api'
 import logger from '@/utils/logger'
-import { sendErrorMessage } from '@/utils/message'
+import Message from '@/utils/message'
 import { marked } from 'marked'
 
+const message = new Message()
+
 let notice = {
   getNotice: getNotice
 }
@@ -14,7 +16,7 @@ async function getNotice() {
     res = await api.v2.notice.root.get()
   } catch (e) {
     logger.error(e)
-    sendErrorMessage('获取 Notice 失败: ' + e)
+    message.error('获取 Notice 失败: ' + e)
   }
   // console.log(res)
   if (!res) return
diff --git a/src/utils/notification.js b/src/utils/notification.js
index 431da16..bc48c9e 100644
--- a/src/utils/notification.js
+++ b/src/utils/notification.js
@@ -1,32 +1,36 @@
-export const sendSuccessNotification = (message) => {
-  window.notification['success']({
-    content: '成功',
-    meta: message,
-    duration: 2500,
-    keepAliveOnHover: true
-  })
-}
-export const sendWarningNotification = (message) => {
-  window.notification['warning']({
-    content: '警告',
-    meta: message,
-    duration: 2500,
-    keepAliveOnHover: true
-  })
-}
-export const sendErrorNotification = (message) => {
-  window.notification['error']({
-    content: '错误',
-    meta: message,
-    duration: 2500,
-    keepAliveOnHover: true
-  })
-}
-export const sendInfoNotification = (message) => {
-  window.notification['info']({
-    content: '信息',
-    meta: message,
-    duration: 2500,
-    keepAliveOnHover: true
-  })
+class Notification {
+  info(title, message) {
+    window.notification['info']({
+      content: title,
+      meta: message,
+      duration: 2500,
+      keepAliveOnHover: true
+    })
+  }
+  success(title, message) {
+    window.notification['success']({
+      content: title,
+      meta: message,
+      duration: 2500,
+      keepAliveOnHover: true
+    })
+  }
+  warning(title, message) {
+    window.notification['warning']({
+      content: title,
+      meta: message,
+      duration: 2500,
+      keepAliveOnHover: true
+    })
+  }
+  error(title, message) {
+    window.notification['error']({
+      content: title,
+      meta: message,
+      duration: 2500,
+      keepAliveOnHover: true
+    })
+  }
 }
+
+export default Notification
diff --git a/src/utils/profile.js b/src/utils/profile.js
index 5f6265c..b5012f8 100644
--- a/src/utils/profile.js
+++ b/src/utils/profile.js
@@ -1,53 +1,4 @@
-import axios from 'axios'
-import { ref } from 'vue'
 import userData from './stores/userData/store'
-import router from '@router'
-import { get } from './request'
-import { sendWarningMessage } from './message'
-
-export function getNotice() {
-  const rs = ref('')
-  axios({
-    method: 'get',
-    url: 'https://api.locyanfrp.cn/App'
-  }).then((res) => {
-    rs.value = res.data
-  })
-  return rs
-}
-
-export function getLoginStatus(username, token) {
-  const rs = get(
-    'https://api.locyanfrp.cn/Account/info?username=' + username + '&token=' + token,
-    []
-  )
-  const return_res = ref('')
-  rs.then((res) => {
-    if (res.status !== 0) {
-      sendWarningMessage('登录过期或未登录，请使用 LCF 账户登录后台！')
-      logout()
-    } else {
-      return_res.value = res
-      return return_res
-    }
-  })
-  return return_res
-}
-
-export function getProxies(username, token) {
-  const rs = get(
-    'https://api.locyanfrp.cn/Proxies/GetProxiesList?username=' + username + '&token=' + token,
-    []
-  )
-  rs.then((res) => {
-    if (res.status !== 0) {
-      return res
-    } else {
-      localStorage.setItem('proxies', res.count)
-      return res.proxies
-    }
-  })
-}
 
 export function logout() {
   userData.commit('delete_user_info')
diff --git a/src/utils/request.js b/src/utils/request.js
index e51bf41..d2f1046 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -6,9 +6,11 @@ import QS from 'qs'
 import userData from './stores/userData/store'
 import router from '@router'
 import Base64 from 'qs/lib/utils'
-import { sendErrorMessage } from './message'
+import Message from './message'
 import logger from '@/utils/logger'
 
+const message = new Message()
+
 //这一步的目的是判断出当前是开发环境还是生成环境，方法不止一种，达到目的就行
 // if(process.env.NODE_ENV=="development"){
 //   baseURL='https://api.locyanfrp.cn'
@@ -23,8 +25,6 @@ const instance = axios.create({
 
 const tokenDomains = ['api.locyanfrp.cn', 'api-v2.locyanfrp.cn', 'localhost']
 
-// post请求的时候，我们需要加上一个请求头，所以可以在这里进行一个默认的设置，即设置post的请求头为
-axios.defaults.headers.post['Content-Type'] = 'multipart/form-data;charset=UTF-8'
 // 添加请求拦截器
 instance.interceptors.request.use(
   async (config) => {
@@ -68,7 +68,7 @@ instance.interceptors.response.use(
           })
           break
         case 500:
-          sendErrorMessage('服务器响应时发生错误')
+          message.error('服务器响应时发生错误')
         // 403 token过期
         // 登录过期对用户进行提示
         // 清除本地token和清空vuex中token对象
@@ -119,7 +119,7 @@ export async function get(url, params) {
  * @param headers
  */
 export async function post(url, params, headers = {}) {
-  return await instance.post(url, QS.stringify(params), {
+  return await instance.post(url, QS.stringify(params, { arrayFormat: 'repeat' }), {
     headers: { ...headers, 'Content-Type': 'application/x-www-form-urlencoded' }
   })
 }
diff --git a/src/utils/stores/userData/def.js b/src/utils/stores/userData/def.js
index 67218ec..da69751 100644
--- a/src/utils/stores/userData/def.js
+++ b/src/utils/stores/userData/def.js
@@ -1,8 +1,9 @@
 export default {
   token: '',
   username: '',
+  user_id: 0,
   email: '',
-  frptoken: '',
+  frp_token: '',
   inbound: 0,
   outbound: 0,
   avatar: '',
diff --git a/src/utils/stores/userData/local.js b/src/utils/stores/userData/local.js
index 6714109..2ce047d 100644
--- a/src/utils/stores/userData/local.js
+++ b/src/utils/stores/userData/local.js
@@ -4,8 +4,9 @@ import defStateData from './def'
 const loadFromLocal = () => {
   userData.commit('set_token', localStorage.getItem('token') ?? defStateData.token)
   userData.commit('set_username', localStorage.getItem('username') ?? defStateData.username)
+  userData.commit('set_user_id', localStorage.getItem('user_id') ?? defStateData.user_id)
   userData.commit('set_user_email', localStorage.getItem('email') ?? defStateData.email)
-  userData.commit('set_frp_token', localStorage.getItem('frptoken') ?? defStateData.frptoken)
+  userData.commit('set_frp_token', localStorage.getItem('frp_token') ?? defStateData.frp_token)
   userData.commit(
     'set_user_inbound',
     Number(localStorage.getItem('inbound') ?? defStateData.inbound)
diff --git a/src/utils/stores/userData/store.js b/src/utils/stores/userData/store.js
index 636484b..9e4d0fd 100644
--- a/src/utils/stores/userData/store.js
+++ b/src/utils/stores/userData/store.js
@@ -4,8 +4,9 @@ import defStateData from './def'
 const stateData = {
   token: '',
   username: '',
+  user_id: 0,
   email: '',
-  frptoken: '',
+  frp_token: '',
   inbound: 0,
   outbound: 0,
   avatar: '',
@@ -23,11 +24,14 @@ export default new vuex.Store({
     get_username(state) {
       return state.username
     },
+    get_user_id(state) {
+      return state.user_id
+    },
     get_email(state) {
       return state.email
     },
     get_frp_token(state) {
-      return state.frptoken
+      return state.frp_token
     },
     get_user_inbound(state) {
       // 限速方面必须返回整数
@@ -65,14 +69,24 @@ export default new vuex.Store({
       state.username = defStateData.username
       localStorage.removeItem('username')
     },
+    // user id
+    set_user_id(state, user_id) {
+      console.log(user_id)
+      state.user_id = user_id
+      localStorage.setItem('user_id', user_id)
+    },
+    remove_user_id(state) {
+      state.user_id = defStateData.user_id
+      localStorage.removeItem('user_id')
+    },
     // frp token
-    set_frp_token(state, frptoken) {
-      state.frptoken = frptoken
-      localStorage.setItem('frptoken', frptoken)
+    set_frp_token(state, frp_token) {
+      state.frp_token = frp_token
+      localStorage.setItem('frp_token', frp_token)
     },
     remove_frp_token(state) {
-      state.frptoken = defStateData.frptoken
-      localStorage.removeItem('frptoken')
+      state.frp_token = defStateData.frp_token
+      localStorage.removeItem('frp_token')
     },
     // inbound
     set_user_inbound(state, inbound) {
@@ -126,28 +140,31 @@ export default new vuex.Store({
       localStorage.setItem('outbound', limit_info.outbound)
     },
     // 可选
-    set_user_info(state, userdata) {
-      // console.log(userdata)
-      state.username = userdata.username
-      state.email = userdata.email
-      state.frptoken = userdata.frp_token
-      state.inbound = userdata.inbound
-      state.outbound = userdata.outbound
-      state.avatar = userdata.avatar
-      state.traffic = userdata.traffic
+    set_user_info(state, userData) {
+      // console.log(userData)
+      state.username = userData.username
+      state.user_id = userData.id
+      state.email = userData.email
+      state.frptoken = userData.frp_token
+      state.inbound = userData.inbound
+      state.outbound = userData.outbound
+      state.avatar = userData.avatar
+      state.traffic = userData.traffic
       // state.proxies_num = userdata.proxies_num
-      localStorage.setItem('username', userdata.username)
-      localStorage.setItem('email', userdata.email)
-      localStorage.setItem('traffic', userdata.traffic)
-      localStorage.setItem('frptoken', userdata.frp_token)
-      localStorage.setItem('inbound', userdata.inbound)
-      localStorage.setItem('outbound', userdata.outbound)
-      localStorage.setItem('avatar', userdata.avatar)
+      localStorage.setItem('username', userData.username)
+      localStorage.setItem('user_id', userData.id)
+      localStorage.setItem('email', userData.email)
+      localStorage.setItem('traffic', userData.traffic)
+      localStorage.setItem('frp_token', userData.frp_token)
+      localStorage.setItem('inbound', userData.inbound)
+      localStorage.setItem('outbound', userData.outbound)
+      localStorage.setItem('avatar', userData.avatar)
       // localStorage.setItem('proxies_num', userdata.proxies_num)
     },
     delete_user_info(state) {
       state.token = defStateData.token
       state.username = defStateData.username
+      state.user_id = defStateData.user_id
       state.email = defStateData.email
       state.frptoken = defStateData.frptoken
       state.inbound = defStateData.inbound
@@ -156,14 +173,15 @@ export default new vuex.Store({
       state.traffic = defStateData.traffic
       localStorage.removeItem('token')
       localStorage.removeItem('username')
+      localStorage.removeItem('user_id')
       localStorage.removeItem('email')
       localStorage.removeItem('avatar')
       localStorage.removeItem('traffic')
-      localStorage.removeItem('frptoken')
+      localStorage.removeItem('frp_token')
       localStorage.removeItem('inbound')
       localStorage.removeItem('outbound')
       localStorage.removeItem('proxies')
-      localStorage.removeItem('avator')
+      localStorage.removeItem('avatar')
     }
   },
 
diff --git a/src/utils/title.js b/src/utils/title.js
index d1444c2..2071a98 100644
--- a/src/utils/title.js
+++ b/src/utils/title.js
@@ -7,7 +7,7 @@ const colorBadgeData = 'background-color: #606060; color: #fff;'
 const colorReset = 'background-color: none; color: none;'
 const colorCFU = 'wdith: 100%; background-color: #66ccff; color: #fff;'
 
-export async function printTitle() {
+export default () => {
   console.log(
     `%c
         _           ____                  _____           
diff --git a/src/views/AppView.vue b/src/views/AppView.vue
new file mode 100644
index 0000000..6651a53
--- /dev/null
+++ b/src/views/AppView.vue
@@ -0,0 +1,282 @@
+<template>
+  <n-h1 prefix="bar" style="margin-top: 30px">
+    <i class="twa twa-package"></i>
+    <n-text type="primary"> OAuth2.0 应用</n-text>
+  </n-h1>
+  <n-modal
+    preset="card"
+    style="max-width: 600px"
+    size="huge"
+    title="新建应用"
+    v-model:show="showCreateModal"
+    :bordered="false"
+    :segmented="modalSegmented"
+  >
+    <n-form>
+      <n-form-item label="应用名称">
+        <n-input v-model:value="creatingData.name"></n-input>
+      </n-form-item>
+      <n-form-item label="介绍">
+        <n-input v-model:value="creatingData.description"></n-input>
+      </n-form-item>
+      <n-form-item label="重定向 URL">
+        <n-input v-model:value="creatingData.redirectUrl"></n-input>
+      </n-form-item>
+    </n-form>
+    <template #footer>
+      <n-button @click="createApplication" type="primary" secondary>提交</n-button>
+    </template>
+  </n-modal>
+  <n-modal
+    preset="card"
+    style="max-width: 600px"
+    size="huge"
+    :title="'编辑应用 - ID: ' + modifyingData.id"
+    v-model:show="showModifyModal"
+    :bordered="false"
+    :segmented="modalSegmented"
+  >
+    <n-form>
+      <n-form-item label="应用名称">
+        <n-input v-model:value="modifyingData.name"></n-input>
+      </n-form-item>
+      <n-form-item label="介绍">
+        <n-input v-model:value="modifyingData.description"></n-input>
+      </n-form-item>
+      <n-form-item label="重定向 URL">
+        <n-input v-model:value="modifyingData.redirectUrl"></n-input>
+      </n-form-item>
+    </n-form>
+    <template #footer>
+      <n-button @click="modifyApplication" type="primary" secondary>提交</n-button>
+    </template>
+  </n-modal>
+  <n-grid :y-gap="3" :x-gap="20" cols="3" item-responsive>
+    <n-grid-item span="0:3 600:2">
+      <n-card>
+        <n-space style="flex-direction: column">
+          <div>
+            <n-h3>我的应用</n-h3>
+            <n-button @click="createModal" type="primary">创建</n-button>
+            <n-divider></n-divider>
+            <n-spin :show="applicationListLoading">
+              <n-empty v-if="applicationList.length === 0"></n-empty>
+              <n-card style="margin-block: 1rem" v-for="app in applicationList">
+                <template #header>
+                  <n-h3 style="margin-bottom: 0">
+                    {{ app.name }}
+                    <n-tag :bordered="false" type="success" style="transform: translateY(-2px)">
+                      ID: {{ app.id }}
+                    </n-tag>
+                  </n-h3>
+                </template>
+                <n-text
+                  >介绍: {{ app.description === '' ? '无' : (app.description ?? '无') }}</n-text
+                ><br />
+                <n-text>重定向地址: {{ app.redirect_url }}</n-text>
+                <template #action>
+                  <n-space>
+                    <n-button @click="modifyModal(app.id)" type="primary" secondary>修改</n-button>
+                    <n-button @click="deleteApplication(app.id)" type="error" secondary
+                      >删除</n-button
+                    >
+                  </n-space>
+                </template>
+              </n-card>
+            </n-spin>
+          </div>
+        </n-space>
+      </n-card>
+    </n-grid-item>
+    <!-- 权限列表 -->
+    <n-grid-item span="0:3 600:1">
+      <n-list style="margin: 0" bordered>
+        <template #header>
+          <n-h3 style="margin-bottom: 0">权限节点列表</n-h3>
+        </template>
+        <n-spin :show="permissionListLoading">
+          <n-scrollbar style="height: 75vh">
+            <n-list-item v-for="permission in permissionList">
+              <n-thing>
+                <n-text>{{ permission.node }}</n-text>
+                <n-text style="margin-left: 1.5rem; float: right">
+                  {{ permission.description ?? '无描述' }}
+                </n-text>
+              </n-thing>
+            </n-list-item>
+          </n-scrollbar>
+        </n-spin>
+      </n-list>
+    </n-grid-item>
+  </n-grid>
+</template>
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import userData from '@/utils/stores/userData/store'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
+import api from '@/api'
+import logger from '@/utils/logger'
+
+const message = new Message()
+const dialog = new Dialog()
+
+const permissionList = ref([])
+const permissionListLoading = ref(true)
+
+const applicationList = ref([])
+const applicationListLoading = ref(true)
+
+const showCreateModal = ref(false)
+const showModifyModal = ref(false)
+let creatingData = ref({
+  name: '',
+  description: null,
+  redirectUrl: ''
+})
+let modifyingData = ref({
+  id: 0,
+  name: '',
+  description: null,
+  redirectUrl: ''
+})
+const modalSegmented = {
+  content: 'soft',
+  footer: 'soft'
+}
+
+function createModal() {
+  showCreateModal.value = true
+}
+async function createApplication() {
+  let rs
+  try {
+    rs = await api.v2.app.root.post(
+      userData.getters.get_user_id,
+      creatingData.value.name,
+      creatingData.value.description,
+      creatingData.value.redirectUrl
+    )
+  } catch (e) {
+    logger.error(e)
+    message.error(e)
+  }
+  if (!rs) return
+  if (rs.status === 200) {
+    dialog.success('创建成功')
+    reloadApplications()
+    showCreateModal.value = false
+  } else {
+    message.error(rs.status)
+  }
+}
+
+function modifyModal(id: number) {
+  showModifyModal.value = true
+  modifyingData.value.id = id
+  const data = applicationList.value.filter((item) => item.id === id)[0]
+  modifyingData.value.name = data.name
+  modifyingData.value.description = data.description
+  modifyingData.value.redirectUrl = data.redirect_url
+}
+async function modifyApplication() {
+  let rs
+  try {
+    rs = await api.v2.app.update(
+      userData.getters.get_user_id,
+      modifyingData.value.id,
+      modifyingData.value.name,
+      modifyingData.value.description,
+      modifyingData.value.redirectUrl
+    )
+  } catch (e) {
+    logger.error(e)
+    message.error(e)
+  }
+  if (!rs) return
+  if (rs.status === 200) {
+    dialog.success('修改成功')
+    reloadApplications()
+    showModifyModal.value = false
+  } else {
+    message.error(rs.status)
+  }
+}
+
+async function deleteApplication(id: number) {
+  dialog.warning('确认要删除这个应用吗？此操作不可逆', {
+    onPositiveClick: async () => {
+      let rs
+      try {
+        rs = await api.v2.app.root.delete(userData.getters.get_user_id, id)
+      } catch (e) {
+        logger.error(e)
+        message.error(e)
+      }
+      if (!rs) return
+      if (rs.status === 200) {
+        message.success('删除成功')
+        applicationList.value = applicationList.value.filter((item) => item.id !== id)
+      } else {
+        message.error(rs.message)
+      }
+    }
+  })
+}
+
+async function reloadApplications() {
+  applicationListLoading.value = true
+  const reload = await initApplications()
+  if (!reload) message.warning('刷新应用列表失败')
+  applicationListLoading.value = false
+}
+
+async function initApplications(): Promise<boolean> {
+  let rs
+  try {
+    rs = await api.v2.app.all(userData.getters.get_user_id)
+  } catch (e) {
+    logger.error(e)
+    message.error(e)
+    return false
+  }
+  if (!rs) return false
+  if (rs.status === 200) {
+    applicationList.value = rs.data.list
+    return true
+  } else {
+    message.error(rs.message)
+  }
+  return false
+}
+
+onMounted(async () => {
+  async function initPermissions(): Promise<boolean> {
+    let rs
+    try {
+      rs = await api.v2.auth.oauth.permission.all(userData.getters.get_user_id)
+    } catch (e) {
+      logger.error(e)
+      message.error(e)
+      return false
+    }
+    if (!rs) return false
+    if (rs.status === 200) {
+      // logger.info(rs.data)
+      permissionList.value = rs.data.list
+      return true
+    } else {
+      message.error(rs.message)
+    }
+    return false
+  }
+  let init1 = await initPermissions()
+  let init2 = await initApplications()
+  if (init1) {
+    permissionListLoading.value = false
+  }
+  if (init2) {
+    applicationListLoading.value = false
+  }
+})
+</script>
diff --git a/src/views/DashboardView.vue b/src/views/DashboardView.vue
index 543820f..e24a1f1 100644
--- a/src/views/DashboardView.vue
+++ b/src/views/DashboardView.vue
@@ -38,8 +38,8 @@
             style="margin-left: 10px; transform: translateY(-5px)"
             type="info"
             v-clipboard="() => frpToken"
-            v-clipboard:success="() => sendSuccessMessage('复制成功')"
-            v-clipboard:error="() => sendErrorMessage('复制失败')"
+            v-clipboard:success="() => message.success('复制成功')"
+            v-clipboard:error="() => message.error('复制失败')"
           >
             复制
           </n-button>
@@ -165,13 +165,16 @@ import { ref, onMounted } from 'vue'
 // import clipboard from '@/utils/clipboard'
 import { AngleRight, Key } from '@vicons/fa'
 import userData from '@/utils/stores/userData/store'
-import { useDialog, useMessage } from 'naive-ui'
 import { startLoadingBar, finishLoadingBar, errorLoadingBar } from '@/utils/loadingbar'
-import { sendSuccessMessage, sendErrorMessage } from '@/utils/message'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
 import api from '@/api'
 import logger from '@/utils/logger'
 import notice from '@/utils/notice'
 
+const message = new Message()
+const dialog = new Dialog()
+
 localStorage.setItem('ViewPage', 'personality')
 const username = userData.getters.get_username
 const email = userData.getters.get_email
@@ -181,8 +184,6 @@ const outbound = ref(userData.getters.get_user_outbound + 'Mbps 上行')
 const outboundRef = ref(null)
 const frpToken = ref(userData.getters.get_frp_token)
 const notShowFrpToken = ref(true)
-const dialog = useDialog()
-const message = useMessage()
 
 const broadcastHtml = ref('')
 const broadcastLoading = ref(true)
@@ -243,22 +244,18 @@ function helloMessage() {
 }
 
 async function resetTraffic() {
-  dialog.warning({
-    title: '警告',
-    content: '确定要重置流量吗？这将将剩余流量设置为 10 GiB',
-    positiveText: '确定',
-    negativeText: '还是算了~',
+  dialog.warning('确定要重置流量吗？这将将剩余流量设置为 10 GiB', {
     onPositiveClick: async () => {
       startLoadingBar()
       const data = {
-        username: userData.getters.get_username
+        user_id: userData.getters.get_user_id
       }
       let rs
       try {
-        rs = await api.v2.user.traffic(data.username)
+        rs = await api.v2.user.traffic(data.user_id)
       } catch (e) {
         logger.error(e)
-        sendErrorMessage('请求重置流量失败: ' + e)
+        message.error('请求重置流量失败: ' + e)
       }
       if (!rs) {
         errorLoadingBar()
diff --git a/src/views/DonateView.vue b/src/views/DonateView.vue
index 25bfd9b..c40c612 100644
--- a/src/views/DonateView.vue
+++ b/src/views/DonateView.vue
@@ -62,13 +62,13 @@
       <n-grid-item span="1" v-if="showMessageLabel">
         <n-form
           ref="formRef"
-          :model="message"
+          :model="donateMessage"
           label-width="auto"
           require-mark-placement="right-hanging"
           size="medium"
         >
           <n-form-item label="留言" path="message">
-            <n-input type="text" v-model:value="message.message" placeholder="赞助的留言" />
+            <n-input type="text" v-model:value="donateMessage.message" placeholder="赞助的留言" />
           </n-form-item>
           <n-space>
             <n-button
@@ -86,7 +86,8 @@
   </n-card>
   <n-h3>留言</n-h3>
   <n-spin :show="donateListLoading">
-    <n-grid cols="3" item-responsive :x-gap="12" :y-gap="12">
+    <n-empty v-if="donateList.length === 0"></n-empty>
+    <n-grid v-else cols="3" item-responsive :x-gap="12" :y-gap="12">
       <n-grid-item
         v-for="item in donateList
           .filter((element) => element.amount >= amountFilterThreshold)
@@ -117,6 +118,7 @@
     </n-grid>
     <br />
     <n-button
+      v-if="donateList.length !== 0"
       @click="
         () => {
           displayAllMessages = !displayAllMessages
@@ -132,10 +134,14 @@
 import { onMounted, ref } from 'vue'
 import { getUrlKey } from '@/utils/request'
 import userData from '@/utils/stores/userData/store'
-import { sendErrorMessage } from '@/utils/message'
-import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
+import logger from '@/utils/logger'
 import api from '@/api'
 
+const message = new Message()
+const dialog = new Dialog()
+
 // 页面元素初始化
 const amount = ref('0.01')
 const amountFilterThreshold = ref(3.0)
@@ -147,7 +153,6 @@ const displayMessagesDefault = ref(5)
 const displayAllMessages = ref(false)
 const tradeInfo = ref({
   id: 1,
-  username: '',
   message: null,
   trade_name: '',
   trade_no: '',
@@ -170,23 +175,23 @@ onMounted(async () => {
     showModal.value = true
     let rs
     try {
-      rs = await api.v1.Donate.GetDonateInfo(inputTradeNo)
+      rs = await api.v2.donate.info(userData.getters.get_user_id, inputTradeNo)
     } catch (e) {
-      sendErrorMessage('请求列表失败: ' + e)
+      logger.error(e)
+      message.error('请求列表失败: ' + e)
     }
     if (!rs) return
     if (rs.status === 200) {
-      if (rs.data) tradeInfo.value = rs.data
-      else sendErrorMessage('返回数据无效')
+      tradeInfo.value = rs.data
     } else {
-      sendErrorMessage(rs.message)
+      message.error(rs.message)
     }
   }
 })
 const submitLoading = ref(false)
 const donateLoading = ref(false)
 const formRef = ref(null)
-const message = ref([
+const donateMessage = ref([
   {
     message: ''
   }
@@ -198,14 +203,14 @@ async function getDonateList() {
   try {
     rs = await api.v2.donate.say.all()
   } catch (e) {
-    sendErrorMessage('请求列表失败: ' + e)
+    message.error('请求列表失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
     donateList.value = rs.data.list
     donateListLoading.value = false
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
   }
 }
 
@@ -224,8 +229,8 @@ const timestampToTime = (timestamp) => {
 
 async function submitMessage() {
   submitLoading.value = true
-  if (message.message === '') {
-    sendWarningDialog('内容不能为空！')
+  if (donateMessage.message === '') {
+    message.warning('内容不能为空！')
     submitLoading.value = false
     return
   }
@@ -233,20 +238,21 @@ async function submitMessage() {
   let rs
   try {
     rs = await api.v2.donate.say.root.post(
-      userData.getters.get_username,
+      userData.getters.get_user_id,
       inputTradeNo,
-      message.value.message
+      donateMessage.value.message
     )
   } catch (e) {
-    sendErrorMessage('请求列表失败: ' + e)
+    logger.error(e)
+    message.error('请求列表失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
-    sendSuccessDialog('提交成功，感谢您的赞助~')
+    message.success('提交成功，感谢您的赞助~')
     getDonateList()
     submitLoading.value = false
   } else {
-    sendWarningDialog(rs.message)
+    message.warning(rs.message)
     submitLoading.value = false
   }
 }
@@ -254,22 +260,23 @@ async function submitMessage() {
 async function doDonate() {
   donateLoading.value = true
   if (payType.value === '' || payType.value === null) {
-    sendWarningDialog('请选择支付方式')
+    message.error('请选择支付方式')
     donateLoading.value = false
     return
   }
   let rs
   try {
-    rs = await api.v2.donate.root.post(userData.getters.get_username, amount.value)
+    rs = await api.v2.donate.root.post(userData.getters.get_user_id, amount.value)
   } catch (e) {
-    sendErrorMessage('请求列表失败: ' + e)
+    logger.error(e)
+    message.error('请求列表失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
     window.open(rs.data.url)
     donateLoading.value = false
   } else {
-    sendWarningDialog(rs.message)
+    message.error(rs.message)
     donateLoading.value = false
   }
 }
diff --git a/src/views/IcpCheckView.vue b/src/views/IcpCheckView.vue
index 4febbae..9dd1d12 100644
--- a/src/views/IcpCheckView.vue
+++ b/src/views/IcpCheckView.vue
@@ -26,7 +26,7 @@
       <n-grid-item span="1">
         <n-h3> 已登记的域名 </n-h3>
         <n-spin :show="icpListLoading">
-          <n-empty v-if="!icpListLoading && icpList.length === 0"></n-empty>
+          <n-empty v-if="icpList.length === 0"></n-empty>
           <n-list v-else bordered v-show="showList">
             <n-list-item v-for="item in icpList">
               <n-thing
@@ -47,14 +47,16 @@
 <script setup>
 import { ref } from 'vue'
 import userData from '@/utils/stores/userData/store'
-import { sendSuccessMessage, sendErrorMessage } from '@/utils/message'
-import { sendErrorDialog, sendSuccessDialog } from '@/utils/dialog'
-import { useDialog } from 'naive-ui'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
+import logger from '@/utils/logger'
 import api from '@/api'
 
+const message = new Message()
+const dialog = new Dialog()
+
 const showList = ref(false)
 const formRef = ref(null)
-const dialog = useDialog()
 const loading = ref(false)
 const icpListLoading = ref(true)
 const domainInput = ref({
@@ -78,54 +80,46 @@ async function submit() {
   }
   loading.value = true
   if (domainInput.value.domain === '' || domainInput.value.domain === null) {
-    sendErrorDialog('域名不得为空！')
+    message.error('域名不得为空！')
     loading.value = false
     return
   }
   let rs
   try {
-    rs = await api.v2.icp.post(userData.getters.get_username, domainInput.value.domain)
+    rs = await api.v2.icp.post(userData.getters.get_user_id, domainInput.value.domain)
   } catch (e) {
-    sendErrorMessage('请求审核失败: ' + e)
+    logger.error(e)
+    dialog.error('请求审核失败: ' + e)
   }
   loading.value = false
   if (!rs) return
   if (rs.status !== 200) {
     loading.value = false
-    sendErrorDialog('审核失败，可能是域名没有备案或格式错误！')
+    dialog.error('审核失败: ' + rs.message)
   } else {
     getList()
     loading.value = false
-    sendSuccessDialog('添加成功！')
+    dialog.success('添加成功！')
   }
 }
 
 async function removeICP(id) {
-  dialog.warning({
-    title: '警告',
-    content: '你确定要删除这个域名吗？（域名 ID: ' + id + '）',
-    positiveText: '确定',
-    negativeText: '取消',
+  dialog.warning('你确定要删除这个域名吗？（域名 ID: ' + id + '）', {
     onPositiveClick: async () => {
       let rs
       try {
-        rs = await api.v2.icp.delete(userData.getters.get_username, id)
+        rs = await api.v2.icp.delete(userData.getters.get_user_id, id)
       } catch (e) {
-        sendErrorMessage('请求移除域名失败: ' + e)
+        logger.error(e)
+        message.error('请求移除域名失败: ' + e)
       }
       if (!rs) return
       if (rs.status === 200) {
-        sendSuccessDialog('删除成功！')
+        message.success('删除成功！')
         await getList()
       } else {
-        sendErrorDialog('删除失败，请联系管理员处理！')
+        message.error('删除失败，请联系管理员处理！')
       }
-    },
-    onNegativeClick: () => {
-      sendSuccessMessage('你取消了操作！')
-    },
-    onMaskClick: () => {
-      sendSuccessMessage('你取消了操作！')
     }
   })
 }
@@ -134,9 +128,10 @@ async function getList() {
   icpListLoading.value = true
   let rs
   try {
-    rs = await api.v2.icp.get(userData.getters.get_username)
+    rs = await api.v2.icp.get(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求移除域名失败: ' + e)
+    logger.error(e)
+    message.error('请求移除域名失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
diff --git a/src/views/SignView.vue b/src/views/SignView.vue
index 5352bd0..f2b5d7a 100644
--- a/src/views/SignView.vue
+++ b/src/views/SignView.vue
@@ -108,20 +108,23 @@
 <script setup>
 import { ref } from 'vue'
 import { NButton, NCard, NGrid, NGridItem, NH1, NSkeleton, NSpace, NText } from 'naive-ui'
-import { sendErrorMessage } from '@/utils/message'
-import { sendSuccessDialog } from '@/utils/dialog'
+import Message from '@/utils/message'
 import userData from '@/utils/stores/userData/store'
+import logger from '@/utils/logger'
 import api from '@/api'
 
+const message = new Message()
+
 const loading = ref(true)
 const status = ref(false)
 
 async function checkSign() {
   let rs
   try {
-    rs = await api.v2.sign.get(userData.getters.get_username)
+    rs = await api.v2.sign.get(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('获取签到状态失败: ' + e)
+    logger.error(e)
+    message.error('获取签到状态失败: ' + e)
     loading.value = false
   }
   if (!rs) return
@@ -134,18 +137,18 @@ async function checkSign() {
 async function doSign() {
   let rs
   try {
-    rs = await api.v2.sign.post(userData.getters.get_username)
+    rs = await api.v2.sign.post(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('签到失败: ' + e)
+    logger.error(e)
+    message.error('签到失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
-    sendSuccessDialog('签到成功，本次获得 ' + rs.data.get_traffic + ' GiB 流量')
-    checkSign()
+    message.success('签到成功，本次获得 ' + rs.data.get_traffic + ' GiB 流量')
   } else {
-    sendErrorMessage(rs.message)
-    checkSign()
+    message.warning(rs.message)
   }
+  await checkSign()
 }
 
 checkSign()
diff --git a/src/views/VerificationView.vue b/src/views/VerificationView.vue
index 6b2441e..b4c364b 100644
--- a/src/views/VerificationView.vue
+++ b/src/views/VerificationView.vue
@@ -74,7 +74,7 @@
       <n-collapse-item title="实人认证（一级认证，可使用全部节点）" name="2">
         <n-grid cols="1" item-responsive>
           <n-gi span="1">
-            <n-card v-show="showRealpersonMoal && !showPayModal" title="实人认证">
+            <n-card v-show="showRealpersonModal && !showPayModal" title="实人认证">
               <n-form :ref="formRef" :model="userProfile" label-width="auto" :size="'large'">
                 <n-grid cols="1" item-responsive :y-gap="5">
                   <n-grid-item>
@@ -162,16 +162,19 @@
 
 <script setup>
 import { ref } from 'vue'
-import { sendErrorMessage } from '@/utils/message'
-import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
 import { finishLoadingBar, startLoadingBar, errorLoadingBar } from '@/utils/loadingbar'
 import userData from '@/utils/stores/userData/store'
 import api from '@/api'
 import logger from '@/utils/logger'
 
+const message = new Message()
+const dialog = new Dialog()
+
 const loading = ref(true)
 const showRealnameModal = ref(true)
-const showRealpersonMoal = ref(true)
+const showRealpersonModal = ref(true)
 const showPayModal = ref(false)
 const showFinishModal = ref(false)
 const showScanCodeModal = ref(false)
@@ -196,19 +199,16 @@ const segmented = {
 async function submitRealName() {
   startLoadingBar()
   const submitForm = {
-    username: userData.getters.get_username,
+    user_id: userData.getters.get_user_id,
     name: userProfile.value.name,
     id_card: userProfile.value.idCard
   }
   let rs
   try {
-    rs = await api.v2.verification.realname(
-      submitForm.username,
-      submitForm.name,
-      submitForm.id_card
-    )
+    rs = await api.v2.verification.realname(submitForm.user_id, submitForm.name, submitForm.id_card)
   } catch (e) {
-    sendErrorMessage('请求失败: ' + e)
+    logger.error(e)
+    message.error('请求失败: ' + e)
   }
   if (!rs) {
     errorLoadingBar()
@@ -217,29 +217,30 @@ async function submitRealName() {
   if (rs.status === 200) {
     checkVerificationStatus()
     finishLoadingBar()
-    sendSuccessDialog('恭喜, 二级认证成功!')
+    message.success('恭喜, 二级认证成功!')
   } else {
     finishLoadingBar()
-    sendWarningDialog(rs.message)
+    message.warning(rs.message)
   }
 }
 
 async function submitRealPerson() {
   startLoadingBar()
   const submitForm = {
-    username: userData.getters.get_username,
+    user_id: userData.getters.get_user_id,
     name: userProfile.value.name,
     id_card: userProfile.value.idCard
   }
   let rs
   try {
     rs = await api.v2.verification.realperson.root.post(
-      submitForm.username,
+      submitForm.user_id,
       submitForm.name,
       submitForm.id_card
     )
   } catch (e) {
-    sendErrorMessage('请求失败: ' + e)
+    logger.error(e)
+    message.error('请求失败: ' + e)
   }
   if (!rs) {
     errorLoadingBar()
@@ -257,7 +258,7 @@ async function submitRealPerson() {
       }
     }, 5000)
   } else {
-    sendErrorMessage('发生错误: ' + rs.message)
+    message.error('发生错误: ' + rs.message)
     finishLoadingBar()
   }
 }
@@ -265,14 +266,14 @@ async function submitRealPerson() {
 async function queryRealPersonStatus() {
   let rs
   try {
-    rs = await api.v2.verification.realperson.query(userData.getters.get_username, ci.value)
+    rs = await api.v2.verification.realperson.query(userData.getters.get_user_id, ci.value)
   } catch (e) {
-    sendErrorMessage('请求失败: ' + e)
+    message.error('请求失败: ' + e)
   }
   if (!rs) return
-  if (res.status === 200) {
+  if (rs.status === 200) {
     // 后端会处理所有审核通过的事宜，前端处理消息显示
-    sendSuccessDialog('一级认证成功')
+    message.success('一级认证成功')
     showScanCodeModal.value = false
     checkVerificationStatus()
   }
@@ -281,9 +282,9 @@ async function queryRealPersonStatus() {
 async function checkVerificationStatus() {
   let rs
   try {
-    rs = await api.v2.verification.root.get(userData.getters.get_username)
+    rs = await api.v2.verification.root.get(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求失败: ' + e)
+    message.error('请求失败: ' + e)
   }
   if (!rs) return
   // 如果已经完成实名，那么关闭实名的框，展示实人的框
@@ -295,7 +296,7 @@ async function checkVerificationStatus() {
   if (realName.value === true && realPerson.value === true) {
     showFinishModal.value = true
     showRealnameModal.value = false
-    showRealpersonMoal.value = false
+    showRealpersonModal.value = false
     showPayModal.value = false
   }
 
@@ -306,10 +307,10 @@ async function checkVerificationStatus() {
     // 实人次数足够展示实人，不够展示支付
     logger.info('剩余实人次数: ' + realPersonCount.value)
     if (realPersonCount.value < 1) {
-      showRealpersonMoal.value = false
+      showRealpersonModal.value = false
       showPayModal.value = true
     } else {
-      showRealpersonMoal.value = true
+      showRealpersonModal.value = true
       showPayModal.value = false
     }
   }
@@ -320,10 +321,10 @@ async function checkVerificationStatus() {
     showRealnameModal.value = true
     // 实人次数足够展示实人，不够展示支付
     if (realPersonCount.value < 1) {
-      showRealpersonMoal.value = false
+      showRealpersonModal.value = false
       showPayModal.value = true
     } else {
-      showRealpersonMoal.value = true
+      showRealpersonModal.value = true
       showPayModal.value = false
     }
   }
@@ -333,9 +334,10 @@ async function checkVerificationStatus() {
 async function realPersonPay() {
   let rs
   try {
-    rs = await api.v2.verification.realperson.pay(userData.getters.get_username)
+    rs = await api.v2.verification.realperson.pay(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求失败: ' + e)
+    logger.error(e)
+    message.error('请求失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
diff --git a/src/views/auth/LoginView.vue b/src/views/auth/LoginView.vue
index d1c1412..1f01ec8 100644
--- a/src/views/auth/LoginView.vue
+++ b/src/views/auth/LoginView.vue
@@ -43,7 +43,29 @@
               >
                 没有账户？去注册
               </n-button>
-              <n-button type="primary" @click="login"> 登录</n-button>
+              <n-button type="primary" @click="showTurnstile = true"> 登录</n-button>
+              <!-- Turnstile -->
+              <n-modal
+                v-model:show="showTurnstile"
+                :mask-closable="false"
+                preset="card"
+                title="请完成人机验证"
+                style="min-width: 300px; width: min-content"
+              >
+                <vue-turnstile
+                  site-key="0x4AAAAAAAEXAhvwOKerpBsb"
+                  v-model="token"
+                  @error="
+                    (code) => {
+                      showTurnstile = false
+                      message.error(`验证码加载失败，错误代码: ${code}`)
+                    }
+                  "
+                  @unsupported="
+                    message.error('您的浏览器不支持加载验证码，请更换或升级浏览器后重试')
+                  "
+                />
+              </n-modal>
             </n-space>
           </n-space>
         </div>
@@ -53,21 +75,28 @@
 </template>
 
 <script setup>
-import { ref } from 'vue'
-import { useLoadingBar, useMessage } from 'naive-ui'
+import { ref, watch } from 'vue'
+import { useLoadingBar } from 'naive-ui'
 import router from '@router'
 import userData from '@/utils/stores/userData/store'
-import { sendErrorMessage } from '@/utils/message'
+import Message from '@/utils/message'
+import Notification from '@/utils/notification'
 import logger from '@/utils/logger'
 import api from '@/api'
 import { getUrlKey } from '@/utils/request'
+import VueTurnstile from 'vue-turnstile'
+
+const message = new Message()
+const notification = new Notification()
 
 const formRef = ref(null)
-const message = useMessage()
 const ldb = useLoadingBar()
 const qqLoginLoading = ref(false)
 // const oauthLogin_loading = ref(false)
 
+let token = ref('')
+let showTurnstile = ref(false)
+
 const model = ref([
   {
     username: '',
@@ -81,38 +110,13 @@ if (redirect !== null) {
   logger.info('Redirect after login: ' + redirect)
 }
 
-// if (token !== null) {
-//   onMounted(async () => {
-//     other_login.value = true
-//     let rs
-//     try {
-//       rs = await api.v2.auth.oauth.login.token(token)
-//     } catch (e) {
-//       sendErrorMessage('登录失败: ' + e)
-//       router.push('/auth/login')
-//     }
-//     if (!rs) return
-//     if (rs.status === 200) {
-//       message.success(rs.data.username + '，欢迎回来！')
-//       userData.commit('set_token', rs.data.token)
-//       userData.commit('set_user_info', rs.data)
-//       router.push(redirect || '/dashboard')
-//     }
-//   })
-// }
-
-// LoCyan OAuth 2.0
-// There is no need
-// function oauthLogin() {
-//   oauthLogin_loading.value = true
-//   window.location.href =
-//     'https://api-v2.locyanfrp.cn/api/v2/oauth/authorize?redirectUrl=http://' +
-//     window.location.host +
-//     '/auth/login'
-// }
+watch(token, (newToken, _) => {
+  showTurnstile.value = false
+  login(newToken)
+})
 
 // 登录
-async function login() {
+async function login(turnstileToken) {
   ldb.start()
   if (
     model.value.username === null ||
@@ -126,16 +130,16 @@ async function login() {
   }
   let rs
   try {
-    rs = await api.v2.auth.login(model.value.username, model.value.password)
+    rs = await api.v2.auth.login(model.value.username, model.value.password, turnstileToken)
   } catch (e) {
-    sendErrorMessage('请求失败: ' + e)
+    message.error('请求失败: ' + e)
   }
   if (!rs) {
     ldb.error()
     return
   }
   if (rs.status === 200) {
-    message.success(rs.data.username + '，欢迎回来！')
+    notification.success('登录成功', rs.data.username + '，欢迎回来！')
     userData.commit('set_token', rs.data.token)
     // console.log(res.data)
     userData.commit('set_user_info', rs.data)
@@ -154,7 +158,7 @@ async function qqLogin() {
   try {
     rs = await api.v2.auth.oauth.qq.login.get()
   } catch (e) {
-    sendErrorMessage('请求 QQ 登录失败: ' + e)
+    message.error('请求 QQ 登录失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
diff --git a/src/views/auth/RegisterView.vue b/src/views/auth/RegisterView.vue
index 2fb3f42..cdcbb8a 100644
--- a/src/views/auth/RegisterView.vue
+++ b/src/views/auth/RegisterView.vue
@@ -19,8 +19,12 @@
         <n-form-item label="密码" path="password">
           <n-input type="password" v-model:value="model.password" placeholder="密码" />
         </n-form-item>
-        <n-form-item label="确认密码" path="confirmpwd">
-          <n-input type="password" v-model:value="model.confirmpwd" placeholder="再次输入密码" />
+        <n-form-item label="确认密码" path="confirmPassword">
+          <n-input
+            type="password"
+            v-model:value="model.confirmPassword"
+            placeholder="再次输入密码"
+          />
         </n-form-item>
         <n-form-item label="QQ & 邮件验证码" path="qq">
           <n-grid cols="6" :x-gap="8" :y-gap="8" item-responsive>
diff --git a/src/views/auth/ResetPasswordView.vue b/src/views/auth/ResetPasswordView.vue
index 5a7adad..2435721 100644
--- a/src/views/auth/ResetPasswordView.vue
+++ b/src/views/auth/ResetPasswordView.vue
@@ -12,10 +12,10 @@
         v-show="sendResetEmail"
       >
         <n-form-item label="新密码" path="password">
-          <n-input type="text" v-model:value="model.password" placeholder="新密码" />
+          <n-input type="password" v-model:value="model.password" placeholder="新密码" />
         </n-form-item>
         <n-form-item label="重复密码" path="confirm_password">
-          <n-input type="text" v-model:value="model.confirmPassword" placeholder="重复密码" />
+          <n-input type="password" v-model:value="model.confirmPassword" placeholder="重复密码" />
         </n-form-item>
         <n-form-item label="验证" path="username">
           <n-grid cols="6" :x-gap="8" :y-gap="8" item-responsive>
diff --git a/src/views/auth/oauth/AppAuthView.vue b/src/views/auth/oauth/AppAuthView.vue
new file mode 100644
index 0000000..95288aa
--- /dev/null
+++ b/src/views/auth/oauth/AppAuthView.vue
@@ -0,0 +1,222 @@
+<template>
+  <div class="flex-center outbox">
+    <n-h2>应用授权</n-h2>
+    <n-spin style="width: 100%; max-width: 500px" v-if="!error" :show="loading">
+      <n-card>
+        <div v-if="valid">
+          <n-h3>{{ applicationName }}</n-h3>
+          <n-text>{{ applicationDescription }}</n-text>
+          <n-divider></n-divider>
+          <n-text>确认是否要授权此应用访问您的数据？这将授予应用获取以下权限：</n-text>
+          <div>
+            <n-ul>
+              <n-li v-for="permission in applicationPermissionRequested">
+                <n-text>{{ permission.node }}</n-text>
+                <n-text style="margin-left: 1rem; float: right">{{
+                  permission.description
+                }}</n-text>
+              </n-li>
+            </n-ul>
+          </div>
+          <n-divider></n-divider>
+          <div class="buttons">
+            <n-tooltip trigger="hover">
+              <template #trigger>
+                <n-avatar :src="userAvatarUrl" round></n-avatar>
+              </template>
+              将以此身份继续: {{ username }}
+            </n-tooltip>
+            <n-button
+              :loading="acceptLoading"
+              :disabled="acceptLoading"
+              type="primary"
+              @click="doAuthorize"
+              >同意</n-button
+            >
+            <n-button :loading="denyLoading" :disabled="denyLoading" @click="deny">拒绝</n-button>
+          </div>
+          <n-divider></n-divider>
+          <div style="text-align: center">
+            <n-text>
+              授权后，您将被重定向到以下地址:
+              <br />
+              {{ urlKeys.redirectUrl }}
+            </n-text>
+          </div>
+        </div>
+        <div v-else>
+          <n-text>无效请求，请检查 URL 参数</n-text>
+        </div>
+      </n-card>
+    </n-spin>
+    <div v-else>
+      <n-text>初始化失败，请重试</n-text>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.outbox {
+  margin: 3rem;
+}
+.flex-center {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.buttons .n-button {
+  margin-left: 1rem;
+  float: right;
+}
+</style>
+
+<script setup lang="ts">
+import userData from '@/utils/stores/userData/store'
+import { getUrlKey } from '@/utils/request'
+import { onMounted, ref } from 'vue'
+import Message from '@/utils/message'
+import Notification from '@/utils/notification'
+import api from '@/api'
+import logger from '@/utils/logger'
+
+const message = new Message()
+const notification = new Notification()
+
+const loading = ref(true)
+const error = ref(false)
+const valid = ref(true)
+
+const urlKeys = {
+  appId: getUrlKey('app_id'),
+  scopes: getUrlKey('scopes'),
+  redirectUrl: getUrlKey('redirect_url')
+}
+
+if (urlKeys.appId == null || urlKeys.scopes == null || urlKeys.redirectUrl == null) {
+  loading.value = false
+  valid.value = false
+}
+
+const applicationName = ref('')
+const applicationDescription = ref('')
+const applicationPermissionRequested = ref([])
+
+const username = ref('')
+const userAvatarUrl = ref('')
+
+username.value = userData.getters.get_username
+userAvatarUrl.value = userData.getters.get_avatar
+
+userData.subscribe((mutation: any, state: any) => {
+  if (mutation.type === 'set_avatar' || mutation.type === 'set_user_info') {
+    userAvatarUrl.value = state.avatar
+  }
+})
+
+const acceptLoading = ref(false)
+const denyLoading = ref(false)
+
+async function doAuthorize() {
+  acceptLoading.value = true
+  let permissionIds: Array<number> = []
+  applicationPermissionRequested.value.forEach((permission) => {
+    permissionIds.push(permission.id)
+  })
+  let rs
+  try {
+    rs = await api.v2.auth.oauth.authorize(
+      userData.getters.get_user_id,
+      urlKeys.appId,
+      urlKeys.redirectUrl,
+      permissionIds
+    )
+  } catch (e) {
+    logger.error(e)
+    message.error('授权失败: ' + e)
+    acceptLoading.value = false
+    return
+  }
+  if (!rs) return
+  if (rs.status === 200) {
+    message.success('授权成功，正在重定向，请不要刷新浏览器')
+    window.location.href = `${urlKeys.redirectUrl}?refresh_token=${rs.data.refresh_token}`
+  } else if (rs.status === 403) {
+    notification.error('授权失败', `服务器拒绝授权，原因: ${rs.message}`)
+  } else {
+    message.error('授权失败: ' + rs.message)
+  }
+  acceptLoading.value = false
+}
+function deny() {
+  denyLoading.value = true
+  window.location.href = urlKeys.redirectUrl + '?error=user.deny'
+}
+
+onMounted(async () => {
+  let permissionList
+
+  async function initAppInfo(): Promise<boolean> {
+    let rs
+    try {
+      rs = await api.v2.app.info(userData.getters.get_user_id, urlKeys.appId)
+    } catch (e) {
+      logger.error(e)
+      message.error(e)
+      return false
+    }
+    if (!rs) return false
+    if (rs.status === 200) {
+      applicationName.value = rs.data.name
+      applicationDescription.value = rs.data.description
+      return true
+    } else if (rs.status === 404) {
+      message.error('未找到此应用程序')
+      valid.value = false
+      return true
+    } else {
+      message.error(rs.message)
+    }
+    return false
+  }
+
+  async function initPermissions(): Promise<boolean> {
+    let rs
+    try {
+      rs = await api.v2.auth.oauth.permission.all(userData.getters.get_user_id)
+    } catch (e) {
+      logger.error(e)
+      message.error(e)
+      return false
+    }
+    if (!rs) return false
+    if (rs.status === 200) {
+      // logger.info(rs.data)
+      permissionList = rs.data.list
+      return true
+    } else {
+      message.error(rs.message)
+    }
+    return false
+  }
+
+  async function initAppPermissions(): Promise<boolean> {
+    const permissions = urlKeys.scopes.split(',')
+    permissionList.forEach((permission) => {
+      if (permissions.includes(permission.node))
+        applicationPermissionRequested.value.push(permission)
+    })
+    return true
+    // applicationPermissionRequested
+  }
+
+  let init1 = await initAppInfo()
+  let init2 = await initPermissions()
+  let init3 = await initAppPermissions()
+  if (init1 && init2 && init3) {
+    loading.value = false
+  } else {
+    error.value = true
+  }
+})
+</script>
diff --git a/src/views/callback/auth/oauth/qq/BindView.vue b/src/views/callback/auth/oauth/qq/BindView.vue
index c50ca12..291c833 100644
--- a/src/views/callback/auth/oauth/qq/BindView.vue
+++ b/src/views/callback/auth/oauth/qq/BindView.vue
@@ -13,18 +13,20 @@
 </template>
 
 <script setup>
-import { sendErrorMessage, sendSuccessMessage } from '@/utils/message'
+import Message from '@/utils/message'
 import { getUrlKey } from '@/utils/request'
 import api from '@/api'
 import userData from '@/utils/stores/userData/store'
 
+const message = new Message()
+
 let error = ref(false)
 let success = ref(false)
 let errorMessage = ref('')
 
-const username = userData.getters.get_username
+const user_id = userData.getters.get_user_id
 
-if (username == null) {
+if (user_id == null) {
   error.value = true
   errorMessage.value = '需要登录才能继续操作'
 }
@@ -35,15 +37,15 @@ if (!error.value && code !== null) {
   onMounted(async () => {
     let rs
     try {
-      rs = await api.v2.auth.oauth.qq.bind.post(username, code)
+      rs = await api.v2.auth.oauth.qq.bind.post(get_user_id, code)
     } catch (e) {
-      sendErrorMessage('登录失败: ' + e)
+      message.error('登录失败: ' + e)
       error.value = true
       errorMessage.value = '请求服务器失败'
     }
     if (!rs) return
     if (rs.status === 200) {
-      sendSuccessMessage('绑定成功')
+      message.success('绑定成功')
       success.value = true
     } else {
       error.value = true
diff --git a/src/views/callback/auth/oauth/qq/LoginView.vue b/src/views/callback/auth/oauth/qq/LoginView.vue
index 8b2e1e0..f65228a 100644
--- a/src/views/callback/auth/oauth/qq/LoginView.vue
+++ b/src/views/callback/auth/oauth/qq/LoginView.vue
@@ -13,11 +13,15 @@
 </template>
 
 <script setup>
-import { sendErrorMessage, sendSuccessMessage } from '@/utils/message'
 import userData from '@/utils/stores/userData/store'
 import { getUrlKey } from '@/utils/request'
 import router from '@router'
 import api from '@/api'
+import Message from '@/utils/message'
+import Notification from '@/utils/notification'
+
+const message = new Message()
+const notification = new Notification()
 
 let error = ref(false)
 let errorMessage = ref('')
@@ -30,17 +34,17 @@ if (code !== null) {
     try {
       rs = await api.v2.auth.oauth.qq.login.post(code)
     } catch (e) {
-      sendErrorMessage('登录失败: ' + e)
+      message.error('登录失败: ' + e)
       error.value = true
       errorMessage.value = '请求服务器失败'
     }
     if (!rs) return
     if (rs.status === 200) {
-      sendSuccessMessage(rs.data.username + '，欢迎回来！')
+      notification.success('登录成功', rs.data.username + '，欢迎回来！')
       userData.commit('set_token', rs.data.token)
       // console.log(rs.data)
       userData.commit('set_user_info', rs.data)
-      router.push(redirect || '/dashboard')
+      router.push('/dashboard')
     } else {
       error.value = true
       errorMessage.value = rs.message
diff --git a/src/views/games/MinecraftView.vue b/src/views/games/MinecraftView.vue
index b87efac..b3558d7 100644
--- a/src/views/games/MinecraftView.vue
+++ b/src/views/games/MinecraftView.vue
@@ -27,7 +27,7 @@
     <n-grid-item span="1">
       <n-h3>已创建的联机</n-h3>
       <n-spin :show="loading">
-        <n-empty v-if="!loading && created.length === 0" description="没有任何数据捏"></n-empty>
+        <n-empty v-if="created.length === 0" description="没有任何数据捏"></n-empty>
         <n-grid v-else cols="3" item-responsive :x-gap="12" :y-gap="12">
           <n-grid-item v-for="item in created" span="0:3 950:1">
             <n-space style="display: block">
@@ -45,8 +45,8 @@
                       style="margin: 1px"
                       type="info"
                       v-clipboard="() => item.code"
-                      v-clipboard:success="() => sendSuccessMessage('复制成功')"
-                      v-clipboard:error="() => sendErrorMessage('复制失败')"
+                      v-clipboard:success="() => message.success('复制成功')"
+                      v-clipboard:error="() => message.error('复制失败')"
                     >
                       复制联机代码
                     </n-button>
@@ -69,10 +69,12 @@
 
 <script setup>
 import api from '@/api'
-import { sendErrorMessage, sendSuccessMessage } from '@/utils/message'
+import Message from '@/utils/message'
 import userData from '@/utils/stores/userData/store'
 import { ref } from 'vue'
 
+const message = new Message()
+
 const loading = ref(true)
 const createLoading = ref(false)
 
@@ -83,9 +85,9 @@ let created = ref([])
 async function initProxyList() {
   let rs
   try {
-    rs = await api.v2.proxy.all(userData.getters.get_username)
+    rs = await api.v2.proxy.all(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求隧道列表失败: ' + e)
+    message.error('请求隧道列表失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
@@ -102,8 +104,10 @@ async function initProxyList() {
       })
     })
     if (proxies.length !== 0) selected.value = proxies[0].id
+  } else if (rs.status === 404) {
+    // Nothing to do here
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
   }
 }
 
@@ -111,16 +115,16 @@ async function initCreatedGames() {
   created.value.length = 0
   let rs
   try {
-    rs = await api.v2.minecraft.game.all(userData.getters.get_username)
+    rs = await api.v2.minecraft.game.all(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求游戏列表失败: ' + e)
+    message.error('请求游戏列表失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
     rs.data.list.forEach((value) => created.value.push(value))
     loading.value = false
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
   }
 }
 
@@ -129,9 +133,9 @@ async function createMinecraftGame() {
   let selectedId = selected.value
   let rs
   try {
-    rs = await api.v2.minecraft.game.root.post(userData.getters.get_username, selectedId)
+    rs = await api.v2.minecraft.game.root.post(userData.getters.get_user_id, selectedId)
   } catch (e) {
-    sendErrorMessage('创建联机失败: ' + e)
+    message.error('创建联机失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
@@ -139,7 +143,7 @@ async function createMinecraftGame() {
     await initCreatedGames()
     loading.value = false
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
   }
   createLoading.value = false
 }
@@ -147,18 +151,16 @@ async function createMinecraftGame() {
 async function deleteMinecraftGame(code) {
   let rs
   try {
-    rs = await api.v2.minecraft.game.root.delete(userData.getters.get_username, code)
+    rs = await api.v2.minecraft.game.root.delete(userData.getters.get_user_id, code)
   } catch (e) {
-    sendErrorMessage('删除联机失败: ' + e)
+    message.error('删除联机失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
-    created.value = created.value.filter((item) => {
-      return item.code !== code
-    })
-    sendSuccessMessage('删除成功')
+    created.value = created.value.filter((item) => item.code !== code)
+    message.success('删除成功')
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
   }
 }
 
diff --git a/src/views/proxies/AddView.vue b/src/views/proxies/AddView.vue
index 8882f86..6ab9573 100644
--- a/src/views/proxies/AddView.vue
+++ b/src/views/proxies/AddView.vue
@@ -139,12 +139,15 @@ n-input {
 <script setup>
 import { onMounted, ref } from 'vue'
 import userData from '@/utils/stores/userData/store'
-import { sendErrorMessage } from '@/utils/message'
-import { sendErrorDialog, sendSuccessDialog } from '@/utils/dialog'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
 import api from '@/api'
 import logger from '@/utils/logger'
 import { CheckmarkCircle, CloseCircle } from '@vicons/ionicons5'
 
+const message = new Message()
+const dialog = new Dialog()
+
 const loading = ref(true)
 
 localStorage.setItem('ViewPage', 'add_proxy')
@@ -282,29 +285,31 @@ function proxyTypeSelectChangeHandle(value) {
 
 async function randomPort() {
   if (proxyInfo.value.nodeId === 0) {
-    sendErrorDialog('请先选择你需要的节点')
+    dialog.error('请先选择你需要的节点')
     return
   }
   let rs
   try {
-    rs = await api.v1.Proxies.GetRandomPort(proxyInfo.value.nodeId)
+    rs = await api.v2.node.port.random(userData.getters.get_user_id, proxyInfo.value.nodeId)
   } catch (e) {
     logger.error(e)
-    sendErrorMessage('请求隧道端口失败: ' + e)
+    message.error('请求隧道端口失败: ' + e)
   }
   if (!rs) return
   if (rs.status === 200) {
     proxyInfo.value.remotePort = rs.data.port
+  } else {
+    message.error(rs.message)
   }
 }
 
 async function addProxy() {
   if (editCheck.value === false) {
-    sendErrorDialog('参数检查未通过，请检查信息格式是否正确')
+    dialog.error('参数检查未通过，请检查信息格式是否正确')
     return
   }
   const tunnelCreateInfo = {
-    username: userData.getters.get_username,
+    user_id: userData.getters.get_user_id,
     name: proxyInfo.value.proxyName,
     localIp: proxyInfo.value.localIp,
     proxyType: proxyInfo.value.proxyType,
@@ -320,7 +325,7 @@ async function addProxy() {
   let rs
   try {
     rs = await api.v2.proxy.root.post(
-      tunnelCreateInfo.username,
+      tunnelCreateInfo.user_id,
       tunnelCreateInfo.name,
       tunnelCreateInfo.localIp,
       tunnelCreateInfo.proxyType,
@@ -334,15 +339,15 @@ async function addProxy() {
     )
   } catch (e) {
     logger.error(e)
-    sendErrorMessage(e)
-    sendErrorDialog('添加失败，再试一次吧~')
+    message.error(e)
+    message.dialog('添加失败，再试一次吧~')
     loading.value = false
   }
   if (!rs) return
   if (rs.status === 200) {
-    sendSuccessDialog('添加成功')
+    message.success('添加成功')
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
   }
   loading.value = false
 }
@@ -351,10 +356,10 @@ onMounted(async () => {
   loading.value = true
   let rs
   try {
-    rs = await api.v2.node.all()
+    rs = await api.v2.node.all(userData.getters.get_user_id)
   } catch (e) {
     logger.error(e)
-    sendErrorMessage('请求节点列表失败: ' + e)
+    message.error('请求节点列表失败: ' + e)
     loading.value = false
   }
   if (!rs) return
diff --git a/src/views/proxies/ConfigView.vue b/src/views/proxies/ConfigView.vue
index e8b8c11..aebe841 100644
--- a/src/views/proxies/ConfigView.vue
+++ b/src/views/proxies/ConfigView.vue
@@ -13,8 +13,8 @@
           type="info"
           style="margin-top: 30px"
           v-clipboard="() => code"
-          v-clipboard:success="() => sendSuccessMessage('复制成功')"
-          v-clipboard:error="() => sendErrorMessage('复制失败')"
+          v-clipboard:success="() => message.success('复制成功')"
+          v-clipboard:error="() => message.error('复制失败')"
         >
           复制
         </n-button>
@@ -68,11 +68,13 @@ set_real_ip_from 127.0.0.1;"
 <script setup>
 import { ref } from 'vue'
 import userData from '@/utils/stores/userData/store'
-import { sendSuccessMessage, sendErrorMessage } from '@/utils/message'
+import Message from '@/utils/message'
 // import clipboard from '@/utils/clipboard'
 import api from '@/api'
 import logger from '@/utils/logger'
 
+const message = new Message()
+
 const loading = ref(true)
 
 const node = ref('')
@@ -99,10 +101,10 @@ const code = ref('')
 onMounted(async () => {
   let rs
   try {
-    rs = await api.v2.node.all()
+    rs = await api.v2.node.all(userData.getters.get_user_id)
   } catch (e) {
     logger.error(e)
-    sendErrorMessage('请求节点列表失败: ' + e)
+    message.error('请求节点列表失败: ' + e)
   }
   if (!rs) return
   let i = 0
@@ -133,17 +135,17 @@ async function updateValue(value) {
   loading.value = true
   let rs
   try {
-    rs = await api.v2.proxy.config(userData.getters.get_username, null, value)
+    rs = await api.v2.proxy.config(userData.getters.get_user_id, null, value)
   } catch (e) {
     logger.error(e)
-    sendErrorMessage('请求获取隧道配置文件失败: ' + e)
+    message.error('请求获取隧道配置文件失败: ' + e)
     loading.value = false
   }
   if (!rs) return
   if (rs.status === 200) {
     code.value = rs.data.config
   } else {
-    sendErrorMessage(rs.message)
+    message.error(rs.message)
     code.value = '该节点下没有任何隧道捏~'
   }
   loading.value = false
diff --git a/src/views/proxies/ProxiesView.vue b/src/views/proxies/ProxiesView.vue
index 08cdaf6..70a4c60 100644
--- a/src/views/proxies/ProxiesView.vue
+++ b/src/views/proxies/ProxiesView.vue
@@ -4,8 +4,8 @@
     v-model:show="showEditModal"
     class="custom-card"
     preset="card"
-    :style="bodyStyle"
-    :title="'编辑隧道 - 隧道ID: ' + String(selectProxyID)"
+    style="max-width: 600px"
+    :title="'编辑隧道 - ID: ' + String(selectProxyID)"
     size="huge"
     :bordered="false"
     :segmented="segmented"
@@ -89,7 +89,7 @@
     v-model:show="showDetailModal"
     class="custom-card"
     preset="card"
-    :style="bodyStyle"
+    style="max-width: 600px"
     :title="'详细信息 - 隧道ID: ' + selectProxyID"
     size="huge"
     :bordered="false"
@@ -122,8 +122,8 @@
           secondary
           type="primary"
           v-clipboard="() => quickStartCommand"
-          v-clipboard:success="() => sendSuccessMessage('复制成功')"
-          v-clipboard:error="() => sendErrorMessage('复制失败')"
+          v-clipboard:success="() => message.success('复制成功')"
+          v-clipboard:error="() => message.error('复制失败')"
         >
           复制
         </n-button>
@@ -137,10 +137,7 @@
     <n-text type="primary"> 隧道列表</n-text>
   </n-h1>
   <n-spin :show="loading">
-    <n-empty
-      v-if="!loading && proxiesList.length === 0"
-      description="一个隧道都没找到哦~"
-    ></n-empty>
+    <n-empty v-if="proxiesList.length === 0" description="一个隧道都没找到哦~"></n-empty>
     <n-grid v-else cols="4" item-responsive>
       <n-gi
         v-for="item in proxiesList"
@@ -260,25 +257,23 @@
 
 <script setup>
 import { computed, ref } from 'vue'
-import { useDialog } from 'naive-ui'
 import userData from '@/utils/stores/userData/store'
-import { sendErrorMessage, sendSuccessMessage } from '@/utils/message'
-import { sendErrorDialog, sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
+import Message from '@/utils/message'
+import Dialog from '@/utils/dialog'
 import api from '@/api'
 import logger from '@/utils/logger'
 import router from '@router'
 
+const message = new Message()
+const dialog = new Dialog()
+
 const loading = ref(true)
 const showEditModal = ref(false)
 const showDetailModal = ref(false)
 const selectProxyID = ref(0)
 const indexOfProxies = ref(0)
-const dialog = useDialog()
 const linkAddr = ref('')
 const editServerList = ref([])
-const bodyStyle = {
-  width: '600px'
-}
 const segmented = {
   content: 'soft',
   footer: 'soft'
@@ -325,52 +320,38 @@ function makeLinkAddr(id) {
 }
 
 async function launchProxyThroughApplication(id) {
-  dialog.success({
-    title: '通知',
-    content: '该功能需要配合 C# 客户端或 NyaLCF 使用!',
-    positiveText: '已经安装好了',
-    negativeText: '没安装...',
+  dialog.success('该功能需要配合 C# 客户端或 NyaLCF 使用!', {
     onPositiveClick: () => {
       const url = 'locyanfrp://' + userData.getters.get_frp_token + '/' + id
       window.open(url)
     },
     onNegativeClick: () => {
       router.push({ name: 'Software' })
-    },
-    onMaskClick: () => {
-      sendSuccessMessage('你取消了操作！')
     }
   })
 }
 
 async function forceDownProxy(proxyId) {
-  dialog.warning({
-    title: '警告',
-    content: '确认要强制下线隧道吗？这将会使该隧道下线',
-    positiveText: '确认',
-    negativeText: '还是算了吧~',
+  dialog.warning('确认要强制下线隧道吗？这将会使该隧道下线', {
     onPositiveClick: async () => {
       let rs
       try {
-        rs = await api.v2.proxy.down(userData.getters.get_username, proxyId)
+        rs = await api.v2.proxy.down(userData.getters.get_user_id, proxyId)
       } catch (e) {
         logger.error(e)
-        sendErrorMessage(`请求强制下线隧道失败: ${e}`)
+        message.error(`请求强制下线隧道失败: ${e}`)
       }
       if (!rs) return
       if (rs.status === 200) {
-        sendSuccessMessage('已发送隧道下线指令')
+        message.success('已发送隧道下线指令')
       }
-    },
-    onMaskClick: () => {
-      sendSuccessMessage('你取消了操作！')
     }
   })
 }
 
 async function editProxy(proxyId) {
   if (editCheck.value === false) {
-    sendWarningDialog('参数检查未通过，请检查信息格式是否正确！')
+    message.warning('参数检查未通过，请检查信息格式是否正确！')
   }
 
   const editInfo = {
@@ -386,7 +367,7 @@ async function editProxy(proxyId) {
   let rs
   try {
     rs = await api.v2.proxy.update(
-      userData.getters.get_username,
+      userData.getters.get_user_id,
       editInfo.proxyId,
       editInfo.proxyName,
       editInfo.proxyType,
@@ -400,8 +381,8 @@ async function editProxy(proxyId) {
       null
     )
   } catch (e) {
-    sendErrorMessage('请求修改隧道信息失败: ' + e)
-    sendErrorDialog('修改隧道信息失败，再试一次吧~')
+    message.error('请求修改隧道信息失败: ' + e)
+    dialog.error('修改隧道信息失败，再试一次吧~')
   }
   if (!rs) return
   if (rs.status === 200) {
@@ -409,9 +390,9 @@ async function editProxy(proxyId) {
     await initList()
     // 关闭模态框
     showEditModal.value = false
-    sendSuccessDialog('修改成功')
+    message.success('修改成功')
   } else {
-    sendErrorDialog(rs.message)
+    message.error(rs.message)
   }
 }
 
@@ -528,9 +509,9 @@ const serverList = ref([
 async function initList() {
   let rs1
   try {
-    rs1 = await api.v2.node.all()
+    rs1 = await api.v2.node.all(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求节点列表失败: ' + e)
+    message.error('请求节点列表失败: ' + e)
   }
   if (!rs1) return
   let i = 0
@@ -568,18 +549,19 @@ async function initList() {
 
   let rs2
   try {
-    rs2 = await api.v2.proxy.all(userData.getters.get_username)
+    rs2 = await api.v2.proxy.all(userData.getters.get_user_id)
   } catch (e) {
-    sendErrorMessage('请求隧道列表失败: ' + e)
+    message.error('请求隧道列表失败: ' + e)
   }
   if (!rs2) return
   if (rs2.status === 200) {
     proxiesList.value = rs2.data.list
     loading.value = false
   } else if (rs2.status === 404) {
+    loading.value = false
     // sendErrorMessage('你还没有隧道，先创建一个吧？')
   } else {
-    sendErrorMessage(rs2.message)
+    message.error(rs2.message)
   }
 }
 
@@ -609,25 +591,19 @@ function deleteProxy(id) {
       loading.value = true
       let rs
       try {
-        rs = await api.v2.proxy.root.delete(userData.getters.get_username, proxiesList.value[id].id)
+        rs = await api.v2.proxy.root.delete(userData.getters.get_user_id, proxiesList.value[id].id)
       } catch (e) {
-        sendErrorMessage('请求删除隧道失败: ' + e)
+        message.error('请求删除隧道失败: ' + e)
         loading.value = false
       }
       if (!rs) return
       if (rs.status === 200) {
-        sendSuccessMessage('删除成功！')
+        message.success('删除成功！')
         proxiesList.value.splice(id, 1)
       } else {
-        sendErrorMessage(rs.message)
+        message.error(rs.message)
       }
       loading.value = false
-    },
-    onNegativeClick: () => {
-      sendSuccessMessage('你取消了操作！')
-    },
-    onMaskClick: () => {
-      sendSuccessMessage('你取消了操作！')
     }
   })
 }
diff --git a/tsconfig.app.json b/tsconfig.app.json
index e14c754..44a400b 100644
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -8,7 +8,10 @@
 
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": ["./src/*"],
+      "@views/*": ["./src/views/*"],
+      "@components/*": ["./src/components/*"],
+      "@router": ["./src//router/index.js"],
     }
   }
 }