From 6bc644a6ae26af9763a3d178afa59b875fb73c1a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=8F=E6=B2=AB=E8=8A=B1=E7=81=ABzzz=F0=9F=8C=99?=
 <xmcn@1l1.icu>
Date: Sat, 14 Sep 2024 20:38:37 +0800
Subject: [PATCH] =?UTF-8?q?[*]=20=E4=BF=AE=E5=A4=8D=E7=99=BB=E5=87=BA?=
 =?UTF-8?q?=EF=BC=8C=E6=9B=B4=E6=94=B9=E6=9C=AC=E5=9C=B0=E5=AD=98=E5=82=A8?=
 =?UTF-8?q?=E8=AF=BB=E5=8F=96=E9=80=BB=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _deprecated/LanLobby.vue                   |  12 +-
 src/App.vue                                |  18 +--
 src/components/MainNav.vue                 |   6 +-
 src/components/UserInfo.vue                |  30 ++--
 src/main.js                                |   7 +-
 src/router/index.js                        |  19 +--
 src/twemoji-amazing.css                    |   4 +-
 src/utils/profile.js                       |   5 +-
 src/utils/request.js                       |   4 +-
 src/utils/stores/loadFromLocal.js          |  36 +++++
 src/utils/stores/{store.js => userData.js} | 175 ++++++++++++++-------
 src/views/AddProxies.vue                   |   8 +-
 src/views/Config.vue                       |   6 +-
 src/views/Dashboard.vue                    |  26 +--
 src/views/Donate.vue                       |  12 +-
 src/views/IcpCheck.vue                     |  10 +-
 src/views/Login.vue                        |  14 +-
 src/views/NewYear.vue                      |   4 +-
 src/views/Prize.vue                        |   7 +-
 src/views/Proxies.vue                      |  26 ++-
 src/views/RealName.vue                     |  12 +-
 src/views/Sign.vue                         |   6 +-
 22 files changed, 271 insertions(+), 176 deletions(-)
 create mode 100644 src/utils/stores/loadFromLocal.js
 rename src/utils/stores/{store.js => userData.js} (52%)

