.vscode/settings.json

@@ -19,5 +19,6 @@
     "markdown",
     "json",
     "jsonc"
-  ]
+  ],
+  "common-intellisense.ui": ["naiveUi2"]
 }

package.json

@@ -48,8 +48,7 @@
     "unplugin-vue-components": "^0.27.4",
     "vite": "^5.4.9",
     "vite-plugin-router-warn": "^1.0.0",
-    "vite-plugin-vue-devtools": "^7.5.2",
+    "vite-plugin-vue-devtools": "^7.5.2"
-    "vue3-intro-step": "^1.0.5"
   },
   "simple-git-hooks": {
     "pre-commit": "pnpm lint-staged"

pnpm-lock.yaml

@@ -114,9 +114,6 @@ importers:
       vite-plugin-vue-devtools:
         specifier: ^7.5.2
         version: 7.5.2(@nuxt/kit@3.13.2(rollup@4.20.0)(webpack-sources@3.2.3))(rollup@4.20.0)(vite@5.4.9(sass@1.79.3))(vue@3.5.12(typescript@5.5.4))
-      vue3-intro-step:
-        specifier: ^1.0.5
-        version: 1.0.5(vue@3.5.12(typescript@5.5.4))
 
 packages:
 
@@ -3299,12 +3296,6 @@ packages:
     peerDependencies:
       vue: ^3.2.0
 
-  vue3-intro-step@1.0.5:
-    resolution: {integrity: sha512-MV+Y2VZCRVWGFgmwxaAFq0opANe7Yj/xEyL5Zox2z+8JNbU1Y6vkbGivT+yKbqc4o+Q/ui0z45zizI7GCouDmw==}
-    engines: {node: '>=12'}
-    peerDependencies:
-      vue: ^3.0.5
-
   vue@3.5.12:
     resolution: {integrity: sha512-CLVZtXtn2ItBIi/zHZ0Sg1Xkb7+PU32bJJ8Bmy7ts3jxXTcbfsEfBivFYYWz1Hur+lalqGAh65Coin0r+HRUfg==}
     peerDependencies:
@@ -6981,10 +6972,6 @@ snapshots:
       '@vue/devtools-api': 6.6.4
       vue: 3.5.12(typescript@5.5.4)
 
-  vue3-intro-step@1.0.5(vue@3.5.12(typescript@5.5.4)):
-    dependencies:
-      vue: 3.5.12(typescript@5.5.4)
-
   vue@3.5.12(typescript@5.5.4):
     dependencies:
       '@vue/compiler-dom': 3.5.12

src/components/common/LayoutSetting.vue

@@ -10,7 +10,7 @@
   <div>
     <n-tooltip trigger="hover" placement="left">
       <template #trigger>
-        <div id="layout-setting" class="f-c-c rounded-4 bg-primary p-8" @click="modalRef.open()">
+        <div class="f-c-c rounded-4 bg-primary p-8" @click="modalRef.open()">
           <i class="i-fe:settings cursor-pointer bg-white text-20" />
         </div>
       </template>

src/components/common/ThemeSetting.vue

@@ -2,7 +2,6 @@
   <n-tooltip trigger="hover">
     <template #trigger>
       <n-color-picker
-        id="theme-setting"
         class="mr-16 h-32 w-32"
         :value="appStore.primaryColor"
         :swatches="primaryColors"

src/components/common/ToggleTheme.vue

@@ -1,6 +1,5 @@
 <template>
   <i
-    id="toggleTheme"
     class="mr-16 cursor-pointer"
     :class="isDark ? 'i-fe:moon' : 'i-fe:sun'"
     @click="toggleDark"

src/layouts/components/BeginnerGuide.vue

@@ -1,129 +0,0 @@
-<template>
-  <n-tooltip trigger="hover">
-    <template #trigger>
-      <i
-        class="i-fe:beginner mr-16 cursor-pointer text-20"
-        @click="show = true"
-      />
-    </template>
-    操作指引
-  </n-tooltip>
-
-  <Vue3IntroStep
-    ref="myIntroStep"
-    v-model:show="show"
-    :config="config"
-  >
-    <template #prev="{ tipItem, index }">
-      <NButton class="mr-12" type="primary" color="#fff" text-color="#fff" ghost round size="small" @click="prev(tipItem, index)">
-        上一步
-      </NButton>
-    </template>
-    <template #next="{ tipItem }">
-      <NButton class="mr-12" type="primary" color="#fff" text-color="#fff" ghost round size="small" @click="next(tipItem)">
-        下一步
-      </NButton>
-    </template>
-
-    <template #skip>
-      <NButton type="primary" color="#fff" text-color="#fff" ghost round size="small" @click="skip">
-        跳过
-      </NButton>
-    </template>
-
-    <template #done>
-      <NButton type="primary" color="#fff" text-color="#fff" ghost round size="small" @click="done">
-        完成
-      </NButton>
-    </template>
-  </Vue3IntroStep>
-</template>
-
-<script setup>
-import { lStorage } from '@/utils'
-import Vue3IntroStep from 'vue3-intro-step'
-
-const myIntroStep = shallowRef(null)
-const show = shallowRef(false)
-const config = {
-  backgroundOpacity: 0.8,
-  titleStyle: {
-    textAlign: 'left',
-    fontSize: '18px',
-  },
-  contentStyle: {
-    textAlign: 'left',
-    fontSize: '14px',
-  },
-  tips: [
-    {
-      el: '#toggleTheme',
-      tipPosition: 'bottom',
-      title: '切换系统主题',
-      content: '一键开启护眼模式',
-    },
-    {
-      el: '#fullscreen',
-      tipPosition: 'bottom',
-      title: '全屏/退出全屏',
-      content: '一键开启全屏',
-    },
-    {
-      el: '#theme-setting',
-      tipPosition: 'bottom',
-      title: '设置主题色',
-      content: '调整为你喜欢的主题色',
-    },
-    {
-      el: '#user-dropdown',
-      tipPosition: 'bottom',
-      title: '个人中心',
-      content: '查看个人资料和退出系统',
-    },
-    {
-      el: '#menu-collapse',
-      tipPosition: 'bottom',
-      title: '展开/收起菜单',
-      content: '一键展开/收起菜单',
-    },
-    {
-      el: '#top-tab',
-      tipPosition: 'bottom',
-      title: '标签栏',
-      content: '鼠标滚轮滑动可调整至最佳视野',
-    },
-    {
-      el: '#layout-setting',
-      tipPosition: 'left',
-      title: '调整系统布局',
-      content: '将系统布局调整为你喜欢的样子',
-    },
-  ],
-}
-
-onMounted(() => {
-  if (lStorage.get('beginner-guide') === true)
-    return
-  show.value = true
-})
-
-function skip() {
-  lStorage.set('beginner-guide', true)
-  show.value = false
-}
-
-function done() {
-  lStorage.set('beginner-guide', true)
-  show.value = false
-}
-
-function next() {
-  // tipItem当前的提示项信息
-  // 调用vue3-intro-step的next方法 手动触发下一步
-  myIntroStep.value.next()
-}
-function prev() {
-  // 调用vue3-intro-step的prev方法 手动触发上一步
-  myIntroStep.value.prev()
-}
-</script>

src/layouts/components/Fullscreen.vue

@@ -1,6 +1,5 @@
 <template>
   <i
-    id="fullscreen"
     class="mr-16 cursor-pointer"
     :class="isFullscreen ? 'i-fe:minimize' : 'i-fe:maximize'"
     @click="toggle"

src/layouts/components/MenuCollapse.vue

@@ -8,7 +8,6 @@
 
 <template>
   <div
-    id="menu-collapse"
     class="f-c-c cursor-pointer rounded-4 p-6 text-22 transition-all-300 auto-bg-hover"
     @click="appStore.switchCollapsed"
   >

src/layouts/components/UserAvatar.vue

@@ -8,7 +8,7 @@
 
 <template>
   <n-dropdown :options="options" @select="handleSelect">
-    <div id="user-dropdown" class="flex cursor-pointer items-center">
+    <div class="flex cursor-pointer items-center">
       <n-avatar round :size="36" :src="userStore.avatar" />
       <div v-if="userStore.userInfo" class="ml-12 flex-col flex-shrink-0 items-center">
         <span class="text-14">{{ userStore.nickName ?? userStore.username }}</span>

src/layouts/components/index.js

@@ -1,4 +1,3 @@
-export { default as BeginnerGuide } from './BeginnerGuide.vue'
 export { default as BreadCrumb } from './BreadCrumb.vue'
 export { default as Fullscreen } from './Fullscreen.vue'
 export { default as MenuCollapse } from './MenuCollapse.vue'

src/layouts/components/tab/index.vue

@@ -7,7 +7,7 @@
  --------------------------------->
 
 <template>
-  <div id="top-tab">
+  <div>
     <n-tabs
       :value="tabStore.activeTab"
       :closable="tabStore.tabs.length > 1"

src/layouts/full/header/index.vue

@@ -13,8 +13,6 @@
     <BreadCrumb />
 
     <div class="ml-auto flex flex-shrink-0 items-center px-12 text-18">
-      <BeginnerGuide />
-
       <ToggleTheme />
 
       <Fullscreen />
@@ -37,7 +35,7 @@
 
 <script setup>
 import { ToggleTheme } from '@/components'
-import { BeginnerGuide, BreadCrumb, Fullscreen, MenuCollapse, UserAvatar } from '@/layouts/components'
+import { BreadCrumb, Fullscreen, MenuCollapse, UserAvatar } from '@/layouts/components'
 
 function handleLinkClick(link) {
   window.open(link)

src/layouts/normal/header/index.vue

@@ -15,8 +15,6 @@
     <span class="mx-6 opacity-20">|</span>
 
     <div class="flex flex-shrink-0 items-center px-12 text-18">
-      <BeginnerGuide />
-
       <ToggleTheme />
 
       <Fullscreen />
@@ -39,7 +37,7 @@
 
 <script setup>
 import { ToggleTheme } from '@/components'
-import { AppTab, BeginnerGuide, Fullscreen, MenuCollapse, UserAvatar } from '@/layouts/components'
+import { AppTab, Fullscreen, MenuCollapse, UserAvatar } from '@/layouts/components'
 
 function handleLinkClick(link) {
   window.open(link)