perf: 登录情况下点击设置按钮会进入设置页面(#82)

blossom-editor/src/renderer/src/router/index.ts

@@ -13,4 +13,12 @@ export const toLogin = () => {
   router.push('/settingIndex')
 }
 
-export default router
+/**
+ * 前往设置页面, 指定激活的 tab
+ * @param tabName
+ */
+export const toSetting = (tabName: 'setting' | 'about') => {
+  router.push('/settingIndex?activeTab=' + tabName)
+}
+
+export default router

blossom-editor/src/renderer/src/views/index/AsideSetting.vue

@@ -2,7 +2,7 @@
   <div class="index-setting-root">
     <el-switch class="setting-switch" inline-prompt size="large" v-model="isDark" :active-icon="Moon" :inactive-icon="Sunny" @change="changeTheme" />
     <el-button-group>
-      <el-button class="setting-button" type="primary" :icon="Setting" @click="toSetting" />
+      <el-button class="setting-button" type="primary" :icon="Setting" @click="toSettingTab" />
       <el-button class="setting-button" type="primary" :icon="Crop" @click="handlePrintScreenUpload()" />
     </el-button-group>
   </div>
@@ -70,8 +70,9 @@
 </template>
 
 <script setup lang="ts">
-import { toLogin } from '@renderer/router'
 import { onMounted, ref } from 'vue'
+import { useUserStore } from '@renderer/stores/user'
+import { toLogin, toSetting } from '@renderer/router'
 import { Sunny, Moon, Setting, Crop } from '@element-plus/icons-vue'
 import { docTreeApi, uploadFileApi } from '@renderer/api/blossom'
 import { handleUploadSeccess, handleUploadError } from '@renderer/views/picture/scripts/picture'
@@ -82,12 +83,18 @@ import { getNowTime, isMacOS, isElectron } from '@renderer/assets/utils/util'
 import { isDark, changeTheme } from '@renderer/scripts/global-theme'
 import Notify from '@renderer/scripts/notify'
 
+const userStore = useUserStore()
+
 onMounted(() => {
   printscreenAfter()
 })
 
-const toSetting = () => {
-  toLogin()
+const toSettingTab = () => {
+  if (userStore.isLogin) {
+    toSetting('setting')
+  } else {
+    toLogin()
+  }
 }
 
 //#region ----------------------------------------< 截屏 >----------------------------------------

blossom-editor/src/renderer/src/views/index/SettingIndex.vue

@@ -1,20 +1,20 @@
 <template>
   <div class="setting-index-root">
-    <el-tabs tab-position="left" class="setting-tabs">
-      <el-tab-pane label="登录">
+    <el-tabs tab-position="left" class="setting-tabs" v-model="activeTab">
+      <el-tab-pane label="登录" name="login">
         <div class="setting-container">
           <div class="wrapper">
             <SettingLogin></SettingLogin>
           </div>
         </div>
       </el-tab-pane>
-      <el-tab-pane label="设置">
+      <el-tab-pane label="设置" name="setting">
         <SettingConfig></SettingConfig>
       </el-tab-pane>
-      <el-tab-pane label="关于">
+      <el-tab-pane label="关于" name="about">
         <SettingAboutVue></SettingAboutVue>
       </el-tab-pane>
-      <el-tab-pane label="访问流量" :lazy="true">
+      <el-tab-pane label="访问流量" :lazy="true" name="flow">
         <SentinelResources></SentinelResources>
       </el-tab-pane>
     </el-tabs>
@@ -25,14 +25,30 @@
 </template>
 
 <script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import { useUserStore } from '@renderer/stores/user'
+import { useRoute } from 'vue-router'
+import { isNotBlank } from '@renderer/assets/utils/obj'
 import SettingLogin from './SettingLogin.vue'
 import SettingConfig from './SettingConfig.vue'
 import SettingAboutVue from './SettingAbout.vue'
 import SentinelResources from '@renderer/views/statistic/SentinelResources.vue'
 import CONFIG from '@renderer/assets/constants/system'
-import { useUserStore } from '@renderer/stores/user'
 
 const userStore = useUserStore()
+const route = useRoute()
+
+onMounted(() => {
+  let actTab = route.query.activeTab as string
+  console.log(actTab)
+  if (isNotBlank(actTab)) {
+    activeTab.value = actTab
+  } else {
+    activeTab.value = 'login'
+  }
+})
+
+const activeTab = ref('login')
 
 const getServerVersion = () => {
   if (userStore.sysParams && userStore.sysParams.SERVER_VERSION) {