diff --git a/_deprecated/LanLobby.vue b/_deprecated/LanLobby.vue
index 0a3913c..60ee2ab 100644
--- a/_deprecated/LanLobby.vue
+++ b/_deprecated/LanLobby.vue
@@ -203,7 +203,7 @@
 <script setup>
 import { ref } from 'vue'
 import { get, post, deleteReq } from '@/utils/request'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendSuccessDialog } from '@/utils/dialog'
 
 const bodyStyle = {
@@ -286,7 +286,7 @@ const lobbyValue = ref({
   client_download_url: '',
   client_download_type: '',
   client_download_password: '',
-  username: store.getters.get_username
+  username: userData.getters.get_username
 })
 
 const Proxies_Select = ref([])
@@ -315,7 +315,7 @@ function getGameList() {
 function getLobbys(game_name) {
   const rs = get(
     'https://api-v2.locyanfrp.cn/api/v2/lan/public/getListByGameName?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&game_name=' +
       game_name
   )
@@ -328,7 +328,7 @@ function getLobbys(game_name) {
 
 function getPrivateLobby() {
   const rs = get(
-    'https://api-v2.locyanfrp.cn/api/v2/lan/private/list?username=' + store.getters.get_username
+    'https://api-v2.locyanfrp.cn/api/v2/lan/private/list?username=' + userData.getters.get_username
   )
   rs.then((res) => {
     if (res.status === 200) {
@@ -374,7 +374,7 @@ function createLobby() {
 function deleteLobby(id) {
   const rs = deleteReq(
     'https://api-v2.locyanfrp.cn/api/v2/lan/private/deleteReq?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&id=' +
       String(id)
   )
@@ -389,7 +389,7 @@ function deleteLobby(id) {
 function getAddress(proxyId, nodeId) {
   const rs = get(
     'https://api-v2.locyanfrp.cn/api/v2/lan/public/address?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&proxy_id=' +
       proxyId +
       '&node_id=' +
diff --git a/src/App.vue b/src/App.vue
index 6cff0f8..a057e2a 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -8,7 +8,7 @@
             <loadingbar />
             <ndialog />
             <Notification />
-            <MainNav v-if="store.getters.get_token" />
+            <MainNav v-if="userData.getters.get_token" />
             <GuestNav v-else />
           </n-notification-provider>
         </n-dialog-provider>
@@ -32,7 +32,7 @@ import MainNav from './components/MainNav.vue'
 import GuestNav from './components/GuestNav.vue'
 import Notification from './components/Notification.vue'
 import { computed } from 'vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import hljs from 'highlight.js/lib/core'
 import ini from 'highlight.js/lib/languages/ini'
 import nginx from 'highlight.js/lib/languages/nginx'
@@ -65,10 +65,10 @@ if (inited === false) {
 }
 
 setInterval(async () => {
-  if (store.getters.get_token) {
+  if (userData.getters.get_token) {
     let rs
     try {
-      rs = await api.v2.users.info(store.getters.get_username)
+      rs = await api.v2.users.info(userData.getters.get_username)
     } catch (e) {
       sendWarningMessage('查询用户信息失败: ' + e + '，请重新登录后台！')
       logout()
@@ -76,14 +76,14 @@ setInterval(async () => {
     if (!rs) return
     if (rs.status === 200) {
       // console.log(rs)
-      store.commit('set_user_email', rs.data.email)
-      store.commit('set_user_inbound', rs.data.inbound)
-      store.commit('set_user_outbound', rs.data.inbound)
-      store.commit('set_user_traffic', rs.data.traffic)
+      userData.commit('set_user_email', rs.data.email)
+      userData.commit('set_user_inbound', rs.data.inbound)
+      userData.commit('set_user_outbound', rs.data.inbound)
+      userData.commit('set_user_traffic', rs.data.traffic)
       // localStorage.setItem('proxies', res.proxies_num)
       // localStorage.setItem('traffic', res.traffic)
       // localStorage.setItem('set_limit', res)
-      // store.set_limit({
+      // userData.set_limit({
       //   inbound: res.inbound,
       //   outbound: res.outbound,
       // })
diff --git a/src/components/MainNav.vue b/src/components/MainNav.vue
index 52aa183..51bc970 100644
--- a/src/components/MainNav.vue
+++ b/src/components/MainNav.vue
@@ -106,7 +106,7 @@
 import { h, ref, onMounted } from 'vue'
 import { NGradientText } from 'naive-ui'
 import SideBar from './MainSideBar.vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import router from '@/router/index'
 import UserInfo, { changeUserInfoShow } from './UserInfo.vue'
 import { get } from '@/utils/request'
@@ -124,7 +124,7 @@ const hitokoto_content = ref('Loading')
 if (document.body.clientWidth >= 1000) {
   collapsed.value = false
 }
-avatar.value = store.getters.get_avatar
+avatar.value = userData.getters.get_avatar
 
 // 刚进入面板不展示用户信息框
 changeUserInfoShow(false)
@@ -138,7 +138,7 @@ function renderIcon(icon) {
 }
 
 function getStyle() {
-  if (!store.getters.get_token) {
+  if (!userData.getters.get_token) {
     return 'display: none;'
   }
 }
diff --git a/src/components/UserInfo.vue b/src/components/UserInfo.vue
index a1b8b93..8216d73 100644
--- a/src/components/UserInfo.vue
+++ b/src/components/UserInfo.vue
@@ -1,9 +1,9 @@
 <template>
   <n-drawer v-model:show="show" :width="dialogWidth">
     <n-drawer-content title="个人信息" closable>
-      <n-avatar round :size="80" :src="store.getters.get_avatar" />
+      <n-avatar round :size="80" :src="userData.getters.get_avatar" />
       <br />
-      <n-text style="font-size: 20px">{{ store.getters.get_username }} </n-text>
+      <n-text style="font-size: 20px">{{ userData.getters.get_username }} </n-text>
       <br />
       <n-text style="color: gray"
         >本站使用 Cravatar 公用头像库 API ，可以前往
@@ -91,7 +91,7 @@
 
 <script setup>
 import { logout } from '@/utils/profile'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendSuccessMessage } from '@/utils/message'
 import { onMounted, ref } from 'vue'
 import { useDialog } from 'naive-ui'
@@ -117,7 +117,7 @@ const bindQQ = ref({
 })
 
 const tEmail = ref({
-  email: store.getters.get_email,
+  email: userData.getters.get_email,
   msg: '修改',
   isEditDisable1: 'display:none',
   isEditDisable: true,
@@ -141,7 +141,7 @@ const tPassword = ref({
 onMounted(async () => {
   let rs
   try {
-    rs = await api.v2.oauth.qq.check(store.getters.get_username)
+    rs = await api.v2.oauth.qq.check(userData.getters.get_username)
   } catch (e) {
     logger.error(e)
     bindQQ.value.isDisable = true
@@ -173,8 +173,8 @@ async function changeEmail() {
     ldb.start()
     try {
       rs = await api.v1.Account.EditEmail(
-        store.getters.get_username,
-        store.getters.get_token,
+        userData.getters.get_username,
+        userData.getters.get_token,
         tEmail.value.email,
         tEmail.value.verify.code
       )
@@ -214,8 +214,8 @@ async function sendChangeEmailCode() {
   let rs
   try {
     rs = await api.v1.Account.SendEditMail(
-      store.getters.get_username,
-      store.getters.get_token,
+      userData.getters.get_username,
+      userData.getters.get_token,
       tEmail.value.email
     )
   } catch (e) {
@@ -243,7 +243,7 @@ async function doBindQQ() {
   binding.value = true
   let rs
   try {
-    rs = await api.v2.oauth.qq.bind(store.getters.get_username)
+    rs = await api.v2.oauth.qq.bind(userData.getters.get_username)
   } catch (e) {
     logger.error(e)
     message.error('请求失败: ' + e)
@@ -259,7 +259,7 @@ async function unBindQQ() {
   binding.value = true
   let rs
   try {
-    rs = await api.v2.oauth.qq.unbind(store.getters.get_username)
+    rs = await api.v2.oauth.qq.unbind(userData.getters.get_username)
   } catch (e) {
     logger.error(e)
     binding.value = false
@@ -304,7 +304,7 @@ async function changePassword() {
     return
   }
   const data = {
-    username: store.getters.get_username,
+    username: userData.getters.get_username,
     old_password: tPassword.value.oldPaxsword,
     new_password: tPassword.value.newPassword
   }
@@ -331,7 +331,7 @@ async function resetFrpToken() {
   resetFrpTokenLoading.value = true
 
   const data = {
-    username: store.getters.get_username
+    username: userData.getters.get_username
   }
 
   dialog.warning({
@@ -352,7 +352,7 @@ async function resetFrpToken() {
       if (!rs) return
       if (rs.status === 200) {
         resetFrpTokenLoading.value = false
-        store.commit('set_frp_token', rs.data.token)
+        userData.commit('set_frp_token', rs.data.token)
         sendSuccessMessage('重置成功')
       } else {
         resetFrpTokenLoading.value = false
@@ -369,7 +369,7 @@ async function exitAllDevices() {
   exitAllDevicesLoading.value = true
 
   const data = {
-    username: store.getters.get_username
+    username: userData.getters.get_username
   }
 
   dialog.warning({
diff --git a/src/main.js b/src/main.js
index 00783df..cd70425 100644
--- a/src/main.js
+++ b/src/main.js
@@ -8,12 +8,13 @@ import ndialog from './components/Dialog.vue'
 import router from './router/index'
 import axios from 'axios'
 import VueAxios from 'vue-axios'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { printTitle } from '@/utils/title'
 import Clipboard from 'v-clipboard'
+import loadFromLocal from './utils/stores/loadFromLocal'
 
 const app = createApp(App)
-app.use(store)
+app.use(userData)
 app.use(router)
 // app.use(websocket, '', {
 //     connectManually: true,
@@ -32,5 +33,7 @@ app.use(VueAxios, axios)
 app.component('message', message)
 app.component('loadingbar', loadingbar)
 app.component('ndialog', ndialog)
+
+loadFromLocal()
 app.mount('#app')
 printTitle()
diff --git a/src/router/index.js b/src/router/index.js
index 345fffd..6169ad5 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,6 +1,6 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { changeMainSideBarShow } from '../components/MainNav.vue'
 import { changeShowGuestSideBar } from '../components/GuestNav.vue'
 import { setSideBarActiveKey } from '../components/MainSideBar.vue'
@@ -158,26 +158,23 @@ const router = createRouter({
 
 // // 检查本地存储是否存在token，若存在则直接使用
 // if (localStorage.getItem('token')) {
-//   store.commit('set_token', localStorage.getItem('token'))
+//   userData.commit('set_token', localStorage.getItem('token'))
 // }
 
 // 检测到已登录之后自动跳转 /dashboard 的界面
 const _autoRedirectLogined = ['Login', 'Register', 'ResetPassword']
 
 router.beforeEach((to, from, next) => {
+  logger.info(`Routing from ${from.name} to ${to.name}`)
   startLoadingBar()
   if (_autoRedirectLogined.includes(to.name)) {
-    const hasToken = store.getters.get_token != ''
-    logger.info(`Has token: ${hasToken}${hasToken ? ` ${store.getters.get_token}` : ''}`)
+    const hasToken = userData.getters.get_token != ''
+    logger.info(`Has token: ${hasToken}${hasToken ? ` ${userData.getters.get_token}` : ''}`)
     if (hasToken) next({ name: 'Dashboard' })
     else next()
-    return
-  }
-  if (to.name === 'MainPage') {
+  } else if (to.name === 'MainPage') {
     next()
-    return
-  }
-  if (!store.getters.get_token) {
+  } else if (userData.getters.get_token == '') {
     next({ name: 'Login', query: { redirect: location.pathname } })
   } else {
     next()
@@ -214,7 +211,7 @@ router.afterEach((to) => {
       changeShowGuestSideBar(false)
   }
 
-  if (store.getters.get_token) {
+  if (userData.getters.get_token) {
     setSideBarActiveKey(to.name)
   } else {
     setGuestSideBarActiveKey(to.name)
diff --git a/src/twemoji-amazing.css b/src/twemoji-amazing.css
index babed14..ed84a94 100644
--- a/src/twemoji-amazing.css
+++ b/src/twemoji-amazing.css
@@ -1014,7 +1014,7 @@
 .twa-control-knobs {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f39b.svg');
 }
-.twa-convenience-store {
+.twa-convenience-userData {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f3ea.svg');
 }
 .twa-cook {
@@ -1560,7 +1560,7 @@
 .twa-delivery-truck {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f69a.svg');
 }
-.twa-department-store {
+.twa-department-userData {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f3ec.svg');
 }
 .twa-derelict-house {
diff --git a/src/utils/profile.js b/src/utils/profile.js
index 34ff8db..1e6c3a6 100644
--- a/src/utils/profile.js
+++ b/src/utils/profile.js
@@ -1,6 +1,6 @@
 import axios from 'axios'
 import { ref } from 'vue'
-import store from './stores/store'
+import userData from './stores/userData'
 import router from '@/router/index'
 import { get } from './request'
 import { sendWarningMessage } from './message'
@@ -50,7 +50,6 @@ export function getProxies(username, token) {
 }
 
 export function logout() {
-  store.commit('delete_token')
-  store.commit('delete_user_info')
+  userData.commit('delete_user_info')
   router.push('/login')
 }
diff --git a/src/utils/request.js b/src/utils/request.js
index 736ad9c..8d949b3 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -3,7 +3,7 @@ import axios from 'axios'
 // 序列化
 import QS from 'qs'
 // vuex
-import store from './stores/store'
+import userData from './stores/userData'
 import router from '@/router/index'
 import Base64 from 'qs/lib/utils'
 import { sendErrorMessage } from './message'
@@ -33,7 +33,7 @@ instance.interceptors.request.use(
     // 每次发送请求之前判断vuex中是否存在token
     // 如果存在，则统一在http请求的header都加上token，这样后台根据token判断你的登录情况
     // 即使本地存在token，也有可能token是过期的，所以在响应拦截器中要对返回状态进行判断
-    const token = store.getters.get_token
+    const token = userData.getters.get_token
     // 2024-09-07 Muska_Ami: 修复 Token 泄露问题 只有在指定域名请求时才应该添加 Token
     const url = new URL(config.url)
     logger.info(url.hostname + ', ' + url.pathname + ', ' + tokenDomains.includes(url.hostname))
diff --git a/src/utils/stores/loadFromLocal.js b/src/utils/stores/loadFromLocal.js
new file mode 100644
index 0000000..8d445e5
--- /dev/null
+++ b/src/utils/stores/loadFromLocal.js
@@ -0,0 +1,36 @@
+import userData from './userData'
+
+const defStateData = {
+  token: '',
+  username: '',
+  email: '',
+  frptoken: '',
+  inbound: 0,
+  outbound: 0,
+  avatar: '',
+  traffic: '',
+  proxies_num: 0
+}
+
+const loadFromLocal = () => {
+  userData.commit('set_token', localStorage.getItem('token') ?? defStateData.token)
+  userData.commit('set_username', localStorage.getItem('username') ?? defStateData.username)
+  userData.commit('set_user_email', localStorage.getItem('email') ?? defStateData.email)
+  userData.commit('set_frp_token', localStorage.getItem('frptoken') ?? defStateData.frptoken)
+  userData.commit(
+    'set_user_inbound',
+    Number(localStorage.getItem('inbound') ?? defStateData.inbound)
+  )
+  userData.commit(
+    'set_user_outbound',
+    Number(localStorage.getItem('outbound') ?? defStateData.outbound)
+  )
+  userData.commit('set_avatar', localStorage.getItem('avatar') ?? defStateData.avatar)
+  userData.commit(
+    'set_user_traffic',
+    Number(localStorage.getItem('traffic') ?? defStateData.traffic)
+  )
+  // userData.commit('set_proxies_num', localStorage.getItem('proxies_num'))
+}
+
+export default loadFromLocal
diff --git a/src/utils/stores/store.js b/src/utils/stores/userData.js
similarity index 52%
rename from src/utils/stores/store.js
rename to src/utils/stores/userData.js
index ddd540a..57e70c1 100644
--- a/src/utils/stores/store.js
+++ b/src/utils/stores/userData.js
@@ -1,120 +1,179 @@
 import vuex from 'vuex'
 
+const stateData = {
+  token: '',
+  username: '',
+  email: '',
+  frptoken: '',
+  inbound: 0,
+  outbound: 0,
+  avatar: '',
+  traffic: '',
+  proxies_num: 0
+}
+const defStateData = {
+  token: '',
+  username: '',
+  email: '',
+  frptoken: '',
+  inbound: 0,
+  outbound: 0,
+  avatar: '',
+  traffic: '',
+  proxies_num: 0
+}
+
 // 用Vuex.Store对象用来记录token
-const store = new vuex.Store({
-  state: {
-    token: '',
-    username: '',
-    email: '',
-    frptoken: '',
-    inbound: 0,
-    outbound: 0,
-    avatar: '',
-    traffic: '',
-    proxies_num: 0
-  },
+const userData = new vuex.Store({
+  state: stateData,
   getters: {
     get_token(state) {
-      return state.token || localStorage.getItem('token') || ''
+      return state.token
     },
     get_username(state) {
-      return state.username || localStorage.getItem('username') || ''
+      return state.username
     },
     get_email(state) {
-      return state.email || localStorage.getItem('email') || ''
+      return state.email
     },
     get_frp_token(state) {
-      return state.frptoken || localStorage.getItem('frptoken') || ''
+      return state.frptoken
     },
-    get_in_bound(state) {
+    get_user_inbound(state) {
       // 限速方面必须返回整数
-      return state.inbound / 128 || Number(localStorage.getItem('inbound')) / 128 || 0
+      return state.inbound / 128
     },
-    get_out_bound(state) {
-      return state.outbound / 128 || Number(localStorage.getItem('outbound')) / 128 || 0
+    get_user_outbound(state) {
+      return state.outbound / 128
     },
     get_avatar(state) {
-      return state.avatar || localStorage.getItem('avatar') + '&size=512' || ''
+      return state.avatar
     },
     get_traffic(state) {
-      return Number(state.traffic) / 1024 || Number(localStorage.getItem('traffic')) / 1024 || 0
+      return Number(state.traffic) / 1024
     },
     get_proxies_num(state) {
-      return state.proxies_num || localStorage.getItem('proxies_num') || 0
+      return state.proxies_num
     }
   },
   mutations: {
-    // 修改token，并将token存入localStorage
+    // token
     set_token(state, token) {
       state.token = token
       localStorage.setItem('token', token)
     },
-    delete_token(state) {
-      state.token = ''
+    remove_token(state) {
+      state.token = defStateData.token
       localStorage.removeItem('token')
     },
-    // 可选
-    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
-      // 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('proxies_num', userdata.proxies_num)
+    // username
+    set_username(state, username) {
+      state.username = username
+      localStorage.setItem('username', username)
+    },
+    remove_username(state) {
+      state.username = defStateData.username
+      localStorage.removeItem('username')
+    },
+    // frp token
+    set_frp_token(state, frptoken) {
+      state.frptoken = frptoken
+      localStorage.setItem('frptoken', frptoken)
+    },
+    remove_frp_token(state) {
+      state.frptoken = defStateData.frptoken
+      localStorage.removeItem('frptoken')
     },
+    // inbound
     set_user_inbound(state, inbound) {
       state.inbound = inbound
       localStorage.setItem('inbound', inbound)
     },
+    remove_user_inbound(state) {
+      state.inbound = defStateData.inbound
+      localStorage.removeItem('inbound')
+    },
+    // outbound
     set_user_outbound(state, outbound) {
-      state.outbound = outbound
+      state.outbound = stateData.outbound
       localStorage.setItem('outbound', outbound)
     },
+    remove_user_outbound(state) {
+      state.outbound = defStateData.outbound
+      localStorage.removeItem('outbound')
+    },
+    // email
     set_user_email(state, email) {
       state.email = email
       localStorage.setItem('email', email)
     },
+    remove_user_email(state) {
+      state.email = defStateData.email
+      localStorage.removeItem('email')
+    },
+    // traffic
     set_user_traffic(state, traffic) {
       state.traffic = traffic
       localStorage.setItem('traffic', traffic)
     },
+    remove_user_traffic(state) {
+      state.traffic = defStateData.traffic
+      localStorage.removeItem('traffic')
+    },
+    // avatar
+    set_avatar(state, avatar) {
+      state.avatar = avatar
+      localStorage.setItem('avatar', avatar)
+    },
+    remove_avatar(state) {
+      state.avatar = defStateData.avatar
+      localStorage.removeItem('avatar')
+    },
     set_limit(state, limit_info) {
       state.inbound = limit_info.inbound
       state.outbound = limit_info.outbound
       localStorage.setItem('inbound', limit_info.inbound)
       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
+      // 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('proxies_num', userdata.proxies_num)
+    },
     delete_user_info(state) {
-      state.usermame = ''
-      state.email = ''
-      state.frptoken = ''
-      state.inbound = 0
-      state.outbound = 0
-      state.avatar = ''
-      state.traffic = ''
+      state.token = defStateData.token
+      state.usermame = defStateData.username
+      state.email = defStateData.email
+      state.frptoken = defStateData.frptoken
+      state.inbound = defStateData.inbound
+      state.outbound = defStateData.outbound
+      state.avatar = defStateData.avatar
+      state.traffic = defStateData.traffic
+      localStorage.removeItem('token')
       localStorage.removeItem('username')
       localStorage.removeItem('email')
+      localStorage.removeItem('avatar')
       localStorage.removeItem('traffic')
       localStorage.removeItem('frptoken')
       localStorage.removeItem('inbound')
       localStorage.removeItem('outbound')
       localStorage.removeItem('proxies')
       localStorage.removeItem('avator')
-    },
-    set_frp_token(state, frptoken) {
-      state.frptoken = frptoken
-      localStorage.setItem('frptoken', frptoken)
     }
   },
 
@@ -125,4 +184,4 @@ const store = new vuex.Store({
   }
 })
 
-export default store
+export default userData
diff --git a/src/views/AddProxies.vue b/src/views/AddProxies.vue
index ed0b3fb..f5d44ea 100644
--- a/src/views/AddProxies.vue
+++ b/src/views/AddProxies.vue
@@ -88,7 +88,7 @@ n-input {
 </style>
 <script setup>
 import { onMounted, ref } from 'vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendErrorMessage } from '@/utils/message'
 import { sendErrorDialog, sendSuccessDialog } from '@/utils/dialog'
 import api from '@/api'
@@ -245,9 +245,9 @@ async function addProxy() {
     return
   }
   const tunnelCreateInfo = {
-    username: store.getters.get_username,
+    username: userData.getters.get_username,
     name: proxyInfo.value.proxy_name,
-    key: store.getters.get_frp_token,
+    key: userData.getters.get_frp_token,
     ip: proxyInfo.value.local_ip,
     type: proxyInfo.value.proxy_type,
     lp: proxyInfo.value.local_port,
@@ -255,7 +255,7 @@ async function addProxy() {
     ue: '0',
     uz: '0',
     id: proxyInfo.value.node,
-    token: store.getters.get_token,
+    token: userData.getters.get_token,
     url: proxyInfo.value.domain,
     sk: proxyInfo.value.sk
   }
diff --git a/src/views/Config.vue b/src/views/Config.vue
index a08d02e..4a187a4 100644
--- a/src/views/Config.vue
+++ b/src/views/Config.vue
@@ -61,7 +61,7 @@ set_real_ip_from 127.0.0.1;"
 
 <script setup>
 import { ref } from 'vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendSuccessMessage, sendErrorMessage } from '@/utils/message'
 // import clipboard from '@/utils/clipboard'
 import api from '@/api'
@@ -115,8 +115,8 @@ async function updateValue(value) {
   let rs
   try {
     rs = await api.v1.Proxies.GetConfigFile(
-      store.getters.get_username,
-      store.getters.get_token,
+      userData.getters.get_username,
+      userData.getters.get_token,
       value
     )
   } catch (e) {
diff --git a/src/views/Dashboard.vue b/src/views/Dashboard.vue
index 3cfdac1..ce24ceb 100644
--- a/src/views/Dashboard.vue
+++ b/src/views/Dashboard.vue
@@ -97,7 +97,7 @@
       <n-card title="数据报表" size="large">
         <n-space>
           <n-statistic label="剩余流量" tabular-nums>
-            <n-number-animation ref="TrafficRef" :from="0" :to="store.getters.get_traffic" />
+            <n-number-animation ref="TrafficRef" :from="0" :to="userData.getters.get_traffic" />
             <template #suffix> GiB</template>
           </n-statistic>
           <n-statistic label="隧道数" tabular-nums>
@@ -180,7 +180,7 @@ import { ref, onMounted } from 'vue'
 // import clipboard from '@/utils/clipboard'
 import { get } from '@/utils/request'
 import { AngleRight, Key } from '@vicons/fa'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { marked } from 'marked'
 import { useDialog, useMessage } from 'naive-ui'
 import { startLoadingBar } from '@/utils/loadingbar'
@@ -189,11 +189,11 @@ import api from '@/api'
 import logger from '@/utils/logger'
 
 localStorage.setItem('ViewPage', 'personality')
-const username = store.getters.get_username
-const email = store.getters.get_email
-const inbound = ref(store.getters.get_in_bound + 'Mbps 下行')
-const outbound = ref(store.getters.get_out_bound + 'Mbps 上行')
-const frpToken = ref(store.getters.get_frp_token)
+const username = userData.getters.get_username
+const email = userData.getters.get_email
+const inbound = ref(userData.getters.get_user_inbound + 'Mbps 下行')
+const outbound = ref(userData.getters.get_user_outbound + 'Mbps 上行')
+const frpToken = ref(userData.getters.get_frp_token)
 const notice = ref('')
 const proxiesRef = ref(null)
 const notShowFrpToken = ref(true)
@@ -275,7 +275,7 @@ async function changeShowFrptoken() {
 
 const traffic = ref(Number(localStorage.getItem('traffic')) / 1024 + 'GB')
 const Proxiesanimation = ref(
-  Number(store.getters.get_proxies_num || localStorage.getItem('proxies_num'))
+  Number(userData.getters.get_proxies_num || localStorage.getItem('proxies_num'))
 )
 const TrafficRef = ref(null)
 const boardcast_html = ref('')
@@ -329,7 +329,7 @@ async function resetTraffic() {
     onPositiveClick: async () => {
       startLoadingBar()
       const data = {
-        username: store.getters.get_username
+        username: userData.getters.get_username
       }
       const rs = await get('https://api-v2.locyanfrp.cn/api/v2/users/reset/traffic', data)
       if (rs.status === 200) {
@@ -343,10 +343,10 @@ async function resetTraffic() {
 }
 
 setInterval(() => {
-  Proxiesanimation.value = Number(store.getters.get_proxies_num)
+  Proxiesanimation.value = Number(userData.getters.get_proxies_num)
   traffic.value = Number(localStorage.getItem('traffic')) / 1024 + 'GB'
-  inbound.value = store.getters.get_in_bound + 'Mbps 下行'
-  outbound.value = store.getters.get_out_bound + 'Mbps 上行'
-  frpToken.value = store.getters.get_frp_token
+  inbound.value = userData.getters.get_user_inbound + 'Mbps 下行'
+  outbound.value = userData.getters.get_user_outbound + 'Mbps 上行'
+  frpToken.value = userData.getters.get_frp_token
 }, 10000)
 </script>
diff --git a/src/views/Donate.vue b/src/views/Donate.vue
index b500f77..3e4de3e 100644
--- a/src/views/Donate.vue
+++ b/src/views/Donate.vue
@@ -12,8 +12,8 @@
       role="dialog"
       aria-modal="true"
     >
-      <n-p>用户名：{{ store.getters.get_username }}</n-p>
-      <n-p>邮箱：{{ store.getters.get_email }}</n-p>
+      <n-p>用户名：{{ userData.getters.get_username }}</n-p>
+      <n-p>邮箱：{{ userData.getters.get_email }}</n-p>
       <n-p>商品名：{{ trade_info.trade_name }}</n-p>
       <n-p>捐赠订单号：{{ trade_no }}</n-p>
       <n-p>捐赠方式：{{ trade_info.type }}</n-p>
@@ -129,7 +129,7 @@
 <script setup>
 import { onMounted, ref } from 'vue'
 import { getUrlKey } from '@/utils/request'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendErrorMessage } from '@/utils/message'
 import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
 import api from '@/api'
@@ -232,8 +232,8 @@ async function submitMessage() {
   let rs
   try {
     rs = await api.v1.Donate.SetMessage(
-      store.getters.get_username,
-      store.getters.get_token,
+      userData.getters.get_username,
+      userData.getters.get_token,
       trade_no,
       message.value.message
     )
@@ -266,7 +266,7 @@ async function doDonate() {
   let rs
   try {
     rs = await api.v2.donate.create(
-      store.getters.get_username,
+      userData.getters.get_username,
       'LoCyanFrpDonate',
       amount.value,
       'https://dashboard.locyanfrp.cn/donate',
diff --git a/src/views/IcpCheck.vue b/src/views/IcpCheck.vue
index 4d9e33e..7fb127e 100644
--- a/src/views/IcpCheck.vue
+++ b/src/views/IcpCheck.vue
@@ -41,7 +41,7 @@
 </template>
 <script setup>
 import { ref } from 'vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { get, deleteReq } from '@/utils/request'
 import { sendSuccessMessage, sendErrorMessage } from '@/utils/message'
 import { sendErrorDialog, sendSuccessDialog } from '@/utils/dialog'
@@ -80,8 +80,8 @@ async function submit() {
   let rs
   try {
     rs = await api.v2.icp.check(
-      store.getters.get_username,
-      store.getters.get_token,
+      userData.getters.get_username,
+      userData.getters.get_token,
       domainInput.value.domain
     )
   } catch (e) {
@@ -108,7 +108,7 @@ async function removeICP(id) {
     onPositiveClick: async () => {
       let rs
       try {
-        rs = await api.v2.icp.remove(store.getters.get_username, store.getters.get_token, id)
+        rs = await api.v2.icp.remove(userData.getters.get_username, userData.getters.get_token, id)
       } catch (e) {
         sendErrorMessage('请求移除域名失败: ' + e)
       }
@@ -132,7 +132,7 @@ async function removeICP(id) {
 async function getList() {
   let rs
   try {
-    rs = await api.v2.icp.list(store.getters.get_username, store.getters.get_token)
+    rs = await api.v2.icp.list(userData.getters.get_username, userData.getters.get_token)
   } catch (e) {
     sendErrorMessage('请求移除域名失败: ' + e)
   }
diff --git a/src/views/Login.vue b/src/views/Login.vue
index 18939dc..fa255af 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -59,7 +59,7 @@ import { ref, onMounted } from 'vue'
 import { useLoadingBar, useMessage } from 'naive-ui'
 import { getUrlKey } from '@/utils/request'
 import router from '@/router/index'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendErrorMessage } from '@/utils/message'
 import logger from '@/utils/logger'
 import api from '@/api'
@@ -101,9 +101,9 @@ if (code !== null) {
     if (!rs) return
     if (rs.status === 200) {
       message.success(rs.data.username + '，欢迎回来！')
-      store.commit('set_token', rs.data.token)
+      userData.commit('set_token', rs.data.token)
       // console.log(rs.data)
-      store.commit('set_user_info', rs.data)
+      userData.commit('set_user_info', rs.data)
       router.push(redirect || '/dashboard')
     }
   })
@@ -122,8 +122,8 @@ if (token !== null) {
     if (!rs) return
     if (rs.status === 200) {
       message.success(rs.data.username + '，欢迎回来！')
-      store.commit('set_token', rs.data.token)
-      store.commit('set_user_info', rs.data)
+      userData.commit('set_token', rs.data.token)
+      userData.commit('set_user_info', rs.data)
       router.push(redirect || '/dashboard')
     }
   })
@@ -167,9 +167,9 @@ async function login() {
   }
   if (rs.status === 200) {
     message.success(rs.data.username + '，欢迎回来！')
-    store.commit('set_token', rs.data.token)
+    userData.commit('set_token', rs.data.token)
     // console.log(res.data)
-    store.commit('set_user_info', rs.data)
+    userData.commit('set_user_info', rs.data)
     router.push(redirect || '/dashboard')
     ldb.finish()
   } else {
diff --git a/src/views/NewYear.vue b/src/views/NewYear.vue
index 7d2b517..ed5777d 100644
--- a/src/views/NewYear.vue
+++ b/src/views/NewYear.vue
@@ -37,7 +37,7 @@ import { ref } from 'vue'
 import { sendErrorDialog, sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
 import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar'
 import { get } from '@/utils/request'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 
 const CommentList = ref([])
 const formRef = ref(null)
@@ -65,7 +65,7 @@ function submitcomment() {
   }
   const rs = get(
     'https://api.locyanfrp.cn/App/SubmitComment?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&comment=' +
       NewYear.value.comment,
     []
diff --git a/src/views/Prize.vue b/src/views/Prize.vue
index 391044c..a968cf3 100644
--- a/src/views/Prize.vue
+++ b/src/views/Prize.vue
@@ -49,7 +49,7 @@ import { ref } from 'vue'
 import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
 import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar'
 import { get } from '@/utils/request'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { marked } from 'marked'
 
 const PrizesList = ref([
@@ -82,7 +82,10 @@ function timestampToTime(timestamp) {
 function submitjoin(id) {
   startLoadingBar()
   const rs = get(
-    'https://api.locyanfrp.cn/Prize/JoinPrize?username=' + store.getters.get_username + '&id=' + id
+    'https://api.locyanfrp.cn/Prize/JoinPrize?username=' +
+      userData.getters.get_username +
+      '&id=' +
+      id
   )
   rs.then((res) => {
     if (res.status) {
diff --git a/src/views/Proxies.vue b/src/views/Proxies.vue
index 549e685..6ad1c10 100644
--- a/src/views/Proxies.vue
+++ b/src/views/Proxies.vue
@@ -114,7 +114,7 @@
       </template>
       <p>
         <span style="margin-right: 15px">
-          {{ getQuickStartText() }}
+          {{ quickStartCommand }}
         </span>
         <!-- 2024-09-14 2:36 Muska-Ami: 这里不知道为啥复制不了 -->
         <!-- 2024-9-14 4:17 ltzXiaoYanMo: 大概v-clipboard的bug，这死吗玩意就死活不传入-->
@@ -122,7 +122,7 @@
         <n-button
           secondary
           type="primary"
-          v-clipboard:copy="getQuickStartText()"
+          v-clipboard="quickStartCommand"
           v-clipboard:success="() => sendSuccessMessage('复制成功')"
           v-clipboard:error="() => sendErrorMessage('复制失败')"
         >
@@ -260,7 +260,7 @@
 import { computed, ref } from 'vue'
 import { useDialog } from 'naive-ui'
 // import clipboard from '@/utils/clipboard'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendErrorMessage, sendSuccessMessage } from '@/utils/message'
 import { sendErrorDialog, sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
 import downloadSoftPage from '../components/InstallCsApp.vue'
@@ -285,11 +285,9 @@ const segmented = {
 const editCheck = ref(true)
 const showDownloadPage = ref(false)
 
-function getQuickStartText() {
-  const token = store.getters.get_frp_token
-  const proxyID = selectProxyID.value
-  return `./frpc -u ${token} -p ${proxyID}`
-}
+const quickStartCommand = computed(
+  () => `./frpc -u ${userData.getters.get_frp_token} -p ${selectProxyID.value}`
+)
 
 // 隧道类型翻译
 function transtype(type) {
@@ -334,7 +332,7 @@ async function launchProxyThroughApplication(id) {
     positiveText: '已经安装好了',
     negativeText: '没安装...',
     onPositiveClick: () => {
-      const url = 'locyanfrp://' + store.getters.get_frp_token + '/' + id
+      const url = 'locyanfrp://' + userData.getters.get_frp_token + '/' + id
       window.open(url)
     },
     onNegativeClick: () => {
@@ -355,7 +353,7 @@ async function forceDownProxy(proxyId) {
     onPositiveClick: async () => {
       let rs
       try {
-        rs = await api.v2.proxies.down(store.getters.get_username, proxyId)
+        rs = await api.v2.proxies.down(userData.getters.get_username, proxyId)
       } catch (e) {
         logger.error(e)
         sendErrorMessage(`请求强制下线隧道失败: ${e}`)
@@ -381,7 +379,7 @@ async function editProxy(proxyid) {
     proxyName: proxyEditInfo.value.proxy_name,
     proxyType: proxyEditInfo.value.proxy_type,
     remotePort: proxyEditInfo.value.remote_port,
-    username: store.getters.get_username,
+    username: userData.getters.get_username,
     localIp: proxyEditInfo.value.local_ip,
     localPort: proxyEditInfo.value.local_port,
     domain: proxyEditInfo.value.domain,
@@ -546,7 +544,7 @@ async function initList() {
 
   let rs2
   try {
-    rs2 = await api.v2.proxies.getlist(store.getters.get_username)
+    rs2 = await api.v2.proxies.getlist(userData.getters.get_username)
   } catch (e) {
     sendErrorMessage('请求节点列表失败: ' + e)
   }
@@ -585,9 +583,9 @@ function deleteProxy(id) {
       let rs
       try {
         rs = await api.v2.proxies.delete(
-          store.getters.get_username,
+          userData.getters.get_username,
           proxiesList.value[id].id,
-          store.getters.get_token
+          userData.getters.get_token
         )
       } catch (e) {
         sendErrorMessage('请求删除隧道失败: ' + e)
diff --git a/src/views/RealName.vue b/src/views/RealName.vue
index 5d3d038..18f5a04 100644
--- a/src/views/RealName.vue
+++ b/src/views/RealName.vue
@@ -163,7 +163,7 @@ import { ref } from 'vue'
 import { sendErrorMessage } from '@/utils/message'
 import { sendSuccessDialog, sendWarningDialog } from '@/utils/dialog'
 import { finishLoadingBar, startLoadingBar, errorLoadingBar } from '@/utils/loadingbar'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import api from '@/api'
 import logger from '@/utils/logger'
 
@@ -194,7 +194,7 @@ const segmented = {
 async function submitRealName() {
   startLoadingBar()
   const submitForm = {
-    username: store.getters.get_username,
+    username: userData.getters.get_username,
     name: userProfile.value.name,
     id_card: userProfile.value.idcard
   }
@@ -221,7 +221,7 @@ async function submitRealName() {
 async function submitRealPerson() {
   startLoadingBar()
   const submitForm = {
-    username: store.getters.get_username,
+    username: userData.getters.get_username,
     name: userProfile.value.name,
     id_card: userProfile.value.idcard
   }
@@ -255,7 +255,7 @@ async function submitRealPerson() {
 async function queryRealPersonStatus() {
   let rs
   try {
-    rs = await api.v2.realperson.query(store.getters.get_username, ci.value)
+    rs = await api.v2.realperson.query(userData.getters.get_username, ci.value)
   } catch (e) {
     sendErrorMessage('请求失败: ' + e)
   }
@@ -271,7 +271,7 @@ async function queryRealPersonStatus() {
 async function checkRealNameStatus() {
   let rs
   try {
-    rs = await api.v2.realperson.get_status(store.getters.get_username)
+    rs = await api.v2.realperson.get_status(userData.getters.get_username)
   } catch (e) {
     sendErrorMessage('请求失败: ' + e)
   }
@@ -324,7 +324,7 @@ async function realPersonPay() {
   let rs
   try {
     rs = await api.v2.realperson.pay(
-      store.getters.get_username,
+      userData.getters.get_username,
       'https://api-v2.locyanfrp.cn/api/v2/realperson/notify',
       'https://dashboard.locyanfrp.cn/realname'
     )
diff --git a/src/views/Sign.vue b/src/views/Sign.vue
index 30eba4b..6a1cb44 100644
--- a/src/views/Sign.vue
+++ b/src/views/Sign.vue
@@ -108,7 +108,7 @@ 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 store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import api from '@/api'
 
 const loading = ref(true)
@@ -117,7 +117,7 @@ const status = ref(false)
 async function checkSign() {
   let rs
   try {
-    rs = await api.v2.sign.check(store.getters.get_username)
+    rs = await api.v2.sign.check(userData.getters.get_username)
   } catch (e) {
     sendErrorMessage('获取签到状态失败: ' + e)
     loading.value = false
@@ -132,7 +132,7 @@ async function checkSign() {
 async function doSign() {
   let rs
   try {
-    rs = await api.v2.sign.sign(store.getters.get_username)
+    rs = await api.v2.sign.sign(userData.getters.get_username)
   } catch (e) {
     sendErrorMessage('签到失败: ' + e)
   }